/* ReMOTIVE — Specialist units (Live, Energy, Connect).
   Additive: loaded after style.css and reuses its tokens and components
   (.hero, .hero-grid, .hero-photo, .region-strip, .capability-grid, .original-story, .page-cta).
   No inline styles anywhere: the site's CSP is style-src 'self'. */

/* ---------- Nav: Specialist units dropdown ---------- */
.header{z-index:22} /* above the privacy banner (also z-index 20) so the dropdown and mobile menu are never covered */
nav{white-space:nowrap}
.nav-units{position:static;display:flex;align-items:center}
.nav-units-toggle{display:inline-flex;align-items:center;gap:7px;padding:8px 0;font-weight:600}
.nav-units-toggle::after{content:"↓";content:"↓"/"";display:inline-block;font-size:12px;transition:transform .2s cubic-bezier(.22,1,.36,1)}
.nav-units-toggle[aria-expanded=true]::after{transform:rotate(180deg)}
.nav-units-toggle.is-current{box-shadow:inset 0 -1px 0 currentColor}
.nav-units-menu{position:absolute;top:100%;right:5%;left:auto;width:min(860px,90vw);background:var(--paper);border:1px solid var(--ink);display:none;grid-template-columns:repeat(3,minmax(0,1fr));z-index:30;white-space:normal;box-shadow:0 22px 50px #14110c1f}
.nav-units-menu:before{content:"";position:absolute;left:0;right:0;top:-34px;height:34px}
@media(min-width:1600px){.nav-units-menu{right:calc((100vw - 1296px)/2)}}
.nav-units.open .nav-units-menu{display:grid;animation:unitDrop .22s cubic-bezier(.22,1,.36,1)}
@media(hover:hover)and (pointer:fine){.nav-units:hover .nav-units-menu{display:grid}}
.nav-units-menu a{display:flex;flex-direction:column;gap:6px;padding:20px 22px 22px;min-height:178px;position:relative;text-decoration:none!important;transition:background .15s}
.nav-units-menu a+a{border-left:1px solid var(--ink)}
.nav-units-menu small{font:10px/1.5 var(--mono);letter-spacing:.08em;color:var(--mute)}
.nav-units-menu b{font:800 40px/.92 var(--display);letter-spacing:-.04em;margin-top:auto;transition:color .15s}
.nav-units-menu span{font-size:13px;font-weight:500;color:var(--mute);min-height:2.9em}
.nav-units-menu a::after{content:"↗";content:"↗"/"";position:absolute;top:18px;right:20px;font-style:normal;font-size:20px;transition:transform .2s cubic-bezier(.22,1,.36,1)}
.nav-units-menu a:hover,.nav-units-menu a:focus-visible{background:var(--paper2)}
.nav-units-menu a:hover b,.nav-units-menu a[aria-current=page] b{color:var(--red)}
.nav-units-menu a:hover::after{transform:translate(3px,-3px)}
.nav-units-menu .u-energy:hover{background:#0b0d0e;color:#fff}
.nav-units-menu .u-energy:hover b{color:#c7ff00}
.nav-units-menu .u-energy:hover small,.nav-units-menu .u-energy:hover span{color:#aeb6b4}
@keyframes unitDrop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media(max-width:1000px){nav{gap:16px}.nav-units-menu{right:4%;width:92vw}.nav-units-menu b{font-size:32px}}
@media(max-width:860px){nav{gap:12px;font-size:13px}}
@media(min-width:721px) and (max-width:800px){.header .wordmark{font-size:28px}nav{gap:10px;font-size:12.5px}nav .button.small{padding:8px 12px;gap:12px}}
@media(max-width:720px){
  nav{white-space:normal}
  .nav-units{display:block;padding:10px 0 2px}
  .nav-units-toggle{display:none}
  .nav-units::before{content:"SPECIALIST UNITS";display:block;font:10px/1.5 var(--mono);letter-spacing:.08em;color:var(--mute)}
  .nav-units-menu,.nav-units:hover .nav-units-menu{display:flex;flex-direction:column;position:static;width:auto;border:0;border-left:1px solid var(--ink);box-shadow:none;margin:8px 0 6px;padding-left:16px;background:none;animation:none}
  .nav-units-menu:before{display:none}
  .nav-units-menu a{min-height:0;padding:10px 0;flex-direction:row;align-items:baseline;gap:12px}
  .nav-units-menu a+a{border-left:0}
  .nav-units-menu b{font:600 18px/1.2 var(--body);letter-spacing:0;margin:0}
  .nav-units-menu small,.nav-units-menu a::after,.nav-units-menu span{display:none}
  .nav-units-menu .u-energy:hover{background:none;color:inherit}
}

/* ---------- Unit hero (same grid as the home hero) ---------- */
.unit-hero h1{font-size:clamp(66px,8.6vw,128px)}
.unit-hero .hero-photo{background:var(--ink)}
.unit-video{aspect-ratio:16/9;display:flex;flex-direction:column}
.unit-video video,.unit-video iframe,.unit-video .unit-poster{display:block;width:100%;aspect-ratio:16/9;height:auto;border:0;object-fit:cover;background:#000}
.unit-video{aspect-ratio:auto}
.unit-mute{position:absolute;right:10px;top:10px;z-index:2;background:#14110cb3;color:var(--paper);border:1px solid #f4f0e766;font:10px/1 var(--mono);letter-spacing:.08em;padding:8px 10px}
.unit-mute:hover{background:var(--red);color:#000;border-color:var(--red)}

/* ---------- Animated chart panels ---------- */
.unit-chart{margin:0;position:relative}
.unit-chart.ink{background:var(--ink);color:var(--paper)}
.unit-chart.paper{background:var(--paper2);border:1px solid var(--line)}
.unit-chart svg{display:block;width:100%;height:auto;overflow:visible}
section>.unit-chart{padding:30px}
.hero-photo.unit-chart{padding:18px 18px 0;margin:0 0 22px}
@media(max-width:720px){.hero-photo.unit-chart{margin:26px 0 0}}
.hero-photo.unit-chart svg{height:330px}
.hero-photo.unit-chart figcaption{margin:12px -18px 0}
.unit-scroll{position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.unit-tight{padding-top:40px;padding-bottom:40px}

/* Two dark proof panels */
.unit-duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.unit-duo>article{padding:26px;display:flex;flex-direction:column;gap:22px}
.unit-duo svg{max-height:400px}
.unit-duo-copy h3{font:800 clamp(30px,3vw,44px)/.95 var(--display);letter-spacing:-.035em;margin:0 0 12px}
.unit-duo-copy p{font-size:15px;color:#cfc8bb}
.unit-nums{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #f4f0e740;margin-top:18px}
.unit-nums div{padding:14px 0 0}
.unit-nums div+div{border-left:1px solid #f4f0e740;padding-left:18px}
.unit-nums strong{display:block;font:800 clamp(40px,4vw,60px)/1 var(--display);letter-spacing:-.04em;color:#f2c230}
.unit-nums span{display:block;font:10px/1.5 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#b8b0a2;margin-top:6px}

/* Proof numbers (energy) */
.unit-proof{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-block:1px solid var(--ink)}
.unit-proof div{padding:26px 24px 24px 0}
.unit-proof div+div{border-left:1px solid var(--ink);padding-left:24px}
.unit-proof strong{display:block;font:800 clamp(56px,6.4vw,96px)/.9 var(--display);letter-spacing:-.045em}
.unit-proof span{display:block;font-size:14px;color:var(--mute);margin-top:14px;max-width:32ch}

/* Live: proof band + photo strip */
.unit-band .audience-copy h2 [data-count]{font:inherit}
.unit-strip{display:grid;grid-template-columns:2fr 1fr 1fr;gap:10px;padding-block:10px 0}
.unit-strip img{width:100%;height:260px;object-fit:cover;filter:grayscale(1) contrast(1.05);transition:filter .4s ease,transform .6s cubic-bezier(.22,1,.36,1)}
.unit-strip img:hover{filter:grayscale(0);transform:scale(1.015)}

/* ---------- Firefly (its own brand system, inside the ReMOTIVE page) ---------- */
.ff-card{background:#0b0d0e!important;min-height:250px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:28px 26px 0;color:#fff;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
.ff-card .ff-field,.firefly .ff-field{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover;opacity:.9;pointer-events:none}
.ff-card .ff-mark{display:block;position:relative;width:74px}
.ff-card .ff-mark img,.firefly .ff-mark img{display:block;width:100%!important;height:auto!important;object-fit:contain;position:relative}
.ff-card .ff-word{position:relative;margin:14px 0 26px}
.ff-card .ff-word b{display:block;font-weight:600;font-size:46px;letter-spacing:-.04em;line-height:1}
.ff-card .ff-word small{display:block;font-size:10px;letter-spacing:.24em;color:#aeb6b4;margin-top:8px}
.ff-card figcaption{position:relative;align-self:stretch;margin:0 -26px;background:#15191b;color:#c7ff00;font-family:var(--mono)}
.ff-mark:before{content:"";position:absolute;left:50%;top:72%;width:44%;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,#daff52 0,#c7ff0066 35%,#c7ff0000 70%);animation:ffGlow 2.6s ease-in-out infinite}
@keyframes ffGlow{0%,100%{opacity:.25;transform:translate(-50%,-50%) scale(.8)}50%{opacity:.9;transform:translate(-50%,-50%) scale(1.15)}}
.firefly{--ff-black:#0b0d0e;--ff-charcoal:#15191b;--ff-green:#c7ff00;--ff-mute:#aeb6b4;--ff-line:#30363a;position:relative;overflow:hidden;background:var(--ff-black);color:#fff;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;padding:70px 5% 64px}
.firefly-inner{position:relative;max-width:1296px;margin:auto}
.firefly-lockup{display:flex;align-items:center;gap:18px}
.firefly-lockup .ff-mark{display:block;position:relative;width:86px}
.firefly-lockup b{display:block;font-weight:600;font-size:clamp(46px,5vw,74px);letter-spacing:-.04em;line-height:1}
.firefly-lockup small{display:block;font-size:11px;letter-spacing:.26em;color:var(--ff-mute);margin-top:8px}
.firefly h2{font-family:inherit;font-weight:600;letter-spacing:-.035em;font-size:clamp(34px,4vw,58px);line-height:1.04;max-width:18ch;margin:40px 0 14px}
.firefly h2 em{font-style:normal;color:var(--ff-green)}
.firefly-lede{color:#d9dedb;font-size:17px;max-width:60ch}
.firefly-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:34px}
.firefly-grid article{background:var(--ff-charcoal);border:1px solid var(--ff-line);border-radius:16px;padding:22px;transition:border-color .2s,transform .3s cubic-bezier(.22,1,.36,1)}
.firefly-grid article:hover{border-color:var(--ff-green);transform:translateY(-3px)}
.firefly-grid .k{font-size:11px;letter-spacing:.22em;color:var(--ff-green);font-weight:600}
.firefly-grid p{font-size:15px;color:#d9dedb;line-height:1.55;margin-top:10px}
.firefly-flow{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 0;align-items:center;font-size:13px}
.firefly-flow li{border:1px solid var(--ff-line);border-radius:999px;padding:7px 14px;background:#23282b;animation:ffStep 7s linear infinite}
.firefly-flow li+li{margin-left:22px;position:relative}
.firefly-flow li+li:before{content:"";position:absolute;left:-19px;top:50%;width:16px;height:1px;background:var(--ff-line)}
.firefly-flow li.gate{border-color:var(--ff-green);color:var(--ff-green)}
.firefly-flow li:nth-child(2){animation-delay:1s}.firefly-flow li:nth-child(3){animation-delay:2s}.firefly-flow li:nth-child(4){animation-delay:3s}.firefly-flow li:nth-child(5){animation-delay:4s}.firefly-flow li:nth-child(6){animation-delay:5s}.firefly-flow li:nth-child(7){animation-delay:6s}
@keyframes ffStep{0%,12%{box-shadow:0 0 0 0 #c7ff0000}4%{box-shadow:0 0 18px 2px #c7ff0059;border-color:#c7ff00;color:#c7ff00}}

/* ---------- Tech stack wall ---------- */
.stack-filter{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.stack-filter button{border:1px solid var(--ink);padding:8px 13px;font-size:12px;font-weight:650;background:var(--paper);transition:background .15s,color .15s}
.stack-filter button:hover{background:var(--paper2)}
.stack-filter button[aria-pressed=true]{background:var(--ink);color:var(--paper)}
.stack-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px;list-style:none;margin:0;padding:0}
.stack-wall li[hidden]{display:none}
.stack-tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;height:104px;padding:10px;background:#fff;border:1px solid var(--line);text-align:center;text-decoration:none!important;transition:transform .25s cubic-bezier(.22,1,.36,1),border-color .15s,box-shadow .25s}
.stack-tile img{width:30px;height:30px;object-fit:contain;filter:grayscale(1);opacity:.72;transition:filter .2s,opacity .2s,transform .25s cubic-bezier(.22,1,.36,1)}
.stack-tile span{font-size:12px;font-weight:650;line-height:1.15}
.stack-tile i{position:absolute;top:7px;right:9px;font-style:normal;font-size:13px;opacity:0;transform:translate(-3px,3px);transition:opacity .15s,transform .2s}
.stack-tile:hover,.stack-tile:focus-visible{transform:translateY(-4px);border-color:var(--ink);box-shadow:0 10px 22px #14110c17}
.stack-tile:hover img,.stack-tile:focus-visible img{filter:none;opacity:1;transform:scale(1.12)}
.stack-tile:hover i,.stack-tile:focus-visible i{opacity:1;transform:none;color:var(--red)}
.stack-tile.text b{font:800 22px/1 var(--display);letter-spacing:-.02em;color:var(--mute);transition:color .2s}
.stack-tile.text:hover b{color:var(--red)}
.corpus{margin-top:42px;border-top:1px solid var(--ink);padding-top:20px}
.corpus-head{display:flex;justify-content:space-between;gap:20px;align-items:baseline;flex-wrap:wrap;margin-bottom:12px}
.corpus-head h3{font:800 30px/1 var(--display);letter-spacing:-.03em}
.corpus-head p{font-size:13px;color:var(--mute)}
.corpus-matrix{width:100%;border-collapse:collapse;font-size:13px;min-width:640px}
.corpus-matrix th,.corpus-matrix td{padding:8px 6px;border-bottom:1px solid var(--line);text-align:center}
.corpus-matrix thead th{font:10px/1.3 var(--mono);letter-spacing:.06em;color:var(--mute);border-bottom:1px solid var(--ink)}
.corpus-matrix thead th:first-child{text-align:left}
.corpus-matrix tbody th{text-align:left;font-weight:650;white-space:nowrap}
.corpus-matrix th.grp{font:10px/1.3 var(--mono);letter-spacing:.08em;color:var(--red);text-align:left;padding-top:16px}
.corpus-matrix td i{display:inline-block;width:11px;height:11px;border-radius:50%;background:var(--ink);transform:scale(0);transition:transform .35s cubic-bezier(.22,1,.36,1)}
.corpus-matrix.in td i{transform:scale(1)}
.corpus-matrix tbody tr:hover{background:var(--paper2)}
.corpus-matrix tbody tr:hover td i{background:var(--red)}

/* ---------- Responsive ---------- */
@media(max-width:1000px){
  .unit-duo{grid-template-columns:1fr}
  .unit-proof{grid-template-columns:1fr}
  .unit-proof div+div{border-left:0;padding-left:0;border-top:1px solid var(--line)}
  .firefly-grid{grid-template-columns:1fr}
}
@media(max-width:720px){
  .unit-hero h1{font-size:clamp(58px,17vw,84px)}
  section>.unit-chart{padding:16px}
  .unit-scroll svg{min-width:720px}
  .unit-duo>article{padding:18px}
  .unit-strip{grid-template-columns:1fr 1fr}
  .unit-strip img{height:150px}
  .unit-strip img:first-child{grid-column:span 2;height:200px}
  .firefly{padding:46px 6% 42px}
  .firefly-lockup .ff-mark{width:62px}
  .firefly-flow li+li{margin-left:18px}
  .stack-wall{grid-template-columns:repeat(auto-fill,minmax(92px,1fr))}
  .stack-tile{height:92px}
}
@media(prefers-reduced-motion:reduce){
  .nav-units-menu,.nav-units.open .nav-units-menu{animation:none}
  .ff-mark:before,.firefly-flow li{animation:none}
  .stack-tile,.stack-tile img,.unit-strip img{transition:none}
  .corpus-matrix td i{transform:scale(1);transition:none}
}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Live: what we run ---------- */
.live-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.live-card{display:flex;flex-direction:column;align-items:flex-start;border-top:1px solid var(--ink);padding-top:16px}
.live-media{position:relative;display:block;width:100%;aspect-ratio:4/3;overflow:hidden;background:var(--ink);margin-bottom:16px;padding:0}
.live-media img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05);transition:filter .4s ease,transform .7s cubic-bezier(.22,1,.36,1)}
.live-media .play{color:var(--paper);background:#14110c8c;font-size:16px;transition:background .2s,color .2s,transform .25s cubic-bezier(.22,1,.36,1)}
.live-media:hover img,.live-media:focus-visible img{filter:none;transform:scale(1.04)}
.live-media:hover .play,.live-media:focus-visible .play{background:var(--red);color:#000;border-color:var(--red);transform:scale(1.08)}
.live-card .eyebrow{color:var(--mute);font-size:10px}
.live-card h3{font:800 clamp(24px,2vw,30px)/1 var(--display);letter-spacing:-.03em;margin:10px 0}
.live-card p{font-size:14px;color:var(--mute);margin-bottom:14px}
.live-card .text-link{margin-top:auto}
.unit-video .unit-poster-btn{position:relative;display:block;width:100%;padding:0;background:#000}
.unit-video .unit-poster-btn img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
@media(max-width:1000px){.live-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.live-grid{grid-template-columns:1fr}.live-media{aspect-ratio:16/9}}
@media(prefers-reduced-motion:reduce){.live-media img,.live-media .play{transition:none}}

/* ---------- Live: remix thumbnails (reuses the site's .portrait-remix / .collage-paper styles) ---------- */
.live-media .portrait-remix,.dp-thumb .portrait-remix{position:absolute;inset:0;background:#e8e1d1}
.live-media .portrait-remix>img,.dp-thumb .portrait-remix>img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05);transform:none;transition:clip-path .18s ease,filter .18s ease}
.live-media .play,.dp-thumb .dp-play{z-index:5}
@media(hover:hover) and (pointer:fine){
  .live-media:hover .portrait-remix,.dp-watch:hover .portrait-remix{--collage:1}
  .live-media:hover .portrait-remix>img,.dp-watch:hover .portrait-remix>img{filter:grayscale(1) contrast(1.3);clip-path:var(--torn);transform:none}
}
.live-media:focus-visible .portrait-remix,.dp-tile:focus-visible .portrait-remix{--collage:1}
.live-media:focus-visible .portrait-remix>img,.dp-tile:focus-visible .portrait-remix>img{filter:grayscale(1) contrast(1.3);clip-path:var(--torn);transform:none}
.live-card:nth-child(3n+1) .portrait-remix{--spot:#d8ef16}
.live-card:nth-child(3n+2) .portrait-remix{--spot:#ed452e}
.live-card:nth-child(3n) .portrait-remix,.dp-thumb .portrait-remix{--spot:#e50066}

/* ---------- Live: "Digital + physical" hover player ---------- */
.dp-watch{position:relative;display:inline-block}
.dp-tile{display:grid;grid-template-columns:150px auto;align-items:center;gap:16px;padding:0;margin:0;background:none;border:0;color:inherit;text-align:left;cursor:pointer}
.dp-thumb{position:relative;display:block;width:150px;aspect-ratio:16/9;overflow:hidden;background:var(--ink)}
.dp-thumb .dp-play{position:absolute;left:50%;top:50%;width:36px;height:36px;margin:-18px 0 0 -18px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--paper);color:var(--paper);background:#14110c8c;font-size:12px;transition:background .2s,color .2s,border-color .2s}
.dp-watch:hover .dp-play,.dp-tile:focus-visible .dp-play{background:var(--red);border-color:var(--red);color:#000}
.dp-label small{display:block;font:10px/1.5 var(--mono);letter-spacing:.08em;color:var(--mute)}
.dp-label b{display:block;margin-top:4px;font:800 clamp(20px,1.7vw,24px)/1 var(--display);letter-spacing:-.03em}
.dp-watch:hover .dp-label b{color:var(--red)}
.dp-pop{position:absolute;left:0;bottom:calc(100% + 14px);width:min(560px,86vw);background:var(--ink);border:1px solid var(--ink);box-shadow:0 26px 60px #14110c40;z-index:40}
.dp-pop[hidden]{display:none}
.dp-anchor{position:relative}.dp-anchor .dp-watch{position:static}.dp-anchor .dp-pop{left:0;right:0;width:auto}
.dp-pop:after{content:"";position:absolute;left:0;right:0;top:100%;height:16px}
.dp-pop video{display:block;width:100%;height:auto;aspect-ratio:854/452;background:#000;cursor:pointer}
.dp-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 12px;color:var(--paper);font:10px/1.5 var(--mono);letter-spacing:.08em}
.dp-sound{font:inherit;letter-spacing:inherit;color:var(--paper);background:none;border:1px solid #f4f0e766;padding:4px 10px;cursor:pointer;white-space:nowrap}
.dp-sound:hover,.dp-watch.is-muted .dp-sound{background:var(--red);border-color:var(--red);color:#000}
.dp-watch.is-muted .dp-sound{animation:dp-pulse 1.4s ease-in-out infinite}
@keyframes dp-pulse{50%{opacity:.55}}
@media(max-width:720px){.dp-tile{grid-template-columns:120px auto}.dp-thumb{width:120px}.dp-pop{position:static;width:100%;margin-top:14px;box-shadow:none}.dp-pop:after{display:none}}
@media(prefers-reduced-motion:reduce){.dp-watch.is-muted .dp-sound{animation:none}.dp-thumb .dp-play{transition:none}}
