/* Micro2 section widgets. Uses the theme's tokens (--m2-gold, --m2-display and so on),
   with fallbacks so a widget still looks right if the theme is ever switched off. */

/* ---------- particle stage ---------- */
/* Behind everything (z-index -1), so any Elementor content on the page sits on top,
   and a hero video set to "blend" can mix with the particles. */
.m2-stage{position:fixed;inset:0;width:100%;height:100%;z-index:-1;display:block;pointer-events:none;background:#000;opacity:0;transition:opacity 1.2s ease}
.m2-stage.on{opacity:1}
html.m2-has-stage body{background:transparent}
.m2-vignette{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(120% 90% at 50% 45%,transparent 55%,rgba(0,0,0,.55) 100%)}
.m2-vignette.is-off{display:none} /* the world map sits on plain black */

/* ---------- Lenis smooth scroll ----------
   Elementor sets html{scroll-behavior:smooth}. With Lenis running, that turns every
   frame of Lenis's own easing into a separate native smooth-scroll, which stalls
   the page for about a second. Lenis's required CSS, plus the override. */
html.lenis,html.lenis body{height:auto}
html.lenis{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
.lenis [data-lenis-prevent]{overscroll-behavior:contain}

/* ---------- section rail ---------- */
.m2-rail{position:fixed;inset-inline-end:max(18px,env(safe-area-inset-right,0px));top:50%;transform:translateY(-50%);z-index:55;display:flex;flex-direction:column;gap:14px;align-items:flex-end}
.m2-rail a{display:flex;align-items:center;gap:12px;font-family:var(--m2-mono,monospace);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:transparent;transition:color .4s}
.m2-rail a span{opacity:0;transform:translateX(6px);transition:opacity .35s,transform .35s;background:rgba(0,0,0,.7);padding:4px 8px}
.m2-rail:hover a span,.m2-rail a:focus-visible span{opacity:1;transform:none}
.m2-rail a i{width:7px;height:7px;border:1px solid rgba(244,239,230,.45);transform:rotate(45deg);transition:background .4s,border-color .4s,transform .4s}
.m2-rail:hover a{color:var(--m2-mute,#aaa)}
.m2-rail a.on{color:var(--m2-gold,#C99D51)}
.m2-rail a.on i{background:var(--m2-gold,#C99D51);border-color:var(--m2-gold,#C99D51);transform:rotate(45deg) scale(1.25)}
@media (max-width:899.98px){.m2-rail{display:none}}

/* ---------- shared ---------- */
.m2-sec{position:relative}
.m2-sec .btn-row{display:flex;gap:12px;flex-wrap:wrap}

/* ---------- hero ---------- */
.m2-hero{min-height:100svh;display:flex;flex-direction:column;padding-block:calc(110px + var(--m2-nav-top,0px) + env(safe-area-inset-top,0px)) 34px;position:relative}
.m2-hero>*:not(.m2-hero-media){position:relative}
.m2-hero-media{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.m2-hero-media video,.m2-hero-media img{width:100%;height:100%;object-fit:cover}
.m2-hero[data-bg="blend"] .m2-hero-media{mix-blend-mode:screen;opacity:.85}
.m2-hero[data-bg="video"] .m2-hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35) 0%,transparent 30%,transparent 55%,rgba(0,0,0,.75) 100%)}
.m2-hero-top{display:flex;justify-content:space-between;gap:12px 24px;flex-wrap:wrap}
.m2-hero-top .eyebrow b{color:var(--m2-cream,#F4EFE6);font-weight:500;font-variant-numeric:tabular-nums}
.m2-hero-space{flex:1;min-height:34vh;position:relative}
.m2-hero-fallback{display:none;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(70%,820px);height:auto}
html.no-gl .m2-hero[data-bg="particles"] .m2-hero-fallback{display:block}
.m2-hero-title{font-size:clamp(3.4rem,10.4vw,12.4rem);line-height:.84;text-align:center} /* centred under the logo */
.m2-hero-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:20px 40px;margin-top:24px}
.m2-hero-row p{max-width:44ch;color:var(--m2-mute,#bbb);font-size:clamp(16px,1.3vw,19px);margin:0}
.m2-hero-row p b,.m2-hero-row p strong{color:var(--m2-cream,#F4EFE6);font-weight:500}
.m2-hint{position:absolute;left:50%;transform:translateX(-50%);bottom:0;margin:0;font-family:var(--m2-mono,monospace);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--m2-mute,#bbb);display:flex;align-items:center;gap:12px;white-space:nowrap}
.m2-hint i{width:26px;height:1px;background:var(--m2-gold,#C99D51);display:inline-block}
html.no-gl .m2-hint,.m2-hero:not([data-bg="particles"]) .m2-hint{display:none}
@media (max-width:899.98px){
  .m2-hero-row{grid-template-columns:1fr}
  .m2-hint{display:none}
}

/* ---------- shared two-column section with a particle "slot" ---------- */
.m2-split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,5vw,80px);align-items:center}
.m2-split>*{min-width:0}
.m2-split[data-side="right"] .m2-slot{order:2}
.m2-slot{min-height:60vh}
.m2-sec .h2{font-size:clamp(3rem,7vw,7.4rem);margin:16px 0 24px}

/* ---------- reach (globe + stats) ---------- */
.m2-reach{min-height:100vh;padding-block:var(--m2-sec)}
.m2-reach-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.m2-badge{height:clamp(96px,10vw,150px);width:auto;flex:none}
.m2-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:44px 0 0;border-top:1px solid var(--m2-line,rgba(244,239,230,.12))}
.m2-stat{display:flex;flex-direction:column-reverse;justify-content:flex-end;padding:22px 20px 22px 0;border-bottom:1px solid var(--m2-line,rgba(244,239,230,.12));min-width:0}
.m2-stat dd{margin:0;font-family:var(--m2-display);font-size:clamp(3.6rem,5.4vw,5.6rem);line-height:.9;font-variant-numeric:tabular-nums}
.m2-stat dt{margin:8px 0 0;font-family:var(--m2-mono);font-size:12px;letter-spacing:.06em;color:var(--m2-mute);text-transform:uppercase;line-height:1.5}

/* ---------- channels (horizontal panels over the funnel) ---------- */
.m2-channels{padding-block:var(--m2-sec)}
.m2-ch-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px 40px;flex-wrap:wrap;margin-bottom:40px}
.m2-ch-head .h2{margin:12px 0 0;font-size:clamp(3rem,6vw,6.6rem)}
.m2-ch-prog{width:220px;display:grid;gap:10px}
.m2-ch-prog .bar{height:1px;background:var(--m2-line)}
.m2-ch-prog .bar span{display:block;height:100%;background:var(--m2-gold);transform-origin:left;transform:scaleX(0)}
:dir(rtl) .m2-ch-prog .bar span{transform-origin:right}
.m2-ch-viewport{overflow-x:auto;overscroll-behavior-x:contain;perspective:1200px}
.m2-ch-track{display:flex;gap:20px;width:max-content;padding-inline:var(--m2-gl,16px) var(--m2-gr,16px)}
.m2-panel{width:clamp(300px,31vw,500px);height:min(60vh,580px);min-height:460px;display:flex;flex-direction:column;border:1px solid var(--m2-line);background:var(--m2-glass,rgba(8,8,8,.58));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:28px;position:relative;overflow:hidden;transition:border-color .5s;will-change:transform}
.m2-panel:hover{border-color:rgba(201,157,81,.5)}
.m2-panel-top{display:flex;justify-content:space-between;gap:12px;font-family:var(--m2-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--m2-mute)}
.m2-panel-top b{color:var(--m2-gold);font-weight:500}
.m2-viz{flex:1;position:relative;margin:22px 0;min-height:150px}
.m2-panel h3{font-family:var(--m2-display);font-weight:400;font-size:clamp(2.6rem,3.4vw,4rem);line-height:.9;margin:0 0 12px;text-transform:uppercase}
.m2-panel p{margin:0;color:var(--m2-mute);max-width:36ch;font-size:16px}
.m2-viz .m2-pvid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:1px solid var(--m2-line)}
/* Desktop with motion: the section is held on screen while the panels slide sideways. */
@media (min-width:900px){
  html.js-motion .m2-channels.is-h{padding-block:0}
  html.js-motion .m2-channels.is-h .m2-ch-sticky{position:sticky;top:0;height:100vh;min-height:640px;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
  html.js-motion .m2-channels.is-h .m2-ch-viewport{overflow:visible}
}
@media (max-width:899.98px){
  .m2-ch-viewport{overflow:visible;perspective:none}
  .m2-ch-track{flex-direction:column;width:auto}
  .m2-panel{width:100%;height:auto;min-height:460px}
  /* No frosted glass on phones: blurring over the moving canvas is expensive there. */
  .m2-panel{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgba(8,8,8,.86)}
  .m2-ch-prog{display:none}
  /* Panels have no fixed height here, so mockups that fill their box need one. */
  .m2-viz{min-height:240px}
  .m2-viz-social{height:320px}
  .m2-serp,.m2-browser{min-height:240px}
}
/* mockup: search */
.m2-viz-search{display:flex;flex-direction:column;justify-content:center;gap:10px}
.m2-sbar{display:flex;align-items:center;gap:12px;height:52px;padding:0 18px;border:1px solid rgba(244,239,230,.22);border-radius:26px;background:rgba(0,0,0,.5);font-size:15px;min-width:0}
.m2-sbar .ico{width:15px;height:15px;border:2px solid var(--m2-mute);border-radius:50%;position:relative;flex:none}
.m2-sbar .ico::after{content:"";position:absolute;width:2px;height:7px;background:var(--m2-mute);right:-4px;bottom:-6px;transform:rotate(-45deg)}
.m2-typed{white-space:nowrap;overflow:hidden}
.m2-caret{width:2px;height:19px;background:var(--m2-gold);flex:none;animation:m2blink 1s steps(1) infinite;margin-inline-start:-8px}
@keyframes m2blink{50%{opacity:0}}
.m2-res{padding:10px 16px;border-inline-start:2px solid transparent;display:grid;gap:2px;opacity:.4}
.m2-res b{font-weight:500;font-size:15px}
.m2-res i{font-style:normal;font-family:var(--m2-mono);font-size:11px;color:var(--m2-mute)}
.m2-res-ad{opacity:1;border-inline-start-color:var(--m2-gold);background:var(--m2-gold-soft,rgba(201,157,81,.1))}
.m2-res-ad .tag{font-family:var(--m2-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--m2-gold)}
/* mockup: social */
.m2-viz-social{display:flex;justify-content:center;align-items:center}
.m2-phone{height:100%;max-height:330px;aspect-ratio:9/18;border:1px solid rgba(244,239,230,.25);border-radius:28px;overflow:hidden;position:relative;background:#0b0b0b;padding:22px 8px 8px}
.m2-phone::before{content:"";position:absolute;top:8px;left:50%;width:52px;height:6px;margin-left:-26px;border-radius:3px;background:#1d1d1d;z-index:2}
.m2-feed{display:flex;flex-direction:column;gap:8px;animation:m2feed 12s linear infinite}
@keyframes m2feed{to{transform:translateY(calc(-50% - 4px))}}
.m2-fpost{height:118px;flex:none;border-radius:12px;background:#141414;position:relative;overflow:hidden}
.m2-fpost::before{content:"";position:absolute;left:10px;top:10px;width:18px;height:18px;border-radius:50%;background:#2a2a2a;box-shadow:26px 2px 0 -4px #222,44px 2px 0 -4px #222}
.m2-fpost.g{background:#120e07;border:1px solid rgba(201,157,81,.55)}
.m2-fpost.g::after{content:attr(data-cta);position:absolute;left:8px;right:8px;bottom:8px;height:24px;display:grid;place-items:center;background:var(--m2-gold);color:#000;font-family:var(--m2-body);font-size:11px;font-weight:600;border-radius:4px}
.m2-pchip{position:absolute;font-family:var(--m2-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;padding:7px 10px;border:1px solid var(--m2-line-hi);background:rgba(0,0,0,.7);animation:m2bob 5s ease-in-out infinite}
.m2-pchip.a{left:4%;top:18%}.m2-pchip.b{right:4%;top:44%;animation-delay:-1.6s}.m2-pchip.c{left:8%;bottom:14%;animation-delay:-3.2s;color:var(--m2-gold);border-color:rgba(201,157,81,.5)}
@keyframes m2bob{50%{transform:translateY(-10px)}}
/* mockup: video */
.m2-viz-vsl{display:flex;flex-direction:column;justify-content:center;gap:18px}
.m2-vframe{aspect-ratio:16/9;width:100%;border:1px solid rgba(244,239,230,.18);position:relative;background:rgba(0,0,0,.55);display:grid;place-items:center;overflow:hidden}
.m2-vframe::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 4px)}
.m2-vrec{position:absolute;right:12px;top:10px;font-family:var(--m2-mono);font-size:10px;letter-spacing:.12em;color:var(--m2-mute);display:flex;align-items:center;gap:6px}
.m2-vrec::before{content:"";width:7px;height:7px;border-radius:50%;background:#E85D2A;animation:m2blink 1.2s steps(1) infinite}
.m2-play{width:62px;height:62px;border-radius:50%;background:var(--m2-gold);display:grid;place-items:center;position:relative;z-index:1;animation:m2ping 2.4s ease-out infinite}
@keyframes m2ping{0%{box-shadow:0 0 0 0 rgba(201,157,81,.45)}100%{box-shadow:0 0 0 22px rgba(201,157,81,0)}}
.m2-play::after{content:"";width:20px;height:22px;background:#000;clip-path:polygon(0 0,100% 50%,0 100%);margin-left:5px}
.m2-vcap{position:absolute;left:14px;bottom:10px;height:32px;width:60%}
.m2-vcap span{position:absolute;left:0;bottom:0;font-family:var(--m2-display);font-size:30px;line-height:1;opacity:0;animation:m2cap 8s linear infinite}
.m2-vcap span:nth-child(2){animation-delay:-6s}.m2-vcap span:nth-child(3){animation-delay:-4s}.m2-vcap span:nth-child(4){animation-delay:-2s}
@keyframes m2cap{0%,23%{opacity:1;transform:none}25%,100%{opacity:0;transform:translateY(6px)}}
.m2-vbar{height:3px;background:var(--m2-line);position:relative}
.m2-vbar>span{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--m2-gold);animation:m2vbar 8s linear infinite}
@keyframes m2vbar{to{width:100%}}
.m2-vmarks{display:flex;justify-content:space-between;font-family:var(--m2-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--m2-mute)}
/* mockup: website */
.m2-browser{height:100%;border:1px solid rgba(244,239,230,.18);display:flex;flex-direction:column;background:rgba(0,0,0,.5)}
.m2-bchrome{display:flex;align-items:center;gap:6px;padding:10px 12px;border-bottom:1px solid var(--m2-line)}
.m2-bchrome i{width:8px;height:8px;border-radius:50%;background:#2b2b2b}
.m2-bchrome span{margin-inline-start:10px;font-family:var(--m2-mono);font-size:11px;color:var(--m2-mute);padding:3px 10px;border:1px solid var(--m2-line);border-radius:12px}
.m2-bbody{flex:1;padding:16px;display:grid;grid-template-columns:1.25fr 1fr;grid-template-rows:auto 1fr auto;gap:12px;min-height:0}
.m2-bk{animation:m2build 6s cubic-bezier(.2,.8,.2,1) infinite both}
.m2-bk1{grid-column:1/-1;display:grid;gap:8px;animation-delay:.1s}
.m2-bk1 span{height:14px;background:var(--m2-cream);opacity:.9}
.m2-bk1 span:first-child{width:78%}.m2-bk1 span:last-child{width:52%;opacity:.5}
.m2-bk2{background:repeating-linear-gradient(135deg,rgba(201,157,81,.35) 0 2px,transparent 2px 9px);border:1px solid rgba(201,157,81,.4);animation-delay:.5s}
.m2-bk3{display:grid;gap:8px;align-content:start;animation-delay:.8s}
.m2-bk3 span{height:7px;background:rgba(244,239,230,.25)}
.m2-bk3 span:nth-child(2){width:86%}.m2-bk3 span:nth-child(3){width:64%}
.m2-bk4{grid-column:1/-1;justify-self:start;background:var(--m2-gold);color:#000;font-size:12px;font-weight:600;padding:9px 16px;animation-delay:1.1s}
@keyframes m2build{0%{opacity:0;transform:translateY(14px)}12%,82%{opacity:1;transform:none}94%,100%{opacity:0;transform:none}}
/* mockup: SEO rankings */
.m2-serp{position:relative;height:100%}
.m2-rk{position:absolute;left:0;right:0;display:flex;align-items:center;gap:14px;padding:0 14px;border-bottom:1px solid var(--m2-line);transition:top .7s cubic-bezier(.7,0,.2,1);font-size:15px}
.m2-rk .n{font-family:var(--m2-mono);font-size:12px;color:var(--m2-mute);width:26px;font-variant-numeric:tabular-nums}
.m2-rk.me{background:var(--m2-gold-soft,rgba(201,157,81,.1));color:var(--m2-gold);z-index:2}
.m2-rk.me .n{color:var(--m2-gold)}

/* ---------- service panels (home): results pages in our colours (PPC ads, SEO organic) ---------- */
.m2-viz-search{justify-content:flex-start;gap:10px}
.m2-gres{display:grid;gap:8px;min-height:0}
.m2-gad{display:grid;gap:3px;padding:9px 12px;border:1px solid var(--m2-line);border-radius:10px;background:rgba(12,11,10,.72);opacity:.55}
.m2-gad.is-win{opacity:1;border-color:rgba(201,157,81,.7);background:linear-gradient(180deg,rgba(201,157,81,.13),rgba(12,11,10,.85));box-shadow:0 0 0 1px rgba(201,157,81,.25),0 18px 40px -22px rgba(201,157,81,.6);animation:m2gwin 3.2s ease-in-out infinite}
@keyframes m2gwin{50%{box-shadow:0 0 0 1px rgba(201,157,81,.45),0 18px 44px -18px rgba(201,157,81,.85)}}
.m2-gad-l{font-family:var(--m2-mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--m2-gold);font-weight:600}
.m2-gsite{display:flex;align-items:center;gap:8px;min-width:0}
.m2-gsite i,.m2-rk .fav{flex:none;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#26231e;border:1px solid var(--m2-line-hi);font:600 10px/1 var(--m2-body);font-style:normal;color:var(--m2-cream)}
.m2-gad.is-win .m2-gsite i,.m2-rk.me .fav{background:var(--m2-gold);border-color:var(--m2-gold);color:#0b0b0b}
.m2-gsite span{display:grid;min-width:0;line-height:1.2}
.m2-gsite b{font-weight:500;font-size:12px;color:var(--m2-cream)}
.m2-gsite small,.m2-rk .u small{font-size:10.5px;color:var(--m2-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m2-gtitle{font-weight:500;font-size:14.5px;line-height:1.25;color:var(--m2-cream)}
.m2-gad.is-win .m2-gtitle{color:var(--m2-gold-hi)}
.m2-gdesc{font-size:11.5px;line-height:1.4;color:var(--m2-mute);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.m2-gstars,.m2-rk .st{color:var(--m2-gold);letter-spacing:.04em}
.m2-glinks{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:4px;padding-top:6px;border-top:1px solid rgba(201,157,81,.25)}
.m2-glinks span{font-size:11.5px;color:var(--m2-gold-hi)}
/* SEO: richer rows that still climb */
.m2-serp-rich .m2-rk{align-items:center;gap:10px;padding:0 10px;border:1px solid transparent;border-bottom-color:var(--m2-line);font-size:inherit}
.m2-serp-rich .m2-rk .n{width:22px;font-size:10px}
.m2-serp-rich .m2-rk .rt{display:grid;gap:1px;min-width:0;line-height:1.25}
.m2-serp-rich .m2-rk .u{display:flex;gap:6px;align-items:baseline;min-width:0}
.m2-serp-rich .m2-rk .u b{font-weight:500;font-size:11.5px;color:var(--m2-cream);white-space:nowrap}
.m2-serp-rich .m2-rk .t{font-weight:500;font-size:14px;color:var(--m2-cream);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m2-serp-rich .m2-rk .d{font-size:11px;color:var(--m2-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m2-serp-rich .m2-rk.me{border:1px solid rgba(201,157,81,.65);border-radius:10px;background:linear-gradient(180deg,rgba(201,157,81,.14),rgba(12,11,10,.9));box-shadow:0 14px 34px -20px rgba(201,157,81,.7)}
.m2-serp-rich .m2-rk.me .t{color:var(--m2-gold-hi)}
@media (max-width:899.98px){.m2-serp-rich{min-height:300px}.m2-gres .m2-gad:nth-child(3){display:none}}

/* ---------- service panels (home): real-looking visuals ---------- */
/* a phone (Paid Social, Organic Social): its own names, so the service pages' phone rules never touch it */
.m2-cv-phone{position:relative;height:100%;max-height:340px;aspect-ratio:9/18.5;border-radius:26px;padding:7px;background:linear-gradient(145deg,#2a2722,#0c0b0a 40%,#1b1916);box-shadow:0 0 0 1px rgba(244,239,230,.18),0 30px 60px -28px #000,inset 0 0 0 1px rgba(255,255,255,.06)}
.m2-cv-phone::before{content:"";position:absolute;top:13px;left:50%;width:46px;height:12px;margin-left:-23px;border-radius:8px;background:#000;z-index:2}
.m2-cv-feed,.m2-cv-prof{position:relative;height:100%;border-radius:20px;overflow:hidden;background:#000}
.m2-cv-feed img,.m2-cv-prof img{display:block;width:100%;height:auto}
.m2-cv-feed::after,.m2-cv-prof::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.25),transparent 8%,transparent 92%,rgba(0,0,0,.35))}
.m2-cv-feed>img{animation:m2cvfeed 30s linear infinite}
@keyframes m2cvfeed{to{transform:translateY(-100%)}}
.m2-cv-prof img{animation:m2cvprof 14s ease-in-out infinite alternate}
@keyframes m2cvprof{0%,12%{transform:none}88%,100%{transform:translateY(calc(-100% + 300px))}}
.m2-cv-org .m2-cvo{position:absolute;z-index:2;padding:8px 12px;border-radius:14px;background:rgba(12,11,10,.92);border:1px solid var(--m2-line-hi);font-size:12.5px;white-space:nowrap;box-shadow:0 14px 30px -14px #000;animation:m2bob 5s ease-in-out infinite}
.m2-cvo i{font-style:normal;color:#ff3b5c}
.m2-cvo.a{left:2%;top:16%}
.m2-cvo.b{right:0;top:46%;border-radius:14px 14px 4px 14px;animation-delay:-1.7s}
.m2-cvo.c{left:4%;bottom:12%;color:var(--m2-gold);border-color:rgba(201,157,81,.5);font-family:var(--m2-mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;animation-delay:-3.3s}
/* the showreel (Video Production) */
.m2-cv-vf video,.m2-cv-vf img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.m2-cv-vf::before{z-index:1}
.m2-cv-vf .m2-vrec{z-index:2;color:#fff;text-shadow:0 1px 6px #000}
/* the example website (Website Development) */
.m2-cv-browser{background:#0d0c0a;overflow:hidden;border-radius:8px 8px 0 0;box-shadow:0 30px 60px -30px #000}
.m2-cv-browser .m2-bchrome{background:#161513}
.m2-cv-browser .m2-bchrome i:nth-child(1){background:#e2655b}.m2-cv-browser .m2-bchrome i:nth-child(2){background:#e7b54d}.m2-cv-browser .m2-bchrome i:nth-child(3){background:#61c454}
.m2-cv-browser .m2-bchrome span{flex:1;max-width:220px;margin-inline:auto;text-align:center;color:var(--m2-cream);background:rgba(255,255,255,.04)}
.m2-cv-site{position:relative;flex:1;min-height:0;overflow:hidden}
.m2-cv-site img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0;animation:m2cvsite 24s cubic-bezier(.6,0,.3,1) infinite}
.m2-cv-live video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0}
.m2-cv-live img{animation:none} /* the still under the video stays put */
@keyframes m2cvsite{0%,9%{object-position:50% 0}22%,30%{object-position:50% 24%}43%,51%{object-position:50% 47%}64%,72%{object-position:50% 72%}85%,92%{object-position:50% 100%}100%{object-position:50% 0}}
/* the identity coming together (Branding) */
/* logo beside a 2 x 2 palette, the type across, then the card in whatever height is left: the mockup always fits its
   box, so it never spills over the labels above or the heading below */
.m2-cv-brand{--bt:10s;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr);gap:10px;align-content:stretch}
@media (min-width:900px) and (max-height:820px){.m2-cv-brand{gap:8px}}
.m2-cv-brand>*{animation:m2cvb1 var(--bt) cubic-bezier(.2,.8,.2,1) infinite both}
/* one after another in, all out together, then again */
@keyframes m2cvb1{0%{opacity:0;transform:translateY(14px) scale(.96)}9%,88%{opacity:1;transform:none}96%,100%{opacity:0;transform:none}}
@keyframes m2cvb2{0%,8%{opacity:0;transform:translateY(14px) scale(.96)}17%,88%{opacity:1;transform:none}96%,100%{opacity:0;transform:none}}
@keyframes m2cvb3{0%,15%{opacity:0;transform:translateY(14px) scale(.96)}24%,88%{opacity:1;transform:none}96%,100%{opacity:0;transform:none}}
@keyframes m2cvb4{0%,22%{opacity:0;transform:translateY(14px) scale(.96)}31%,88%{opacity:1;transform:none}96%,100%{opacity:0;transform:none}}
.m2-cv-brand>.m2-cvb-pal{animation-name:m2cvb2}.m2-cv-brand>.m2-cvb-type{animation-name:m2cvb3}.m2-cv-brand>.m2-cvb-card{animation-name:m2cvb4}
.m2-cvb-logo{display:grid;justify-items:center;align-content:center;gap:4px;padding:10px 12px;border:1px solid var(--m2-line);background:#0d0c0a}
.m2-cvb-logo svg,.m2-cvb-front svg{width:54px;height:54px}
.m2-cv-brand circle{fill:none;stroke:#cfa968;stroke-width:3;stroke-dasharray:330;stroke-dashoffset:330;animation:m2cvbring var(--bt) ease-out infinite}
@keyframes m2cvbring{0%,4%{stroke-dashoffset:330}22%,100%{stroke-dashoffset:0}}
.m2-cv-brand text{font:italic 500 56px/1 Georgia,"Times New Roman",serif;fill:#cfa968}
.m2-cvb-logo b{font-family:var(--m2-display);font-weight:400;font-size:24px;letter-spacing:.32em;margin-inline-start:.32em;line-height:1}
.m2-cvb-logo small{font-family:var(--m2-mono);font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--m2-mute);text-align:center}
.m2-cvb-pal{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.m2-cvb-pal i{display:grid;align-content:end;min-height:44px;padding:6px;background:var(--c);font-style:normal;font-family:var(--m2-mono);font-size:8px;letter-spacing:.06em;color:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.08)}
.m2-cvb-pal i:nth-child(3){color:rgba(0,0,0,.6)}.m2-cvb-pal i:nth-child(2){color:rgba(0,0,0,.65)}
.m2-cvb-pal b{font-family:var(--m2-body);font-weight:600;font-size:10px;letter-spacing:0}
.m2-cvb-type{grid-column:1 / -1;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;column-gap:16px;row-gap:2px;align-items:center;padding:10px 16px;border:1px solid var(--m2-line)}
.m2-cvb-type>b{grid-row:1 / 3;font:italic 500 40px/.9 Georgia,"Times New Roman",serif;color:var(--m2-gold)}
.m2-cvb-type span{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:12px;white-space:nowrap}
.m2-cvb-type em{font-style:normal;font-family:var(--m2-mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--m2-mute)}
.m2-cvb-type i{font:italic 500 14px/1 Georgia,serif;color:var(--m2-cream)}
.m2-cvb-card{grid-column:1 / -1;min-height:0;display:flex;align-items:center;justify-content:center;padding-block:10px;perspective:700px} /* room for the tilt */
.m2-cvb-front{height:min(100%,143px);width:auto;max-width:100%;aspect-ratio:1.75;overflow:hidden;display:grid;grid-template-columns:auto 1fr;grid-template-rows:1fr auto auto;column-gap:12px;align-items:end;padding:12px 14px;border-radius:6px;background:linear-gradient(135deg,#1a1814,#0b0a09);border:1px solid rgba(207,169,104,.45);box-shadow:0 22px 40px -20px #000;transform:rotateX(14deg) rotateZ(-3deg);animation:m2cvbcard var(--bt) ease-in-out infinite}
/* a short mockup box (small laptops): the logo, palette and type tighten up so the card keeps a real size */
@media (min-width:900px){.m2-cv-brand{container-type:size}}
@container (max-height:300px){
  .m2-cvb-logo{padding:6px 10px;gap:2px}
  .m2-cvb-logo svg{width:36px;height:36px}
  .m2-cvb-logo b{font-size:19px}
  .m2-cvb-pal i{min-height:30px;padding:4px 6px}
  .m2-cvb-pal b{font-size:9px}
  .m2-cvb-type{padding:6px 14px}
  .m2-cvb-type>b{font-size:30px}
  .m2-cvb-card{padding-block:8px}
  .m2-cvb-front{padding:8px 10px;column-gap:8px}
  .m2-cvb-front svg{width:30px;height:30px}
  .m2-cvb-front b{font-size:11px}
  .m2-cvb-front small{font-size:7.5px}
}
@container (max-height:250px){
  .m2-cvb-logo{padding:4px 8px}
  .m2-cvb-logo svg{width:28px;height:28px}
  .m2-cvb-logo b{font-size:16px}
  .m2-cvb-logo small{font-size:7.5px}
  .m2-cvb-pal{gap:4px}
  .m2-cvb-pal i{min-height:26px;padding:3px 5px;font-size:7px}
  .m2-cvb-pal b{font-size:8px}
  .m2-cvb-type{padding:4px 12px;column-gap:12px}
  .m2-cvb-type>b{font-size:24px}
  .m2-cvb-type span{font-size:11px}
  .m2-cvb-type i{font-size:12px}
  .m2-cvb-card{padding-block:6px}
}
@keyframes m2cvbcard{0%,24%{transform:rotateY(-70deg) rotateX(14deg)}38%,100%{transform:rotateX(14deg) rotateZ(-3deg)}}
.m2-cvb-front svg{grid-row:1 / 4;width:44px;height:44px;align-self:center}
.m2-cvb-front b{font-weight:500;font-size:13px}
.m2-cvb-front small{font-family:var(--m2-mono);font-size:8.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--m2-mute)}
/* aerial footage with a flight display (Drone) */
.m2-cv-drone{overflow:hidden;border:1px solid rgba(244,239,230,.18);background:#05080d}
.m2-cv-drone>video,.m2-cv-drone>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.m2-cvd-hud{position:absolute;inset:0;font-family:var(--m2-mono);font-size:10px;letter-spacing:.1em;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.85)}
.m2-cvd-hud>i{position:absolute;width:18px;height:18px;border:1.5px solid rgba(255,255,255,.85)}
.m2-cvd-hud .tl{left:10px;top:10px;border-right:0;border-bottom:0}.m2-cvd-hud .tr{right:10px;top:10px;border-left:0;border-bottom:0}
.m2-cvd-hud .bl{left:10px;bottom:10px;border-right:0;border-top:0}.m2-cvd-hud .br{right:10px;bottom:10px;border-left:0;border-top:0}
.m2-cvd-x{position:absolute;left:50%;top:50%;width:34px;height:34px;margin:-17px 0 0 -17px;border:1px solid rgba(255,255,255,.7);border-radius:50%}
.m2-cvd-x::before,.m2-cvd-x::after{content:"";position:absolute;background:rgba(255,255,255,.8)}
.m2-cvd-x::before{left:50%;top:-8px;bottom:-8px;width:1px}.m2-cvd-x::after{top:50%;left:-8px;right:-8px;height:1px}
.m2-cvd-rec{position:absolute;left:34px;top:14px;display:flex;align-items:center;gap:6px}
.m2-cvd-rec::before{content:"";width:7px;height:7px;border-radius:50%;background:#ff3b30;animation:m2blink 1.2s steps(1) infinite}
.m2-cvd-q{position:absolute;right:34px;top:14px;color:var(--m2-gold-hi)}
.m2-cvd-head{position:absolute;left:50%;top:12px;width:120px;margin-left:-60px;height:16px;overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 25%,#000 75%,transparent);mask:linear-gradient(90deg,transparent,#000 25%,#000 75%,transparent)}
.m2-cvd-head div{display:flex;gap:18px;width:max-content;animation:m2cvdhead 18s linear infinite}
.m2-cvd-head span{width:20px;text-align:center;font-size:9px}
@keyframes m2cvdhead{to{transform:translateX(-50%)}}
.m2-cvd-l,.m2-cvd-r{position:absolute;bottom:14px;line-height:1.5}
.m2-cvd-l{left:34px}.m2-cvd-r{right:34px;text-align:right}
.m2-cvd-bat{position:absolute;right:34px;top:32px;display:flex;align-items:center;gap:5px;font-size:9px}
.m2-cvd-bat i{width:20px;height:9px;border:1px solid #fff;border-radius:2px;background:linear-gradient(90deg,#61c454 78%,transparent 78%) content-box;padding:1px}
.m2-cvd-path{position:absolute;left:12%;right:12%;top:28%;bottom:26%;width:76%;height:46%;overflow:visible}
.m2-cvd-path path{fill:none;stroke:var(--m2-gold-hi);stroke-width:1.6;stroke-dasharray:4 5;vector-effect:non-scaling-stroke;opacity:.85;animation:m2cvdpath 3s linear infinite}
@keyframes m2cvdpath{to{stroke-dashoffset:-36}}
/* on air (Podcasts, coming soon) */
.m2-cv-pod{display:grid;justify-items:center;align-content:center;gap:16px;border:1px solid var(--m2-line);background:radial-gradient(60% 60% at 50% 45%,rgba(201,157,81,.14),transparent 70%)}
.m2-cvp-air{padding:6px 14px;border:1.5px solid #ff3b30;border-radius:6px;color:#ff6b5f;font-family:var(--m2-mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;box-shadow:0 0 22px -4px rgba(255,59,48,.6);animation:m2cvpair 2.4s ease-in-out infinite}
@keyframes m2cvpair{50%{opacity:.55;box-shadow:none}}
.m2-cvp-mic{width:64px;height:64px;fill:none;stroke:var(--m2-gold);stroke-width:2.4;stroke-linecap:round}
.m2-cvp-mic rect{fill:rgba(201,157,81,.15)}
.m2-cvp-wave{display:flex;align-items:center;gap:3px;height:40px}
.m2-cvp-wave i{width:3px;height:100%;border-radius:2px;background:var(--m2-gold);transform:scaleY(.15);animation:m2cvpwave 1.3s ease-in-out infinite alternate}
.m2-cvp-wave i:nth-child(3n){animation-duration:.9s}.m2-cvp-wave i:nth-child(4n+1){animation-duration:1.7s}.m2-cvp-wave i:nth-child(5n+2){animation-delay:-.6s}.m2-cvp-wave i:nth-child(7n){animation-delay:-1.1s}
@keyframes m2cvpwave{to{transform:scaleY(1)}}
.m2-cvp-soon{font-family:var(--m2-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--m2-mute)}
.m2-panel.is-soon{cursor:default}
.m2-panel.is-soon .m2-panel-top b{color:var(--m2-mute)}
@media (max-width:899.98px){
  .m2-cv-phone{max-height:320px}
  .m2-viz-vsl .m2-cv-vf{width:100%}
  .m2-cv-site{min-height:200px}
  .m2-cv-drone{min-height:220px}
  .m2-cv-pod{min-height:240px}
  /* phones: the panel grows with its content, so the card is sized by its width */
  .m2-cvb-front{width:min(100%,250px);height:auto}
}
@media (prefers-reduced-motion:reduce){
  .m2-cv-feed>img,.m2-cv-prof img,.m2-cv-site img,.m2-cv-brand>*,.m2-cv-brand circle,.m2-cvb-front,.m2-cvd-head div,.m2-cvd-path path,.m2-cvp-wave i,.m2-cvp-air,.m2-cvo{animation:none!important}
  .m2-cv-brand circle{stroke-dashoffset:0}
  .m2-cvp-wave i{transform:scaleY(.6)}
}

/* ---------- proof (orbit + 3D dashboard) ---------- */
.m2-proof{padding-block:var(--m2-sec)}
.m2-proof-grid{min-height:78vh}
.m2-proof .m2-slot{position:relative;min-height:62vh}
.m2-proof-cap{position:absolute;inset-inline-end:0;bottom:-6px;margin:0;font-family:var(--m2-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--m2-mute)}
/* With motion: held on screen while the dashboard turns and fills in. */
html.js-motion .m2-proof{height:var(--m2-proof-h,220vh);padding-block:0}
html.js-motion .m2-proof-sticky{position:sticky;top:0;height:100vh;display:flex;align-items:center}
html.js-motion .m2-proof-grid{width:100%;min-height:0}

@media (max-width:899.98px){
  .m2-split{grid-template-columns:1fr}
  .m2-split .m2-slot{order:-1!important;min-height:78vw}
  .m2-reach{min-height:0;padding-block:var(--m2-sec)}
  .m2-proof .m2-slot{min-height:70vw}
  .m2-proof-cap{inset-inline:0 auto}
  html.js-motion .m2-proof{height:calc(var(--m2-proof-h,220vh) * .6)}
  html.js-motion .m2-proof-sticky{align-items:flex-start;height:auto;padding-top:calc(76px + var(--m2-nav-top,0px))} /* fits its content, so no empty band when the pin lets go */
}
@media (max-width:520px){
  .m2-stats{grid-template-columns:1fr}
  .m2-badge{height:84px}
}
@media (prefers-reduced-motion:reduce){
  .m2-feed,.m2-pchip,.m2-bk,.m2-vcap span,.m2-vbar>span,.m2-play{animation:none!important}
  .m2-vcap span:first-child,.m2-bk{opacity:1}
}

/* ---------- Dubai dive (scroll-driven descent) ---------- */
/* Transparent so the zooming globe behind shows through until the Dubai scene fades in (as in the original). */
.m2-dive{position:relative;background:transparent}
.m2-dive-sticky{position:relative;height:100vh;height:100svh;min-height:560px;overflow:hidden}
html.js-motion .m2-dive{height:360vh}
html.js-motion .m2-dive-sticky{position:sticky;top:0}
.m2-dive-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.m2-dive-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:none}
.m2-dive.no-dive .m2-dive-fallback,html:not(.js) .m2-dive-fallback{display:block}
.m2-dive.no-dive .m2-hud{display:none}
.m2-hud{position:absolute;inset:calc(84px + var(--m2-nav-top,0px) + env(safe-area-inset-top,0px)) var(--m2-gr,16px) 28px var(--m2-gl,16px);pointer-events:none;opacity:0}
.m2-hud>i{position:absolute;width:26px;height:26px;border-color:rgba(244,239,230,.55);border-style:solid;border-width:0}
.m2-hud>i:nth-child(1){left:0;top:0;border-left-width:1px;border-top-width:1px}
.m2-hud>i:nth-child(2){right:0;top:0;border-right-width:1px;border-top-width:1px}
.m2-hud>i:nth-child(3){left:0;bottom:0;border-left-width:1px;border-bottom-width:1px}
.m2-hud>i:nth-child(4){right:0;bottom:0;border-right-width:1px;border-bottom-width:1px}
.m2-hud-row{position:absolute;left:22px;right:22px;display:flex;justify-content:space-between;gap:16px;font-family:var(--m2-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,239,230,.82);text-shadow:0 1px 8px rgba(0,0,0,.6)}
.m2-hud-row.top{top:18px}.m2-hud-row.bot{bottom:18px}
.m2-hud-row b{font-weight:500;color:var(--m2-cream);font-variant-numeric:tabular-nums}
.m2-hud-row .live{display:inline-flex;align-items:center;gap:8px}
.m2-hud-row .live::before{content:"";width:7px;height:7px;border-radius:50%;background:#E85D2A;animation:m2blink 1.2s steps(1) infinite}
.m2-hud-cross{position:absolute;left:50%;top:50%;width:40px;height:40px;margin:-20px 0 0 -20px}
.m2-hud-cross::before,.m2-hud-cross::after{content:"";position:absolute;background:rgba(244,239,230,.55)}
.m2-hud-cross::before{left:50%;top:0;bottom:0;width:1px}
.m2-hud-cross::after{top:50%;left:0;right:0;height:1px}
.m2-alt-bar{position:absolute;right:22px;top:50%;height:42%;transform:translateY(-50%);width:1px;background:rgba(244,239,230,.3)}
.m2-alt-bar span{position:absolute;left:-4px;width:9px;height:1px;background:var(--m2-gold);box-shadow:0 0 10px var(--m2-gold)}
.m2-dive-copy{position:absolute;inset-inline-start:var(--m2-gl,16px);bottom:clamp(56px,9vh,96px);max-width:min(640px,calc(100% - 32px));will-change:transform,opacity}
.m2-dive-copy .h2{font-size:clamp(3rem,7.4vw,8rem);text-shadow:0 2px 30px rgba(0,0,0,.35)}
.m2-dive-copy .lead{color:rgba(244,239,230,.86);text-shadow:0 1px 14px rgba(0,0,0,.5)}
.m2-dive-copy .eyebrow{color:rgba(244,239,230,.8)}
@media (max-width:899.98px){.m2-dive-copy{bottom:120px}.m2-alt-bar{display:none}.m2-hud-row{font-size:10px;letter-spacing:.1em}.m2-hud-row .hide-sm{display:none}}

/* ---------- partners strip ---------- */
/* Dark by default so white badge files show; "cream" suits dark or full-colour badges. */
.m2-partners{background:#000;color:var(--m2-cream,#F4EFE6);padding-block:var(--m2-sec)}
.m2-partners[data-bg="cream"]{background:var(--m2-cream,#F4EFE6);color:var(--m2-ink,#0B0B0B)}
.m2-partners-h{margin:0 auto clamp(22px,3vw,36px);text-align:center;font-size:clamp(2.2rem,4.6vw,4rem);line-height:.95}
.m2-partners-mq .m2-mq-in{gap:clamp(44px,5vw,80px);padding-inline-end:clamp(44px,5vw,80px)}
.m2-partners-mq .m2-mq-in img{height:clamp(40px,4vw,56px);max-width:180px;filter:none;opacity:.82}
.m2-partners[data-bg="cream"] .m2-mq{border-color:rgba(11,11,11,.12)}

/* ---------- clients marquee ---------- */
.m2-clients{background:#000;padding-block:var(--m2-sec);overflow:hidden}
.m2-clients-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 40px;flex-wrap:wrap;margin-bottom:56px}
.m2-clients-head .h2{margin:12px 0 0}
.m2-mq{overflow:hidden;white-space:nowrap;padding-block:22px;border-top:1px solid var(--m2-line)}
.m2-mq:last-child{border-bottom:1px solid var(--m2-line)}
.m2-mq-in{display:inline-flex;align-items:center;gap:clamp(48px,6vw,96px);padding-inline-end:clamp(48px,6vw,96px);will-change:transform}
.m2-mq-in img{height:clamp(30px,3.2vw,48px);width:auto;max-width:200px;object-fit:contain;filter:grayscale(1) brightness(1.25);opacity:.68;transition:opacity .4s,filter .4s}
.m2-mq-in img:hover{opacity:1;filter:none}
/* brand name in place of a logo not uploaded yet: same height and tone as the logos */
.m2-wordmark{font-family:var(--m2-display);font-size:clamp(28px,3vw,44px);line-height:1;letter-spacing:.04em;text-transform:uppercase;color:var(--m2-cream,#F4EFE6);opacity:.68;white-space:nowrap;transition:opacity .4s,color .4s}
.m2-wordmark:hover{opacity:1;color:var(--m2-gold,#C99D51)}
.m2-mq[dir]{direction:ltr}

/* ---------- work list ---------- */
.m2-work{background:#000;padding-block:var(--m2-sec)}
.m2-work-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 40px;flex-wrap:wrap}
.m2-work-head .h2{margin:12px 0 0}
.m2-work-head .lead{max-width:36ch}
.m2-work-list{list-style:none;margin:48px 0 0;padding:0;border-top:1px solid var(--m2-line)}
.m2-work-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:16px 28px;padding-block:26px;border-bottom:1px solid var(--m2-line)}
.m2-wr-name{font-family:var(--m2-display);font-size:clamp(2.6rem,7vw,7.2rem);line-height:.9;text-transform:uppercase;background:linear-gradient(90deg,var(--m2-gold) 0 50%,var(--m2-cream) 50% 100%);background-size:202% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;color:transparent;transition:background-position .8s cubic-bezier(.7,0,.2,1);min-width:0;overflow-wrap:anywhere}
:lang(ar) .m2-wr-name{line-height:1.2;text-transform:none}
.m2-work-row:hover .m2-wr-name,.m2-work-row:focus-visible .m2-wr-name{background-position:0 0}
.m2-wr-tags{font-family:var(--m2-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--m2-mute);text-align:end;max-width:30ch;line-height:1.6}
.m2-wr-arrow{width:58px;height:58px;border:1px solid var(--m2-line-hi);border-radius:50%;display:grid;place-items:center;transition:background .4s,border-color .4s,color .4s;flex:none}
.m2-wr-arrow svg{width:18px;height:18px;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
:dir(rtl) .m2-wr-arrow svg{transform:scaleX(-1)}
.m2-work-row:hover .m2-wr-arrow{background:var(--m2-gold);border-color:var(--m2-gold);color:#000}
.m2-work-row:hover .m2-wr-arrow svg{transform:rotate(45deg)}
.m2-wpre{position:fixed;left:0;top:0;z-index:58;pointer-events:none;width:300px;height:210px;margin:-105px 0 0 -150px;opacity:0;transform:scale(.6);transition:opacity .45s cubic-bezier(.2,.8,.2,1),transform .45s cubic-bezier(.2,.8,.2,1)}
.m2-wpre.on{opacity:1;transform:none}
.m2-wpre-in{width:100%;height:100%;background:#0b0b0b;border:1px solid rgba(201,157,81,.55);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;box-shadow:0 30px 80px rgba(0,0,0,.6);position:relative;overflow:hidden}
.m2-wpre-in::before{content:"";position:absolute;inset:-40%;background:conic-gradient(from 0deg,transparent 0 70%,rgba(201,157,81,.22) 80%,transparent 90%);animation:m2spin 4s linear infinite}
@keyframes m2spin{to{transform:rotate(360deg)}}
.m2-wpre-in img{height:64px;width:auto;max-width:220px;object-fit:contain;position:relative}
.m2-wpre-in span{font-family:var(--m2-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--m2-gold);position:relative}
@media (max-width:899.98px){
  .m2-work-row{grid-template-columns:minmax(0,1fr) auto}
  .m2-wr-tags{grid-column:1/-1;grid-row:2;text-align:start}
  .m2-wpre{display:none}
}

/* ---------- process ---------- */
.m2-process{background:#000;padding-block:var(--m2-sec)}
@media (min-width:900px){
  html.js-motion .m2-process{height:calc(100vh + 1500px);padding-block:0}
  html.js-motion .m2-process-sticky{position:sticky;top:0;height:100vh;min-height:620px;display:flex;flex-direction:column;justify-content:center}
}
.m2-pr-head .h2{margin:12px 0 0}
.m2-pr-track{position:relative;margin-top:64px}
.m2-pr-line{position:absolute;left:0;right:0;top:0;height:1px;background:var(--m2-line)}
.m2-pr-fill{position:absolute;inset:0;background:var(--m2-gold);transform-origin:left;transform:scaleX(0);box-shadow:0 0 12px var(--m2-gold)}
:dir(rtl) .m2-pr-fill{transform-origin:right}
html:not(.js-motion) .m2-pr-fill{transform:none}
.m2-pr-steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(var(--m2-steps,5),minmax(0,1fr));gap:28px}
.m2-step{padding-top:30px;position:relative;transition:opacity .6s,transform .6s;min-width:0}
.m2-step::before{content:"";position:absolute;top:-5px;inset-inline-start:0;width:10px;height:10px;background:#000;border:1px solid rgba(244,239,230,.45);transform:rotate(45deg);transition:background .4s,border-color .4s,box-shadow .4s}
.m2-step.on::before{background:var(--m2-gold);border-color:var(--m2-gold);box-shadow:0 0 14px var(--m2-gold)}
html.js-motion .m2-step:not(.on){opacity:.24;transform:translateY(8px)}
.m2-step .num{font-family:var(--m2-mono);font-size:12px;letter-spacing:.12em;color:var(--m2-gold)}
.m2-step h3{font-family:var(--m2-display);font-weight:400;font-size:clamp(2.4rem,3.3vw,3.7rem);line-height:.9;margin:10px 0 12px;text-transform:uppercase}
.m2-step p{margin:0;color:var(--m2-mute);font-size:15.5px;max-width:30ch}
@media (max-width:899.98px){
  .m2-pr-line{display:none}
  .m2-pr-steps{grid-template-columns:1fr;gap:0}
  .m2-step{padding:22px 0 22px 30px;padding-inline:30px 0;border-inline-start:1px solid var(--m2-line)}
  .m2-step::before{top:30px;inset-inline-start:-5.5px}
}

/* ---------- offices ---------- */
.m2-offices{background:#000;padding-block:var(--m2-sec)}
.m2-off-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:20px;margin-top:40px}
.m2-office{border:1px solid var(--m2-line);background:var(--m2-panel,#070707);padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;gap:22px;position:relative;overflow:hidden;min-width:0;transition:border-color .5s}
.m2-office:hover{border-color:rgba(201,157,81,.45)}
.m2-o-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.m2-office h3{font-family:var(--m2-display);font-weight:400;font-size:clamp(4rem,9vw,9.4rem);line-height:.82;margin:0;text-transform:uppercase}
.m2-o-tz{font-family:var(--m2-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--m2-mute);text-align:end}
.m2-o-time{font-family:var(--m2-mono);font-size:clamp(30px,3.4vw,48px);font-variant-numeric:tabular-nums;letter-spacing:.02em;line-height:1}
.m2-o-day{position:relative;height:1px;background:var(--m2-line);margin:18px 0 6px}
.m2-o-day span{position:absolute;inset-inline-start:0;top:0;height:1px;background:var(--m2-gold)}
.m2-o-day i{position:absolute;top:-4px;width:9px;height:9px;margin-inline-start:-4.5px;border-radius:50%;background:var(--m2-gold);box-shadow:0 0 12px var(--m2-gold)}
.m2-o-status{display:inline-flex;align-items:center;gap:9px;font-family:var(--m2-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--m2-mute);margin-top:12px}
.m2-o-status i{width:8px;height:8px;border-radius:50%;background:#555}
.m2-o-status.open i{background:var(--m2-ok,#3ECF6E);box-shadow:0 0 0 4px rgba(62,207,110,.16)}
.m2-o-meta{display:grid;gap:4px;color:var(--m2-mute);font-size:15.5px;margin-top:auto}
.m2-o-meta a{color:var(--m2-cream);font-weight:500}
.m2-o-meta a:hover{color:var(--m2-gold)}

/* ---------- CTA ---------- */
.m2-cta{min-height:88vh;padding-block:var(--m2-sec)}
.m2-cta .h2{font-size:clamp(4rem,9.6vw,10.5rem)}
.m2-cta .lead{margin-bottom:34px}
.m2-toast{font-family:var(--m2-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--m2-gold);min-height:18px;margin-top:14px}
@media (max-width:899.98px){.m2-cta{min-height:0;padding-block:var(--m2-sec)}}

/* ---------- contact form ---------- */
.m2-form-sec{padding-block:var(--m2-sec);display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:start;background:#000}
.m2-form-head .h2{font-size:clamp(3rem,6vw,6.4rem)}
.m2-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px}
.m2-field{display:grid;gap:8px;min-width:0}
.m2-field[data-field="message"]{grid-column:1/-1}
.m2-field label{font-family:var(--m2-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--m2-mute)}
.m2-field input,.m2-field select,.m2-field textarea{width:100%;font:inherit;font-size:16px;color:var(--m2-cream);background:rgba(255,255,255,.03);border:1px solid var(--m2-line-hi);border-radius:0;padding:14px 16px;transition:border-color .3s,background .3s;appearance:none}
.m2-field textarea{resize:vertical;min-height:130px}
.m2-field select{background-image:linear-gradient(45deg,transparent 50%,var(--m2-gold) 50%),linear-gradient(135deg,var(--m2-gold) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 15px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-inline-end:40px}
:dir(rtl) .m2-field select{background-position:20px 50%,25px 50%}
.m2-field select option{background:#0b0b0b}
.m2-field input:focus,.m2-field select:focus,.m2-field textarea:focus{outline:none;border-color:var(--m2-gold);background:rgba(201,157,81,.06)}
.m2-field.has-err input,.m2-field.has-err select,.m2-field.has-err textarea{border-color:#E85D2A}
.m2-err{margin:0;min-height:0;font-size:13px;color:#F08A63}
.m2-err:empty{display:none}
.m2-consent{margin-top:22px}
.m2-consent label{display:flex;gap:12px;align-items:flex-start;font-family:var(--m2-body);font-size:14px;letter-spacing:0;text-transform:none;color:var(--m2-mute);line-height:1.5;cursor:pointer}
.m2-consent input{appearance:auto;width:18px;height:18px;flex:none;margin-top:2px;accent-color:var(--m2-gold);padding:0}
.m2-consent a{color:var(--m2-gold);text-decoration:underline;text-underline-offset:3px}
.m2-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.m2-turnstile{margin-top:18px;min-height:65px}
.m2-form-foot{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:26px}
.m2-form-foot .btn[disabled]{opacity:.6;cursor:progress}
.m2-form-msg{margin:0;font-size:14px;color:#F08A63}
.m2-form-done{font-family:var(--m2-display);font-size:clamp(2rem,3.4vw,3.2rem);line-height:1;text-transform:uppercase;color:var(--m2-gold);margin:0;padding:40px 0;outline:none}
:lang(ar) .m2-form-done{text-transform:none;line-height:1.4}
@media (max-width:899.98px){
  .m2-form-sec{grid-template-columns:1fr;padding-block:var(--m2-sec)}
}
@media (max-width:520px){
  .m2-form-grid{grid-template-columns:1fr}
}

/* ---------- booking page: words on the left, the Microsoft Bookings calendar framed on the right ---------- */
/* the page, two columns on desktop: the headline and promises beside the video, then the call box beside the calendar */
.m2-booking{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(24px,3vw,44px);padding-block:var(--m2-top-s) var(--m2-sec);background:transparent}
.m2-booking-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,3.4vw,56px);align-items:stretch}
.m2-booking-col{display:flex;flex-direction:column;gap:clamp(24px,2.6vw,36px);min-width:0}
.m2-booking-intro{display:grid;gap:clamp(18px,2vw,26px)}
/* the video: a screen with a gold edge, a soft glow below and a slow sheen */
.m2-booking-film{position:relative;isolation:isolate}
.m2-booking-film-in{position:relative;will-change:transform,opacity}
.m2-booking-film-screen{position:relative;aspect-ratio:16/10;border-radius:18px;overflow:hidden;background:#0b0a08;border:1px solid rgba(201,157,81,.45);box-shadow:0 40px 100px -40px rgba(0,0,0,.95),0 0 0 1px rgba(0,0,0,.6) inset}
.m2-booking-film-screen video,.m2-booking-film-screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 46%}
.m2-booking-film-screen::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,0) 60%,rgba(0,0,0,.4)),linear-gradient(115deg,rgba(255,236,196,0) 30%,rgba(255,236,196,.07) 45%,rgba(255,236,196,0) 60%);box-shadow:inset 0 0 0 1px rgba(243,213,143,.18)}
.m2-booking-film-in::before{content:"";position:absolute;inset:-1px;z-index:1;border-radius:19px;pointer-events:none;padding:1px;background:linear-gradient(135deg,rgba(243,213,143,.9),rgba(201,157,81,.15) 30%,rgba(201,157,81,.15) 70%,rgba(243,213,143,.75));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.m2-booking-film-glow{position:absolute;inset:auto 8% -36px;height:80px;z-index:-1;border-radius:50%;background:radial-gradient(50% 50% at 50% 50%,rgba(214,168,88,.38),transparent 72%);filter:blur(18px);pointer-events:none}
/* the headline and intro */
.m2-booking-head{display:grid;gap:16px}
.m2-booking-titles{display:grid;gap:12px}
.m2-booking-h{font-size:clamp(2.8rem,5.2vw,5.6rem);line-height:.9;margin:0}
.m2-booking-lead{margin:0;max-width:44ch}
/* the promises, stacked */
.m2-booking-expect{list-style:none;margin:0;padding:0;display:grid;border-top:1px solid var(--m2-line)}
.m2-booking-expect li{display:grid;grid-template-columns:24px minmax(0,1fr);gap:14px;align-items:start;padding:13px 0;border-bottom:1px solid var(--m2-line);color:var(--m2-mute);font-size:14.5px;line-height:1.45}
.m2-booking-expect svg{width:22px;height:22px;margin-top:1px;fill:none;stroke:var(--m2-gold);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.m2-booking-expect b{display:block;font-family:var(--m2-display);font-weight:400;font-size:1.3rem;line-height:1.05;letter-spacing:.02em;text-transform:uppercase;color:var(--m2-cream);margin-bottom:2px}
.m2-booking-expect em{font-style:normal}
/* the calendar on the right, the call box on the left */
.m2-booking-slide{position:relative;z-index:2;min-width:0;will-change:transform}
.m2-booking-alt{position:sticky;top:var(--m2-sticky-top);display:grid;gap:8px;justify-items:start;padding:clamp(22px,2.4vw,32px);border:1px solid rgba(201,157,81,.28);border-radius:16px;background:radial-gradient(120% 80% at 0% 0%,rgba(201,157,81,.14),transparent 60%),linear-gradient(180deg,#121110,#0a0a09)}
.m2-booking-alt-ico{display:grid;place-items:center;width:46px;height:46px;margin-bottom:8px;border-radius:50%;background:var(--m2-gold)}
.m2-booking-alt-ico svg{width:20px;height:20px;fill:none;stroke:#0b0b0b;stroke-width:1.7;stroke-linejoin:round}
.m2-booking-phone{font-family:var(--m2-display);font-size:clamp(2rem,3vw,3rem);line-height:1;color:var(--m2-cream);text-decoration:none;font-variant-numeric:tabular-nums;transition:color .3s}
.m2-booking-phone:hover,.m2-booking-phone:focus-visible{color:var(--m2-gold)}
.m2-booking-addr{display:grid;grid-template-columns:20px minmax(0,1fr);gap:10px;align-items:start;width:100%;margin:14px 0 0;padding-top:16px;border-top:1px solid var(--m2-line);font-size:15px;line-height:1.5;color:var(--m2-mute);text-decoration:none;transition:color .3s}
.m2-booking-addr svg{width:18px;height:18px;margin-top:3px;fill:none;stroke:var(--m2-gold);stroke-width:1.6}
a.m2-booking-addr:hover,a.m2-booking-addr:focus-visible{color:var(--m2-cream)}
.m2-booking-msg{margin-top:10px;font-size:14.5px;color:var(--m2-gold);text-decoration:none}
.m2-booking-msg:hover,.m2-booking-msg:focus-visible{color:#fff}
/* the card: a dark title bar, then the calendar (or Microsoft's page) in a rounded panel */
.m2-booking-card{position:relative;min-width:0;border:1px solid rgba(201,157,81,.32);border-radius:16px;background:linear-gradient(180deg,#121110,#0a0a09);padding:0 10px 10px;box-shadow:0 50px 120px -50px rgba(0,0,0,.95),0 0 80px -30px rgba(201,157,81,.35)}
.m2-booking-card::before{content:"";position:absolute;inset:-12% -8% auto;height:60%;z-index:-1;pointer-events:none;background:radial-gradient(50% 50% at 50% 50%,rgba(214,168,88,.18),transparent 70%)}
.m2-booking-bar{display:flex;align-items:center;gap:14px;height:52px;padding:0 8px}
.m2-booking-dots{display:flex;gap:6px}.m2-booking-dots i{width:9px;height:9px;border-radius:50%;background:rgba(244,239,230,.18)}.m2-booking-dots i:first-child{background:var(--m2-gold)}
.m2-booking-title{flex:1;font-family:var(--m2-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--m2-mute)}
.m2-booking-open{font-family:var(--m2-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--m2-gold);text-decoration:none;white-space:nowrap}
.m2-booking-open:hover,.m2-booking-open:focus-visible{color:#fff}
.m2-booking-open-sm{display:none}
.m2-booking-frame{position:relative;height:var(--cal-h,860px);border-radius:10px;overflow:hidden;background:#fff}
.m2-booking-frame iframe{position:relative;z-index:1;display:block;width:100%;height:100%;border:0;background:transparent}
.m2-booking-wait{position:absolute;inset:0;display:grid;place-items:center;margin:0;font-family:var(--m2-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#6b6457}
.m2-booking-frame.is-loaded .m2-booking-wait{display:none}
.m2-booking-none{display:grid;gap:18px;padding:clamp(24px,4vw,48px)}
@media (max-width:899.98px){
  /* phones, stacked: headline, intro, promises, video, calendar, call box */
  /* phones: the site's small section step (28px) between the blocks, 48px into the footer */
  .m2-booking{gap:var(--m2-sec-sm)}
  .m2-booking-grid{display:flex;flex-direction:column;gap:var(--m2-sec-sm)}
  .m2-booking-col{display:contents}
  .m2-booking-intro{order:1}.m2-booking-film{order:2}.m2-booking-slide{order:3}.m2-booking-alt{order:4}
  .m2-booking-intro{gap:20px}
  .m2-booking-head{gap:14px}
  .m2-booking-lead{font-size:16px}
  .m2-booking-film-screen{aspect-ratio:auto;height:clamp(180px,52vw,260px);border-radius:14px}
  .m2-booking-film-in::before{border-radius:15px}
  .m2-booking-film-glow{bottom:-24px;height:56px}
  /* the promises: three short columns, titles only */
  .m2-booking-expect{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:12px 0;border-bottom:1px solid var(--m2-line)}
  .m2-booking-expect li{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;gap:6px;padding:0;border:0}
  .m2-booking-expect b{font-size:1.05rem;margin:0}
  .m2-booking-expect em{display:none}
  .m2-booking-alt{position:static;padding:18px}
  .m2-booking-phone{font-size:2.2rem}
  /* the iframe version: a big "Open booking page" button first, then Microsoft's page, tall enough to use */
  .m2-booking-card:not(.is-own){padding:12px}
  .m2-booking-card:not(.is-own) .m2-booking-bar{display:none}
  .m2-booking-open-sm{display:flex;justify-content:center;width:100%;margin-bottom:12px}
  .m2-booking-frame{height:min(1150px,175vh)}
}
/* our own calendar inside the card: month and times side by side, then the form, then a gold confirmation */
.m2-booking-card.is-own{padding:0 10px 10px}
.m2-cal{position:relative;border-radius:10px;background:radial-gradient(120% 80% at 0% 0%,rgba(201,157,81,.07),transparent 55%),#080808;border:1px solid rgba(244,239,230,.06);overflow:hidden}
.m2-cal{display:grid}
.m2-cal-step{display:none}
.m2-cal-step.is-on{display:grid;animation:m2CalIn .45s var(--m2-ease-out) both}
@keyframes m2CalIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.m2-cal-pick.is-on{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}
.m2-cal-month{padding:clamp(20px,2.4vw,32px);border-inline-end:1px solid var(--m2-line)}
.m2-cal-head{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.m2-cal-title{flex:1;margin:0;text-align:center;font-family:var(--m2-display);font-weight:400;font-size:clamp(1.7rem,2.2vw,2.1rem);line-height:1;letter-spacing:.03em;text-transform:uppercase;color:var(--m2-cream)}
.m2-cal-nav{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--m2-line-hi);background:transparent;color:var(--m2-cream);cursor:pointer;transition:border-color .3s,color .3s,background .3s,opacity .3s}
.m2-cal-nav svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.m2-cal-nav:hover:not(:disabled),.m2-cal-nav:focus-visible{border-color:var(--m2-gold);color:var(--m2-gold)}
.m2-cal-nav:disabled{opacity:.25;cursor:default}
.m2-cal-dow,.m2-cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.m2-cal-dow{margin-bottom:8px}
.m2-cal-dow span{text-align:center;font-family:var(--m2-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--m2-mute)}
.m2-cal-d{position:relative;display:grid;place-items:center;min-width:0;height:clamp(44px,4.4vw,54px);border-radius:10px;border:1px solid transparent;background:transparent;font:500 16px/1 var(--m2-body);font-variant-numeric:tabular-nums;color:rgba(244,239,230,.26);padding:0;cursor:default;transition:background .25s,color .25s,border-color .25s,transform .25s var(--m2-ease-out)}
.m2-cal-d.is-free{color:var(--m2-gold-hi);background:rgba(201,157,81,.1);border-color:rgba(201,157,81,.38);cursor:pointer}
.m2-cal-d.is-free::after{content:"";position:absolute;bottom:7px;left:50%;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--m2-gold)}
.m2-cal-d.is-free:hover{background:rgba(201,157,81,.2);border-color:var(--m2-gold);color:#fff}
.m2-cal-d.is-sel,.m2-cal-d.is-sel:hover{background:linear-gradient(160deg,var(--m2-gold-hi),var(--m2-gold));border-color:var(--m2-gold-hi);color:#0b0b0b;box-shadow:0 10px 30px -10px rgba(201,157,81,.7)}
.m2-cal-d.is-sel::after{background:#0b0b0b}
.m2-cal-d.is-today:not(.is-sel){box-shadow:inset 0 0 0 1px rgba(244,239,230,.35)}
.m2-cal-grid.is-loading .m2-cal-d{color:transparent;background:linear-gradient(90deg,rgba(244,239,230,.03),rgba(244,239,230,.08),rgba(244,239,230,.03)) 0 0/300% 100%;animation:m2CalShim 1.4s linear infinite}
@keyframes m2CalShim{to{background-position:-300% 0}}
.m2-cal-times{display:flex;flex-direction:column;min-width:0;padding:clamp(20px,2.4vw,32px);padding-inline-end:max(clamp(20px,2.4vw,32px),calc(var(--m2-wa-lane,84px) - var(--m2-gr) - 11px))}
.m2-cal-day{margin:0;font-family:var(--m2-display);font-size:clamp(1.5rem,1.9vw,1.85rem);line-height:1.05;letter-spacing:.02em;text-transform:uppercase;color:var(--m2-cream)}
.m2-cal-count{margin:6px 0 16px;min-height:1.4em;font-family:var(--m2-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--m2-gold)}
.m2-cal-slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px;align-content:start;max-height:520px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(201,157,81,.4) transparent}
.m2-cal-t{height:48px;border:1px solid var(--m2-line-hi);border-radius:10px;background:rgba(255,255,255,.02);color:var(--m2-cream);font:500 16px/1 var(--m2-body);font-variant-numeric:tabular-nums;cursor:pointer;transition:background .25s,border-color .25s,color .25s}
.m2-cal-t:hover,.m2-cal-t:focus-visible{background:var(--m2-gold);border-color:var(--m2-gold);color:#0b0b0b}
.m2-cal-tz{display:flex;gap:8px;align-items:flex-start;margin:0;padding-top:18px;font-size:13px;line-height:1.4;color:var(--m2-mute)}
.m2-cal-tz svg{flex:none;width:16px;height:16px;margin-top:1px;fill:none;stroke:var(--m2-gold);stroke-width:1.5}
.m2-cal-tz b{font-weight:500;color:var(--m2-cream)}
/* the form */
.m2-cal-form.is-on{gap:18px;padding:clamp(20px,2.6vw,36px);padding-inline-end:max(clamp(20px,2.6vw,36px),calc(var(--m2-wa-lane,84px) - var(--m2-gr) - 11px));align-content:start}
.m2-cal-sum{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px 16px;border:1px solid rgba(201,157,81,.4);border-radius:12px;background:rgba(201,157,81,.08)}
.m2-cal-sum-ico{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--m2-gold)}
.m2-cal-sum-ico svg{width:20px;height:20px;fill:none;stroke:#0b0b0b;stroke-width:1.7;stroke-linecap:round}
.m2-cal-sum-txt{display:grid;gap:2px;min-width:0}
.m2-cal-sum-txt b{font-family:var(--m2-display);font-weight:400;font-size:1.45rem;line-height:1.05;letter-spacing:.02em;text-transform:uppercase;color:var(--m2-cream)}
.m2-cal-sum-txt span{font-size:14px;color:var(--m2-mute)}
.m2-cal-change{min-height:44px;padding:0 14px;border:1px solid var(--m2-line-hi);border-radius:999px;background:transparent;color:var(--m2-cream);font:500 13px/1 var(--m2-body);cursor:pointer;transition:border-color .3s,color .3s}
.m2-cal-change:hover,.m2-cal-change:focus-visible{border-color:var(--m2-gold);color:var(--m2-gold)}
.m2-cal-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 18px}
.m2-cal-fields .m2-field[data-field="company"]{grid-column:1/-1}
.m2-cal .m2-field input{border-radius:10px}
.m2-cal .m2-field.is-bad input{border-color:#e0795f}
.m2-cal-err{font-size:13px;color:#f0a08b;min-height:0}
.m2-cal-err:empty{display:none}
.m2-cal-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.m2-cal-msg{margin:0;font-size:14px;color:#f0a08b}
.m2-cal-msg:empty{display:none}
.m2-cal-submit{width:100%;border-radius:10px}
.m2-cal-submit:disabled{opacity:.7;cursor:progress}
.m2-cal-small{margin:0;font-size:12.5px;line-height:1.5;color:var(--m2-mute)}
/* the confirmation: gold */
.m2-cal-done.is-on{place-content:center;justify-items:center;text-align:center;gap:6px;min-height:560px;padding:40px 24px;color:#0b0b0b;background:radial-gradient(90% 70% at 50% 0%,#f0d39c,transparent 70%),linear-gradient(160deg,var(--m2-gold-hi),var(--m2-gold) 55%,#a87c36);outline:none}
.m2-cal-tick svg{width:76px;height:76px;margin-bottom:14px;fill:none;stroke:#0b0b0b;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.m2-cal-tick circle{stroke-dasharray:151;stroke-dashoffset:151;animation:m2CalDraw .8s .1s var(--m2-ease-out) forwards}
.m2-cal-tick path{stroke-dasharray:36;stroke-dashoffset:36;animation:m2CalDraw .5s .7s var(--m2-ease-out) forwards}
@keyframes m2CalDraw{to{stroke-dashoffset:0}}
.m2-cal-done-eye{margin:0;font-family:var(--m2-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase}
.m2-cal-done-date{margin:6px 0 0;font-family:var(--m2-display);font-size:clamp(2.2rem,4vw,3.4rem);line-height:.95;text-transform:uppercase;text-wrap:balance}
.m2-cal-done-time{margin:4px 0 0;font-size:17px;font-weight:500}
.m2-cal-done-note{margin:22px 0 0;padding:12px 20px;border-radius:999px;background:#0b0b0b;color:var(--m2-gold-hi);font-weight:500;font-size:15px}
/* the fallback */
.m2-cal-down.is-on{gap:22px;align-content:center;min-height:560px;padding:clamp(24px,4vw,48px)}
@media (prefers-reduced-motion:reduce){.m2-cal-step.is-on,.m2-cal-tick circle,.m2-cal-tick path,.m2-cal-grid.is-loading .m2-cal-d{animation:none;stroke-dashoffset:0}}
@media (max-width:899.98px){
  /* phones: the card reaches nearly to the screen edges; month on top, times below, all big to tap */
  .m2-booking-card.is-own{margin-inline:calc(0px - var(--m2-gl)) calc(0px - var(--m2-gr));padding:0 6px 6px} /* to the section's own edges */
  .m2-booking-card.is-own .m2-booking-bar{height:44px}
  .m2-cal{min-height:0}
  .m2-cal-pick.is-on{grid-template-columns:minmax(0,1fr)}
  .m2-cal-month{padding:18px 12px 16px;border-inline-end:0;border-bottom:1px solid var(--m2-line)}
  .m2-cal-dow,.m2-cal-grid{gap:4px}
  .m2-cal-d{height:48px;font-size:17px;border-radius:9px}
  .m2-cal-times{padding:20px 12px 18px;padding-inline-end:12px;scroll-margin-top:calc(80px + var(--m2-nav-top))}
  /* phones: the WhatsApp button stays on; the times and the Book button leave it a lane on the right */
  .m2-cal-slots{margin-inline-end:calc(var(--m2-wa-lane,84px) - 39px)}
  .m2-cal-submit{width:calc(100% - 43px)} /* the WhatsApp button (48px, 20px from the edge) sits in the space on the right */
  .m2-cal-slots{max-height:none;overflow:visible;padding-right:0;grid-template-columns:repeat(3,minmax(0,1fr))}
  .m2-cal-t{height:52px;font-size:16px}
  .m2-cal-form.is-on{padding:18px 14px 20px;padding-inline-end:14px}
  .m2-cal-fields{grid-template-columns:minmax(0,1fr)}
  .m2-cal-sum{grid-template-columns:minmax(0,1fr) auto;padding:12px 14px}
  .m2-cal-sum-ico{display:none}
  .m2-cal-done.is-on,.m2-cal-down.is-on{min-height:460px}
}
@media (max-width:379.98px){.m2-cal-month{padding-inline:8px}.m2-cal-dow,.m2-cal-grid{gap:3px}} /* small phones: wider day buttons */
@media (max-width:359.98px){.m2-cal-slots{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- inner pages: page hero ---------- */
.m2-phero{position:relative;background:transparent;padding-block:var(--m2-top-m) var(--m2-sec);min-height:80vh;display:flex;align-items:flex-end;overflow:hidden;isolation:isolate}
.m2-phero[data-size="compact"]{min-height:0;padding-block:var(--m2-top-m) var(--m2-space-s)}
.m2-phero-grid{width:100%;position:relative;z-index:1}
.m2-phero-grid .m2-slot{min-height:52vh}
/* a big, tappable phone number under the hero buttons (Contact) */
.m2-phero-phone{display:inline-grid;gap:6px;margin-top:22px;color:var(--m2-cream);text-decoration:none}
.m2-phero-phone-n{display:inline-flex;align-items:center;gap:14px;font-size:clamp(2.4rem,4.4vw,4.2rem);line-height:1;font-variant-numeric:tabular-nums;transition:color .3s}
.m2-phero-phone-n i{flex:none;display:grid;place-items:center;width:.72em;height:.72em;border-radius:50%;background:var(--m2-gold);color:#000;transform:translateY(-.04em)} /* a gold disc with the handset centred in it */
.m2-phero-phone-n i svg{width:52%;height:52%;display:block}
.m2-phero-phone:hover .m2-phero-phone-n{color:var(--m2-gold)}
.m2-phero-copy{max-width:min(100%,1100px)}
.m2-phero .m2-phero-title{font-size:clamp(3.4rem,8.2vw,9.4rem);margin:14px 0 26px}
.m2-phero .m2-phero-grid.m2-split .m2-phero-title{font-size:clamp(3.2rem,6vw,7.2rem)}
.m2-phero-grid.m2-split{align-items:center}
.m2-phero[data-size="compact"] .m2-phero-grid .m2-phero-title{font-size:clamp(3rem,7vw,7rem)}
.m2-phero .lead{max-width:52ch}
.m2-phero .btn-row{margin-top:34px}
.m2-phero .m2-crumbs{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 26px}
.m2-crumbs a{color:var(--m2-mute);transition:color .3s}
.m2-crumbs a:hover{color:var(--m2-gold)}
.m2-crumbs [aria-current]{color:var(--m2-cream)}
.m2-phero .m2-phero-eyebrow{color:var(--m2-gold)}
.m2-phero-bg{position:absolute;inset:0;z-index:-1}
.m2-phero-bg img,.m2-phero-bg video{width:100%;height:100%;object-fit:cover;opacity:.55}
.m2-phero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.2) 40%,#000 100%)}
@media (max-width:900px){.m2-phero{min-height:0;padding-bottom:60px}.m2-phero-grid .m2-slot{min-height:70vw}}

/* ---------- text section ---------- */
.m2-text{padding-block:var(--m2-sec);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(28px,6vw,110px);align-items:start}
.m2-text[data-layout="column"]{grid-template-columns:minmax(0,1fr);max-width:calc(820px + var(--m2-gl) + var(--m2-gr));margin-inline:auto}
.m2-text-head{position:sticky;top:var(--m2-sticky-top)}
.m2-text[data-layout="column"] .m2-text-head{position:static}
.m2-text-head .h2{margin-bottom:0}
.m2-text-img{margin-top:36px;width:100%;aspect-ratio:4/3;object-fit:cover;border:1px solid var(--m2-line)}
.m2-text-body{max-width:68ch;color:rgba(244,239,230,.86)}
.m2-text-body .btn-row{margin-top:32px}
.m2-text[data-tone="panel"],.m2-cards[data-tone="panel"]{background:var(--m2-panel)}
.m2-text[data-tone="cream"]{background:var(--m2-cream);color:var(--m2-ink)}
.m2-text[data-tone="cream"] .eyebrow{color:rgba(11,11,11,.6)}
.m2-text[data-tone="cream"] .m2-text-body{color:rgba(11,11,11,.82)}
@media (max-width:900px){.m2-text{grid-template-columns:1fr;padding-block:var(--m2-sec)}.m2-text-head{position:static}}

/* ---------- cards ---------- */
.m2-cards{padding-block:var(--m2-sec)}
.m2-cards-head,.m2-people-head,.m2-faq-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 40px;flex-wrap:wrap;margin-bottom:56px}
.m2-cards-head .h2,.m2-people-head .h2{margin-bottom:0}
.m2-cards-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--m2-line)}
.m2-cards-grid[data-cols="2"]{grid-template-columns:repeat(2,minmax(0,1fr))}
.m2-cards-grid[data-cols="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.m2-cards-grid>li{border-bottom:1px solid var(--m2-line);border-inline-end:1px solid var(--m2-line);min-width:0}
.m2-cards-grid[data-cols="2"]>li:nth-child(2n),.m2-cards-grid[data-cols="3"]>li:nth-child(3n),.m2-cards-grid[data-cols="4"]>li:nth-child(4n){border-inline-end:0}
.m2-card{position:relative;display:flex;flex-direction:column;gap:14px;height:100%;padding:clamp(26px,3vw,44px);color:inherit;transition:background .5s}
a.m2-card:hover{background:var(--m2-gold-soft)}
.m2-card-num{color:var(--m2-gold)}
.m2-card-title{font-family:var(--m2-display);font-weight:400;text-transform:uppercase;font-size:clamp(1.9rem,2.6vw,2.6rem);line-height:.95;margin:0}
.m2-card-text{color:var(--m2-mute);margin:0;max-width:46ch}
.m2-card-fig{font-size:clamp(4.4rem,8vw,8rem);line-height:.85;color:var(--m2-gold)}
.m2-cards[data-style="stats"] .m2-card-title{font-family:var(--m2-mono);font-size:12px;letter-spacing:.14em;color:var(--m2-mute)}
.m2-card-img{display:block;aspect-ratio:16/10;overflow:hidden;margin:-1px -1px 6px;border:1px solid var(--m2-line)}
.m2-card-img img{width:100%;height:100%;object-fit:cover;filter:grayscale(.6);transition:transform 1.2s var(--m2-ease-out),filter .6s}
a.m2-card:hover .m2-card-img img{transform:scale(1.05);filter:none}
.m2-card-arrow{margin-top:auto;width:22px;height:22px;color:var(--m2-gold);transition:transform .45s var(--m2-ease-out)}
a.m2-card:hover .m2-card-arrow{transform:translate(4px,-4px)}
@media (max-width:1100px){.m2-cards-grid[data-cols]{grid-template-columns:repeat(2,minmax(0,1fr))}.m2-cards-grid[data-cols]>li{border-inline-end:1px solid var(--m2-line)}.m2-cards-grid[data-cols]>li:nth-child(2n){border-inline-end:0}}
@media (max-width:640px){.m2-cards-grid[data-cols]{grid-template-columns:1fr}.m2-cards-grid[data-cols]>li{border-inline-end:0}.m2-cards{padding-block:var(--m2-sec)}}

/* ---------- FAQ and open roles ---------- */
.m2-faq{padding-block:var(--m2-sec);display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(28px,6vw,110px);align-items:start}
.m2-faq-head{display:block;margin:0;position:sticky;top:var(--m2-sticky-top)}
.m2-faq-list{border-top:1px solid var(--m2-line)}
.m2-faq-item{border-bottom:1px solid var(--m2-line)}
.m2-faq-item summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:26px 0;cursor:pointer;font-size:clamp(18px,1.6vw,22px)}
.m2-faq-item summary::-webkit-details-marker{display:none}
.m2-faq-item summary small{display:block;margin-top:6px}
.m2-faq-item summary i{flex:none;position:relative;width:18px;height:18px}
.m2-faq-item summary i::before,.m2-faq-item summary i::after{content:"";position:absolute;left:0;top:8px;width:18px;height:2px;background:var(--m2-gold);transition:transform .45s var(--m2-ease-out)}
.m2-faq-item summary i::after{transform:rotate(90deg)}
.m2-faq-item[open] summary i::after{transform:none}
.m2-faq-item summary:hover{color:var(--m2-gold-hi)}
.m2-faq-a{padding:0 0 28px;color:var(--m2-mute);max-width:66ch}
.m2-faq-a .btn{margin-top:14px}
.m2-jobs{padding-block:var(--m2-sec)}
.m2-jobs-empty{max-width:60ch;padding:32px 0;border-block:1px solid var(--m2-line)}
.m2-jobs-cv{margin-top:36px}
@media (max-width:900px){.m2-faq{grid-template-columns:1fr;padding-block:var(--m2-sec)}.m2-faq-head{position:static}}

/* ---------- team and talent ---------- */
.m2-people{padding-block:var(--m2-sec)}
.m2-team-grid,.m2-talent-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:clamp(18px,2vw,32px)}
.m2-talent-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.m2-person-card,.m2-talent-card{all:unset;box-sizing:border-box;display:flex;flex-direction:column;gap:8px;width:100%;cursor:pointer}
.m2-person-card:focus-visible,.m2-talent-card:focus-visible{outline:2px solid var(--m2-gold);outline-offset:6px}
.m2-person-photo,.m2-talent-media{position:relative;display:grid;place-items:center;aspect-ratio:4/5;overflow:hidden;background:var(--m2-panel);border:1px solid var(--m2-line);margin-bottom:8px}
.m2-person-photo img,.m2-talent-media img,.m2-talent-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.m2-person-media{position:absolute;inset:0;display:grid;place-items:center;filter:grayscale(1) contrast(1.05);transition:filter .7s,transform 1.2s var(--m2-ease-out)}
.m2-person-card:hover .m2-person-media,.m2-person-card:focus-visible .m2-person-media,.m2-person-card.is-playing .m2-person-media{filter:none;transform:scale(1.04)}
.m2-talent-media video{opacity:0;transition:opacity .5s}
.m2-talent-card.is-playing video{opacity:1}
.m2-initials{font-family:var(--m2-display);font-size:clamp(3.5rem,6vw,5.5rem);color:rgba(201,157,81,.5)}
.m2-person-name{font-family:var(--m2-display);font-size:clamp(1.7rem,2.2vw,2.2rem);text-transform:uppercase;line-height:1}
.m2-person-card:hover .m2-person-name,.m2-talent-card:hover .m2-person-name{color:var(--m2-gold)}
.m2-memorial{position:absolute;inset:auto 10px 10px auto;padding:6px 10px;background:rgba(0,0,0,.72);color:var(--m2-gold);border:1px solid rgba(201,157,81,.4)}
.m2-person.is-memorial .m2-person-media{filter:grayscale(1)!important}
.m2-reel-tag{position:absolute;inset:auto auto 10px 10px;padding:6px 10px;background:rgba(0,0,0,.72);color:var(--m2-cream);transition:opacity .4s}
.m2-talent-card.is-playing .m2-reel-tag{opacity:0}

/* ---------- profile pop-up ---------- */
.m2-dialog{--dlg-h:min(600px,calc(100dvh - 32px));padding:0;border:1px solid var(--m2-line-hi);background:var(--m2-panel);color:var(--m2-cream);width:min(1100px,calc(100vw - 32px));height:var(--dlg-h);max-height:none;overflow:hidden;overscroll-behavior:contain}
.m2-dialog::backdrop{background:rgba(0,0,0,.78);backdrop-filter:blur(6px)}
.m2-dialog[open]{animation:m2-pop .5s var(--m2-ease-out)}
@keyframes m2-pop{from{opacity:0;transform:translateY(24px)}}
/* every pop-up the same size: a square photo the full height, the words beside it
   (centred when short, scrolling inside when long) */
.m2-dialog-in{position:relative;height:100%;display:grid;grid-template-columns:var(--dlg-h) minmax(0,1fr)}
.m2-dialog-photo{width:100%;height:100%;object-fit:cover;object-position:50% 20%;background:#000;display:block}
.m2-dialog-copy{min-height:0;overflow:auto;overscroll-behavior:contain;padding:clamp(56px,6vh,72px) clamp(28px,4vw,52px) clamp(32px,5vh,52px);display:flex;flex-direction:column;justify-content:flex-start;justify-content:safe center;gap:14px;align-items:flex-start;-webkit-mask-image:linear-gradient(#000 calc(100% - 44px),transparent);mask-image:linear-gradient(#000 calc(100% - 44px),transparent);scrollbar-width:thin;scrollbar-color:rgba(201,157,81,.4) transparent}
.m2-dialog-copy h3{font-size:clamp(2.4rem,4vw,3.6rem);margin:0}
.m2-dialog-copy .prose{font-size:16px;line-height:1.65;color:rgba(244,239,230,.86)}
.m2-dialog-close{position:absolute;top:12px;inset-inline-end:12px;z-index:2;width:44px;height:44px;border:1px solid var(--m2-line-hi);background:rgba(0,0,0,.6);color:var(--m2-cream);font-size:26px;line-height:1;cursor:pointer}
.m2-dialog-close:hover{border-color:var(--m2-gold);color:var(--m2-gold)}
.m2-creds{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:8px;font-family:var(--m2-mono);font-size:12px;letter-spacing:.06em;color:var(--m2-mute)}
.m2-creds li::before{content:"— ";color:var(--m2-gold)}
.m2-dialog-initials{display:grid;place-items:center;background:radial-gradient(70% 70% at 50% 40%,rgba(201,157,81,.16),transparent 70%),#100d09}
.m2-dialog-initials span{font-family:var(--m2-display);font-size:clamp(5rem,12vw,9rem);line-height:1;color:var(--m2-gold);letter-spacing:.02em}
/* narrower screens: photo on top (a fixed band), words below, the whole pop-up scrolls */
@media (max-width:860px){
  .m2-dialog{height:auto;max-height:calc(100dvh - 32px);overflow:auto}
  .m2-dialog-in{height:auto;grid-template-columns:1fr}
  .m2-dialog-photo{height:min(46vh,420px)}
  .m2-dialog-copy{overflow:visible;padding-top:28px;-webkit-mask-image:none;mask-image:none}
}
@media (max-width:640px){.m2-people{padding-block:var(--m2-sec)}.m2-team-grid,.m2-talent-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.m2-person-name{font-size:1.5rem}}

/* ---------- case study ---------- */
.m2-case-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:0;margin:0 0 50px;border-block:1px solid var(--m2-line)}
.m2-case-facts>div{padding:22px 24px 22px 0;border-inline-end:1px solid var(--m2-line)}
.m2-case-facts>div+div{padding-inline-start:24px}
.m2-case-facts>div:last-child{border-inline-end:0}
.m2-case-facts dd{margin:8px 0 0;font-size:18px}
.m2-case-facts a{color:var(--m2-gold)}
.m2-case-cover{margin:0 0 20px}
.m2-case-cover img{width:100%;max-height:78vh;object-fit:cover;border:1px solid var(--m2-line)}
.m2-case .m2-cards{padding-block:var(--m2-sec)}
.m2-case-body{padding-block:var(--m2-sec-sm) var(--m2-sec);display:flex;justify-content:center}
.m2-case-body .prose{font-size:19px;color:rgba(244,239,230,.86)}
.m2-case-body .prose h2{color:var(--m2-cream)}
.m2-case-next{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:40px;align-items:end;padding-block:var(--m2-sec);border-top:1px solid var(--m2-line)}
.m2-case-next-link{display:flex;flex-direction:column;gap:10px;color:inherit}
.m2-case-next-link .display{font-size:clamp(3.4rem,8vw,8.5rem);line-height:.86;transition:color .4s}
.m2-case-next-link:hover .display{color:var(--m2-gold)}
.m2-case-cta .btn-row{margin-top:20px}
@media (max-width:820px){.m2-case-next{grid-template-columns:1fr}.m2-case-facts>div{border-inline-end:0;padding-inline:0!important;border-bottom:1px solid var(--m2-line)}.m2-case-facts>div:last-child{border-bottom:0}}

/* ---------- legal pages ---------- */
.m2-legal-body{display:grid;grid-template-columns:minmax(220px,300px) minmax(0,1fr);gap:clamp(28px,6vw,100px);padding-block:0 var(--m2-sec);align-items:start}
.m2-legal-body:not(:has(.m2-legal-toc)){grid-template-columns:minmax(0,1fr);max-width:calc(860px + var(--m2-gl) + var(--m2-gr));margin-inline:auto}
.m2-legal-date{margin:0;font-family:var(--m2-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--m2-mute)}
.m2-legal-date time{color:var(--m2-gold)}
/* the contents: sticky beside the text on desktop */
.m2-legal-toc{position:sticky;top:var(--m2-sticky-top);max-height:calc(100vh - 140px);overflow:auto;border-top:1px solid var(--m2-gold);padding-top:16px;scrollbar-width:thin;scrollbar-color:rgba(201,157,81,.4) transparent}
.m2-legal-toc summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;color:var(--m2-cream)}
.m2-legal-toc summary::-webkit-details-marker{display:none}
.m2-legal-toc summary span{color:var(--m2-gold)}
.m2-legal-toc ol{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:2px;font-size:14px;line-height:1.35;color:var(--m2-mute)}
.m2-legal-toc a{display:grid;grid-template-columns:28px minmax(0,1fr);gap:6px;padding:6px 8px;border-inline-start:2px solid transparent;color:inherit;text-decoration:none;transition:color .25s,border-color .25s,background .25s}
.m2-legal-toc a span{font-family:var(--m2-mono);font-size:12px;color:var(--m2-gold)}
.m2-legal-toc a:hover{color:var(--m2-cream)}
.m2-legal-toc a.is-on{color:var(--m2-cream);border-inline-start-color:var(--m2-gold);background:rgba(201,157,81,.07)}
/* the text: a comfortable column, numbered section headings, clause numbers that stand out */
.m2-legal .prose{font-size:17px;line-height:1.75;color:rgba(244,239,230,.84);max-width:70ch}
.m2-legal .prose>*+*{margin-top:.85em}
.m2-legal .prose .m2-legal-h{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:baseline;gap:14px;margin:2.4em 0 .7em;padding-top:1.1em;border-top:1px solid var(--m2-line);font-size:clamp(1.9rem,3vw,2.6rem);line-height:1;color:var(--m2-cream);scroll-margin-top:var(--m2-sticky-top)}
.m2-legal .prose .m2-legal-h:first-child{margin-top:0}
.m2-legal-n{display:inline-grid;place-items:center;min-width:1.5em;height:1.5em;padding:0 .3em;border:1px solid rgba(201,157,81,.55);border-radius:6px;font-family:var(--m2-mono);font-size:.42em;letter-spacing:.04em;color:var(--m2-gold);transform:translateY(-.25em)}
.m2-legal .prose strong,.m2-legal .prose b{color:var(--m2-cream);font-weight:600}
.m2-legal-cl{display:grid;grid-template-columns:3.4em minmax(0,1fr);gap:4px}
.m2-legal-cn{font-family:var(--m2-mono);font-size:.82em;color:var(--m2-gold);padding-top:.15em}
.m2-legal .prose ul,.m2-legal .prose ol{padding-inline-start:1.2em}
.m2-legal .prose li+li{margin-top:.4em}
.m2-legal .prose li::marker{color:var(--m2-gold)}
.m2-legal .prose table{width:100%;border-collapse:collapse;font-size:14px}
.m2-legal .prose th,.m2-legal .prose td{border:1px solid var(--m2-line);padding:10px;text-align:start;vertical-align:top}
.m2-legal-top{margin-top:3em!important;padding-top:1.4em;border-top:1px solid var(--m2-line)}
.m2-legal-top a{font-family:var(--m2-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--m2-gold)!important;text-decoration:none!important}
/* phones: the contents fold away above the text */
@media (max-width:900px){
  .m2-legal-body{grid-template-columns:minmax(0,1fr);gap:24px}
  .m2-legal-toc{position:static;max-height:none;border:1px solid var(--m2-line);border-top-color:var(--m2-gold);padding:14px 16px}
  .m2-legal-toc summary{min-height:24px}
  .m2-legal-toc summary::after{content:"+";font-family:var(--m2-mono);font-size:18px;color:var(--m2-gold);margin-inline-start:12px}
  .m2-legal-toc[open] summary::after{content:"−"}
  .m2-legal-toc summary span{margin-inline-start:auto}
  .m2-legal .prose{font-size:16px;line-height:1.7}
  .m2-legal-cl{grid-template-columns:2.9em minmax(0,1fr)}
}
/* ---------- vacancies page ---------- */
.m2-vac-intro{margin-top:4px;color:var(--m2-cream)}
.m2-vac-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,360px);gap:clamp(28px,5vw,80px);align-items:start;padding-block:0 var(--m2-sec)}
.m2-vac-empty{position:relative;padding:clamp(26px,3.4vw,44px);border:1px solid rgba(201,157,81,.32);border-radius:16px;background:radial-gradient(90% 70% at 0% 0%,rgba(201,157,81,.1),transparent 60%),#0b0a09;overflow:hidden}
.m2-vac-empty::after{content:"";position:absolute;right:-60px;bottom:-60px;width:220px;height:220px;border-radius:50%;border:1px solid rgba(201,157,81,.18);box-shadow:0 0 0 30px rgba(201,157,81,.04),0 0 0 60px rgba(201,157,81,.025)}
.m2-vac-status{display:inline-flex;align-items:center;gap:10px;margin-bottom:22px;padding:8px 14px;border:1px solid var(--m2-line-hi);border-radius:30px;font-family:var(--m2-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--m2-cream)}
.m2-vac-status i{width:8px;height:8px;border-radius:50%;background:var(--m2-gold);box-shadow:0 0 0 4px rgba(201,157,81,.18)}
.m2-vac-text{position:relative;z-index:1;font-size:17px;line-height:1.75;color:rgba(244,239,230,.84);max-width:62ch}
.m2-vac-text h3,.m2-vac-text h4{font-family:var(--m2-display);font-weight:400;text-transform:uppercase;font-size:clamp(1.7rem,2.6vw,2.2rem);line-height:1;color:var(--m2-cream)}
.m2-vac-count{margin:0 0 14px;color:var(--m2-mute)}.m2-vac-count span{color:var(--m2-gold)}
.m2-vac-list{display:grid;gap:12px;margin-bottom:36px}
.m2-vac-job{border:1px solid var(--m2-line);border-radius:14px;background:#0b0a09;transition:border-color .3s}
.m2-vac-job[open],.m2-vac-job:hover{border-color:rgba(201,157,81,.5)}
.m2-vac-job summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 24px}
.m2-vac-job summary::-webkit-details-marker{display:none}
.m2-vac-job-t{display:grid;gap:8px}
.m2-vac-job-t b{font-family:var(--m2-display);font-weight:400;font-size:clamp(1.8rem,2.6vw,2.4rem);line-height:1;text-transform:uppercase}
.m2-vac-job-t small{display:flex;flex-wrap:wrap;gap:6px}
.m2-vac-job-t small span{padding:4px 10px;border:1px solid var(--m2-line-hi);border-radius:20px;font-family:var(--m2-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--m2-mute)}
.m2-vac-job summary i{flex:none;width:36px;height:36px;border:1px solid var(--m2-line-hi);border-radius:50%;position:relative;transition:transform .3s,border-color .3s}
.m2-vac-job summary i::before,.m2-vac-job summary i::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;margin:-.75px 0 0 -6px;background:var(--m2-gold)}
.m2-vac-job summary i::after{transform:rotate(90deg);transition:transform .3s}
.m2-vac-job[open] summary i::after{transform:rotate(0)}
.m2-vac-job-d{padding:0 24px 24px;font-size:16px}
.m2-vac-job-d .btn{margin-top:18px}
.m2-vac-side{position:sticky;top:var(--m2-sticky-top);display:grid;gap:14px;justify-items:start;padding:clamp(22px,2.4vw,30px);border:1px solid var(--m2-line);border-top:1px solid var(--m2-gold);border-radius:16px;background:linear-gradient(180deg,#121110,#0a0a09)}
.m2-vac-side .eyebrow{margin:0;color:var(--m2-gold)}
.m2-vac-side-t{margin:0;color:var(--m2-mute);font-size:15px;line-height:1.6}
.m2-vac-mail{font-size:15px;color:var(--m2-cream);border-bottom:1px solid rgba(201,157,81,.5);padding-bottom:2px}
.m2-vac-more{font-size:14px;color:var(--m2-gold)}
.m2-vac a:not(.btn):hover{color:var(--m2-gold)}
@media (max-width:900px){
  .m2-vac-body{grid-template-columns:minmax(0,1fr);gap:24px}
  .m2-vac-side{position:static}
  .m2-vac-text{font-size:16px}
  .m2-vac-job summary{padding:18px}
  .m2-vac-job-d{padding:0 18px 20px}
}
@media print{.site-header,.site-footer,.m2-legal-toc,.m2-wa{display:none!important}.m2-legal .prose{color:#000}}
.m2-work-filters{display:flex;flex-wrap:wrap;gap:10px;margin:-20px 0 36px}
.m2-chip{height:40px;padding:0 18px;border:1px solid var(--m2-line-hi);background:transparent;color:var(--m2-mute);font:500 14px var(--m2-body);cursor:pointer;transition:all .3s}
.m2-chip:hover{color:var(--m2-cream);border-color:var(--m2-cream)}
.m2-chip[aria-pressed="true"]{background:var(--m2-gold);border-color:var(--m2-gold);color:#000}
.m2-work-list>li[hidden]{display:none}

/* team: square cinematic portraits, grouped by team, hover clips */
.m2-team .m2-person-photo{aspect-ratio:1/1}
.m2-person-photo video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .45s}
.m2-person-photo video.is-on{opacity:1}
/* with a reversed copy the clips swap on matching frames: no fade, or the gap between them would show */
[data-reel-back] .m2-person-photo video{transition:none}
/* the real M2 logo, where the portraits have it (same size and place as on the CEO's) */
.m2-person-photo .m2-person-mark{position:absolute;inset:2.8% 2.9% auto auto;z-index:2;width:10.3%;height:auto;object-fit:contain;pointer-events:none}
.m2-person-card.is-playing .m2-reel-tag{opacity:0}
.m2-team-group{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin:64px 0 24px;padding-top:18px;border-top:1px solid var(--m2-line);color:var(--m2-gold)}
.m2-team-group:first-of-type{margin-top:0}
.m2-team-group i{font-style:normal;color:var(--m2-mute)}

/* office label that follows a pin on the globe (placed by stage.js) */
.m2-pin-label{position:fixed;left:0;top:0;z-index:2;pointer-events:none;opacity:0;transition:opacity .35s;display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:center;will-change:transform}
/* world map (Contact): both offices labelled, out over the sea on a thin leader line */
.m2-map-label{position:fixed;left:0;top:0;z-index:2;width:0;height:0;pointer-events:none;opacity:0;transition:opacity .4s;will-change:transform}
.m2-map-label i{position:absolute;left:-7px;top:-7px;width:14px;height:14px;border-radius:50%;border:1.5px solid var(--m2-gold-hi);box-shadow:0 0 18px rgba(201,157,81,.8);animation:m2maplbl 2.2s ease-out infinite}
@keyframes m2maplbl{0%{transform:scale(.7);opacity:1}100%{transform:scale(2.4);opacity:0}}
.m2-map-label em{position:absolute;left:0;top:0;height:1px;transform-origin:0 0;background:linear-gradient(90deg,rgba(226,190,126,.9),rgba(226,190,126,.35))}
.m2-map-label span{position:absolute;left:0;top:0;display:grid;gap:3px;justify-items:center;text-align:center;padding:9px 14px;white-space:nowrap;border-radius:10px;background:rgba(0,0,0,.7);box-shadow:0 0 0 1px rgba(201,157,81,.3)}
.m2-map-label span.is-west{text-align:end}
.m2-map-label b{font:400 1.7rem/1 var(--m2-display);text-transform:uppercase;color:var(--m2-cream);letter-spacing:.02em}
.m2-map-label small{font-family:var(--m2-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--m2-mute)}
@media (prefers-reduced-motion:reduce){.m2-map-label i{animation:none}}
.m2-pin-label.is-map{padding:10px 16px 10px 10px;border-radius:12px;background:rgba(6,6,6,.72);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 0 0 1px rgba(201,157,81,.25)}
.m2-pin-label.is-map i,.m2-pin-label.is-map.is-flip i{margin:0}
.m2-pin-label i{grid-row:span 2;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:var(--m2-gold);box-shadow:0 0 0 6px rgba(201,157,81,.18),0 0 24px rgba(201,157,81,.9)}
.m2-pin-label b{font:400 clamp(1.6rem,2.4vw,2.4rem)/1 var(--m2-display);text-transform:uppercase;color:var(--m2-cream);letter-spacing:.02em}
.m2-pin-label span{font:500 11px/1.4 var(--m2-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--m2-mute)}

/* ---------- story timeline ---------- */
.m2-story{padding-block:var(--m2-sec);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(28px,6vw,110px);align-items:start}
.m2-story-side{position:sticky;top:var(--m2-sticky-top)}
.m2-story-side .h2{margin-bottom:28px}
.m2-story-count{display:flex;flex-direction:column;gap:6px;margin:0 0 28px}
.m2-story-count .display{font-size:clamp(6rem,13vw,13rem);line-height:.8;color:var(--m2-gold)}
.m2-tl{position:relative;padding-inline-start:44px}
.m2-tl-line{position:absolute;inset-block:10px 10px;inset-inline-start:6px;width:2px;background:var(--m2-line)}
.m2-tl-fill{position:absolute;inset:0;background:linear-gradient(var(--m2-gold),var(--m2-gold-hi));transform-origin:top;transform:scaleY(1)}
html.js-motion .m2-tl-fill{transform:scaleY(0)}
.m2-tl-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:clamp(48px,7vh,90px)}
.m2-tl-item{position:relative;transition:opacity .6s,transform .8s var(--m2-ease-out)}
html.js-motion .m2-tl-item{opacity:.28;transform:translateX(14px)}
html.js-motion .m2-tl-item.is-on{opacity:1;transform:none}
.m2-tl-dot{position:absolute;inset-inline-start:-44px;top:14px;width:14px;height:14px;border-radius:50%;border:2px solid var(--m2-line-hi);background:#000;transition:all .5s}
.m2-tl-item.is-on .m2-tl-dot,html:not(.js-motion) .m2-tl-dot{border-color:var(--m2-gold);background:var(--m2-gold);box-shadow:0 0 18px rgba(201,157,81,.7)}
.m2-tl-year{font-size:clamp(2.6rem,4vw,3.8rem);color:var(--m2-gold);margin:0 0 6px}
.m2-tl-title{font-family:var(--m2-display);font-weight:400;text-transform:uppercase;font-size:clamp(1.8rem,2.4vw,2.4rem);line-height:1;margin:0 0 10px}
.m2-tl-text{color:var(--m2-mute);margin:0;max-width:52ch}
@media (max-width:900px){.m2-story{grid-template-columns:1fr;padding-block:var(--m2-sec)}.m2-story-side{position:static}}

/* ---------- values ---------- */
.m2-values{padding-block:var(--m2-sec)}
.m2-values-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--m2-line)}
.m2-value{display:flex;flex-direction:column;gap:14px;padding:clamp(26px,3vw,40px);border-inline-end:1px solid var(--m2-line);border-bottom:1px solid var(--m2-line)}
.m2-value:last-child{border-inline-end:0}
.m2-value-art{width:72px;height:72px;margin-bottom:12px;overflow:visible}
.m2-value-art *{fill:none;stroke:var(--m2-gold);stroke-width:1.6;vector-effect:non-scaling-stroke}
.m2-value-art .f{fill:var(--m2-gold);stroke:none}
.m2-value-art .l{stroke:var(--m2-line-hi)}
.m2-value-art .r{transform-origin:40px 40px;animation:m2v-ring 3s var(--m2-ease-out) infinite}
.m2-value-art .r2{animation-delay:1s}.m2-value-art .r3{animation-delay:2s}
@keyframes m2v-ring{from{transform:scale(.4);opacity:1}to{transform:scale(2.4);opacity:0}}
.m2-value-art .b{transform-box:fill-box;transform-origin:bottom;animation:m2v-bar 2.8s var(--m2-ease-io) infinite alternate}
.m2-value-art .b1{animation-delay:-.2s;--h:.35}.m2-value-art .b2{animation-delay:-.6s;--h:.55}.m2-value-art .b3{animation-delay:-1s;--h:.75}.m2-value-art .b4{animation-delay:-1.4s;--h:1}
@keyframes m2v-bar{from{transform:scaleY(.12)}to{transform:scaleY(var(--h))}}
.m2-value-art .s{stroke-dasharray:200;stroke-dashoffset:200;animation:m2v-draw 3.4s var(--m2-ease-io) infinite}
@keyframes m2v-draw{45%,60%{stroke-dashoffset:0}100%{stroke-dashoffset:-200}}
.m2-value-art .o{transform-origin:40px 40px;animation:m2v-spin 6s linear infinite}
.m2-value-art .o2{animation-duration:9s;animation-direction:reverse}
@keyframes m2v-spin{to{transform:rotate(360deg)}}
.m2-value-art *{animation-play-state:paused}
.m2-value.is-in .m2-value-art *{animation-play-state:running}
@media (prefers-reduced-motion:reduce){.m2-value-art *{animation:none!important}}
@media (max-width:1100px){.m2-values-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.m2-value:nth-child(2n){border-inline-end:0}}
@media (max-width:640px){.m2-values-grid{grid-template-columns:1fr}.m2-value{border-inline-end:0}.m2-values{padding-block:var(--m2-sec)}}
.m2-pin-label.is-flip{grid-template-columns:1fr auto;text-align:end}
.m2-pin-label.is-flip i{grid-column:2;grid-row:1/span 2;margin:0 -6px 0 0}
.m2-pin-label.is-flip b,.m2-pin-label.is-flip span{grid-column:1}
.m2-pin-label b,.m2-pin-label span{white-space:nowrap}
.m2-pin-label.is-narrow{grid-template-columns:1fr;text-align:center}
.m2-pin-label.is-narrow i{display:none}

/* ---------- statement (scroll reveal) ---------- */
.m2-statement{position:relative;padding-block:var(--m2-sec)}
html.js-motion .m2-statement{height:210vh;padding-block:0}
html.js-motion .m2-statement-sticky{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center}
.m2-statement-text{font-size:clamp(2.6rem,5vw,5.8rem);line-height:.98;max-width:min(22ch,58vw);margin:22px 0 0;text-wrap:pretty}
.m2-statement .w{display:inline;transition:none}
html.js-motion .m2-statement .w{opacity:.14}
@media (max-width:700px){html.js-motion .m2-statement{height:170vh}.m2-statement-text{font-size:clamp(2.2rem,9vw,3.4rem);max-width:none;text-shadow:0 2px 24px #000}}

/* team group heading: a gold line draws across as it comes into view */
.m2-team .m2-team-group{border-top:0;position:relative}
.m2-team .m2-team-group::before{content:"";position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,var(--m2-gold),var(--m2-line) 60%);transform:scaleX(0);transform-origin:left;transition:transform 1.4s var(--m2-ease-out)}
.m2-team .m2-team-group.is-in::before,html:not(.js-motion) .m2-team .m2-team-group::before{transform:none}

/* chapter guide */
.m2-rail.is-chapters a.on span{opacity:1;transform:none;color:var(--m2-gold)}
.m2-rail.is-chapters a span{white-space:pre}
.m2-chapter-pill{display:none}
@media (max-width:899.98px){
  .m2-chapter-pill{display:flex;gap:6px;align-items:baseline;position:fixed;left:max(16px,env(safe-area-inset-left,0px));bottom:max(22px,env(safe-area-inset-bottom,0px));z-index:55;padding:9px 14px;background:rgba(0,0,0,.72);backdrop-filter:blur(8px);border:1px solid var(--m2-line);font:500 10.5px/1 var(--m2-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--m2-mute);opacity:0;transform:translateY(10px);transition:opacity .4s,transform .4s;pointer-events:none}
  .m2-chapter-pill.on{opacity:1;transform:none}
  .m2-chapter-pill b{color:var(--m2-gold);font-weight:500}
  .m2-chapter-pill span{margin-inline-start:8px;color:var(--m2-cream)}
}

/* ---------- case study showcase ---------- */
.m2-show{padding-block:var(--m2-sec)}
.m2-show-wrap{display:grid;grid-template-columns:minmax(180px,1fr) minmax(0,4fr);gap:clamp(24px,4vw,64px);align-items:start}
.m2-show-menu{position:sticky;top:var(--m2-sticky-top)}
.m2-show-menu ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;border-inline-start:1px solid var(--m2-line)}
.m2-show-menu li[hidden]{display:none}
.m2-show-menu a{display:flex;gap:12px;align-items:baseline;padding:8px 0 8px 16px;margin-inline-start:-1px;border-inline-start:2px solid transparent;color:var(--m2-mute);font-size:15px;transition:color .3s,border-color .3s}
.m2-show-menu a span{font:500 11px var(--m2-mono);letter-spacing:.1em}
.m2-show-menu a:hover{color:var(--m2-cream)}
.m2-show-menu a.on{color:var(--m2-cream);border-color:var(--m2-gold)}
.m2-show-menu a.on span{color:var(--m2-gold)}
.m2-show-items{display:flex;flex-direction:column;gap:clamp(60px,12vh,140px)}
.m2-show-item{min-height:78vh;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,56px);align-items:center;scroll-margin-top:100px}
.m2-show-item[hidden]{display:none}
.m2-show-media{position:relative;display:block;aspect-ratio:4/5;max-height:76vh;overflow:hidden;border:1px solid var(--m2-line);background:radial-gradient(120% 90% at 30% 20%,rgba(201,157,81,.22),transparent 60%),var(--m2-panel)}
.m2-show-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);transition:transform 1.8s var(--m2-ease-out),filter .8s;filter:grayscale(.35) brightness(.9)}
.m2-show-item.is-in .m2-show-media img{transform:scale(1)}
.m2-show-media:hover img{filter:none}
.m2-show-ph{position:absolute;inset:auto 24px 20px;font-size:clamp(3rem,7vw,7rem);line-height:.85;color:transparent;-webkit-text-stroke:1px rgba(201,157,81,.55)}
.m2-show-copy{display:flex;flex-direction:column;gap:16px;align-items:flex-start;opacity:.25;transform:translateY(24px);transition:opacity .9s,transform 1.1s var(--m2-ease-out)}
html:not(.js-motion) .m2-show-copy,.m2-show-item.is-in .m2-show-copy{opacity:1;transform:none}
.m2-show-copy .eyebrow b{color:var(--m2-gold);font-weight:500}
.m2-show-name{font-size:clamp(3rem,6.4vw,7rem);line-height:.86;margin:0}
.m2-show-result{display:flex;flex-direction:column;gap:4px;margin:6px 0 0;color:var(--m2-mute);font:500 12px var(--m2-mono);letter-spacing:.12em;text-transform:uppercase}
.m2-show-result .display{font-size:clamp(3rem,5vw,5rem);line-height:.85;color:var(--m2-gold);letter-spacing:0}
.m2-show-text{color:var(--m2-mute);margin:0;max-width:44ch}
@media (max-width:899.98px){
  .m2-show-wrap{grid-template-columns:1fr}
  .m2-show-menu{position:sticky;top:calc(64px + var(--m2-nav-top));z-index:5;margin-inline:calc(var(--m2-gl) * -1) calc(var(--m2-gr) * -1);padding:10px var(--m2-gr) 10px var(--m2-gl);background:rgba(0,0,0,.82);backdrop-filter:blur(10px);border-bottom:1px solid var(--m2-line)}
  .m2-show-menu ol{flex-direction:row;gap:8px;border:0;overflow-x:auto;scrollbar-width:none}
  .m2-show-menu ol::-webkit-scrollbar{display:none}
  .m2-show-menu a{white-space:nowrap;padding:8px 14px;border:1px solid var(--m2-line);margin:0;font-size:14px}
  .m2-show-menu a.on{border-color:var(--m2-gold)}
  .m2-show-item{grid-template-columns:1fr;min-height:0}
  .m2-show-media{aspect-ratio:4/3}
  .m2-show{padding-block:var(--m2-sec)}
}
.m2-show-menu a em{font-style:normal}
/* compact jump menu: numbers only, the current one with a gold bar */
.m2-show[data-menu="numbers"] .m2-show-wrap{grid-template-columns:56px minmax(0,1fr)}
.m2-show[data-menu="numbers"] .m2-show-menu em{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.m2-show[data-menu="numbers"] .m2-show-menu a{padding-inline-start:14px}
.m2-show[data-menu="numbers"] .m2-show-menu a span{font-size:12px}
@media (max-width:899.98px){.m2-show[data-menu="numbers"] .m2-show-wrap{grid-template-columns:1fr}}

/* quiet tribute under the team */
.m2-tribute{display:flex;gap:20px;align-items:center;margin-top:72px;padding:22px 24px;max-width:640px;border:1px solid var(--m2-line);background:rgba(255,255,255,.02)}
.m2-tribute img{width:72px;height:72px;object-fit:cover;filter:grayscale(1);flex:none}
.m2-tribute .eyebrow{margin:0 0 6px;color:var(--m2-gold)}
.m2-tribute-name{margin:0;font-family:var(--m2-display);font-size:1.7rem;text-transform:uppercase;line-height:1}
.m2-tribute-name span{font-family:var(--m2-mono);font-size:11px;letter-spacing:.12em;color:var(--m2-mute);margin-inline-start:8px;vertical-align:middle}
.m2-tribute-text{margin:8px 0 0;color:var(--m2-mute);font-size:15px}

/* ---------- About journey (3D) ---------- */
.m2-journey{position:relative;background:#040302}
.m2-journey.is-3d .j-track{position:relative;height:calc(var(--j-screens,10) * 100svh)}
.j-mark{position:absolute;left:0;width:1px;pointer-events:none}
.m2-journey.is-3d .j-stage{position:sticky;top:0;height:100svh;overflow:hidden}
.j-gl canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.m2-journey.is-3d .j-ui{position:absolute;inset:0;pointer-events:none}
.m2-journey.is-3d .j-ch{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;gap:14px;padding:calc(110px + var(--m2-nav-top)) var(--m2-gr) clamp(48px,9vh,96px) var(--m2-gl);opacity:0;will-change:opacity,transform}
.m2-journey.is-3d .j-ch.is-on a,.m2-journey.is-3d .j-ch.is-on button{pointer-events:auto}
.j-eyebrow{color:var(--m2-gold)}
.j-h1{font-size:clamp(3.2rem,7.2vw,7.6rem);line-height:.88;margin:0;max-width:14ch}
.j-h2{font-size:clamp(2.6rem,5vw,5rem);line-height:.9;margin:0;max-width:16ch}
.j-lead{color:var(--m2-mute);max-width:46ch;font-size:clamp(16px,1.3vw,19px);margin:0;display:flex;align-items:center;gap:14px}
.j-scroll{display:inline-block;width:1px;height:38px;background:linear-gradient(var(--m2-gold),transparent);animation:j-scroll 1.8s ease-in-out infinite;transform-origin:top}
@keyframes j-scroll{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
.m2-journey.is-3d .j-who{justify-content:center}
.j-statement{font-size:clamp(2.4rem,4.8vw,5.4rem);line-height:1;max-width:20ch;margin:0;text-shadow:0 2px 30px #000}
.j-statement .w{opacity:.16;transition:opacity .45s}
.j-statement .w.lit,.m2-journey.is-static .j-statement .w{opacity:1}
.m2-journey.is-3d .j-team,.m2-journey.is-3d .j-work,.m2-journey.is-3d .j-why{justify-content:space-between}
.j-focus{opacity:0;transform:translateY(16px);transition:opacity .5s,transform .7s var(--m2-ease-out);display:flex;flex-direction:column;align-items:flex-start;gap:8px;max-width:520px;text-shadow:0 2px 24px #000}
.j-focus.on{opacity:1;transform:none}
.j-focus-name{font-size:clamp(2.6rem,5vw,4.8rem);line-height:.9;margin:0}
.j-focus-group{color:var(--m2-gold);margin:0}
.j-focus-role{margin:0 0 8px;color:var(--m2-cream)}
.j-focus-result{display:flex;flex-direction:column;margin:0 0 8px}
.j-focus-result b{font-size:clamp(2.4rem,4vw,3.6rem);color:var(--m2-gold);line-height:.9;font-weight:400}
.j-focus-result b:empty+span{display:none}
.j-tribute{position:absolute;right:var(--m2-gr);bottom:clamp(48px,9vh,96px);max-width:300px;margin:0;font-size:13px;color:var(--m2-mute);text-align:end}
.j-tribute .eyebrow{display:block;color:var(--m2-gold);margin-bottom:4px}
.j-values{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:18px;align-self:flex-end;width:min(440px,100%)}
.j-value{display:flex;gap:16px;align-items:flex-start;opacity:.12;transform:translateX(16px);transition:opacity .6s,transform .8s var(--m2-ease-out)}
.j-value.on,.m2-journey.is-static .j-value{opacity:1;transform:none}
.j-value .m2-value-art{width:44px;height:44px;margin:0;flex:none}
.j-value-title{font-family:var(--m2-display);font-weight:400;font-size:1.7rem;line-height:1;text-transform:uppercase;margin:0 0 4px}
.j-value p{margin:0;color:var(--m2-mute);font-size:15px}
.m2-journey.is-3d .j-why .j-values{position:absolute;right:var(--m2-gr);top:50%;transform:translateY(-50%)}
.m2-journey.is-3d .j-contact{align-items:center;text-align:center;justify-content:flex-start;padding-top:54vh}
/* over the particle logo: hover pushes the dust, a click sends a ripple (as on the home page) */
.j-logo-slot{display:none}
.m2-journey.is-3d .j-logo-slot{display:block;position:absolute;left:18%;right:18%;top:18%;height:30vh}
.m2-journey.is-3d .j-ch.is-on .j-logo-slot{pointer-events:auto;cursor:pointer}
@media (max-width:899.98px){.m2-journey.is-3d .j-contact{padding-top:46vh}.m2-journey.is-3d .j-logo-slot{left:4%;right:4%;top:16%;height:24vh}}
.m2-journey.is-3d .j-contact .j-h1{max-width:16ch}
.j-pin{position:absolute;left:0;top:0;z-index:2;pointer-events:none;opacity:0;display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:center;will-change:transform}
.j-pin i{grid-row:span 2;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:var(--m2-gold);box-shadow:0 0 0 6px rgba(201,157,81,.18),0 0 24px rgba(201,157,81,.9)}
.j-pin b{font:400 clamp(1.4rem,2vw,2.2rem)/1 var(--m2-display);text-transform:uppercase;color:var(--m2-cream);white-space:nowrap}
.j-pin span{font:500 11px/1.4 var(--m2-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--m2-mute);white-space:nowrap}
.m2-journey.is-3d .j-static-list{display:none}
.m2-journey:not(.is-3d) .j-3d-only,.m2-journey:not(.is-3d) .j-gl,.m2-journey:not(.is-3d) .j-pin,.m2-journey:not(.is-3d) .j-mark{display:none}
/* plain stacked version (no WebGL, low power, reduced motion, editor) */
.m2-journey:not(.is-3d) .j-ch{display:flex;flex-direction:column;gap:16px;padding:110px var(--m2-gr) 40px var(--m2-gl);border-bottom:1px solid var(--m2-line)}
.m2-journey:not(.is-3d) .j-intro{padding-top:var(--m2-top-m)}
.j-static-list{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:18px}
.j-team-list button{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:6px}
.j-team-photo{position:relative;display:block;filter:grayscale(1)}
.j-team-list img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border:1px solid var(--m2-line)}
.j-team-list .m2-person-mark{position:absolute;inset:2.8% 2.9% auto auto;width:10.3%;height:auto;aspect-ratio:auto;border:0}
.j-team-list b{font-family:var(--m2-display);font-weight:400;font-size:1.5rem;text-transform:uppercase}
.j-stats li{display:flex;flex-direction:column;gap:6px;padding:18px 0;border-top:1px solid var(--m2-line)}
.j-stats b{font-size:clamp(3rem,6vw,5rem);color:var(--m2-gold);font-weight:400;line-height:.85}
.j-work-list{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.j-work-list a{display:flex;flex-direction:column;gap:8px}
.j-work-list img{width:100%;aspect-ratio:16/10;object-fit:cover;border:1px solid var(--m2-line)}
.j-work-list b{font-size:2rem;font-weight:400}
.m2-journey:not(.is-3d) .j-tribute{position:static;text-align:start;margin-top:24px}
@media (max-width:899.98px){
  .m2-journey.is-3d .j-ch{padding-bottom:max(84px,10vh)}
  .m2-journey.is-3d .j-why .j-values{position:static;transform:none;align-self:stretch;width:100%;gap:10px}
  .j-value .m2-value-art{width:34px;height:34px}
  .j-value-title{font-size:1.3rem}
  .j-value p{font-size:13.5px}
  .j-tribute{left:var(--m2-gl);right:auto;top:calc(150px + var(--m2-nav-top));bottom:auto;text-align:start;max-width:240px;font-size:12px}
  .m2-journey.is-3d .j-team .j-tribute{display:none}
}
/* journey: headings stay at the top, the focused name at the bottom */
.m2-journey.is-3d .j-team,.m2-journey.is-3d .j-work,.m2-journey.is-3d .j-why{justify-content:flex-start}
.m2-journey.is-3d .j-focus{margin-top:auto}
.m2-journey.is-3d .j-team .j-h2,.m2-journey.is-3d .j-work .j-h2,.m2-journey.is-3d .j-why .j-h2{font-size:clamp(2.2rem,3.6vw,3.8rem);text-shadow:0 2px 30px #000}
@media (max-width:899.98px){.m2-journey.is-3d .j-work .j-focus,.m2-journey.is-3d .j-team .j-focus{max-width:none}}
@media (max-width:899.98px){.m2-journey.is-3d .j-why .j-values{margin-top:auto;background:linear-gradient(transparent,rgba(4,3,2,.85) 30%);padding-top:24px}}

/* journey typography (revised): small label, short headline, one line, in the homepage's scale */
.m2-journey .j-h1{font-size:clamp(2.6rem,5.2vw,5.4rem);line-height:.9;max-width:13ch}
.m2-journey .j-h2,.m2-journey.is-3d .j-team .j-h2,.m2-journey.is-3d .j-work .j-h2,.m2-journey.is-3d .j-why .j-h2{font-size:clamp(2.2rem,3.6vw,3.8rem);line-height:.92;max-width:12ch;text-shadow:0 2px 30px #000}
.m2-journey .j-statement{font-size:clamp(2.2rem,3.6vw,3.8rem);max-width:none}
.j-statement .j-line{display:block}
.m2-journey .j-lead{font-size:clamp(15px,1.15vw,17px);line-height:1.5;max-width:40ch;color:var(--m2-mute)}
.m2-journey .j-eyebrow{margin:0}
.m2-journey.is-3d .j-who{justify-content:flex-end}
.j-cue{display:flex;align-items:center;gap:10px;margin:18px 0 0;color:var(--m2-mute)}
.j-cue .j-scroll{height:28px}
.j-link{all:unset;cursor:pointer;display:inline-flex;gap:8px;align-items:center;font:500 12px/1 var(--m2-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--m2-gold);padding:10px 0;border-bottom:1px solid rgba(201,157,81,.4);transition:border-color .3s,color .3s}
.j-link:hover,.j-link:focus-visible{color:var(--m2-gold-hi);border-color:var(--m2-gold-hi)}
.m2-journey .j-focus-name{font-family:var(--m2-display);font-weight:400;text-transform:uppercase;font-size:clamp(1.9rem,2.4vw,2.6rem);line-height:.95;margin:0}
.m2-journey .j-focus-role{font:500 12px/1.5 var(--m2-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--m2-mute);margin:0}
.m2-journey .j-focus-group{font-size:11px}
.m2-journey .j-focus-result b{font-size:clamp(2rem,3vw,2.8rem)}
.m2-journey .j-value-title{font-size:1.3rem}
.m2-journey .j-value p{font-size:14px}
.m2-journey .j-values{gap:14px;width:min(380px,100%)}
/* the person beside the front card: placed by journey.js, never over the portrait */
.m2-journey.is-3d .j-team .j-person{position:absolute;left:0;top:0;margin:0;max-width:360px;gap:6px;text-shadow:none;transition:opacity .45s}
.m2-journey.is-3d .j-team .j-person:not(.on){opacity:0}
@media (max-width:899.98px){
  .m2-journey.is-3d .j-team .j-person{max-width:280px;align-items:center;text-align:center}
  .m2-journey .j-h1{font-size:clamp(2.4rem,10vw,3.4rem)}
  .m2-journey .j-h2,.m2-journey .j-statement{font-size:clamp(2rem,8.6vw,2.8rem)}
}

/* ---------- services hub and service pages (docs/design-references.md, 4) ---------- */
.m2-svc-gl{position:fixed;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.m2-svc-hub{padding-bottom:70px}
/* hub hero: pinned while the headline lights up word by word (hubfx.js) */
.m2-hub-pin{min-height:100svh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:18px;padding-block:var(--m2-top-s) var(--m2-space-s);position:relative}
.m2-hub-hero.is-live{height:160vh}
/* a faint gold nebula behind the stars, drifting slowly */
.m2-hub-hero.is-space .m2-hub-pin::before{content:"";position:absolute;inset:-10%;z-index:-1;pointer-events:none;background:radial-gradient(38% 30% at 28% 38%,rgba(201,157,81,.16),transparent 70%),radial-gradient(30% 36% at 74% 62%,rgba(214,168,88,.11),transparent 70%),radial-gradient(60% 50% at 50% 50%,rgba(120,90,40,.07),transparent 70%);animation:m2-nebula 40s ease-in-out infinite alternate}
@keyframes m2-nebula{to{transform:translate(2.5%,-2%) scale(1.06)}}
.m2-hub-hero.is-space .m2-hub-pin{user-select:none;-webkit-user-select:none}
.m2-hub-hero.can-grab,.m2-hub-hero.can-grab *{cursor:grab!important}
.m2-hub-hero.is-holding,.m2-hub-hero.is-holding *{cursor:grabbing!important}
.m2-hub-hero.is-live .m2-hub-pin{position:sticky;top:0;height:100svh;min-height:0}
.m2-hub-h{font-size:clamp(4rem,11vw,13rem);line-height:.84;max-width:12ch;margin:0}
.m2-hub-h .w{display:inline-block;will-change:opacity,transform}
.m2-hub-hero.is-live:not(.is-done) .m2-hub-h .w{opacity:.14}
.m2-hub-hero.is-live:not(.is-done) [data-hub-lead]{opacity:0}
.m2-svc-hub-lead{max-width:46ch;color:var(--m2-mute);font-size:clamp(16px,1.3vw,19px);line-height:1.6;margin:0}
.m2-hub-cue{position:absolute;bottom:34px;left:50%;transform:translateX(-50%);display:grid;justify-items:center;gap:10px;font-family:var(--m2-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--m2-mute)}
.m2-hub-cue i{width:1px;height:42px;background:linear-gradient(var(--m2-gold),transparent);animation:m2-cue 2.2s ease-in-out infinite}
@keyframes m2-cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.m2-hub-grid{padding-top:0}
.m2-svc-hub-lead,.m2-svc-lead{max-width:56ch;color:var(--m2-mute);font-size:clamp(16px,1.3vw,19px);line-height:1.6;margin:0}
.m2-tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.4vw,20px)}
.m2-tile-li{display:block}
.m2-tile{position:relative;display:flex;flex-direction:column;height:100%;padding:18px 20px 22px;color:inherit;text-decoration:none;background:linear-gradient(180deg,#100f0c,#080807 70%);border:1px solid var(--m2-line);overflow:hidden;will-change:transform;transition:border-color .45s,box-shadow .45s}
a.m2-tile:hover,a.m2-tile:focus-visible{border-color:rgba(201,157,81,.75);box-shadow:0 40px 70px -40px rgba(0,0,0,.95),0 0 0 1px rgba(201,157,81,.18)}
.m2-tile-obj{display:block;aspect-ratio:1/1;margin:6px -8px 8px;background:radial-gradient(42% 14% at 50% 86%,rgba(201,157,81,.2),transparent 72%)}
.m2-tile-num{position:absolute;top:16px;left:20px;font-family:var(--m2-mono);font-size:11px;letter-spacing:.14em;color:var(--m2-mute)}
.m2-tile-name{font-size:clamp(1.9rem,2.3vw,2.7rem);line-height:.95;margin-top:auto}
.m2-tile-sum{color:var(--m2-mute);font-size:14.5px;line-height:1.5;margin-top:8px}
.m2-tile-go{position:absolute;top:12px;right:18px;font-size:20px;color:var(--m2-gold);transition:transform .45s var(--m2-ease-out)}
a.m2-tile:hover .m2-tile-go{transform:translateX(5px)}
.m2-tile-glare{position:absolute;inset:0;pointer-events:none;background:radial-gradient(45% 40% at var(--gx,50%) var(--gy,0%),rgba(255,214,140,.13),transparent 70%);opacity:0;transition:opacity .45s}
a.m2-tile:hover .m2-tile-glare{opacity:1}
.m2-tile.is-soon{opacity:.48;border-style:dashed;cursor:default}
.m2-tile-soon{position:absolute;top:12px;right:14px;font-family:var(--m2-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--m2-gold);border:1px solid rgba(201,157,81,.45);padding:5px 8px}
@media (max-width:1100px){.m2-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.m2-tile{padding:14px 14px 16px}.m2-tile-num{top:12px;left:14px}.m2-tile-go{right:12px;top:8px}.m2-tile-sum{font-size:13px}.m2-tile-soon{font-size:9.5px;padding:4px 6px;right:10px}}

/* service page: six steps; the object sits in each step's slot */
.m2-svc{position:relative}
.m2-svc-hero{min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;text-align:center;gap:14px;padding-block:var(--m2-top-s) var(--m2-sec)}
.m2-svc-hero .m2-svc-slot{flex:1 1 auto;align-self:stretch;min-height:34vh}
.m2-svc-hero-h{font-size:clamp(3.4rem,8.6vw,10rem);line-height:.86}
.m2-svc-hero .btn-row,.m2-svc-cta .btn-row{justify-content:center;margin-top:10px}
.m2-svc-split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,5vw,90px);padding-block:var(--m2-sec)}
.m2-svc-split.is-obj-right .m2-svc-slotcol{order:2}
.m2-svc-slotcol{position:relative}
.m2-svc-split .m2-svc-slot{position:sticky;top:calc(50vh - min(19vw,230px));height:min(38vw,460px)}
.m2-svc-h{font-size:clamp(2.8rem,5.6vw,6rem);margin:14px 0 22px}
.m2-svc-n{font-family:var(--m2-mono);font-size:11px;letter-spacing:.14em;color:var(--m2-gold)}
.m2-svc-inc{list-style:none;margin:30px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--m2-line);border:1px solid var(--m2-line)}
.m2-svc-inc li{background:#060606;padding:24px 22px 26px}
.m2-svc-inc h3,.m2-svc-steps h3{font-size:19px;font-weight:500;line-height:1.3;margin:10px 0 8px}
.m2-svc-inc p,.m2-svc-steps p{margin:0;color:var(--m2-mute);font-size:15px;line-height:1.6}
.m2-svc-steps{list-style:none;margin:30px 0 0;padding:0;border-top:1px solid var(--m2-line)}
.m2-svc-steps li{display:grid;grid-template-columns:64px minmax(0,1fr);gap:16px;padding:24px 0;border-bottom:1px solid var(--m2-line)}
.m2-svc-steps li .m2-svc-n{font-size:13px;padding-top:12px}
.m2-svc-steps h3{margin-top:6px}
.m2-svc-cases{display:grid;gap:18px;margin-top:30px}
.m2-svc-case{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);border:1px solid var(--m2-line);background:#080807;overflow:hidden;color:inherit;text-decoration:none;transition:border-color .45s}
.m2-svc-case img{width:100%;height:100%;min-height:220px;object-fit:cover;filter:grayscale(.5) brightness(.8);transition:filter .6s,transform 1.2s var(--m2-ease-out)}
.m2-svc-case:hover{border-color:rgba(201,157,81,.75)}
.m2-svc-case:hover img{filter:none;transform:scale(1.04)}
.m2-svc-case-in{display:flex;flex-direction:column;gap:10px;padding:24px}
.m2-svc-case-name{font-size:clamp(2rem,2.8vw,3.1rem);line-height:.95}
.m2-svc-figs{display:flex;flex-wrap:wrap;gap:16px 28px;margin-top:4px}
.m2-svc-figs span{display:grid;gap:6px;font-size:13.5px;line-height:1.4;color:var(--m2-mute);max-width:22ch}
.m2-svc-figs b{font-size:clamp(2.6rem,3.6vw,3.8rem);line-height:.9;color:var(--m2-gold)}
.m2-svc-case-ex{color:var(--m2-mute);font-size:15px;line-height:1.6}
.m2-svc-case-go{margin-top:auto;padding-top:8px;font-family:var(--m2-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.m2-svc .m2-faq-list{margin-top:30px}
.m2-svc-cta{min-height:88svh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px;padding-block:var(--m2-sec)}
.m2-svc-cta .m2-svc-slot{width:min(70vw,520px);height:min(34vh,60vw);margin-bottom:8px}
/* without 3D: no empty slots */
.m2-svc.is-static .m2-svc-slot,.m2-svc.is-static .m2-svc-slotcol{display:none}
.m2-svc.is-static .m2-svc-split{grid-template-columns:1fr}
.m2-svc.is-static .m2-svc-hero{min-height:80svh;justify-content:center}
@media (max-width:899.98px){
  .m2-svc-split{grid-template-columns:1fr;padding-block:var(--m2-sec)}
  .m2-svc-slotcol{display:none} /* phones: between sections the object passes through the gap and leaves (services3d.js) */
  .m2-svc-cta{min-height:0}
  .m2-svc-cta .m2-svc-slot{width:min(56vw,300px);height:min(26vh,44vw)}
  .m2-svc-inc,.m2-svc-case{grid-template-columns:1fr}
  .m2-svc-case img{min-height:0;aspect-ratio:16/9}
  .m2-svc-steps li{grid-template-columns:44px minmax(0,1fr)}
}

/* ---------- hub sections: channels flow, results strip, one team (4d) ---------- */
.m2-flow-pin{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(24px,4vw,70px);align-items:center;padding-block:var(--m2-sec)}
.m2-flow.is-live{height:230vh}
.m2-flow.is-live .m2-flow-pin{position:sticky;top:0;height:100svh;padding-block:calc(80px + var(--m2-nav-top)) 30px}
.m2-flow-map{position:relative;height:min(72vh,720px)}
.m2-flow-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.m2-flow-lines .line{fill:none;stroke:var(--m2-gold);stroke-width:1.5}
.m2-flow-lines .glow{fill:none;stroke:rgba(255,206,120,.28);stroke-width:7;filter:blur(4px)}
.m2-flow-lines .pulse{fill:#ffe2a8;filter:drop-shadow(0 0 6px #ffcf72);transition:opacity .3s}
.m2-flow-node{position:absolute;width:230px;transform:translate(-50%,-30%) scale(calc(.85 + .15 * var(--w,1)));display:grid;justify-items:center;text-align:center;gap:8px}
.m2-flow-obj{display:block;width:118px;height:118px;background:radial-gradient(45% 18% at 50% 92%,rgba(201,157,81,.25),transparent 72%)}
.m2-flow-txt{display:grid;gap:4px;justify-items:center}
.m2-flow-t{font-size:clamp(1.8rem,2.2vw,2.5rem);line-height:.95}
.m2-flow-p{color:var(--m2-mute);font-size:14px;line-height:1.5;max-width:26ch}
.m2-flow-node.is-last .m2-flow-t{color:var(--m2-gold)}
.m2-flow:not(.is-live) .m2-flow-node{position:relative;transform:none}
.m2-numbers{padding-block:var(--m2-sec)}
.m2-numbers-head{margin-bottom:28px}
.m2-numbers-row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));border-top:1px solid var(--m2-line)}
.m2-numbers-row li{display:grid;gap:12px;align-content:start;padding:34px 24px 10px 0;border-right:1px solid var(--m2-line)}
.m2-numbers-row li+li{padding-left:24px}
.m2-numbers-row li:last-child{border-right:0}
.m2-numbers-row b{font-size:clamp(4rem,8vw,8.4rem);line-height:.82;color:var(--m2-gold);font-variant-numeric:tabular-nums}
.m2-numbers-row li>span{color:var(--m2-mute);font-size:15px;line-height:1.5;max-width:26ch}
.m2-why-pin{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-rows:auto 1fr;gap:12px clamp(24px,4vw,70px);padding-block:var(--m2-sec)}
.m2-why-head{grid-column:1 / -1}
.m2-why.is-live{height:210vh}
.m2-why.is-live .m2-why-pin{position:sticky;top:0;height:100svh;padding-block:calc(80px + var(--m2-nav-top)) 30px}
.m2-why-stage{position:relative;min-height:360px;margin-top:10px}
.m2-why-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.m2-why-lines line{stroke:rgba(244,239,230,.3);stroke-width:1;stroke-dasharray:4 6}
.m2-why-chip{position:absolute;left:0;top:0;white-space:nowrap;padding:10px 16px;border:1px solid var(--m2-line-hi);background:#0b0a08;font-family:var(--m2-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--m2-cream)}
.m2-why-one{position:absolute;left:50%;top:50%;width:clamp(170px,18vw,240px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;border:1px solid var(--m2-gold);background:radial-gradient(circle,rgba(201,157,81,.22),rgba(201,157,81,.04) 60%,transparent 70%);box-shadow:0 0 60px rgba(201,157,81,.25),inset 0 0 40px rgba(201,157,81,.15);transform:translate(-50%,-50%)}
.m2-why-one b{font-size:clamp(2.2rem,3vw,3.2rem);color:var(--m2-gold)}
/* with the 3D ring (services3d.js): the labels ride under the gold pieces, the centre is just the words */
.m2-why-stage.is-3d .m2-why-chip{padding:5px 9px;border:0;border-radius:6px;background:rgba(6,6,5,.85);color:var(--m2-cream);font-size:10.5px;white-space:nowrap}
.m2-why-stage.is-3d .m2-why-one{border:0;background:none;box-shadow:none;width:auto;aspect-ratio:auto}
.m2-why-stage.is-3d .m2-why-one b{font-size:clamp(2.6rem,3.6vw,4rem);color:var(--m2-cream)}
@media (max-width:899.98px){.m2-why-stage.is-3d .m2-why-one b{font-size:1.9rem}.m2-why-stage{min-height:340px}}
.m2-why-points p{color:rgba(244,239,230,.8)}
.m2-why-points h3{color:var(--m2-cream)}
.m2-why-points{list-style:none;margin:0;padding:0;align-self:center;border-top:1px solid var(--m2-line)}
.m2-why-points li{display:grid;grid-template-columns:48px minmax(0,1fr);column-gap:12px;padding:20px 0;border-bottom:1px solid var(--m2-line)}
.m2-why-points .m2-svc-n{padding-top:5px;grid-row:span 2}
.m2-why-points h3{margin:0 0 6px;font-size:19px;font-weight:500}
.m2-why-points p{margin:0;color:var(--m2-mute);font-size:15px;line-height:1.55}
.m2-why:not(.is-live) .m2-why-chip{position:static;display:inline-block;margin:4px}
.m2-why:not(.is-live) .m2-why-one{position:relative;left:auto;top:auto;transform:none;margin:20px auto}
.m2-cta-phone{font-variant-numeric:tabular-nums}
@media (max-width:899.98px){
  .m2-hub-hero.is-live{height:170vh}
  .m2-flow.is-live{height:auto}
  .m2-flow.is-live .m2-flow-pin,.m2-flow-pin{position:relative;height:auto;grid-template-columns:1fr;padding-block:var(--m2-sec)}
  .m2-flow-map{height:auto;display:grid;gap:44px;padding-left:4px}
  .m2-flow-node{position:relative;left:auto;top:auto;width:auto;transform:none;grid-template-columns:96px minmax(0,1fr);justify-items:start;text-align:left;gap:18px;align-items:center}
  .m2-flow-obj{width:96px;height:96px}
  .m2-flow-txt{justify-items:start}
  .m2-numbers-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .m2-numbers-row li{padding:26px 14px 22px 0;border-right:0;border-bottom:1px solid var(--m2-line)}
  .m2-numbers-row li+li{padding-left:0}
  .m2-numbers-row li:nth-child(even){padding-left:14px;border-left:1px solid var(--m2-line)}
  .m2-why.is-live{height:auto}
  .m2-why.is-live .m2-why-pin,.m2-why-pin{position:relative;height:auto;grid-template-columns:1fr;padding-block:var(--m2-sec)}
  .m2-why-stage{min-height:300px}
  .m2-why-chip{font-size:10.5px;padding:8px 11px}
}
@media (prefers-reduced-motion:reduce){.m2-hub-hero.is-live,.m2-flow.is-live,.m2-why.is-live{height:auto}.m2-hub-hero.is-live .m2-hub-pin,.m2-flow.is-live .m2-flow-pin,.m2-why.is-live .m2-why-pin{position:relative;height:auto}}
/* the hub's logo strip sits between the numbers and "one team": a tighter band there */
.elementor-element:has(.m2-numbers)+.elementor-element .m2-clients{padding-block:var(--m2-sec-sm)}

/* ---------- service pages: light and depth (4e) ---------- */
.m2-svc{position:relative;isolation:isolate}
.m2-svc.is-turnable,.m2-svc.is-turnable *{cursor:grab}
.m2-svc-hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(55% 42% at 50% 34%,rgba(214,168,88,.26),rgba(201,157,81,.06) 45%,transparent 72%),radial-gradient(90% 40% at 50% 100%,rgba(201,157,81,.08),transparent 70%)}
.m2-svc-split{position:relative}
.m2-svc-split:nth-of-type(even){background:linear-gradient(180deg,transparent,#0b0a07 35%,#0b0a07 65%,transparent)}
.m2-svc-split::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(40% 50% at 18% 50%,rgba(201,157,81,.14),transparent 70%)}
.m2-svc-split.is-obj-right::before{background:radial-gradient(40% 50% at 82% 50%,rgba(201,157,81,.14),transparent 70%)}
.m2-svc-slot{position:relative}
.m2-svc-slot::before{content:"";position:absolute;inset:-18%;pointer-events:none;background:radial-gradient(50% 50% at 50% 56%,rgba(214,168,88,.26),rgba(201,157,81,.08) 40%,rgba(201,157,81,.02) 60%,transparent 72%)}
.m2-svc-cta::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(50% 50% at 50% 42%,rgba(214,168,88,.22),transparent 70%)}
.m2-svc .m2-svc-lead{color:rgba(244,239,230,.82)}
.m2-svc .m2-svc-inc p,.m2-svc .m2-svc-steps p,.m2-svc .m2-faq-a{color:rgba(244,239,230,.72)}
.m2-svc .m2-svc-inc{background:rgba(201,157,81,.16);border-color:rgba(201,157,81,.16)}
.m2-svc .m2-svc-inc li{background:linear-gradient(180deg,#110f0b,#080807)}
.m2-svc .m2-svc-steps,.m2-svc .m2-svc-steps li,.m2-svc .m2-faq-list,.m2-svc .m2-faq-item{border-color:rgba(201,157,81,.18)}

/* story layout: a pinned section whose scroll plays the scene beside the words */
.m2-svc-step[data-story]{grid-template-columns:minmax(0,3fr) minmax(0,9fr)}
.m2-svc-step[data-story].is-obj-right{grid-template-columns:minmax(0,9fr) minmax(0,3fr)}
.m2-svc-step.is-story-live{height:320vh;align-items:stretch;padding-block:0}
.m2-svc-step.is-story-live .m2-svc-body{position:sticky;top:0;height:100svh;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-rows:auto auto minmax(0,1fr);grid-template-areas:"eye eye" "head head" "steps scene";gap:10px clamp(24px,3vw,48px);padding-block:calc(84px + var(--m2-nav-top)) 36px;align-content:start}
.m2-svc-step.is-story-live .m2-svc-body>.eyebrow{grid-area:eye}
.m2-svc-step.is-story-live .m2-svc-body>.m2-svc-h{grid-area:head}
.m2-svc-step.is-story-live .m2-svc-body>.m2-svc-h{margin-bottom:6px;font-size:clamp(2.4rem,4.4vw,4.6rem)}
.m2-story-steps{grid-area:steps;align-self:center;list-style:none;margin:0;padding:0;display:grid;gap:2px}
.m2-story-steps li{display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px;padding:12px 0;border-bottom:1px solid rgba(201,157,81,.12);opacity:calc(.32 + .68 * var(--on,1));transform:translateX(calc((1 - var(--on,1)) * -10px));transition:opacity .2s,transform .2s}
.m2-story-steps .m2-svc-n{padding-top:5px}
.m2-story-steps h3{margin:2px 0 4px;font-size:17px;font-weight:500;line-height:1.3;transition:color .3s}
.m2-story-steps li.is-on h3{color:var(--m2-gold-hi,#e3bd73)}
.m2-story-steps p{margin:0;color:rgba(244,239,230,.68);font-size:14px;line-height:1.55}
[data-story-scene]{grid-area:scene;align-self:center;position:relative;width:100%;max-height:min(64vh,620px);aspect-ratio:4/3;border:1px solid rgba(244,239,230,.14);border-radius:14px;background:linear-gradient(180deg,#121110,#0a0a09);overflow:hidden;box-shadow:0 40px 90px -40px rgba(0,0,0,.95),0 0 60px -20px rgba(201,157,81,.25);font-family:var(--m2-sans,inherit)}

/* the search explainer */
.m2-serp-bar{display:flex;align-items:center;gap:6px;height:34px;padding:0 14px;border-bottom:1px solid rgba(244,239,230,.1);background:#161513}
.m2-serp-bar i{width:9px;height:9px;border-radius:50%;background:rgba(244,239,230,.18)}
.m2-serp-url{margin-left:14px;flex:1;height:18px;line-height:18px;padding:0 10px;border-radius:9px;background:rgba(244,239,230,.07);font-family:var(--m2-mono);font-size:10px;color:var(--m2-mute)}
.m2-serp-page{position:absolute;inset:34px 0 0;padding:22px 22px 0;transform:translateX(calc(var(--lp,0) * -60px));opacity:calc(1 - var(--lp,0))}
.m2-serp-search{display:flex;align-items:center;gap:12px;height:44px;padding:0 16px;border:1px solid rgba(244,239,230,.22);border-radius:22px;background:#1c1b18;font-size:15px;color:var(--m2-cream)}
.m2-serp-g{font-family:var(--m2-display);font-size:22px;color:var(--m2-gold)}
.m2-serp-caret{width:1.5px;height:18px;background:var(--m2-cream);opacity:0}
.is-typing .m2-serp-caret{animation:m2-caret 1s steps(2) infinite}
@keyframes m2-caret{to{opacity:1}}
.m2-serp-ad{display:grid;gap:4px;margin-top:18px;padding:14px 16px;border-radius:10px;border:1px solid rgba(201,157,81,calc(.3 + .7 * var(--glow,0)));background:rgba(201,157,81,calc(.05 + .1 * var(--glow,0)));box-shadow:0 0 0 calc(var(--glow,0) * 2px) rgba(201,157,81,.3),0 0 50px rgba(201,157,81,calc(.45 * var(--glow,0)));opacity:var(--ad,0);transform:translateY(calc((1 - var(--ad,0)) * 14px))}
.is-clicked .m2-serp-ad{box-shadow:0 0 0 calc(var(--lp,0) * 26px) rgba(201,157,81,calc(.35 * (1 - var(--lp,0))))}
.m2-serp-tag{font-family:var(--m2-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--m2-gold)}
.m2-serp-brand{font-size:12px;color:var(--m2-mute)}
.m2-serp-brand b{color:var(--m2-cream);font-weight:500}
.m2-serp-title{font-size:17px;font-weight:500;color:#9cc2ff;line-height:1.25}
.m2-serp-desc{font-size:13px;line-height:1.45;color:rgba(244,239,230,.75)}
.m2-serp-results{display:grid;gap:16px;margin-top:18px;opacity:var(--results,0);transform:translateY(calc((1 - var(--results,0)) * 10px))}
.m2-serp-r{display:grid;gap:7px}
.m2-serp-r i{display:block;height:9px;border-radius:5px;background:rgba(244,239,230,.1)}
.m2-serp-r i.t{height:13px;width:58%;background:rgba(244,239,230,.22)}
.m2-serp-r i.l{width:92%}
.m2-serp-r i.s{width:70%}
.m2-serp-lp{position:absolute;inset:34px 0 0;padding:26px;background:linear-gradient(160deg,#141210,#070706);transform:translateX(calc((1 - var(--lp,0)) * 100%))}
.m2-serp-lp-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px;font-weight:500}
.m2-serp-lp-nav i{width:84px;height:26px;border-radius:4px;background:var(--m2-gold)}
.m2-serp-lp h4{font-size:clamp(1.7rem,2.4vw,2.5rem);margin:0 0 18px;text-wrap:balance}
.m2-serp-form{display:grid;gap:10px;max-width:300px}
.m2-serp-form i{position:relative;display:block;height:36px;border:1px solid rgba(244,239,230,.22);border-radius:6px;background:#111}
.m2-serp-form i::after{content:"";position:absolute;left:10px;top:50%;height:2px;width:calc(var(--fill,0) * 70%);background:var(--m2-cream);transform:translateY(-50%);border-radius:1px}
.m2-serp-form b{display:block;height:40px;line-height:40px;text-align:center;border-radius:6px;background:var(--m2-gold);color:#000;font-weight:500;font-size:14px;transform:scale(calc(1 - var(--press,0) * .05));filter:brightness(calc(1 + var(--press,0) * .25))}
.m2-serp-cursor{position:absolute;left:0;top:0;width:20px;height:24px;background:#fff;clip-path:polygon(0 0,100% 56%,60% 62%,74% 96%,60% 100%,46% 67%,0 82%);filter:drop-shadow(0 2px 4px rgba(0,0,0,.8));opacity:0;pointer-events:none}
.m2-ex-badge{position:absolute;right:18px;bottom:18px;z-index:3;display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;background:var(--m2-gold);color:#000;font-weight:500;font-size:14px;box-shadow:0 0 40px rgba(201,157,81,.6);opacity:var(--lead,0);transform:translateY(calc((1 - var(--lead,0)) * 18px)) scale(calc(.8 + .2 * var(--lead,0)))}
.m2-ex-badge i{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#000;color:var(--m2-gold);font-style:normal;font-size:12px}
.m2-ex-paths{position:absolute;left:18px;bottom:18px;z-index:3;display:flex;gap:8px}
.m2-ex-paths i{padding:8px 11px;border-radius:999px;border:1px solid rgba(201,157,81,.6);background:rgba(10,9,7,.9);color:var(--m2-cream);font-style:normal;font-size:12px;opacity:var(--path0,0);transform:translateY(calc((1 - var(--path0,0)) * 10px))}
.m2-ex-paths i:nth-child(2){opacity:var(--path1,0);transform:translateY(calc((1 - var(--path1,0)) * 10px))}

/* "how we run it" */
.m2-dash{display:flex;flex-direction:column;padding:18px 18px 16px}
.m2-dash-events{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.m2-dash-ev{display:flex;align-items:center;justify-content:center;gap:8px;height:34px;border:1px solid rgba(201,157,81,calc(.15 + .6 * var(--on,0)));border-radius:8px;font-family:var(--m2-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--m2-cream);opacity:calc(.35 + .65 * var(--on,0));background:rgba(201,157,81,calc(.06 * var(--on,0)))}
.m2-dash-ev i{width:8px;height:8px;border-radius:50%;background:var(--m2-gold);box-shadow:0 0 calc(var(--on,0) * 12px) var(--m2-gold)}
.m2-dash-wires{width:100%;height:58px;display:block}
.m2-dash-wires path{fill:none;stroke:var(--m2-gold);stroke-width:1.2;stroke-dasharray:5 11;stroke-dashoffset:calc(var(--t,0) * -64px);opacity:calc(var(--on,0) * .9)}
.m2-dash-card{flex:1;display:grid;gap:14px;padding:16px;border:1px solid rgba(201,157,81,.25);border-radius:12px;background:linear-gradient(180deg,#16140f,#0c0b09);opacity:var(--card,0);transform:translateY(calc((1 - var(--card,0)) * 14px));box-shadow:0 0 50px -20px rgba(201,157,81,.4)}
.m2-dash-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.m2-dash-kpis span{display:grid;gap:4px}
.m2-dash-kpis small{font-family:var(--m2-mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--m2-mute)}
.m2-dash-kpis b{font-family:var(--m2-display);font-size:clamp(1.5rem,2vw,2.1rem);line-height:1;color:var(--m2-cream);font-variant-numeric:tabular-nums}
.m2-dash-kpis b.is-down{color:var(--m2-gold)}
.m2-dash-opt{display:grid;grid-template-columns:1.2fr 1fr;gap:14px;opacity:var(--opt,0)}
.m2-dash-ab{display:grid;gap:8px}
.m2-dash-ab span{display:grid;grid-template-columns:34px 1fr;align-items:center;gap:8px;font-family:var(--m2-mono);font-size:10px;color:var(--m2-mute)}
.m2-dash-ab i{display:block;height:10px;border-radius:5px;background:rgba(244,239,230,.14);position:relative;overflow:hidden}
.m2-dash-ab i::after{content:"";position:absolute;inset:0;width:calc(var(--v) * 100%);background:var(--m2-cream);border-radius:5px}
.m2-dash-ab .b i::after{background:var(--m2-gold);box-shadow:0 0 calc(var(--win,0) * 14px) var(--m2-gold)}
.m2-dash-ab .a{opacity:calc(1 - .55 * var(--win,0))}
.m2-dash-bids{display:flex;align-items:flex-end;gap:6px;height:38px}
.m2-dash-bids i{flex:1;display:flex;align-items:flex-end;height:100%}
.m2-dash-bids b{display:block;width:100%;border-radius:2px 2px 0 0;background:rgba(201,157,81,.7);height:calc(22% + var(--bids,0) * (var(--i) + 1) * 14%)}
.m2-dash-chart{width:100%;height:64px;display:block;opacity:var(--chart,0)}
.m2-dash-chart .g{fill:rgba(201,157,81,.14)}
.m2-dash-chart .l{fill:none;stroke:var(--m2-gold);stroke-width:2.2;stroke-linecap:round}
.m2-dash-chart-label{display:flex;justify-content:space-between;margin-top:-8px;font-family:var(--m2-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--m2-mute);opacity:var(--chart,0)}
.m2-dash-chart-label b{color:var(--m2-gold)}

/* why: three short reasons; proof cards */
.m2-why3{list-style:none;margin:30px 0 0;padding:0;border-top:1px solid rgba(201,157,81,.2)}
.m2-why3 li{display:grid;grid-template-columns:48px minmax(0,1fr);column-gap:14px;padding:24px 0;border-bottom:1px solid rgba(201,157,81,.2)}
.m2-why3 .m2-svc-n{padding-top:10px;grid-row:span 2}
.m2-why3 b{font-size:clamp(2.2rem,3.6vw,3.8rem);line-height:.95}
.m2-why3 p{margin:8px 0 0;color:rgba(244,239,230,.72);font-size:15.5px;line-height:1.55;max-width:48ch}
.m2-proofcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin-top:30px}
.m2-proofcard{position:relative;display:flex;flex-direction:column;gap:14px;min-height:320px;padding:22px;border:1px solid rgba(201,157,81,.25);background:linear-gradient(180deg,#15120d,#090807);overflow:hidden;color:inherit;text-decoration:none;box-shadow:0 30px 60px -40px rgba(0,0,0,.95);transition:border-color .45s,transform .6s var(--m2-ease-out)}
.m2-proofcard:hover{border-color:rgba(201,157,81,.8);transform:translateY(-4px)}
.m2-proofcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.16;filter:grayscale(.6);transition:opacity .6s,transform 1.4s var(--m2-ease-out)}
.m2-proofcard:hover img{opacity:.3;transform:scale(1.05)}
.m2-proofcard>span{position:relative}
.m2-proofcard-top{display:grid;gap:6px}
.m2-proofcard-client{font-size:clamp(1.6rem,2vw,2.2rem);line-height:.95}
.m2-proofcard-figs{display:grid;gap:14px;margin-top:auto}
.m2-proofcard-figs>span{display:grid;gap:4px}
.m2-proofcard-figs b{font-size:clamp(3rem,4.8vw,5.2rem);line-height:.85;color:var(--m2-gold);font-variant-numeric:tabular-nums;text-shadow:0 0 30px rgba(201,157,81,.35)}
.m2-proofcard-figs small{font-size:13px;line-height:1.4;color:rgba(244,239,230,.72)}
.m2-proofcard-ex{margin-top:auto;color:rgba(244,239,230,.72);font-size:14.5px;line-height:1.55}
.m2-proofcard-go{font-family:var(--m2-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--m2-gold)}
@media (max-width:899.98px){
  .m2-svc-step[data-story]{grid-template-columns:1fr}
  .m2-svc-step.is-story-live{height:auto;padding-block:var(--m2-sec)}
  .m2-svc-step.is-story-live .m2-svc-body{position:static;height:auto;display:block;padding-block:0}
  .m2-svc-step.is-story-live .m2-svc-body>.m2-svc-h{font-size:clamp(2.6rem,9vw,3.6rem)}
  .m2-story-steps{margin-top:16px}
  [data-story-scene]{margin-top:24px;aspect-ratio:auto;max-height:none;min-height:420px}
  .m2-serp-page{padding:16px 16px 0}
  .m2-dash-events{grid-template-columns:repeat(2,1fr)}
  .m2-dash-kpis{grid-template-columns:repeat(2,1fr)}
  .m2-dash-opt{grid-template-columns:1fr}
  .m2-svc-split::before,.m2-svc-split.is-obj-right::before{background:radial-gradient(60% 40% at 50% 20%,rgba(201,157,81,.12),transparent 70%)}
}

/* ---------- the other explainers (4f) ---------- */
.m2-ex-stat{position:absolute;right:18px;top:48px;z-index:3;display:grid;gap:3px;padding:10px 14px;border:1px solid rgba(201,157,81,.5);border-radius:10px;background:rgba(10,9,7,.9);opacity:var(--stat,0);transform:translateY(calc((1 - var(--stat,0)) * -10px))}
.m2-ex-stat small{font-family:var(--m2-mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--m2-mute)}
.m2-ex-stat b{font-family:var(--m2-display);font-size:26px;line-height:1;color:var(--m2-gold);font-variant-numeric:tabular-nums}
.m2-ex-checks{position:absolute;left:18px;bottom:18px;z-index:3;list-style:none;margin:0;padding:0;display:grid;gap:6px}
.m2-ex-checks li{display:flex;align-items:center;gap:8px;padding:7px 11px;border:1px solid rgba(201,157,81,.35);border-radius:8px;background:rgba(10,9,7,.9);font-family:var(--m2-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--m2-cream);opacity:calc(.3 + .7 * var(--fix0,0));transform:translateX(calc((1 - var(--fix0,0)) * -8px))}
.m2-ex-checks li:nth-child(2){opacity:calc(.3 + .7 * var(--fix1,0));transform:translateX(calc((1 - var(--fix1,0)) * -8px))}
.m2-ex-checks li:nth-child(3){opacity:calc(.3 + .7 * var(--fix2,0));transform:translateX(calc((1 - var(--fix2,0)) * -8px))}
.m2-ex-checks i{width:14px;height:14px;border-radius:50%;border:1px solid var(--m2-gold);position:relative}
.m2-ex-checks li:nth-child(1) i{background:rgba(201,157,81,var(--fix0,0))}.m2-ex-checks li:nth-child(2) i{background:rgba(201,157,81,var(--fix1,0))}.m2-ex-checks li:nth-child(3) i{background:rgba(201,157,81,var(--fix2,0))}
/* SEO: the climb */
.m2-rank-list{position:relative;margin-top:16px;opacity:var(--list,0)}
.m2-rank-list .m2-serp-r{height:46px;padding:6px 0;box-sizing:border-box}
.m2-rank-us{position:absolute;left:-8px;right:-8px;top:calc(var(--row,5) * 46px);display:grid;gap:3px;padding:8px 10px;border-radius:8px;background:#0d0c0a;border:1px solid rgba(201,157,81,calc(.35 + .65 * var(--top,0)));box-shadow:0 0 0 calc(var(--top,0) * 2px) rgba(201,157,81,.3),0 0 40px rgba(201,157,81,calc(.5 * var(--top,0)))}
.m2-rank-us .m2-serp-title{font-size:14px}.m2-rank-us .m2-serp-desc{font-size:11.5px;line-height:1.35}
.m2-rank-us .m2-serp-tag{color:var(--m2-gold)}
/* social: a phone and a feed */
.m2-phone{position:absolute;left:50%;top:14px;bottom:14px;width:min(62%,300px);transform:translateX(-50%);border:1px solid rgba(244,239,230,.2);border-radius:28px;background:#0a0a09;overflow:hidden;box-shadow:0 30px 60px -30px #000}
.m2-phone-top{height:40px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid rgba(244,239,230,.1);font-size:12px;font-weight:500}
.m2-feed{padding:12px;display:grid;gap:12px;transform:translateY(var(--scroll,0px))}
.m2-post{border:1px solid rgba(244,239,230,.1);border-radius:12px;padding:10px;background:#111;display:grid;gap:8px}
.m2-post-head{display:flex;align-items:center;gap:8px;font-size:11.5px;font-weight:500}
.m2-post-head i{width:22px;height:22px;border-radius:50%;background:rgba(244,239,230,.18)}
.m2-post-head i.g{background:var(--m2-gold)}
.m2-post-head em,.m2-post em.w{display:block;height:8px;width:40%;border-radius:4px;background:rgba(244,239,230,.14)}
.m2-post em.w{width:80%}
.m2-post-head small{margin-left:auto;font-family:var(--m2-mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--m2-gold)}
.m2-post-img{height:90px;border-radius:8px;background:rgba(244,239,230,.08);position:relative}
.m2-post-img.gold{background:linear-gradient(135deg,#3a2e17,#8a6a2f 60%,#d9b068)}
.m2-post-img .play{position:absolute;left:50%;top:50%;width:26px;height:26px;border-radius:50%;background:rgba(0,0,0,.6);transform:translate(-50%,-50%)}
.m2-post-img .play::after{content:"";position:absolute;left:10px;top:7px;border-left:9px solid #fff;border-top:6px solid transparent;border-bottom:6px solid transparent}
.m2-post-cap{margin:0;font-size:11.5px;line-height:1.4;color:rgba(244,239,230,.85)}
.m2-post-ours{border-color:rgba(201,157,81,calc(.2 + .8 * var(--ours,0)));box-shadow:0 0 30px rgba(201,157,81,calc(.4 * var(--ours,0)));transform:scale(calc(.97 + .03 * var(--ours,0)))}
.m2-post-stats{display:flex;gap:12px;align-items:center;font-size:11px;color:var(--m2-mute)}
.m2-post-stats b{color:var(--m2-cream);font-weight:500}
.m2-post-cta{margin-left:auto;padding:5px 10px;border-radius:6px;background:var(--m2-gold);color:#000;font-weight:500;font-size:11px}
.m2-post-compose{border-color:rgba(201,157,81,.4);opacity:calc(1 - var(--publish,0));transform:scale(calc(1 - .06 * var(--publish,0)))}
.m2-post-btn{justify-self:end;padding:5px 12px;border-radius:6px;background:var(--m2-gold);color:#000;font-size:11px;font-weight:500;transform:scale(calc(1 - .08 * var(--press,0)))}
.m2-ex-organic .m2-post-ours{opacity:var(--publish,0)}
.m2-hearts{position:absolute;left:50%;bottom:30%;width:120px;transform:translateX(-50%);pointer-events:none;opacity:var(--hearts,0)}
.m2-hearts i{position:absolute;left:calc(var(--i) * 16px);bottom:0;font-style:normal;color:var(--m2-gold);font-size:14px;transform:translateY(calc(-120px * var(--heartt,0) - var(--i) * 10px));opacity:calc(1 - var(--heartt,0))}
.m2-sheet{position:absolute;left:0;right:0;bottom:0;padding:16px;border-radius:20px 20px 0 0;background:#151310;border-top:1px solid rgba(201,157,81,.4);display:grid;gap:10px;font-size:12px;transform:translateY(calc((1 - var(--sheet,0)) * 110%))}
.m2-sheet .m2-serp-form{max-width:none}.m2-sheet .m2-serp-form i{height:30px}.m2-sheet .m2-serp-form b{height:34px;line-height:34px;font-size:12px}
.m2-dm{position:absolute;left:12px;right:12px;bottom:14px;display:flex;align-items:flex-start;gap:8px;padding:10px 12px;border-radius:12px;background:#1a1812;border:1px solid rgba(201,157,81,.4);font-size:11.5px;line-height:1.4;transform:translateY(calc((1 - var(--dm,0)) * 120%));opacity:var(--dm,0)}
.m2-dm i{flex:none;width:22px;height:22px;border-radius:50%;background:rgba(244,239,230,.2)}
/* video: preview, boards, timeline */
.m2-ex-video{display:grid;grid-template-rows:1fr auto auto;gap:10px;padding:14px}
.m2-vid-preview{position:relative;border-radius:10px;background:linear-gradient(135deg,#2a2112,#6a4f23 55%,#c79a4c);display:flex;align-items:center;justify-content:center;padding:20px;overflow:hidden}
.m2-vid-rec{position:absolute;left:12px;top:12px;width:10px;height:10px;border-radius:50%;background:#e33;opacity:0}
.is-rec .m2-vid-rec{animation:m2-caret 1s steps(2) infinite}
.m2-vid-script{margin:0;font-family:var(--m2-display);font-size:clamp(1.3rem,2vw,2rem);line-height:1;text-transform:uppercase;text-align:center;color:#fff;text-shadow:0 2px 20px rgba(0,0,0,.5);max-width:22ch}
.m2-vid-cap{position:absolute;left:50%;bottom:12px;transform:translateX(-50%) translateY(calc((1 - var(--caption,0)) * 10px));padding:5px 10px;border-radius:4px;background:rgba(0,0,0,.75);color:#fff;font-size:11px;white-space:nowrap;opacity:var(--caption,0)}
.m2-vid-boards{display:flex;gap:8px}
.m2-vid-boards i{flex:1;height:34px;border-radius:6px;background:rgba(244,239,230,.12);border:1px solid rgba(244,239,230,.15);opacity:var(--board0,0);transform:translateY(calc((1 - var(--board0,0)) * 8px))}
.m2-vid-boards i:nth-child(2){opacity:var(--board1,0);transform:translateY(calc((1 - var(--board1,0)) * 8px))}.m2-vid-boards i:nth-child(3){opacity:var(--board2,0);transform:translateY(calc((1 - var(--board2,0)) * 8px))}
.m2-vid-timeline{position:relative;display:grid;gap:5px;padding:8px;border-radius:8px;background:#0d0d0c;border:1px solid rgba(244,239,230,.1)}
.m2-vid-track{display:flex;gap:3px;height:18px}
.m2-vid-track i{width:var(--w);border-radius:3px;background:linear-gradient(90deg,#8a6a2f,#c79a4c);opacity:var(--clip0,0);transform:translateY(calc((1 - var(--clip0,0)) * -10px))}
.m2-vid-track i:nth-child(2){opacity:var(--clip1,0);transform:translateY(calc((1 - var(--clip1,0)) * -10px))}.m2-vid-track i:nth-child(3){opacity:var(--clip2,0);transform:translateY(calc((1 - var(--clip2,0)) * -10px))}.m2-vid-track i:nth-child(4){opacity:var(--clip3,0);transform:translateY(calc((1 - var(--clip3,0)) * -10px))}
.m2-vid-track.audio{height:10px}.m2-vid-track.audio i{background:rgba(244,239,230,.25);opacity:var(--clip4,0);transform:none}
.m2-vid-head{position:absolute;top:4px;bottom:4px;left:calc(8px + var(--x,0%) * .96);width:2px;background:#fff;opacity:var(--play,0)}
.m2-vid-exports{position:absolute;left:14px;bottom:14px;display:flex;gap:6px}
.m2-vid-exports span{padding:5px 9px;border-radius:6px;border:1px solid var(--m2-gold);color:var(--m2-gold);font-family:var(--m2-mono);font-size:10px;opacity:var(--export0,0)}
.m2-vid-exports span:nth-child(2){opacity:var(--export1,0)}.m2-vid-exports span:nth-child(3){opacity:var(--export2,0)}
/* branding */
.m2-brand-board{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr auto;gap:14px;padding:18px}
.m2-brand-mark{grid-row:1;display:grid;place-items:center;align-content:center;gap:10px}
.m2-brand-mark svg{width:min(44%,150px);aspect-ratio:1}
.m2-brand-mark .ring{fill:none;stroke:var(--m2-gold);stroke-width:3}
.m2-brand-mark .m{fill:none;stroke:var(--m2-cream);stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.m2-brand-mark b{font-size:clamp(1.8rem,3vw,2.8rem);letter-spacing:.12em;min-height:1em}
.m2-brand-swatches{grid-column:2;grid-row:1;display:grid;grid-template-columns:1fr 1fr;gap:10px;align-content:center;padding:10px}
.m2-brand-swatches i{aspect-ratio:1;border-radius:50%;background:var(--c);border:1px solid rgba(244,239,230,.2);transform:scale(var(--swatch0,0))}
.m2-brand-swatches i:nth-child(2){transform:scale(var(--swatch1,0))}.m2-brand-swatches i:nth-child(3){transform:scale(var(--swatch2,0))}.m2-brand-swatches i:nth-child(4){transform:scale(var(--swatch3,0))}
.m2-brand-type{grid-column:1;grid-row:2;display:flex;align-items:baseline;gap:12px;opacity:var(--type,0)}
.m2-brand-type b{font-size:44px;line-height:1;color:var(--m2-gold)}.m2-brand-type span{font-family:var(--m2-mono);font-size:10px;color:var(--m2-mute)}
.m2-brand-apply{grid-column:2;grid-row:2;display:flex;gap:8px;align-items:flex-end}
.m2-brand-apply i{display:grid;place-items:center;border-radius:6px;background:#15130f;border:1px solid rgba(201,157,81,.4);color:var(--m2-gold);overflow:hidden}
.m2-brand-apply .card{width:72px;height:42px;opacity:var(--apply0,0);transform:translateY(calc((1 - var(--apply0,0)) * 10px))}
.m2-brand-apply .sign{width:64px;height:58px;background:var(--m2-gold);color:#000;opacity:var(--apply1,0);transform:translateY(calc((1 - var(--apply1,0)) * 10px))}
.m2-brand-apply .tile{width:44px;height:44px;opacity:var(--apply2,0);transform:translateY(calc((1 - var(--apply2,0)) * 10px))}
.m2-brand-apply b{font-size:13px;letter-spacing:.08em}.m2-brand-apply .tile b{font-size:22px}
/* websites */
.m2-web-desk{position:absolute;left:14px;top:14px;bottom:14px;width:70%;border-radius:10px;border:1px solid rgba(244,239,230,.14);background:#0f0f0e;overflow:hidden}
.m2-web-page{padding:14px;display:grid;gap:12px}
.m2-web-nav{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:500;opacity:var(--wire0,0)}
.m2-web-nav i{width:58px;height:18px;border-radius:3px;border:1px solid rgba(244,239,230,.3);background:rgba(201,157,81,var(--design,0))}
.m2-web-hero{display:grid;gap:6px;padding:10px;border:1px dashed rgba(244,239,230,calc(.3 * (1 - var(--design,0))));border-radius:6px;opacity:var(--wire1,0);background:linear-gradient(135deg,rgba(201,157,81,calc(.25 * var(--design,0))),transparent)}
.m2-web-hero h4{margin:0;font-size:clamp(1.2rem,1.8vw,1.8rem);color:rgba(244,239,230,calc(.35 + .65 * var(--design,0)))}
.m2-web-hero em,.m2-web-mobile em{display:block;height:7px;width:70%;border-radius:4px;background:rgba(244,239,230,calc(.14 + .2 * var(--design,0)))}.m2-web-hero em.s,.m2-web-mobile em.s{width:45%}
.m2-web-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;opacity:var(--wire2,0)}
.m2-web-cards i{height:40px;border-radius:5px;border:1px dashed rgba(244,239,230,calc(.3 * (1 - var(--design,0))));background:rgba(201,157,81,calc(.12 * var(--design,0)))}
.m2-web-page .m2-serp-form{max-width:none;grid-template-columns:1fr 1fr auto;opacity:var(--wire3,0)}
.m2-web-page .m2-serp-form i{height:28px}.m2-web-page .m2-serp-form b{height:30px;line-height:30px;font-size:11px;padding:0 10px;background:rgba(201,157,81,calc(.3 + .7 * var(--design,0)))}
.m2-web-mobile{position:absolute;right:14px;bottom:14px;width:22%;aspect-ratio:9/17;border-radius:14px;border:1px solid rgba(244,239,230,.25);background:#0f0f0e;padding:10px;display:grid;gap:7px;align-content:start;opacity:var(--mobile,0);transform:translateY(calc((1 - var(--mobile,0)) * 20px))}
.m2-web-mobile .m2-web-nav{opacity:1;font-size:9px}.m2-web-mobile .m2-web-nav i{width:26px;height:10px;background:var(--m2-gold)}
.m2-web-mobile i.c{height:22px;border-radius:4px;background:rgba(201,157,81,.15)}
.m2-web-mobile .btn{height:16px;border-radius:3px;background:var(--m2-gold)}
.m2-web-speed{right:14px;top:14px;display:grid;justify-items:center;gap:0;padding:8px 12px 10px}
.m2-web-speed svg{width:64px}.m2-web-speed .bg{fill:none;stroke:rgba(244,239,230,.15);stroke-width:8;stroke-linecap:round}.m2-web-speed .v{fill:none;stroke:var(--m2-gold);stroke-width:8;stroke-linecap:round}
.m2-web-speed b{margin-top:-18px;font-size:22px}
/* drone */
.m2-map{position:absolute;inset:14px;border-radius:10px;overflow:hidden;background:#0c0f0b;border:1px solid rgba(244,239,230,.12)}
.m2-map svg{position:absolute;inset:0;width:100%;height:100%}
/* a faint aerial map in the same dark tones: sea and coast, plots, a river, roads, buildings */
.m2-map .sea{fill:#0a1114}.m2-map .coast{fill:none;stroke:rgba(150,180,170,.14);stroke-width:1.2}
.m2-map .plots rect{fill:#121810;stroke:rgba(244,239,230,.04)}
.m2-map .river{fill:none;stroke:#0d1619;stroke-width:5;stroke-linecap:round}
.m2-map .roads path{fill:none;stroke:rgba(244,239,230,.08);stroke-width:2.2;stroke-linecap:round}.m2-map .roads .minor{stroke-width:1.1;stroke:rgba(244,239,230,.06)}
.m2-map .blocks rect{fill:rgba(244,239,230,.07)}
.m2-map .route{fill:none;stroke:var(--m2-gold);stroke-width:2;stroke-dasharray:6 6;filter:drop-shadow(0 0 4px rgba(201,157,81,.7))}
.m2-map .pins circle{fill:var(--m2-gold);transform-box:fill-box;transform-origin:center;transform:scale(var(--pin0,0))}
.m2-map .pins circle:nth-child(2){transform:scale(var(--pin1,0))}.m2-map .pins circle:nth-child(3){transform:scale(var(--pin2,0))}
.m2-map .pins circle.is-snap{animation:m2pinsnap .7s ease-out}
@keyframes m2pinsnap{0%{fill:#fff;filter:drop-shadow(0 0 0 #fff)}40%{fill:#fff;filter:drop-shadow(0 0 10px #fff)}100%{fill:var(--m2-gold)}}
/* the drone: a small gold quadcopter with spinning rotors and a soft shadow */
.m2-drone{position:absolute;left:0;top:0;z-index:2;width:38px;height:38px;opacity:var(--fly,0);filter:drop-shadow(0 6px 6px rgba(0,0,0,.7)) drop-shadow(0 0 8px rgba(201,157,81,.45))}
.m2-drone svg{display:block;width:100%;height:100%;overflow:visible}
.m2-drone .arm{stroke:var(--m2-gold);stroke-width:2.4;stroke-linecap:round}
.m2-drone .rotor circle{fill:rgba(244,239,230,.08);stroke:rgba(226,190,126,.9);stroke-width:1.1;stroke-dasharray:9 4;transform-box:fill-box;transform-origin:center;animation:m2-rotor .22s linear infinite}
.m2-drone .body{fill:var(--m2-cream)}.m2-drone .cam{fill:#0b0b0b}
@keyframes m2-rotor{to{transform:rotate(360deg)}}
.m2-map-weather{position:absolute;left:12px;top:12px;padding:6px 10px;border-radius:6px;background:rgba(10,9,7,.9);border:1px solid rgba(201,157,81,.4);font-family:var(--m2-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--m2-cream);opacity:var(--weather,0)}
/* the captured shots: frames from our footage, each popping in with a flash */
.m2-shots{position:absolute;right:26px;top:26px;z-index:3;display:grid;gap:8px}
.m2-shots i{position:relative;display:block;width:84px;height:48px;border-radius:5px;overflow:hidden;border:1px solid rgba(201,157,81,.55);background:#14110b;box-shadow:0 6px 18px rgba(0,0,0,.6);opacity:.28;transform:scale(.9);transition:opacity .25s,transform .45s cubic-bezier(.2,1.6,.4,1)}
.m2-shots i img{display:block;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.15);transition:opacity .3s,transform .6s var(--m2-ease-out)}
.m2-shots i::after{content:"";position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none}
.m2-shots i.is-in{opacity:1;transform:none;border-color:var(--m2-gold-hi)}
.m2-shots i.is-in img{opacity:1;transform:none}
.m2-shots i.is-in::after{animation:m2shutter .55s ease-out}
@keyframes m2shutter{0%{opacity:.95}100%{opacity:0}}
@media (max-width:899.98px){.m2-ex-stat{top:14px}.m2-brand-board{grid-template-columns:1fr;grid-template-rows:auto auto auto auto}.m2-brand-swatches{grid-column:1;grid-row:2;grid-template-columns:repeat(4,1fr)}.m2-brand-type{grid-row:3}.m2-brand-apply{grid-column:1;grid-row:4}.m2-web-desk{width:auto;right:14px;bottom:30%}.m2-web-mobile{width:30%}}
/* phones: when the hero carries the phone number (Contact), a shorter globe and tighter
   spacing so the number is on screen without scrolling */
@media (max-width:899.98px){
  .m2-phero:has(.m2-phero-phone) .m2-phero-grid .m2-slot{min-height:38vw;max-height:40vh}
  .m2-phero:has(.m2-phero-phone) .m2-phero-copy .lead{font-size:15.5px;margin-bottom:0}
  .m2-phero:has(.m2-phero-phone) .crumbs,.m2-phero:has(.m2-phero-phone) .m2-crumbs{display:none}
  .m2-phero:has(.m2-phero-phone) .btn-row{gap:8px}
  .m2-phero:has(.m2-phero-phone) .btn-row .btn{height:46px;padding:0 16px}
  .m2-phero-phone{margin-top:14px}
  .m2-phero-phone-n{font-size:2.3rem}
}

/* Contact: the form runs straight into the offices; one section gap between them, not two */
.elementor-element:has(.m2-form-sec) + .elementor-element .m2-offices,.m2-form-sec + .m2-offices{padding-top:44px}
.elementor-element:has(+ .elementor-element .m2-offices) .m2-form-sec{padding-bottom:56px}
@media (max-width:899.98px){
  .elementor-element:has(.m2-form-sec) + .elementor-element .m2-offices,.m2-form-sec + .m2-offices{padding-top:30px}
  .elementor-element:has(+ .elementor-element .m2-offices) .m2-form-sec{padding-bottom:44px}
}

/* ---------- Work: hero, filters, the scroll-driven showcase (6) ---------- */
.m2-wk{position:relative}
.m2-wk-hero{position:relative;min-height:72svh;display:flex;align-items:flex-end;padding-bottom:clamp(28px,5vh,56px)}
.m2-wk-hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(60% 50% at 50% 40%,rgba(214,168,88,.2),rgba(201,157,81,.05) 50%,transparent 72%)}
.m2-wk-hero-in{display:grid;gap:16px;width:100%;padding-top:var(--m2-top-s)}
.m2-wk-h{font-size:clamp(4rem,11vw,12.5rem);line-height:.84;max-width:12ch}
.m2-wk-figs{list-style:none;margin:18px 0 0;padding:22px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;border-top:1px solid rgba(201,157,81,.25);max-width:900px}
.m2-wk-figs li{display:grid;gap:8px}
.m2-wk-figs b{font-size:clamp(2.8rem,5vw,5.4rem);line-height:.85;color:var(--m2-gold);font-variant-numeric:tabular-nums}
.m2-wk-figs li>span{font-size:14px;line-height:1.45;color:rgba(244,239,230,.75)}
.m2-wk-filters{display:grid;gap:10px;padding-block:22px 18px;border-top:1px solid var(--m2-line)}
.m2-wk-fgroup{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.m2-wk-fgroup .eyebrow{margin-right:10px;min-width:64px}
.m2-wk .m2-chip{padding:9px 16px;border:1px solid var(--m2-line-hi);border-radius:999px;background:transparent;color:var(--m2-cream);font:500 12.5px var(--m2-sans,inherit);cursor:pointer;transition:border-color .35s,background .35s,color .35s,transform .35s var(--m2-ease-out)}
.m2-wk .m2-chip:hover{border-color:var(--m2-gold);transform:translateY(-1px)}
.m2-wk .m2-chip[aria-pressed="true"]{background:var(--m2-gold);border-color:var(--m2-gold);color:#000}
/* the stage: pinned for one screen per project */
.m2-wk-stage{position:relative;height:calc(var(--n,1) * 100vh + 10vh)}
.m2-wk-pin{position:sticky;top:0;height:100svh;overflow:hidden;background:#000}
.m2-wk-item{position:absolute;inset:0;visibility:hidden;will-change:clip-path}
.m2-wk-item.is-on{visibility:visible}
.m2-wk-media{position:absolute;inset:0;display:block;overflow:hidden;transform-origin:50% 60%;will-change:transform}
.m2-wk-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);will-change:transform}
.m2-wk-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.82) 0%,rgba(0,0,0,.45) 45%,rgba(0,0,0,.1) 100%),linear-gradient(180deg,rgba(0,0,0,.5),transparent 35%,transparent 70%,rgba(0,0,0,.6))}
.m2-wk-ph{position:absolute;left:8vw;bottom:10vh;font-size:clamp(4rem,10vw,12rem);color:transparent;-webkit-text-stroke:1px rgba(201,157,81,.5)}
.m2-wk-copy{position:absolute;left:0;right:0;bottom:0;display:grid;gap:14px;justify-items:start;padding-bottom:clamp(40px,8vh,90px);max-width:min(60vw,760px);z-index:2}
.m2-wk-n b{color:var(--m2-gold);font-weight:500}
.m2-wk-logo{margin:0;height:clamp(40px,5vw,64px)}
.m2-wk-logo img{height:100%;width:auto;max-width:360px;object-fit:contain;filter:brightness(0) invert(1)}
.m2-wk-name{font-size:clamp(3rem,6.6vw,7.4rem);line-height:.86;margin:0}
.m2-wk-services{margin:0;font-family:var(--m2-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:rgba(244,239,230,.75)}
.m2-wk-result{display:grid;gap:4px;margin:6px 0 4px}
.m2-wk-result b{font-size:clamp(4rem,8.6vw,9.6rem);line-height:.82;color:var(--m2-gold);font-variant-numeric:tabular-nums;text-shadow:0 0 40px rgba(201,157,81,.35)}
.m2-wk-result>span{font-size:15px;color:rgba(244,239,230,.82);max-width:34ch}
.m2-wk-text{margin:0;color:rgba(244,239,230,.82);max-width:46ch;font-size:16px;line-height:1.55}
.m2-wk-index{position:absolute;right:max(18px,env(safe-area-inset-right,0px));top:0;height:100svh;position:sticky;display:flex;align-items:center;gap:14px;pointer-events:none;z-index:5;margin-top:-100svh;justify-content:flex-end;padding-right:max(18px,env(safe-area-inset-right,0px))}
.m2-wk-index ol{list-style:none;margin:0;padding:0;display:grid;gap:6px;pointer-events:auto;text-align:right}
.m2-wk-index li[hidden]{display:none}
.m2-wk-index a{display:inline-flex;align-items:baseline;gap:10px;color:rgba(244,239,230,.45);font-size:12px;text-decoration:none;transition:color .3s}
.m2-wk-index a span{font:500 10.5px var(--m2-mono);letter-spacing:.12em}
.m2-wk-index a em{font-style:normal;max-width:0;overflow:hidden;white-space:nowrap;opacity:0;transition:max-width .45s var(--m2-ease-out),opacity .3s}
.m2-wk-index ol:hover a em,.m2-wk-index a.on em{max-width:220px;opacity:1}
.m2-wk-index a:hover,.m2-wk-index a.on{color:var(--m2-cream)}
.m2-wk-index a.on span{color:var(--m2-gold)}
.m2-wk-progress{position:relative;width:2px;height:min(40vh,320px);background:rgba(244,239,230,.15);border-radius:1px;overflow:hidden}
.m2-wk-progress b{position:absolute;inset:0;background:var(--m2-gold);transform-origin:top;transform:scaleY(0);transition:transform .3s}
.m2-wk.is-filtering .m2-wk-item{transition:opacity .4s}
.m2-wk.is-empty .m2-wk-stage{height:40vh}
/* phones: swipeable cards; the index becomes dots */
.m2-wk.is-cards .m2-wk-stage{height:auto;padding-block:8px 48px}
.m2-wk.is-cards .m2-wk-pin{position:static;height:auto;display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--m2-gl) 8px;scrollbar-width:none;background:none}
.m2-wk.is-cards .m2-wk-pin::-webkit-scrollbar{display:none}
.m2-wk.is-cards .m2-wk-item{position:relative;inset:auto;visibility:visible;flex:0 0 82vw;scroll-snap-align:center;aspect-ratio:3/4;border:1px solid var(--m2-line);overflow:hidden;border-radius:4px}
.m2-wk.is-cards .m2-wk-item[hidden]{display:none}
.m2-wk.is-cards .m2-wk-media{position:absolute;inset:0;transform:none!important;filter:none!important}
.m2-wk.is-cards .m2-wk-media img{transform:none!important}
.m2-wk.is-cards .m2-wk-copy{position:absolute;inset:auto 0 0;max-width:none;padding:16px;gap:8px;opacity:1!important;transform:none!important}
.m2-wk.is-cards .m2-wk-name{font-size:2.4rem}
.m2-wk.is-cards .m2-wk-logo{height:34px}
.m2-wk.is-cards .m2-wk-result b{font-size:3.6rem}
.m2-wk.is-cards .m2-wk-result>span,.m2-wk.is-cards .m2-wk-text{font-size:13px}
.m2-wk.is-cards .m2-wk-index{position:static;height:auto;margin:14px 0 0;padding:0 var(--m2-gl);justify-content:center}
.m2-wk.is-cards .m2-wk-index ol{display:flex;gap:8px;text-align:center}
.m2-wk.is-cards .m2-wk-index a{width:10px;height:10px;border-radius:50%;background:rgba(244,239,230,.25);color:transparent;font-size:0;gap:0}
.m2-wk.is-cards .m2-wk-index a span,.m2-wk.is-cards .m2-wk-index a em{display:none}
.m2-wk.is-cards .m2-wk-index a.on{background:var(--m2-gold)}
.m2-wk.is-cards .m2-wk-progress{display:none}
/* reduced motion: the projects stack */
.m2-wk.is-static .m2-wk-stage{height:auto}
.m2-wk.is-static .m2-wk-pin{position:static;height:auto;overflow:visible;display:grid;gap:24px}
.m2-wk.is-static .m2-wk-item{position:relative;inset:auto;visibility:visible;min-height:70vh}
.m2-wk.is-static .m2-wk-item[hidden]{display:none}
.m2-wk.is-static .m2-wk-index{display:none}
@media (max-width:899.98px){
  .m2-wk-hero{min-height:0;padding-bottom:36px}
  .m2-wk-figs{grid-template-columns:1fr 1fr;gap:18px}
  .m2-wk-figs li:nth-child(3){grid-column:1 / -1}
  .m2-wk-filters{padding-block:24px 18px}
  .m2-wk-fgroup .eyebrow{min-width:0;flex-basis:100%;margin:0 0 2px}
}

/* ---------- one case study (single-case_studies.php) ---------- */
.m2-case-hero{position:relative;min-height:88svh;display:flex;align-items:flex-end;padding-block:var(--m2-top-s) clamp(40px,8vh,90px);overflow:hidden;isolation:isolate}
.m2-case-hero-media{position:absolute;inset:0;z-index:-1}
.m2-case-hero-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.08)}
.m2-case-hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.85) 0%,rgba(0,0,0,.45) 50%,rgba(0,0,0,.15) 100%),linear-gradient(180deg,rgba(0,0,0,.55),transparent 35%,transparent 65%,rgba(0,0,0,.75))}
.m2-case-hero-copy{display:grid;gap:16px;justify-items:start;max-width:min(62vw,820px)}
.m2-case-hero .m2-wk-logo{height:clamp(44px,6vw,76px)}
.m2-case-title{font-size:clamp(3.4rem,8vw,9.4rem);line-height:.86;margin:0}
.m2-case-lead{font-size:clamp(16px,1.3vw,19px);line-height:1.6;color:rgba(244,239,230,.85);max-width:52ch;margin:0}
.m2-case-facts{display:flex;flex-wrap:wrap;gap:14px 40px;margin:0;padding-block:26px;border-block:1px solid var(--m2-line)}
.m2-case-facts div{display:grid;gap:6px}
.m2-case-facts dd{margin:0;font-size:15px}
.m2-case-facts a{color:var(--m2-cream)}
.m2-case-story{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(24px,5vw,90px);padding-block:var(--m2-sec);border-bottom:1px solid var(--m2-line);align-items:start}
.m2-case-story .m2-svc-h{font-size:clamp(2.6rem,5vw,5.4rem);margin:12px 0 0;position:sticky;top:var(--m2-sticky-top)}
.m2-case-story .prose{font-size:clamp(16px,1.25vw,18px);line-height:1.7;color:rgba(244,239,230,.84)}
.m2-case-story .prose p{margin:0 0 1.2em}
.m2-case-results{padding-block:var(--m2-sec);border-bottom:1px solid var(--m2-line)}
.m2-case-results .m2-proofcards{margin-top:28px}
.m2-case-gallery{padding-block:var(--m2-sec);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.m2-case-gallery figure{margin:0;overflow:hidden;border:1px solid var(--m2-line);aspect-ratio:4/3}
.m2-case-gallery figure:first-child:nth-last-child(odd){grid-column:1 / -1;aspect-ratio:21/9}
.m2-case-gallery img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--m2-ease-out)}
.m2-case-gallery figure:hover img{transform:scale(1.04)}
.m2-case-next{display:block;position:relative;min-height:62vh;overflow:hidden;border-top:1px solid var(--m2-line);color:inherit;text-decoration:none;isolation:isolate}
.m2-case-next img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1;opacity:.35;filter:grayscale(.3);transition:opacity .8s,transform 2s var(--m2-ease-out)}
.m2-case-next:hover img{opacity:.6;transform:scale(1.04)}
.m2-case-next::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#000,transparent 40%,transparent 70%,#000)}
.m2-case-next-in{min-height:62vh;display:grid;align-content:center;gap:12px;justify-items:start}
.m2-case-next-in .display{font-size:clamp(3rem,7vw,8rem);line-height:.86}
.m2-case-next-in .btn{margin-top:10px}
.m2-case-cta{padding-block:var(--m2-sec);display:grid;gap:18px;justify-items:center;text-align:center}
.m2-case-cta .m2-svc-h{font-size:clamp(3rem,6vw,6.8rem)}
@media (max-width:899.98px){
  .m2-case-hero{min-height:72svh}
  .m2-case-hero-copy{max-width:none}
  .m2-case-story{grid-template-columns:1fr;gap:16px}
  .m2-case-story .m2-svc-h{position:static}
  .m2-case-gallery{grid-template-columns:1fr}
  .m2-case-gallery figure:first-child:nth-last-child(odd){grid-column:auto;aspect-ratio:4/3}
}

/* Work page: the logo strip and the closing section follow the showcase closely */
.elementor-element:has(.m2-wk) + .elementor-element .m2-clients{padding-block:var(--m2-sec-sm)}
.elementor-element:has(.m2-wk) ~ .elementor-element .m2-cta{min-height:0;padding-block:var(--m2-sec)}
@media (max-width:899.98px){

  .m2-wk-figs{margin-top:10px;padding-top:18px}
  .m2-wk.is-cards .m2-wk-stage{padding-block:4px 28px}
  
  
}

/* Every section keeps its decoration (glows, off-screen panels, floating objects) inside
   the screen width. Phones size the page to its widest box, so anything poking out
   made every page slightly wider than the phone. clip, not hidden: sticky still works. */
[class*="elementor-widget-micro2"],.m2-sec,.m2-svc-step,.m2-svc-hero,.m2-svc-cta,.m2-case>section,.foot{overflow-x:clip}

/* contact form: "What can we help with? (choose any)" — a closed field that opens a list of checkboxes */
.m2-multi{position:relative}
.m2-multi-label{font-family:var(--m2-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--m2-mute)}
.m2-multi-btn{position:relative;display:flex;align-items:center;width:100%;min-height:52px;padding:14px 44px 14px 16px;font:inherit;font-size:16px;text-align:start;color:var(--m2-cream);background:rgba(255,255,255,.03);border:1px solid var(--m2-line-hi);border-radius:0;cursor:pointer;transition:border-color .3s,background .3s}
.m2-multi-btn::after{content:"";position:absolute;inset-inline-end:15px;top:50%;width:10px;height:5px;margin-top:-2px;background:linear-gradient(45deg,transparent 50%,var(--m2-gold) 50%) 0 0/5px 5px no-repeat,linear-gradient(135deg,var(--m2-gold) 50%,transparent 50%) 5px 0/5px 5px no-repeat;transition:transform .3s} /* the same gold triangle as the dropdowns */
.m2-multi-btn[aria-expanded="true"]::after{transform:rotate(180deg)}
.m2-multi-btn:hover,.m2-multi-btn:focus-visible,.m2-multi-btn[aria-expanded="true"]{outline:none;border-color:var(--m2-gold);background:rgba(201,157,81,.06)}
.m2-multi-val{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m2-multi:not(.has-value) .m2-multi-val{color:var(--m2-mute)}
.m2-multi-pop{display:grid;gap:2px;margin-top:6px;padding:6px;background:#0b0b0a;border:1px solid rgba(201,157,81,.4);box-shadow:0 30px 70px -20px rgba(0,0,0,.9)}
.m2-multi.is-js .m2-multi-pop{position:absolute;z-index:30;top:100%;left:0;right:0;max-height:min(70vh,480px);overflow:auto;overscroll-behavior:contain}
.m2-multi.is-js:not(.is-open) .m2-multi-pop{display:none}
.m2-multi:not(.is-js) .m2-multi-btn{display:none}
.m2-field .m2-multi-opt{display:flex;align-items:center;gap:12px;min-height:46px;padding:10px 12px;font-family:var(--m2-body);font-size:15.5px;letter-spacing:0;text-transform:none;color:var(--m2-cream);cursor:pointer;transition:background .2s}
.m2-field .m2-multi-opt:hover{background:rgba(201,157,81,.08)}
.m2-field .m2-multi-opt input{appearance:none;-webkit-appearance:none;flex:none;width:18px;height:18px;margin:0;padding:0;border:1px solid var(--m2-gold);background:transparent;border-radius:2px;cursor:pointer;transition:background .2s,box-shadow .2s}
.m2-field .m2-multi-opt input:checked{background:var(--m2-gold);box-shadow:inset 0 0 0 3px #0b0b0a}
.m2-field .m2-multi-opt input:focus-visible{outline:2px solid var(--m2-gold);outline-offset:2px}
.m2-multi-opt:has(input:checked){background:rgba(201,157,81,.1)}
.m2-multi.has-err .m2-multi-btn{border-color:#e06a5a}
@media (max-width:520px){.m2-field .m2-multi-opt{min-height:50px;font-size:16px}}

/* a row of the services as small gold objects (hub CTA, end of each service page) */
.m2-minirow{grid-column:1/-1;order:3;width:100%;margin-top:clamp(28px,4vw,52px);text-align:center}
.m2-minirow-h{margin:0 0 6px;color:var(--m2-gold)}
.m2-minirow-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:6px}
.m2-mini{display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px 4px 12px;color:var(--m2-cream);text-decoration:none;border:1px solid transparent;transition:border-color .3s,background .3s,color .3s}
.m2-mini-obj{display:block;width:clamp(72px,7vw,96px);aspect-ratio:1}
.m2-mini-name{font-family:var(--m2-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;line-height:1.35;color:var(--m2-mute);transition:color .3s}
.m2-mini:hover,.m2-mini:focus-visible{border-color:rgba(201,157,81,.35);background:rgba(201,157,81,.06)}
.m2-mini:hover .m2-mini-name,.m2-mini:focus-visible .m2-mini-name{color:var(--m2-gold)}
.m2-mini:focus-visible{outline:2px solid var(--m2-gold);outline-offset:2px}
.m2-svc-cta .m2-minirow{margin-top:clamp(36px,5vw,64px);padding-top:clamp(22px,3vw,32px);border-top:1px solid rgba(201,157,81,.16)}
/* without 3D the names carry it */
.is-static .m2-mini-obj,html:not(.js) .m2-mini-obj{display:none}
@media (max-width:899.98px){
  /* phones: a swipeable strip, big tap targets, the next item peeking in */
  .m2-minirow-list{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:8px;margin-inline:calc(var(--m2-gl) * -1) calc(var(--m2-gr) * -1);padding-inline:var(--m2-gl) var(--m2-gr);scroll-padding-inline:var(--m2-gl)}
  .m2-minirow-list::-webkit-scrollbar{display:none}
  .m2-minirow-list li{flex:0 0 clamp(112px,32vw,150px);scroll-snap-align:start}
  .m2-mini{min-height:132px;justify-content:center;border-color:rgba(201,157,81,.18);background:rgba(255,255,255,.02)}
  .m2-mini-obj{width:78px}
}

/* Phones: every story mock keeps a strip along its bottom for the result badge, so the
   badge never sits on the mock's own parts; parts that stood in that strip move up. */
@media (max-width:899.98px){
  [data-story-scene]{--foot:62px;padding-bottom:var(--foot)}
  [data-story-scene] .m2-ex-badge{right:14px;bottom:12px}
  .m2-ex-video{grid-template-rows:auto auto auto;padding-bottom:var(--foot)}
  .m2-vid-preview{aspect-ratio:16/11}
  .m2-vid-exports{left:14px;bottom:20px}
  .m2-brand-board{position:relative;inset:auto;padding-bottom:6px}
  .m2-brand-apply{flex-wrap:wrap}
  /* web: the speed score on top, then the desktop and phone mocks side by side, then the badge */
  .m2-web-speed{left:14px;right:auto;top:14px}
  .m2-web-desk{top:104px;right:34%;width:auto;bottom:var(--foot)}
  .m2-web-mobile{top:104px;bottom:auto;right:14px;width:calc(34% - 26px)}
}
@media (max-width:380px){.m2-vid-exports span{padding:4px 6px}[data-story-scene] .m2-ex-badge{font-size:13px;padding:8px 12px}}
.m2-serp-url{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}

/* About, "Proof in numbers" on phones: the heading, then the figures as a 2×2 grid with
   readable labels, then the values. No 3D slabs here (journey.js), so nothing overlaps. */
@media (max-width:899.98px){
  .m2-journey.is-3d .j-why .j-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 16px;margin:4px 0 0}
  .m2-journey .j-why .j-stats li{padding:12px 0 8px;gap:5px}
  .m2-journey .j-why .j-stats b{font-size:clamp(2.4rem,11vw,3.1rem)}
  .m2-journey .j-why .j-stats .eyebrow{font-size:11px;letter-spacing:.08em;line-height:1.35;color:rgba(244,239,230,.82)}
  .m2-journey.is-3d .j-why .j-values{margin-top:14px;background:none;padding-top:0;gap:12px}
  .m2-journey.is-3d .j-why{padding-bottom:max(64px,7vh)}
}
@media (max-width:899.98px) and (max-height:760px){.m2-journey.is-3d .j-why .j-value p{display:none}.m2-journey.is-3d .j-why .j-values{gap:8px}}

/* Phones, service pages: the 3D layer sits behind the content, so the object tucked at
   the side (services3d.js) never covers words or taps; the header stays above it. */
@media (max-width:899.98px){body:has(.m2-svc.is-3d){background:transparent}body:has(.m2-svc.is-3d) .m2-svc-gl{z-index:-1}} /* the black is on html, as on the home page */

/* ---------- Talent page: filters, floating clips, the player, the shortlist tray ---------- */
.m2-tal{padding-top:var(--m2-sec-sm);padding-bottom:var(--m2-sec)}
.m2-tal-filters{display:flex;flex-wrap:wrap;gap:14px 40px;margin-bottom:clamp(28px,4vw,48px);padding-bottom:22px;border-bottom:1px solid var(--m2-line)}
.m2-tal-fgroup{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.m2-tal-fgroup .eyebrow{margin-inline-end:6px}
.m2-tal .m2-chip{height:38px;padding:0 16px;border-radius:999px;border:1px solid var(--m2-line-hi);background:transparent;color:var(--m2-cream);font:inherit;font-size:14px;cursor:pointer;transition:border-color .3s,background .3s,color .3s}
.m2-tal .m2-chip:hover{border-color:var(--m2-gold)}
.m2-tal .m2-chip[aria-pressed="true"]{background:var(--m2-gold);border-color:var(--m2-gold);color:#000}
.m2-tal-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,4vw,56px) clamp(20px,3vw,44px)}
.m2-tal-item[hidden]{display:none}
.m2-tal-card{display:flex;flex-direction:column;gap:10px}
/* the clip "stands" on the page: black on black, a glow at the feet, a few gold specks drifting */
.m2-tal-play{all:unset;position:relative;display:block;aspect-ratio:9/16;width:100%;cursor:pointer;isolation:isolate;border-radius:14px;overflow:visible}
.m2-tal-play video,.m2-tal-play img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 100%;border-radius:14px;background:#000;display:block;transition:transform .7s var(--m2-ease-out),filter .5s}
.m2-tal-play:hover video,.m2-tal-play:focus-visible video,.m2-tal-item.is-preview video{transform:translateY(-6px) scale(1.015)}
.m2-tal-play:focus-visible{outline:2px solid var(--m2-gold);outline-offset:6px}
.m2-tal-glow{position:absolute;left:8%;right:8%;bottom:-6%;height:22%;z-index:-1;border-radius:50%;background:radial-gradient(50% 50% at 50% 50%,rgba(214,168,88,.5),rgba(201,157,81,.14) 50%,transparent 72%);filter:blur(6px);transition:opacity .6s,transform .6s;transform:scaleX(.9)}
.m2-tal-play:hover .m2-tal-glow,.m2-tal-item.is-preview .m2-tal-glow{transform:none;opacity:1}
.m2-tal-dust{position:absolute;inset:-10% -8%;z-index:-1;pointer-events:none;opacity:.55;animation:m2-tal-drift 14s ease-in-out infinite alternate}
.m2-tal-item:nth-child(2n) .m2-tal-dust{animation-duration:17s;animation-delay:-6s}
.m2-tal-item:nth-child(3n) .m2-tal-dust{animation-duration:21s;animation-delay:-11s}
@keyframes m2-tal-drift{from{transform:translateY(6px)}to{transform:translateY(-8px)}}
.m2-tal-ico{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(244,239,230,.4);background:rgba(0,0,0,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff;transition:opacity .35s,transform .35s var(--m2-ease-out),background .3s,border-color .3s}
.m2-tal-ico svg{width:30px;height:30px;margin-left:3px}
.m2-tal-play:hover .m2-tal-ico{background:var(--m2-gold);border-color:var(--m2-gold);color:#000;transform:scale(1.08)}
.m2-tal-item.is-preview .m2-tal-ico{opacity:0;transform:scale(.8)}
.m2-tal-star{position:absolute;top:12px;left:12px;padding:6px 10px;border-radius:999px;background:rgba(0,0,0,.6);color:var(--m2-gold);border:1px solid rgba(201,157,81,.5)}
.m2-tal .m2-initials{position:absolute;inset:0;display:grid;place-items:center;border-radius:14px;background:#0b0a08;font-family:var(--m2-display);font-size:4rem;color:var(--m2-gold)}
.m2-tal-meta{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-top:6px}
.m2-tal-name{margin:0;font-size:clamp(1.9rem,2.4vw,2.5rem);line-height:1}
.m2-tal-add{all:unset;display:inline-flex;align-items:center;gap:7px;flex:none;font-family:var(--m2-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--m2-mute);cursor:pointer;padding:6px 0;transition:color .3s}
.m2-tal-add i{width:16px;height:16px;border-radius:50%;border:1px solid currentColor;display:grid;place-items:center;font-style:normal}
.m2-tal-add i::before{content:"+";font-size:13px;line-height:1}
.m2-tal-add:hover,.m2-tal-add:focus-visible{color:var(--m2-gold)}
.m2-tal-add[aria-pressed="true"]{color:var(--m2-gold)}
.m2-tal-add[aria-pressed="true"] i{background:var(--m2-gold);border-color:var(--m2-gold);color:#000}
.m2-tal-add[aria-pressed="true"] i::before{content:"\2713"}
.m2-tal-bio{margin:0;color:var(--m2-mute);font-size:15px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.m2-tal-langs{list-style:none;margin:2px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.m2-tal-langs li{padding:4px 10px;border-radius:999px;border:1px solid var(--m2-line);font-family:var(--m2-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--m2-mute)}
.m2-tal-empty{text-align:center;padding:40px 0}
/* the player */
.m2-player{padding:0;border:0;background:transparent;color:var(--m2-cream);width:min(1180px,100vw - 32px);max-width:none;height:min(760px,100dvh - 32px);max-height:none}
.m2-player::backdrop{background:rgba(0,0,0,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.m2-player[open]{animation:m2-pop .5s var(--m2-ease-out)}
.m2-player-in{height:100%;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);border:1px solid rgba(201,157,81,.35);background:#070605;box-shadow:0 60px 140px -40px rgba(0,0,0,1),0 0 90px -30px rgba(201,157,81,.35)}
.m2-player-stage{position:relative;background:#000;display:grid;place-items:center;overflow:hidden}
.m2-player-stage video{width:100%;height:100%;object-fit:contain;display:block;cursor:pointer}
.m2-player-big{all:unset;position:absolute;left:50%;top:50%;width:84px;height:84px;margin:-42px 0 0 -42px;display:grid;place-items:center;border-radius:50%;background:var(--m2-gold);color:#000;cursor:pointer;box-shadow:0 0 50px rgba(201,157,81,.45);transition:opacity .35s,transform .35s var(--m2-ease-out)}
.m2-player-big svg{width:38px;height:38px}
.m2-player-big .pa,.m2-player.is-playing .m2-player-big .pl{display:none}
.m2-player.is-playing .m2-player-big .pa{display:block}
.m2-player.is-playing .m2-player-big{opacity:0;transform:scale(.7);pointer-events:none}
.m2-player.is-playing .m2-player-stage:hover .m2-player-big{opacity:.9;transform:none;pointer-events:auto}
.m2-player.is-idle .m2-player-stage:hover .m2-player-big{opacity:0;pointer-events:none}
.m2-player-arrow{all:unset;position:absolute;top:50%;width:46px;height:46px;margin-top:-23px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(244,239,230,.3);background:rgba(0,0,0,.5);color:#fff;font-size:20px;cursor:pointer;transition:opacity .3s,border-color .3s}
.m2-player-arrow.is-prev{left:14px}.m2-player-arrow.is-next{right:14px}
.m2-player-arrow:hover,.m2-player-arrow:focus-visible{border-color:var(--m2-gold);color:var(--m2-gold)}
.m2-player-bar{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:14px;padding:26px 16px 14px;background:linear-gradient(transparent,rgba(0,0,0,.85));transition:opacity .35s,transform .35s}
.m2-player.is-idle .m2-player-bar,.m2-player.is-idle .m2-player-arrow{opacity:0;pointer-events:none}
.m2-player-seek{position:relative;flex:1;height:22px;cursor:pointer;outline:none}
.m2-player-seek::before{content:"";position:absolute;left:0;right:0;top:10px;height:2px;background:rgba(244,239,230,.25)}
.m2-player-seek i{position:absolute;left:0;right:0;top:10px;height:2px;background:var(--m2-gold);transform-origin:left;transform:scaleX(0);box-shadow:0 0 12px rgba(201,157,81,.8)}
.m2-player-seek:hover::before,.m2-player-seek:hover i,.m2-player-seek:focus-visible i{height:4px;top:9px}
.m2-player-seek:focus-visible{outline:1px solid var(--m2-gold);outline-offset:4px}
.m2-player-time{font-family:var(--m2-mono);font-size:11px;letter-spacing:.08em;color:var(--m2-cream);white-space:nowrap}
.m2-player-btn{all:unset;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;color:var(--m2-cream);cursor:pointer;transition:color .3s,background .3s}
.m2-player-btn svg{width:22px;height:22px}
.m2-player-btn:hover,.m2-player-btn:focus-visible{color:var(--m2-gold);background:rgba(255,255,255,.08)}
.m2-player-btn .off,.m2-player-btn[aria-pressed="true"] .on{display:none}
.m2-player-btn[aria-pressed="true"] .off{display:block}
.m2-player-side{position:relative;min-height:0;overflow:auto;overscroll-behavior:contain;padding:clamp(52px,6vh,68px) clamp(24px,3.5vw,44px) clamp(24px,4vh,40px);display:flex;flex-direction:column;gap:14px}
.m2-player-side h3{margin:0;font-size:clamp(2.4rem,3.6vw,3.6rem);line-height:.95}
.m2-player-bio{font-size:16px;line-height:1.65;color:rgba(244,239,230,.84)}
.m2-player-bio p{margin:0 0 .8em}
.m2-player-actions{margin-top:auto;display:flex;flex-wrap:wrap;gap:10px;padding-top:12px}
.m2-player .m2-dialog-close{top:12px;inset-inline-end:12px}
/* the shortlist tray */
.m2-tray{position:fixed;left:50%;bottom:max(16px,env(safe-area-inset-bottom,0px));z-index:64;transform:translateX(-50%);display:flex;align-items:center;gap:14px;max-width:min(960px,100vw - 32px);padding:10px 12px 10px 18px;border:1px solid rgba(201,157,81,.4);border-radius:999px;background:rgba(8,7,5,.9);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 30px 80px -20px rgba(0,0,0,.9);animation:m2-pop .45s var(--m2-ease-out)}
.m2-tray[hidden]{display:none}
.m2-tray-names{list-style:none;margin:0;padding:0;display:flex;flex-wrap:nowrap;gap:6px;overflow:auto;scrollbar-width:none;max-width:52vw}
.m2-tray-names::-webkit-scrollbar{display:none}
.m2-tray-names li{display:inline-flex;align-items:center;gap:4px;padding:4px 6px 4px 12px;border-radius:999px;background:rgba(201,157,81,.14);font-size:14px;white-space:nowrap}
.m2-tray-names button{all:unset;width:22px;height:22px;display:grid;place-items:center;border-radius:50%;color:var(--m2-mute);cursor:pointer;font-size:16px}
.m2-tray-names button:hover{color:#fff;background:rgba(255,255,255,.1)}
.m2-tray-clear{all:unset;font-family:var(--m2-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--m2-mute);cursor:pointer;padding:0 6px}
.m2-tray-clear:hover{color:var(--m2-gold)}
body.has-tray .m2-wa,body.has-tray .m2-totop{transform:translateY(-64px)}
@media (max-width:1023.98px){.m2-tal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:899.98px){
  .m2-player{width:100vw;height:100dvh;max-height:100dvh}
  .m2-player-in{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;border:0}
  .m2-player-stage{max-height:62dvh}
  .m2-player-side{padding:18px 18px calc(18px + env(safe-area-inset-bottom,0px));gap:10px;max-height:38dvh}
  .m2-player-side h3{font-size:2rem}
  .m2-player-bio{font-size:14.5px;line-height:1.5}
  .m2-player-actions{padding-top:4px}
  .m2-player .m2-dialog-close{top:10px}
  .m2-tray{left:12px;right:12px;transform:none;max-width:none;gap:8px;padding:8px 8px 8px 14px}
  .m2-tray>.eyebrow{display:none}
  .m2-tray-names{max-width:none;flex:1}
}
@media (max-width:640px){
  .m2-tal-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 14px}
  .m2-tal-ico{width:48px;height:48px;margin:-24px 0 0 -24px}
  .m2-tal-ico svg{width:22px;height:22px}
  .m2-tal-name{font-size:1.5rem}
  .m2-tal-meta{flex-direction:column;align-items:flex-start;gap:4px}
  .m2-tal-bio{font-size:13.5px}
  .m2-tal-langs li{font-size:9.5px;padding:3px 8px}
  .m2-tal .m2-chip{height:36px;padding:0 13px;font-size:13px}
  .m2-tal-fgroup{gap:6px}
}
@media (prefers-reduced-motion:reduce){.m2-tal-dust{animation:none}}
/* Pages with a gold-dust hero (Work, Talent): the dust and stars drift behind the content,
   never over faces or words. The black is on html, so the canvas shows through. */
body:has([data-dust-hero]:not([data-hub-hero])){background:transparent}
body:has([data-dust-hero]:not([data-hub-hero])) .m2-svc-gl{z-index:-1}
/* language pills and filter chips: a small flag beside the name */
.m2-flag{display:block;width:18px;height:12px;flex:none;border-radius:2px;box-shadow:0 1px 3px rgba(0,0,0,.5)}
.m2-tal-langs li.m2-lang,.m2-tal-langs .m2-lang{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 6px}
.m2-tal .m2-chip-lang{display:inline-flex;align-items:center;gap:8px;padding-inline:12px 15px}
.m2-tal .m2-chip-lang .m2-flag{width:20px;height:13px}
.m2-player .m2-tal-langs .m2-flag{width:20px;height:13px}
/* the whole person always shows: the card is the clip's own 9:16, the clip is never cropped (contain, standing on the glow) */

/* ---------- page hero showreel: a floating gold-edged screen beside the headline ---------- */
.m2-phero-grid.has-reel{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(28px,4vw,72px);align-items:center}
.m2-phero[data-size="compact"] .m2-phero-grid.has-reel .m2-phero-title{font-size:clamp(3rem,5.4vw,6.4rem)}
.m2-reelframe{position:relative;perspective:1400px;isolation:isolate}
.m2-reelframe-tilt{--rx:3deg;--ry:-9deg;transform:rotateX(var(--rx)) rotateY(var(--ry));transform-style:preserve-3d;transition:transform .2s linear;animation:m2-reel-float 9s ease-in-out infinite alternate}
@keyframes m2-reel-float{from{translate:0 -6px}to{translate:0 8px}}
.m2-reelframe-screen{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#000;padding:1.5px;
  background-image:linear-gradient(135deg,#f3d58f,#9a7230 30%,#4d3a1a 55%,#c99d51 80%,#f1d38c);
  box-shadow:0 50px 120px -30px rgba(0,0,0,.95),0 30px 60px -30px rgba(0,0,0,.9),0 0 80px -10px rgba(201,157,81,.35),inset 0 0 0 1px rgba(255,255,255,.06)}
.m2-reelframe-screen video{display:block;width:100%;height:100%;object-fit:cover;border-radius:12.5px;background:#000}
.m2-reelframe-sheen{position:absolute;inset:1.5px;border-radius:12.5px;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.14),rgba(255,255,255,0) 32%,rgba(255,255,255,0) 70%,rgba(255,235,190,.06));mix-blend-mode:screen}
.m2-reelframe-glow{position:absolute;left:6%;right:6%;bottom:-16%;height:28%;z-index:-1;border-radius:50%;background:radial-gradient(50% 50% at 50% 50%,rgba(214,168,88,.42),rgba(201,157,81,.1) 55%,transparent 75%);filter:blur(10px);pointer-events:none}
.m2-reelframe::before{content:"";position:absolute;inset:-18% -12%;z-index:-2;pointer-events:none;background:radial-gradient(45% 50% at 55% 50%,rgba(201,157,81,.16),transparent 70%)}
@media (max-width:899.98px){
  /* phones: the reel sits right under the headline */
  .m2-phero-grid.has-reel{display:flex;flex-direction:column;align-items:stretch;gap:0}
  .m2-phero-grid.has-reel .m2-phero-copy{display:contents}
  .m2-phero-grid.has-reel .m2-crumbs{order:1}.m2-phero-grid.has-reel .m2-phero-eyebrow{order:2}.m2-phero-grid.has-reel .m2-phero-title{order:3}
  .m2-phero-grid.has-reel .m2-reelframe{order:4;margin:22px 0 26px}
  .m2-phero-grid.has-reel .lead{order:5}.m2-phero-grid.has-reel .btn-row{order:6;margin-top:18px}.m2-phero-grid.has-reel .m2-phero-phone{order:7}
  .m2-reelframe-tilt{--rx:2deg;--ry:-4deg}
}
@media (prefers-reduced-motion:reduce){.m2-reelframe-tilt{animation:none}}

/* ---------- player round 3: sized to the 9:16 clip, a loading ring, tap for sound, smooth close ---------- */
.m2-player{--ph:min(880px,100dvh - 48px);width:min(100vw - 32px,calc(var(--ph) * .5625 + 480px));height:var(--ph);transform:translateY(var(--drag,0));transition:transform .25s var(--m2-ease-out),opacity .28s}
.m2-player .m2-player-in{grid-template-columns:calc(var(--ph) * .5625) minmax(0,1fr)}
.m2-player-stage video{object-fit:cover}
.m2-player.is-closing{opacity:0;transform:translateY(calc(var(--drag,0px) + 24px)) scale(.98)}
.m2-player.is-closing::backdrop{opacity:0;transition:opacity .28s}
.m2-player::backdrop{transition:opacity .28s}
.m2-player-ring{position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px 0 0 -27px;border-radius:50%;border:2px solid rgba(201,157,81,.25);border-top-color:var(--m2-gold);opacity:0;pointer-events:none;animation:m2-spin .9s linear infinite;transition:opacity .25s}
@keyframes m2-spin{to{transform:rotate(360deg)}}
.m2-player.is-pending .m2-player-ring,.m2-player.is-playing.is-waiting .m2-player-ring{opacity:1}
.m2-player.is-pending .m2-player-big{opacity:0;pointer-events:none}
.m2-player-sound{all:unset;position:absolute;top:14px;left:50%;transform:translateX(-50%);display:none;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;background:var(--m2-gold);color:#000;font-size:14px;font-weight:500;cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.5)}
.m2-player-sound svg{width:18px;height:18px}
.m2-player.needs-sound .m2-player-sound{display:inline-flex}
@media (max-width:899.98px){
  .m2-player{--ph:100dvh;width:100vw;height:100dvh}
  .m2-player .m2-player-in{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}
  .m2-player-stage video{object-fit:contain}
  .m2-player-stage::after{content:"";position:absolute;top:8px;left:50%;width:42px;height:4px;margin-left:-21px;border-radius:2px;background:rgba(244,239,230,.35)} /* the swipe-down handle */
}
@media (prefers-reduced-motion:reduce){.m2-player{transition:none}.m2-player-ring{animation:none}}

/* ---------- production journey: a gold timeline from script to results ---------- */
.m2-pj{position:relative;padding-block:var(--m2-sec)} /* the site's section rhythm: never flush against the section before or after */
.m2-pj-head{max-width:760px;margin:0 auto clamp(36px,5vw,64px);text-align:center;display:grid;gap:12px;justify-items:center}
.m2-pj-head .h2{margin:0}
.m2-pj-head .lead{margin:0;max-width:52ch}
.m2-pj-list{position:relative;list-style:none;margin:0;padding:0;display:grid;gap:clamp(18px,2.4vw,34px)}
/* the line, centred on desktop */
.m2-pj-rail{position:absolute;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;background:rgba(201,157,81,.16)}
.m2-pj-fill{position:absolute;inset:0;background:linear-gradient(180deg,#f3d58f,var(--m2-gold) 40%,#8f6a2c);transform-origin:top;transform:scaleY(0);box-shadow:0 0 14px rgba(201,157,81,.55)}
.m2-pj-spark{position:absolute;left:50%;top:0;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#fff3d6;box-shadow:0 0 12px 4px rgba(243,213,143,.8),0 0 40px 10px rgba(201,157,81,.45);opacity:0;transition:opacity .3s}
.m2-pj-step{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 64px minmax(0,1fr);align-items:center;column-gap:clamp(16px,2vw,32px)}
.m2-pj-text{grid-column:1;text-align:end;display:grid;gap:6px;justify-items:end;opacity:.35;transform:translateY(14px);transition:opacity .6s,transform .7s var(--m2-ease-out)}
.m2-pj-vis{grid-column:3}
.m2-pj-step.is-flip .m2-pj-text{grid-column:3;grid-row:1;text-align:start;justify-items:start}
.m2-pj-step.is-flip .m2-pj-vis{grid-column:1;grid-row:1;justify-self:end}
.m2-pj-step.is-on .m2-pj-text{opacity:1;transform:none}
.m2-pj-n{font-family:var(--m2-mono);font-size:11px;letter-spacing:.16em;color:var(--m2-gold)}
.m2-pj-text h3{margin:0;font-size:clamp(2.2rem,3.6vw,3.6rem);line-height:.95}
.m2-pj-text p{margin:0;max-width:34ch;color:var(--m2-mute);font-size:16px;line-height:1.5}
.m2-pj-node{grid-column:2;grid-row:1;justify-self:center;width:18px;height:18px;border-radius:50%;border:2px solid rgba(201,157,81,.4);background:#0a0907;transition:background .4s,border-color .4s,box-shadow .5s,transform .5s var(--m2-ease-out);position:relative;z-index:1}
.m2-pj-step.is-on .m2-pj-node{background:var(--m2-gold);border-color:#f3d58f;box-shadow:0 0 0 6px rgba(201,157,81,.16),0 0 24px rgba(201,157,81,.7);transform:scale(1.15)}
/* each visual: a dark card with a gold edge */
.m2-pj-vis{position:relative;width:min(100%,460px);border-radius:14px;overflow:hidden;border:1px solid rgba(201,157,81,.28);background:radial-gradient(80% 70% at 50% 0%,rgba(201,157,81,.12),transparent 60%),linear-gradient(180deg,#141210,#0a0908);box-shadow:0 40px 80px -40px rgba(0,0,0,.95);opacity:.4;transform:translateY(18px) scale(.97);transition:opacity .7s,transform .8s var(--m2-ease-out),border-color .6s,box-shadow .6s}
.m2-pj-step.is-on .m2-pj-vis{opacity:1;transform:none;border-color:rgba(201,157,81,.55);box-shadow:0 40px 80px -40px rgba(0,0,0,.95),0 0 50px -16px rgba(201,157,81,.45)}
.m2-pj-vis img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 18%}
/* 1 script: lines write themselves */
.pj-page{position:absolute;inset:14px 18%;padding:16px 18px;border-radius:6px;background:#f4efe6;color:#111;display:grid;align-content:start;gap:9px;box-shadow:0 20px 40px rgba(0,0,0,.6)}
.pj-slug{font-family:var(--m2-mono);font-size:10px;letter-spacing:.12em;color:#7b5e2a}
.pj-page i{display:block;height:6px;border-radius:3px;background:#2a2620;width:var(--w);transform-origin:left;transform:scaleX(0)}
.m2-pj-step.is-on .pj-page i{animation:pj-write .5s calc(var(--d) * .22s + .2s) cubic-bezier(.4,0,.2,1) forwards}
@keyframes pj-write{to{transform:scaleX(1)}}
.pj-caret{position:absolute;right:20%;bottom:20%;width:2px;height:14px;background:var(--m2-gold);animation:m2-caret 1s steps(2) infinite}
/* 2 storyboard: frames sketch in */
.pj-board{position:absolute;inset:14px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pj-board span{position:relative;border:1px solid rgba(244,239,230,.25);border-radius:4px;background:rgba(244,239,230,.04);display:grid;place-items:center;opacity:0;transform:scale(.9)}
.pj-board svg{width:80%;height:auto;fill:none;stroke:#f4efe6;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:160;stroke-dashoffset:160}
.pj-board em{position:absolute;left:5px;top:3px;font-style:normal;font-family:var(--m2-mono);font-size:9px;color:var(--m2-gold)}
.m2-pj-step.is-on .pj-board span{animation:pj-in .45s calc(var(--d) * .18s) var(--m2-ease-out) forwards}
.m2-pj-step.is-on .pj-board svg{animation:pj-draw 1.1s calc(var(--d) * .18s + .2s) ease-out forwards}
@keyframes pj-in{to{opacity:1;transform:none}}
@keyframes pj-draw{to{stroke-dashoffset:0}}
/* 3 talent: cards fan in, one shortlisted */
.pj-cards{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.pj-card{position:relative;width:26%;aspect-ratio:9/14;margin:0 -2%;border-radius:8px;overflow:hidden;border:1px solid rgba(244,239,230,.25);background:#000;box-shadow:0 20px 40px rgba(0,0,0,.6);opacity:0;transform:translateY(30px) rotate(calc((var(--k) - 1) * 8deg))}
.pj-card:nth-child(2){z-index:2}
.m2-pj-step.is-on .pj-card{animation:pj-fan .7s calc(var(--k) * .15s) var(--m2-ease-out) forwards}
@keyframes pj-fan{to{opacity:1;transform:translateY(calc((var(--k) - 1) * (var(--k) - 1) * 10px)) rotate(calc((var(--k) - 1) * 8deg))}}
.pj-pick{position:absolute;left:6px;right:6px;bottom:6px;padding:5px 6px;border-radius:999px;background:var(--m2-gold);color:#000;font:600 10px/1 var(--m2-body);text-align:center;opacity:0;transform:scale(.6)}
.m2-pj-step.is-on .pj-card:nth-child(2){animation:pj-fan .7s .15s var(--m2-ease-out) forwards,pj-glow 1s 1.1s forwards}
.m2-pj-step.is-on .pj-pick{animation:pj-pop .4s 1.2s cubic-bezier(.3,1.6,.5,1) forwards}
@keyframes pj-glow{to{border-color:var(--m2-gold);box-shadow:0 0 0 2px var(--m2-gold),0 0 30px rgba(201,157,81,.6)}}
@keyframes pj-pop{to{opacity:1;transform:none}}
/* 4 shoot: camera, light, clapperboard snap */
.pj-set{position:absolute;inset:0}
.pj-beam{position:absolute;right:-10%;top:-30%;width:70%;height:140%;background:conic-gradient(from 225deg at 100% 0%,transparent 0deg,rgba(255,226,160,.28) 18deg,transparent 40deg);opacity:0;transform-origin:100% 0}
.m2-pj-step.is-on .pj-beam{animation:pj-light 2.4s .3s ease-in-out infinite alternate}
@keyframes pj-light{from{opacity:.4}to{opacity:1}}
.pj-cam{position:absolute;left:10%;bottom:16%;width:46%;fill:none;stroke:var(--m2-gold);stroke-width:2.4;stroke-linejoin:round}
.pj-clap{position:absolute;right:10%;bottom:18%;width:30%;aspect-ratio:1.25}
.pj-clap-body{position:absolute;left:0;right:0;bottom:0;height:72%;background:#111;border:1.5px solid #f4efe6;border-radius:3px;display:grid;align-content:center;justify-items:center;gap:2px}
.pj-clap-body b{font:600 10px/1 var(--m2-mono);color:#f4efe6;letter-spacing:.1em}
.pj-clap-top{position:absolute;left:0;right:0;top:4%;height:22%;border:1.5px solid #f4efe6;background:repeating-linear-gradient(-45deg,#f4efe6 0 8px,#111 8px 16px);transform-origin:0 100%;transform:rotate(-24deg)}
.m2-pj-step.is-on .pj-clap-top{animation:pj-snap .5s 1s cubic-bezier(.6,0,.4,1.4) forwards}
@keyframes pj-snap{to{transform:rotate(0)}}
.pj-rec{position:absolute;left:12px;top:10px;font:600 10px/1 var(--m2-mono);letter-spacing:.12em;color:#ff5a4f;display:flex;gap:6px;align-items:center}
.pj-rec::before{content:"";width:8px;height:8px;border-radius:50%;background:#ff3b30;animation:m2-caret 1s steps(2) infinite}
/* 5 edit: clips slide onto the timeline, the playhead runs */
.pj-edit{position:absolute;inset:12px;display:grid;grid-template-rows:1fr auto;gap:10px}
.pj-monitor{border-radius:6px;overflow:hidden;border:1px solid rgba(244,239,230,.15);background:#000}
.pj-monitor img{object-position:50% 25%}
.pj-tracks{position:relative;height:58px;border-radius:6px;background:#0d0c0a;border:1px solid rgba(244,239,230,.1)}
.pj-tracks i{position:absolute;left:var(--x);width:var(--w);height:12px;border-radius:3px;opacity:0;transform:translateX(30px)}
.pj-tracks i.v{top:6px;background:linear-gradient(90deg,#8a6a2f,#c79a4c)}
.pj-tracks i.t{top:22px;background:rgba(244,239,230,.55)}
.pj-tracks i.a{top:38px;height:10px;background:repeating-linear-gradient(90deg,rgba(201,157,81,.55) 0 2px,transparent 2px 4px)}
.m2-pj-step.is-on .pj-tracks i{animation:pj-slide .45s calc(var(--d) * .16s + .1s) var(--m2-ease-out) forwards}
@keyframes pj-slide{to{opacity:1;transform:none}}
.pj-head{position:absolute;top:2px;bottom:2px;left:0;width:2px;background:#fff;box-shadow:0 0 8px rgba(255,255,255,.7);opacity:0}
.m2-pj-step.is-on .pj-head{animation:pj-run 3.2s 1.1s linear infinite}
@keyframes pj-run{0%{opacity:1;left:0}95%{opacity:1;left:98%}100%{opacity:0;left:98%}}
/* 6 approval: the final cut gets its tick */
.pj-final{position:absolute;inset:0;display:grid;place-items:center}
.pj-frame{position:absolute;inset:14px 22%;border-radius:8px;overflow:hidden;border:1px solid rgba(244,239,230,.25)}
.pj-frame b{position:absolute;left:8px;top:8px;padding:4px 7px;border-radius:4px;background:rgba(0,0,0,.65);font:600 9px/1 var(--m2-mono);letter-spacing:.1em;color:#f4efe6}
.pj-tick{position:relative;z-index:1;width:28%;fill:rgba(10,9,7,.6);stroke:var(--m2-gold);stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 14px rgba(201,157,81,.7))}
.pj-tick circle{stroke-dasharray:170;stroke-dashoffset:170}
.pj-tick path{stroke-dasharray:44;stroke-dashoffset:44}
.m2-pj-step.is-on .pj-tick circle{animation:pj-draw .8s .4s ease-out forwards}
.m2-pj-step.is-on .pj-tick path{animation:pj-draw .45s 1.1s ease-out forwards}
.pj-ok{position:absolute;right:16px;bottom:14px;padding:7px 12px;border-radius:999px;background:var(--m2-gold);color:#000;font:600 12px/1 var(--m2-body);opacity:0;transform:scale(.6)}
.m2-pj-step.is-on .pj-ok{animation:pj-pop .4s 1.5s cubic-bezier(.3,1.6,.5,1) forwards}
/* 7 campaign: phones rise with the ad, platforms light up */
.pj-live{position:absolute;inset:0}
.pj-phone{position:absolute;bottom:-6%;left:calc(14% + var(--k) * 26%);width:22%;aspect-ratio:9/18;border-radius:12px;border:2px solid #2b2722;background:#000;overflow:hidden;box-shadow:0 20px 40px rgba(0,0,0,.7);opacity:0;transform:translateY(40%)}
.pj-phone:nth-child(2){bottom:2%;z-index:1}
.pj-phone img{height:100%}
.pj-bar{position:absolute;top:4px;left:50%;width:30%;height:4px;margin-left:-15%;border-radius:2px;background:#2b2722;z-index:1}
.pj-likes{position:absolute;left:6px;bottom:6px;padding:3px 6px;border-radius:999px;background:rgba(0,0,0,.65);color:#fff;font:600 9px/1 var(--m2-body);font-style:normal}
.m2-pj-step.is-on .pj-phone{animation:pj-rise .7s calc(var(--k) * .14s) var(--m2-ease-out) forwards}
@keyframes pj-rise{to{opacity:1;transform:none}}
.pj-chips{position:absolute;top:10px;left:10px;right:10px;display:flex;flex-wrap:wrap;gap:5px}
.pj-chips b{padding:4px 8px;border-radius:999px;border:1px solid rgba(201,157,81,.5);font:500 10px/1 var(--m2-body);color:#f4efe6;background:rgba(0,0,0,.5);opacity:0;transform:translateY(-6px)}
.m2-pj-step.is-on .pj-chips b{animation:pj-in .35s calc(.8s + var(--k) * .12s) var(--m2-ease-out) forwards}
.pj-livetag{position:absolute;right:12px;bottom:12px;display:flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;background:#ff3b30;color:#fff;font:700 10px/1 var(--m2-mono);letter-spacing:.12em;opacity:0}
.pj-livetag i{width:6px;height:6px;border-radius:50%;background:#fff;animation:m2-caret 1s steps(2) infinite}
.m2-pj-step.is-on .pj-livetag{animation:pj-pop .4s 1.4s forwards}
/* 8 results: figures count up, the line climbs */
.pj-results{position:absolute;inset:16px;display:grid;grid-template-rows:auto 1fr;gap:10px}
.pj-figs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pj-figs>span{display:grid;gap:2px;padding:8px 10px;border-radius:8px;background:rgba(244,239,230,.04);border:1px solid rgba(201,157,81,.2)}
.pj-figs b{font-size:clamp(1.5rem,2.4vw,2.1rem);line-height:1;color:var(--m2-gold);white-space:nowrap}
.pj-figs small{font-family:var(--m2-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--m2-mute)}
.pj-chart{width:100%;height:100%}
.pj-chart .line{fill:none;stroke:var(--m2-gold);stroke-width:2.2;vector-effect:non-scaling-stroke;stroke-dasharray:400;stroke-dashoffset:400;filter:drop-shadow(0 0 6px rgba(201,157,81,.6))}
.pj-chart .area{fill:url(#none);fill:rgba(201,157,81,.12);opacity:0}
.m2-pj-step.is-on .pj-chart .line{animation:pj-draw 1.6s .3s ease-out forwards}
.m2-pj-step.is-on .pj-chart .area{animation:pj-in .8s 1.2s forwards}
/* phones: the line on the left, each step's words above its scene */
@media (max-width:899.98px){
  .m2-pj-head{text-align:start;justify-items:start;margin-inline:0}
  .m2-pj-rail{left:9px}
  .m2-pj-spark{left:50%}
  .m2-pj-step,.m2-pj-step.is-flip{grid-template-columns:20px minmax(0,1fr);column-gap:16px;row-gap:14px}
  .m2-pj-node{grid-column:1;grid-row:1;align-self:start;margin-top:4px;width:16px;height:16px}
  .m2-pj-text,.m2-pj-step.is-flip .m2-pj-text{grid-column:2;grid-row:1;text-align:start;justify-items:start}
  .m2-pj-vis,.m2-pj-step.is-flip .m2-pj-vis{grid-column:2;grid-row:2;justify-self:stretch;width:100%}
  .m2-pj-list{gap:34px}
  .m2-pj-text h3{font-size:2.1rem}
  .m2-pj-text p{font-size:15px}
}
@media (prefers-reduced-motion:reduce){.m2-pj-step *{animation-duration:.01s!important;animation-delay:0s!important;animation-iteration-count:1!important}}
/* the card's 16:10 shape comes from a spacer, not aspect-ratio: scenes with images or charts
   sized in % (Edit, Results) made aspect-ratio collapse to the text's height, so the card
   spilled into the next step */
.m2-pj-vis::before{content:"";display:block;padding-top:62.5%}

/* ---------- booking page, premium pass: dust behind, the promises arriving, a breathing glow ---------- */
.m2-booking-expect li{opacity:0;transform:translateY(16px);animation:m2-bk-in .7s calc(.5s + var(--i,0) * .16s) var(--m2-ease-out) forwards}
@keyframes m2-bk-in{to{opacity:1;transform:none}}
.m2-booking-expect svg *{stroke-dasharray:80;stroke-dashoffset:80;animation:m2-bk-draw .9s calc(.7s + var(--i,0) * .16s) ease-out forwards}
@keyframes m2-bk-draw{to{stroke-dashoffset:0}}
.m2-booking-card{animation:m2-bk-glow 4.5s ease-in-out infinite alternate}
@keyframes m2-bk-glow{from{box-shadow:0 50px 120px -50px rgba(0,0,0,.95),0 0 60px -30px rgba(201,157,81,.25)}to{box-shadow:0 50px 120px -50px rgba(0,0,0,.95),0 0 110px -20px rgba(201,157,81,.55)}}
.m2-booking-card::after{content:"";position:absolute;inset:-1px;border-radius:16px;pointer-events:none;padding:1px;background:linear-gradient(135deg,rgba(243,213,143,.8),rgba(201,157,81,0) 35%,rgba(201,157,81,0) 65%,rgba(243,213,143,.6));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.m2-booking-help{margin:12px 6px 2px;font-size:13.5px;color:var(--m2-mute)}
.m2-booking-help a{color:var(--m2-gold);text-decoration:underline;text-underline-offset:3px}
.m2-booking-help-note{display:block;margin-top:2px;font-size:12px;opacity:.75}
@media (prefers-reduced-motion:reduce){.m2-booking-expect li,.m2-booking-expect svg *{animation:none;opacity:1;transform:none;stroke-dashoffset:0}.m2-booking-card{animation:none}}
