/* ========== Tokens ========== */
:root{
  --ink:#030303;          /* page black */
  --vault:#060A1C;        /* deep blue-black for alternate bands */
  --gold:#D4AF37;
  --gold-hi:#F1D27A;
  --blue:#0038A8;         /* brand-kit electric blue: fills and glows */
  --blue-text:#7FA2FF;    /* blue for text on black (passes AA) */
  --ivory:#FFFFF0;
  --muted:#C4C9D6;
  --line:rgba(212,175,55,.22);
  --line-soft:rgba(255,255,240,.08);
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --wrap:1180px;
  --gutter:clamp(20px,5vw,48px);
  --radius-lg:22px;
  --radius-sm:10px;
}
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:hidden;scroll-behavior:smooth;scroll-padding-top:84px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--ivory);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block;height:auto}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px;border-radius:6px}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.skip{position:absolute;left:-999px;top:8px;background:var(--gold);color:var(--ink);padding:10px 14px;border-radius:8px;z-index:100}
.skip:focus{left:8px}

h1,h2,h3{font-family:var(--serif);font-weight:600;letter-spacing:-.01em;margin:0;color:var(--ivory)}
h1{font-size:clamp(40px,6.4vw,76px);line-height:1.02}
h2{font-size:clamp(34px,4.6vw,56px);line-height:1.06}
h3{font-size:clamp(26px,2.8vw,34px);line-height:1.12}
p{margin:0}
.lede{font-size:clamp(17px,1.5vw,19px);color:var(--muted);max-width:58ch}
.section{padding:clamp(80px,11vw,140px) 0;position:relative}
.section-head{max-width:720px;margin-bottom:clamp(40px,6vw,64px)}
.section-head .lede{margin-top:18px}

/* ========== Buttons ========== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;font-weight:600;font-size:15px;text-decoration:none;letter-spacing:.01em;transition:background .2s,color .2s,border-color .2s,box-shadow .2s}
.btn-gold{background:var(--gold);color:#0a0700;box-shadow:0 10px 40px -12px rgba(212,175,55,.65)}
.btn-gold:hover{background:var(--gold-hi)}
.btn-line{border:1px solid rgba(255,255,240,.28);color:var(--ivory)}
.btn-line:hover{border-color:var(--gold);color:var(--gold-hi)}

/* ========== The underground touch-light (signature) ========== */
.floor{position:relative;isolation:isolate;overflow-x:clip}
.floor::after{ /* light rising from beneath the section's floor */
  content:"";position:absolute;left:50%;bottom:-1px;transform:translateX(-50%);
  width:min(1100px,120%);height:clamp(160px,26vw,320px);
  background:radial-gradient(50% 100% at 50% 100%,rgba(212,175,55,.34),rgba(212,175,55,.10) 45%,transparent 72%);
  pointer-events:none;z-index:-1}
.floor::before{ /* the floor seam itself */
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(241,210,122,.75) 50%,transparent);z-index:0}

/* ========== Header ========== */
.head{position:sticky;top:0;z-index:50;background:rgba(3,3,3,.86);backdrop-filter:saturate(140%) blur(14px);-webkit-backdrop-filter:saturate(140%) blur(14px);border-bottom:1px solid var(--line-soft);padding-top:env(safe-area-inset-top)}
.head .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:20px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;min-height:44px}
.brand img{width:58px;height:auto}
.brand-name{font-family:var(--serif);font-size:19px;line-height:1.05;font-weight:600}
.brand-name small{display:block;font-family:var(--sans);font-size:11.5px;font-weight:500;letter-spacing:.18em;color:var(--gold);margin-top:3px}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:30px}
.nav a{text-decoration:none;font-size:15px;color:var(--muted);padding:12px 0}
.nav a:hover{color:var(--ivory)}
.head-cta{display:flex;align-items:center;gap:12px}
.head-cta .btn{min-height:44px;padding:0 20px;font-size:14px}
.menu{display:none;width:48px;height:48px;border-radius:12px;border:1.5px solid var(--gold);background:rgba(212,175,55,.14);color:var(--gold-hi);cursor:pointer;box-shadow:0 0 18px -2px rgba(212,175,55,.55),inset 0 0 10px rgba(212,175,55,.12);transition:background .2s,box-shadow .2s}
.menu:hover,.menu[aria-expanded="true"]{background:rgba(212,175,55,.24);box-shadow:0 0 24px 0 rgba(212,175,55,.7),inset 0 0 10px rgba(212,175,55,.18)}
.menu span,.menu span::before,.menu span::after{display:block;width:22px;height:2px;border-radius:2px;background:currentColor;margin:0 auto;position:relative;transition:transform .2s}
.menu span::before,.menu span::after{content:"";position:absolute;left:0}
.menu span::before{top:-6px}.menu span::after{top:6px}
.menu[aria-expanded="true"] span{background:transparent}
.menu[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg)}
.menu[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg)}

/* ========== Hero ========== */
.hero{padding:clamp(56px,8vw,110px) 0 0}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,72px);align-items:center}
.hero-place{font-size:15px;color:var(--gold);margin-bottom:22px}
.hero-kicker{margin:-10px 0 14px;font:600 13px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ivory)}
.hero h1{max-width:15ch}
.hero .lede{margin-top:24px}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.hero-status{display:flex;align-items:center;gap:10px;margin-top:26px;font-size:14px;color:var(--muted)}
.hero-status i{width:8px;height:8px;border-radius:50%;background:#3ddc84;box-shadow:0 0 0 4px rgba(61,220,132,.15)}

.orbit{position:relative;aspect-ratio:1/1;max-width:560px;margin-left:auto;width:100%}
.orbit svg.rings{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.globe{position:absolute;inset:14%;border-radius:50%;
  background:radial-gradient(circle at 34% 28%,#5E86FF 0%,#1A4BD1 18%,#0038A8 36%,#071A55 62%,#02050F 86%);
  box-shadow:inset -30px -40px 80px rgba(0,0,0,.75),0 0 120px -20px rgba(0,56,168,.7)}
.globe::after{content:"";position:absolute;inset:0;border-radius:50%;
  background:repeating-linear-gradient(0deg,transparent 0 22px,rgba(255,255,240,.05) 22px 23px),
             repeating-linear-gradient(90deg,transparent 0 30px,rgba(255,255,240,.035) 30px 31px);
  -webkit-mask:radial-gradient(circle at 40% 40%,#000 40%,transparent 72%);mask:radial-gradient(circle at 40% 40%,#000 40%,transparent 72%)}
.float{position:absolute;background:rgba(6,10,28,.88);border:1px solid rgba(127,162,255,.35);border-radius:14px;padding:16px 18px;box-shadow:0 30px 60px -20px rgba(0,0,0,.8);backdrop-filter:blur(6px)}
.float h4,.float .float-title{margin:0 0 12px;font:600 12.5px/1.2 var(--sans);letter-spacing:.06em;color:var(--gold)}
.float-a{top:12%;right:-2%;width:46%}
.float-a .bar{height:6px;border-radius:4px;background:var(--gold);width:78%;margin-bottom:8px}
.float-a .bar.b{background:rgba(255,255,240,.18);width:92%}
.float-a .tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:12px}
.float-a .tiles span{height:26px;border-radius:5px;background:#12308A}
.float-a .tiles span:nth-child(3){background:#6b5a22}
.float-b{bottom:14%;left:-2%;width:44%}
.float-b .chart{display:flex;align-items:flex-end;gap:7px;height:62px}
.float-b .chart span{flex:1;border-radius:3px 3px 0 0;background:var(--gold)}
.float-b .chart span:nth-child(even){background:#3B6BFF}
.hero-floorlight{position:absolute;left:10%;right:10%;bottom:-6%;height:24%;background:radial-gradient(50% 60% at 50% 60%,rgba(212,175,55,.45),transparent 70%);filter:blur(10px);z-index:-1}

.disciplines{margin-top:clamp(56px,8vw,96px);border-top:1px solid var(--line-soft);padding:22px 0 26px}
.disciplines ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px 34px;font-size:14.5px;color:var(--muted)}
.disciplines li:first-child{color:var(--gold)}

/* ========== Ecosystem ========== */
.eco{background:linear-gradient(180deg,var(--ink),var(--vault) 18%,var(--vault) 82%,var(--ink))}
.pillar{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,4vw,56px);align-items:center;padding:clamp(40px,5vw,56px) 0;border-top:1px solid var(--line-soft)}
.pillar:nth-of-type(even) .pillar-art{order:2}
.pillar-art{position:relative;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line)}
.pillar-art img{width:100%;aspect-ratio:1/1;object-fit:cover}
.pillar-art figcaption{position:absolute;left:14px;bottom:14px;font-size:12.5px;padding:6px 12px;border-radius:999px;background:rgba(3,3,3,.75);color:var(--gold-hi);border:1px solid var(--line)}
.pillar-name{display:flex;align-items:baseline;gap:16px;margin-bottom:10px}
.pillar-name span{font-size:14px;color:var(--gold)}
.pillar > div > .lede{margin-bottom:26px}
.svc{list-style:none;margin:0;padding:0}
.svc li{display:grid;grid-template-columns:1fr auto;gap:4px 20px;padding:18px 0;border-top:1px solid var(--line-soft)}
.svc li:last-child{border-bottom:1px solid var(--line-soft)}
.svc strong{font-weight:600;font-size:17px}
.svc p{grid-column:1;color:var(--muted);font-size:15.5px}
.svc em{grid-row:1/3;grid-column:2;align-self:center;font-style:normal;font-size:14px;color:var(--gold-hi);white-space:nowrap}
.svc li.featured strong::after{content:"Specialty";margin-left:10px;font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:999px;background:rgba(0,56,168,.35);color:var(--blue-text);vertical-align:2px}
/* each pillar keeps its own character */
.pillar.build .pillar-art{box-shadow:0 0 0 1px rgba(127,162,255,.15),0 40px 90px -40px rgba(0,56,168,.8)}
.pillar.tell .pillar-art{box-shadow:0 40px 90px -40px rgba(212,175,55,.55)}
.pillar.tell .pillar-art::before,.pillar.tell .pillar-art::after{content:"";position:absolute;left:0;right:0;height:7%;background:#000;z-index:1}
.pillar.tell .pillar-art::before{top:0}.pillar.tell .pillar-art::after{bottom:0}
.pillar.tell figcaption{bottom:calc(7% + 12px)}
.pillar.grow .pillar-art{box-shadow:0 40px 90px -40px rgba(59,107,255,.55)}

/* ========== Film ========== */
.film .screen{position:relative;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line);background:#000;aspect-ratio:16/9}
.film .screen img,.film .screen video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.film .screen video{display:none}
.film .screen.has-video video{display:block}
.film .screen.has-video .poster-ui{display:none}
.poster-ui{position:absolute;inset:0;display:flex;align-items:flex-end;padding:clamp(16px,3vw,32px);background:linear-gradient(0deg,rgba(0,0,0,.8),transparent 55%)}
.poster-ui p{font-size:14px;color:var(--ivory);max-width:44ch}
.chapters{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:18px;list-style:none;padding:0}
.chapters li{border-top:2px solid rgba(255,255,240,.14);padding-top:12px;font-size:14px;color:var(--muted)}
.chapters li b{display:block;color:var(--ivory);font-weight:600;margin-bottom:2px}
.chapters li:nth-child(1){border-color:var(--gold)}
.chapters span{font-variant-numeric:tabular-nums}

/* ========== Case studies ========== */
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:30px}
.tabs button{min-height:46px;padding:0 20px;border-radius:999px;border:1px solid var(--line-soft);background:transparent;color:var(--muted);font:500 15px var(--sans);cursor:pointer}
.tabs button[aria-selected="true"]{background:var(--ivory);color:var(--ink);border-color:var(--ivory)}
.case{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(28px,4vw,60px);align-items:start}
.case[hidden]{display:none}
.case-tag{display:inline-block;font-size:12.5px;padding:5px 12px;border-radius:999px;border:1px solid var(--line);color:var(--gold-hi);margin-bottom:18px}
.case h3{margin-bottom:22px}
.story{display:grid;gap:18px;margin:0}
.story div{border-left:2px solid var(--line);padding-left:18px}
.story dt{font-size:14px;color:var(--gold);margin-bottom:4px}
.story dd{margin:0;color:var(--muted);font-size:16px}
.case-cta{margin-top:30px}
.case-visual{border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line);background:#050814}
.case-visual img{width:100%}

/* live AI workflow mockup */
.flow{padding:clamp(18px,3vw,30px)}
.flow-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;font-size:14px;color:var(--muted)}
.flow-top b{color:var(--ivory);font-weight:600}
.live{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:#3ddc84}
.live::before{content:"";width:8px;height:8px;border-radius:50%;background:#3ddc84}
.steps{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.steps li{display:grid;grid-template-columns:36px 1fr auto;gap:14px;align-items:center;padding:14px 16px;border-radius:12px;background:rgba(255,255,240,.03);border:1px solid var(--line-soft)}
.steps li .n{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--gold);color:var(--gold);font-size:14px;font-weight:600}
.steps li b{display:block;font-weight:600;font-size:15.5px}
.steps li small{color:var(--muted);font-size:13.5px}
.steps li time{font-size:13.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.steps li.done .n{background:var(--gold);color:#0a0700}
.flow-total{margin-top:18px;display:flex;justify-content:space-between;align-items:baseline;padding-top:18px;border-top:1px solid var(--line-soft)}
.flow-total span{color:var(--muted);font-size:14px}
.flow-total strong{font-family:var(--serif);font-size:34px;font-weight:600;color:var(--gold-hi)}

/* ========== Process ========== */
.process ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:18px;counter-reset:s}
.process li{counter-increment:s;position:relative;padding-top:56px}
.process li::before{content:counter(s,decimal-leading-zero);position:absolute;top:0;left:0;font-family:var(--serif);font-size:30px;color:var(--gold)}
.process li::after{content:"";position:absolute;top:22px;left:52px;right:-9px;height:1px;background:var(--line)}
.process li:last-child::after{display:none}
.process b{display:block;font-size:17px;margin-bottom:6px}
.process p{color:var(--muted);font-size:15.5px}

/* ========== About ========== */
.about{background:var(--vault)}
.about-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(32px,5vw,72px);align-items:center}
.portrait{position:relative;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line);background:#000;aspect-ratio:4/5}
.portrait img{width:100%;height:100%;object-fit:cover}
.portrait.is-logo img{object-fit:contain;padding:12%}
.roles{list-style:none;margin:26px 0 30px;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.roles li{font-size:14.5px;padding:8px 14px;border-radius:999px;border:1px solid var(--line-soft);color:var(--muted)}
.roles li:first-child{border-color:var(--gold);color:var(--gold-hi)}
.about p + p{margin-top:16px}

/* ========== Pricing ========== */
.price-table{border-top:1px solid var(--line)}
.price-row{display:grid;grid-template-columns:1.1fr 1.6fr 7.5em;gap:20px;align-items:center;padding:24px 0;border-bottom:1px solid var(--line-soft)}
.price-row b{font-family:var(--serif);font-size:26px;font-weight:600}
.price-row p{color:var(--muted);font-size:15.5px}
.price-row strong{font-size:19px;color:var(--gold-hi);font-weight:600;white-space:nowrap;text-align:right}
.price-note{margin-top:22px;color:var(--muted);font-size:15px}

/* ========== Final CTA ========== */
.final{text-align:center;padding-bottom:clamp(110px,14vw,170px)}
.final h2{font-size:clamp(40px,6vw,72px)}
.final .lede{margin:20px auto 0}
.final .hero-actions{justify-content:center}
.channels{list-style:none;padding:0;margin:40px 0 0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 26px;font-size:15px}
.channels a{color:var(--muted);text-decoration:none;display:inline-block;padding:10px 0}
.channels a:hover{color:var(--gold-hi)}

/* ========== Footer ========== */
.foot{border-top:1px solid var(--line-soft);padding:36px 0 calc(36px + env(safe-area-inset-bottom))}
.foot .wrap{font-size:14px;color:var(--muted)}

/* ========== Mobile sticky bar ========== */
.mbar{display:none}

/* ========== Motion (one orchestrated moment + orbit drift) ========== */
@media (prefers-reduced-motion:no-preference){
  .hero .floor::after,.hero-floorlight{animation:rise 1.8s cubic-bezier(.2,.7,.2,1) both}
  .hero-copy > *{animation:enter .9s cubic-bezier(.2,.7,.2,1) both}
  .hero-copy > :nth-child(2){animation-delay:.08s}
  .hero-copy > :nth-child(3){animation-delay:.16s}
  .hero-copy > :nth-child(4){animation-delay:.24s}
  .rings .spin{transform-origin:50% 50%;animation:spin 60s linear infinite}
  .float-a{animation:hover 7s ease-in-out infinite}
  .float-b{animation:hover 8s ease-in-out -3s infinite}
  @keyframes rise{from{opacity:0;transform:translate(-50%,40px)}to{opacity:1;transform:translate(-50%,0)}}
  @keyframes enter{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
  @keyframes spin{to{transform:rotate(360deg)}}
  @keyframes hover{50%{transform:translateY(-8px)}}
  .hero-floorlight{animation-name:fade}
  @keyframes fade{from{opacity:0}to{opacity:1}}
}

/* ========== Responsive ========== */
@media (max-width:1040px){
  .nav ul{gap:22px}
  .process ol{grid-template-columns:repeat(3,1fr);row-gap:40px}
  .process li:nth-child(3)::after{display:none}
}
@media (max-width:880px){
  .menu{display:inline-block}
  .head-cta .btn{display:none}
  .nav{position:fixed;inset:72px 0 auto 0;background:rgba(3,3,3,.97);border-bottom:1px solid var(--line);padding:8px var(--gutter) 24px;display:none}
  .nav.open{display:block}
  .nav ul{flex-direction:column;gap:0}
  .nav a{display:block;padding:16px 0;font-size:18px;color:var(--ivory);border-bottom:1px solid var(--line-soft)}
  .hero-grid,.pillar,.case,.about-grid{grid-template-columns:1fr}
  .orbit{max-width:440px;margin:8px auto 0}
  .pillar:nth-of-type(even) .pillar-art{order:0}
  .pillar-art{max-width:520px}
  .case-visual{order:-1}
  .chapters{grid-template-columns:repeat(3,1fr);row-gap:18px}
  .portrait{max-width:420px}
  .price-row{grid-template-columns:1fr auto;gap:6px 16px}
  .price-row p{grid-column:1/-1;grid-row:2}
}
@media (max-width:600px){
  body{font-size:16px;padding-bottom:calc(76px + env(safe-area-inset-bottom))}
  .brand img{width:48px}
  .brand-name{font-size:17px}
  .brand-name small{font-size:11px;letter-spacing:.12em}
  .hero-actions .btn{flex:1 1 100%}
  .float h4,.float .float-title{font-size:11px;margin-bottom:8px}
  .float{padding:12px}
  .float-a{width:52%;right:0}
  .float-b{width:50%;left:0}
  .float-b .chart{height:44px}
  .process ol{grid-template-columns:1fr;row-gap:28px}
  .process li{padding:0 0 0 58px}
  .process li::before{top:-4px}
  .process li::after{display:none}
  .chapters{grid-template-columns:repeat(2,1fr)}
  .steps li{grid-template-columns:32px 1fr;padding:12px}
  .steps li .n{width:32px;height:32px}
  .steps li time{grid-column:2}
  .svc li{grid-template-columns:1fr}
  .svc em{grid-row:auto;grid-column:1}
  .poster-ui{display:none}
  .mbar{display:flex;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:60;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:rgba(3,3,3,.94);border-top:1px solid var(--line);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
  .mbar .btn{flex:1;min-height:48px}
}

/* ========== Shared additions for inner pages ========== */
.nav a[aria-current="page"]{color:var(--ivory);box-shadow:inset 0 -2px 0 var(--gold)}
.page-hero{padding:clamp(56px,8vw,104px) 0 clamp(56px,7vw,88px)}
.page-hero h1{font-size:clamp(42px,5.8vw,70px);max-width:16ch}
.page-hero .lede{margin-top:22px}
.page-hero .hero-actions{margin-top:30px}
.jump{display:flex;flex-wrap:wrap;gap:8px;margin-top:34px}
.jump a,.filters button{display:inline-flex;align-items:center;min-height:46px;padding:0 20px;border-radius:999px;border:1px solid var(--line-soft);color:var(--muted);text-decoration:none;font:500 15px var(--sans);background:transparent;cursor:pointer}
.jump a:hover{border-color:var(--gold);color:var(--gold-hi)}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.filters button[aria-pressed="true"]{background:var(--ivory);color:var(--ink);border-color:var(--ivory)}
.more{margin-top:40px}

/* Pillar group header on services/portfolio */
.group-head{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;padding-top:clamp(40px,6vw,72px)}
.group-head h2{font-size:clamp(38px,5vw,60px)}
.group-head span{color:var(--gold);font-size:15px}

/* Detailed service / work rows */
.row{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(28px,4.5vw,64px);align-items:center;padding:clamp(44px,6vw,72px) 0;border-top:1px solid var(--line-soft)}
.row.flip .row-visual{order:2}
.row[hidden]{display:none}
.row h3{font-size:clamp(28px,3.2vw,40px);margin-bottom:14px}
.row .lede{margin-bottom:24px}
.row-visual{margin:0;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line);background:#050814;position:relative}
.row-visual > img{width:100%;aspect-ratio:1/1;object-fit:cover}
.row-visual.wide > img{aspect-ratio:16/10}
.row-visual.cine::before,.row-visual.cine::after{content:"";position:absolute;left:0;right:0;height:9%;background:#000;z-index:1}
.row-visual.cine::before{top:0}.row-visual.cine::after{bottom:0}
.row-visual figcaption{position:absolute;left:14px;top:14px;z-index:2;font-size:12.5px;padding:6px 12px;border-radius:999px;background:rgba(3,3,3,.78);color:var(--gold-hi);border:1px solid var(--line)}
.row-visual.cine figcaption{top:calc(9% + 12px)}
.gets{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:10px}
.gets li{position:relative;padding-left:28px;color:var(--ivory);font-size:16px}
.gets li::before{content:"";position:absolute;left:2px;top:8px;width:12px;height:7px;border-left:2px solid var(--gold);border-bottom:2px solid var(--gold);transform:rotate(-45deg)}
.meta{display:flex;flex-wrap:wrap;gap:10px 28px;margin-bottom:26px;font-size:15px;color:var(--muted)}
.meta b{color:var(--gold-hi);font-weight:600}
.row .story{margin-bottom:28px}

/* ========== Code mockups ========== */
.mock{padding:clamp(18px,3vw,30px)}
.mock-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;font-size:14px;color:var(--muted)}
.mock-top b{color:var(--ivory);font-weight:600}
.concept-note{font-size:12px;color:var(--muted);margin-top:16px}

/* motion storyboard */
.frames{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.frame{aspect-ratio:1/1;border-radius:10px;background:#02040c;border:1px solid var(--line-soft);display:grid;place-items:center;position:relative;overflow:hidden}
.frame .dot{width:10px;height:10px;border-radius:50%;background:var(--gold-hi);box-shadow:0 0 24px 6px rgba(212,175,55,.6)}
.frame .ring{width:56%;aspect-ratio:1;border-radius:50%;border:2px solid var(--gold);box-shadow:0 0 30px -4px rgba(212,175,55,.6)}
.frame .glyph{font-family:var(--serif);font-size:clamp(28px,4vw,44px);color:var(--gold-hi);font-weight:600}
.frame .word{font:600 clamp(10px,1.1vw,12px) var(--sans);letter-spacing:.18em;color:var(--ivory)}
.frame-caps{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:10px;font-size:12.5px;color:var(--muted)}
.track{position:relative;height:36px;margin-top:22px;border-radius:8px;background:rgba(255,255,240,.04);border:1px solid var(--line-soft)}
.track i{position:absolute;top:50%;width:10px;height:10px;background:var(--gold);transform:translate(-50%,-50%) rotate(45deg)}
.track .head{position:absolute;top:-6px;bottom:-6px;width:2px;background:var(--blue-text);left:62%}

/* copy before/after */
.copy-card{border-radius:12px;padding:18px 20px;border:1px solid var(--line-soft);background:rgba(255,255,240,.02)}
.copy-card + .copy-card{margin-top:12px;border-color:var(--line)}
.copy-card small{display:block;font-size:13px;color:var(--gold);margin-bottom:8px}
.copy-card p{font-family:var(--serif);font-size:clamp(20px,2.2vw,26px);line-height:1.25}
.copy-card del{color:var(--muted);text-decoration-color:var(--gold);text-decoration-thickness:2px}
.notes{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.notes li{font-size:13px;padding:5px 11px;border-radius:999px;background:rgba(0,56,168,.3);color:var(--blue-text)}

/* multilingual */
.langs{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.langs li{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:center;padding:12px 14px;border-radius:10px;border:1px solid var(--line-soft)}
.langs li:first-child{border-color:var(--line)}
.langs abbr{text-decoration:none;font-size:12.5px;font-weight:600;color:var(--gold);text-align:center;border:1px solid var(--line);border-radius:6px;padding:4px 0}
.langs span{font-family:var(--serif);font-size:clamp(19px,2vw,23px)}
.langs [dir="rtl"]{text-align:right;font-family:"Noto Naskh Arabic","Geeza Pro","Segoe UI",serif}

/* order book */
.book-price{display:flex;align-items:baseline;gap:14px;margin-bottom:16px}
.book-price strong{font-family:var(--serif);font-size:clamp(30px,3.4vw,40px);font-weight:600}
.book-price span{color:#3ddc84;font-size:14px}
.book{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}
.book th{text-align:left;font-weight:500;color:var(--muted);font-size:12.5px;padding:0 0 8px}
.book th:last-child,.book td:last-child{text-align:right}
.book td{padding:7px 0;position:relative}
.book tr.ask td:first-child{color:#ff7b8a}
.book tr.bid td:first-child{color:#3ddc84}
.book tr td:last-child{background:linear-gradient(270deg,var(--depth-color) var(--depth),transparent var(--depth))}
.book tr.ask{--depth-color:rgba(255,123,138,.14)}
.book tr.bid{--depth-color:rgba(61,220,132,.14)}
.book .mid td{padding:10px 0;color:var(--ivory);font-weight:600;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}
.trade{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.trade span{min-height:44px;border-radius:10px;display:grid;place-items:center;font-weight:600;font-size:15px}
.trade .buy{background:#1f8f55}
.trade .sell{background:rgba(255,123,138,.16);color:#ff9aa6;border:1px solid rgba(255,123,138,.35)}

/* ========== About ========== */
.about-hero .portrait{max-width:480px}
.principles{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,36px)}
.principles article{border-top:1px solid var(--gold);padding-top:22px}
.principles h3{font-size:26px;margin-bottom:10px}
.principles p{color:var(--muted);font-size:16px}
.role-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.role-list li{display:grid;grid-template-columns:.8fr 1.2fr;gap:20px;padding:24px 0;border-bottom:1px solid var(--line-soft)}
.role-list b{font-family:var(--serif);font-size:26px;font-weight:600}
.role-list li:first-child b{color:var(--gold-hi)}
.role-list p{color:var(--muted)}

/* ========== Contact ========== */
.contact-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(32px,5vw,72px);align-items:start}
.form{display:grid;gap:18px}
.field{display:grid;gap:8px}
.field label{font-size:15px;font-weight:500}
.field .hint{font-size:13.5px;color:var(--muted)}
.field input,.field select,.field textarea{width:100%;min-height:52px;padding:14px 16px;border-radius:12px;border:1px solid rgba(255,255,240,.18);background:#07091a;color:var(--ivory);font:400 16px var(--sans)}
.field textarea{min-height:150px;resize:vertical;line-height:1.5}
.field select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),linear-gradient(135deg,var(--gold) 50%,transparent 50%);background-position:calc(100% - 22px) 23px,calc(100% - 16px) 23px;background-size:6px 6px;background-repeat:no-repeat;padding-right:44px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(212,175,55,.2)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form-error{color:#ffb4bd;font-size:14.5px;min-height:1em}
.field-err{color:#ffb4bd;font-size:13.5px;min-height:0}
.field-err:empty{display:none}
.field [aria-invalid="true"]{border-color:#ff8a98}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-status{padding:14px 16px;border-radius:12px;font-size:15px;line-height:1.5}
.form-status a{color:inherit;text-decoration:underline}
.form-status.ok{background:rgba(212,175,55,.12);border:1px solid rgba(212,175,55,.55);color:var(--ivory)}
.form-status.bad{background:rgba(255,120,140,.1);border:1px solid rgba(255,138,152,.6);color:#ffd9de}
.form-actions .btn[disabled]{opacity:.6;cursor:wait}
.form-actions{display:flex;flex-wrap:wrap;gap:12px}
.form-actions .btn{border:0;cursor:pointer;font-family:var(--sans)}
.form-actions .btn-line{border:1px solid rgba(255,255,240,.28);background:transparent}
.direct{display:grid;gap:12px}
.direct a{display:grid;gap:2px;padding:20px 22px;border-radius:16px;border:1px solid var(--line-soft);text-decoration:none;background:rgba(255,255,240,.02)}
.direct a:hover{border-color:var(--gold)}
.direct a b{font-size:16px}
.direct a span{color:var(--muted);font-size:15px;word-break:break-word}
.direct a:first-child{border-color:var(--line);background:rgba(212,175,55,.06)}
.next{list-style:none;padding:0;margin:34px 0 0;counter-reset:n;display:grid;gap:16px}
.next li{counter-increment:n;display:grid;grid-template-columns:40px 1fr;gap:12px;color:var(--muted);font-size:15.5px}
.next li::before{content:counter(n);width:32px;height:32px;border-radius:50%;border:1px solid var(--gold);color:var(--gold);display:grid;place-items:center;font-size:14px;font-weight:600}
.next b{color:var(--ivory);display:block;font-weight:600}

/* ========== Store ========== */
.products{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,28px)}
.product{display:flex;flex-direction:column;border-radius:var(--radius-lg);border:1px solid var(--line-soft);background:rgba(255,255,240,.02);overflow:hidden}
.product[hidden]{display:none}
.cover{position:relative;aspect-ratio:4/3;padding:22px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.cover::after{content:"";position:absolute;left:50%;bottom:-40%;width:120%;height:70%;transform:translateX(-50%);background:radial-gradient(50% 50% at 50% 50%,rgba(212,175,55,.35),transparent 70%)}
.cover .kind{font-size:12.5px;color:var(--gold-hi);position:relative;z-index:1}
.cover .title{font-family:var(--serif);font-size:clamp(24px,2.3vw,30px);line-height:1.08;font-weight:600;position:relative;z-index:1;max-width:14ch}
.cover.c-tpl{background:linear-gradient(160deg,#0a1336,#030303 70%)}
.cover.c-brand{background:linear-gradient(160deg,#2a2206,#030303 70%)}
.cover.c-seo{background:linear-gradient(160deg,#061a3a,#030303 65%)}
.cover.c-ai{background:linear-gradient(160deg,#08123a,#02040c 60%)}
.cover.c-ads{background:linear-gradient(160deg,#1c1a08,#030303 60%)}
.cover.c-social{background:linear-gradient(160deg,#0b0f2a,#030303 60%)}
.badge{position:absolute;top:18px;right:18px;z-index:2;font-size:12px;font-weight:600;padding:5px 11px;border-radius:999px;background:var(--gold);color:#0a0700}
.badge.new{background:var(--blue);color:#fff}
.product-body{padding:22px;display:flex;flex-direction:column;gap:12px;flex:1}
.product-body h3{font-family:var(--sans);font-size:17px;font-weight:600;line-height:1.35}
.product-body p{color:var(--muted);font-size:15px}
.price{display:flex;align-items:baseline;gap:10px;margin-top:auto;padding-top:8px}
.price strong{font-size:24px;font-weight:600;color:var(--gold-hi)}
.price s{color:var(--muted);font-size:15px}
.product .btn{width:100%;margin-top:6px}
.bundle{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,4vw,56px);align-items:center;margin-top:clamp(48px,7vw,80px);padding:clamp(26px,4vw,48px);border-radius:28px;border:1px solid var(--line);background:linear-gradient(135deg,rgba(212,175,55,.10),rgba(0,56,168,.12))}
.bundle h2{font-size:clamp(34px,4vw,50px)}
.bundle .price strong{font-size:40px}
.bundle ul{margin:0}
.store-note{margin-top:28px;color:var(--muted);font-size:15px}

/* ========== Footer (multi-page) ========== */
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px;padding-bottom:30px}
.foot h4,.foot .foot-title{margin:0 0 12px;font:600 14px/1.6 var(--sans);letter-spacing:normal;color:var(--gold)}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.foot ul a{text-decoration:none;color:var(--muted);display:inline-block;padding:6px 0}
.foot ul a:hover{color:var(--ivory)}
.foot .brand{margin-bottom:12px}
.foot-base{border-top:1px solid var(--line-soft);padding-top:24px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

@media (max-width:1040px){
  .products{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:880px){
  .row,.contact-grid,.bundle{grid-template-columns:1fr}
  .row .row-visual,.row.flip .row-visual{order:-1}
  .row-visual{max-width:560px}
  .principles{grid-template-columns:1fr}
  .role-list li{grid-template-columns:1fr;gap:6px}
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-grid > div:first-child{grid-column:1/-1}
}
@media (max-width:600px){
  .products{grid-template-columns:1fr}
  .two{grid-template-columns:1fr}
  .form-actions .btn{flex:1 1 100%}
  .frame-caps{font-size:11.5px}
  .frames,.frame-caps{gap:6px}
}

@media (max-width:600px){.mbar .btn{padding:0 12px;white-space:nowrap;font-size:14.5px}}

/* Founder portrait: arch frame (from the live About page) */
.portrait.arch{border-radius:50% 50% var(--radius-lg) var(--radius-lg) / 30% 30% var(--radius-lg) var(--radius-lg);border-color:rgba(212,175,55,.55);box-shadow:0 50px 100px -50px rgba(212,175,55,.45)}
.portrait.full{aspect-ratio:768/1378;max-width:420px}
.portrait-badge{position:absolute;left:14px;bottom:14px;padding:14px 18px;border-radius:16px;background:rgba(6,10,28,.9);border:1px solid rgba(127,162,255,.35);font-size:14.5px;color:var(--muted);backdrop-filter:blur(6px)}
.portrait-badge b{display:block;font-family:var(--serif);font-size:34px;line-height:1;color:var(--gold-hi);font-weight:600;margin-bottom:4px}
@media (max-width:880px){.portrait.full{max-width:360px;margin:0 auto}.about-grid .portrait{margin-left:auto;margin-right:auto}}

/* Mobile menu anchored to the sticky header (clears iPhone notch) */
@media (max-width:880px){
  .nav{position:absolute;inset:100% 0 auto 0;background:#030303!important;max-height:calc(100dvh - 72px - env(safe-area-inset-top));overflow-y:auto}
}
[role="tabpanel"]:focus-visible{outline:2px solid var(--gold-hi);outline-offset:8px;border-radius:12px}

/* Signature: rounding shining border + torch sweep */
.row-visual,.case-visual,.pillar-art,.film .screen,.portrait{
  box-shadow:0 0 0 2px rgba(212,175,55,.55),0 0 25px -2px rgba(212,175,55,.35),inset 0 0 15px rgba(0,56,168,.45)}
.pillar-art,.case-visual{position:relative}
.sweep{position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;
  background:linear-gradient(105deg,transparent 42%,rgba(241,210,122,.16) 50%,transparent 58%) no-repeat;background-size:250% 100%;background-position:150% 0;opacity:0}
@media (prefers-reduced-motion:no-preference){
  .sweep{opacity:1;animation:torch 5s ease-in-out infinite}
  @keyframes torch{0%{background-position:150% 0}60%,100%{background-position:-50% 0}}
}

/* ========== Fix: concept labels sit below the picture, never on top of it ========== */
.pillar-art figcaption,
.row-visual figcaption,
.row-visual.cine figcaption{
  position:static;display:inline-block;
  margin:12px 14px 14px;line-height:18px;
  top:auto;left:auto;bottom:auto}
.pillar.tell figcaption{bottom:auto}
/* keep the cinema bars on the picture itself, not the caption */
.row-visual.cine::before,.row-visual.cine::after{height:auto;aspect-ratio:160/9}
.row-visual.cine::after{bottom:auto;top:calc(100% - 58px);transform:translateY(-100%)}
.pillar.tell .pillar-art::before,.pillar.tell .pillar-art::after{height:auto;aspect-ratio:100/7}
.pillar.tell .pillar-art::after{bottom:auto;top:calc(100% - 58px);transform:translateY(-100%)}

/* ==========================================================
   Restoration block — 27 Sep 2026
   Adds styles the current pages reference but never had
   (.hero-photo, .facts), and brings back the 21 Sep homepage
   visuals. Nothing above this line was changed.
   ========================================================== */

/* ---- Hero: cinematic underground torch-light scene ---- */
.hero{position:relative;overflow:hidden}
.hero > .cave{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.hero > .floor{position:relative;z-index:1}
.cv-rock{fill:#02040b}
.cv-rock.far{fill:#050b1f;opacity:.9}
.cv-rock.near{fill:#010208}
.cv-hidden{opacity:.95}
.cv-light{mix-blend-mode:screen}
.cv-body{fill:#010307}
.cv-limb path{fill:none;stroke:#010307;stroke-width:10;stroke-linecap:round;stroke-linejoin:round}
.cv-limb.back path{stroke:#02050d}
.cv-torch{fill:#1b1b1f;stroke:var(--gold);stroke-width:1}
.cv-rim{fill:none;stroke:var(--gold-hi);stroke-opacity:.85;stroke-width:1.6;stroke-linecap:round}

/* ---- Hero: photo in the arched gold portal, globe behind it ---- */
.orbit .rings{z-index:0}
.orbit .globe{inset:12% 2% 20% 2%;z-index:1;opacity:.92}
.hero-photo{position:absolute;z-index:2;top:5%;bottom:3%;left:19%;width:62%;height:92%;
  object-fit:cover;object-position:50% 16%;border-radius:999px 999px 26px 26px;background:#050505;
  box-shadow:0 0 0 1px rgba(212,175,55,.55),0 40px 90px -30px rgba(0,0,0,.95),0 0 80px -20px rgba(0,56,168,.6)}
.orbit .float{z-index:3}
.orbit .float-a{top:3%;right:-5%;width:40%}
.orbit .float-b{bottom:7%;left:-5%;width:40%}
@media (prefers-reduced-motion:no-preference){
  .hero-photo{animation:portal-breathe 6.5s ease-in-out infinite}
  @keyframes portal-breathe{
    0%,100%{box-shadow:0 0 0 1px rgba(212,175,55,.55),0 40px 90px -30px rgba(0,0,0,.95),0 0 80px -20px rgba(0,56,168,.6)}
    50%{box-shadow:0 0 0 1px rgba(212,175,55,.95),0 40px 90px -30px rgba(0,0,0,.95),0 0 110px -14px rgba(212,175,55,.45)}}
}
@media (max-width:600px){
  .orbit .float{padding:10px 11px}
  .orbit .float-a{top:0;right:-3%;width:43%}
  .orbit .float-b{bottom:4%;left:-3%;width:43%}
  .orbit .float-a .tiles span{height:18px}
  .orbit .float-b .chart{height:36px}
}

/* ---- Live displays on the service images ---- */
.pillar-art .rs-card{position:absolute;z-index:2;border-radius:14px;border:1px solid rgba(212,175,55,.35);
  background:rgba(5,7,16,.9);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  box-shadow:0 24px 50px -20px rgba(0,0,0,.85);color:var(--ivory)}
.pillar-art .rs-card small{display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-hi);margin-bottom:8px}

.rs-code{top:14px;right:14px;width:min(80%,360px);overflow:hidden}
.cw-bar{display:flex;align-items:center;gap:6px;padding:9px 12px;border-bottom:1px solid var(--line-soft)}
.cw-bar i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,240,.16)}
.cw-bar i:first-child{background:var(--gold)}
.cw-bar span{margin-left:8px;font-size:11.5px;color:var(--muted)}
.cw-code{padding:12px 14px;font:12px/1.75 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:rgba(255,255,240,.72)}
.cw-code p{margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cw-code b{color:var(--gold);font-weight:500}
.cw-code em{color:var(--blue-text);font-style:normal}
.cw-code .rs-ok{color:#3ddc84;margin-top:4px}
.cw-code .rs-caret{display:inline-block;width:7px;height:13px;margin-left:4px;vertical-align:-2px;background:var(--gold)}

.rs-langs{right:14px;bottom:58px;width:min(70%,290px);padding:12px 14px}
.rs-langs ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.rs-langs li{display:flex;align-items:center;gap:10px;font-size:13px;padding:5px 8px;border-radius:8px;color:var(--muted)}
.rs-langs abbr{flex:none;width:26px;font-size:11px;font-weight:600;text-decoration:none;color:var(--gold)}
.rs-langs li:first-child{background:rgba(0,56,168,.35);color:var(--ivory)}

.rs-copy{right:14px;top:14px;width:min(52%,230px);padding:11px 13px}
.rs-copy p{margin:0;font-size:13px;line-height:1.4}
.rs-copy .rs-was{color:var(--muted);text-decoration:line-through;text-decoration-color:rgba(212,175,55,.7)}
.rs-copy .rs-now{margin-top:6px;color:var(--ivory);font-weight:500}

@media (prefers-reduced-motion:no-preference){
  /* code types in line by line, then holds */
  .cw-code p{animation-duration:10s;animation-timing-function:steps(1,end);animation-iteration-count:infinite;animation-fill-mode:both}
  .cw-code p:nth-child(1){animation-name:cw-l1}
  .cw-code p:nth-child(2){animation-name:cw-l2}
  .cw-code p:nth-child(3){animation-name:cw-l3}
  .cw-code p:nth-child(4){animation-name:cw-l4}
  .cw-code p:nth-child(5){animation-name:cw-l5}
  @keyframes cw-l1{0%{opacity:.15}3%,100%{opacity:1}}
  @keyframes cw-l2{0%,3%{opacity:.15}6%,100%{opacity:1}}
  @keyframes cw-l3{0%,6%{opacity:.15}9%,100%{opacity:1}}
  @keyframes cw-l4{0%,9%{opacity:.15}12%,100%{opacity:1}}
  @keyframes cw-l5{0%,12%{opacity:.15}15%,100%{opacity:1}}
  .cw-code .rs-caret{animation:cw-blink 1s steps(1,end) infinite}
  @keyframes cw-blink{50%{opacity:0}}
  /* the highlighted language moves down the list */
  .rs-langs li{animation:lang-hl 10s infinite}
  .rs-langs li:first-child{background:transparent;color:var(--muted)}
  .rs-langs li:nth-child(2){animation-delay:2s}
  .rs-langs li:nth-child(3){animation-delay:4s}
  .rs-langs li:nth-child(4){animation-delay:6s}
  .rs-langs li:nth-child(5){animation-delay:8s}
  @keyframes lang-hl{0%,18%{background:rgba(0,56,168,.4);color:#FFFFFF}20%,100%{background:transparent;color:var(--muted)}}
}
@media (max-width:600px){
  .rs-code{width:calc(100% - 28px)}
  .cw-code{font-size:11px;padding:10px 12px}
  .rs-copy{display:none}
  .rs-langs{left:auto;right:10px;bottom:52px;width:min(78%,250px);padding:9px 10px}
  .rs-langs ul{gap:0}
  .rs-langs li{font-size:11.5px;padding:2px 6px;gap:8px}
  .pillar-art .rs-card small{font-size:10px;margin-bottom:5px}
}

/* ---- "Studio at a glance" facts (used on 4 pages, never styled) ---- */
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;margin:30px 0 0;padding:0}
.facts > div{display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:4px;padding:16px 0;border-top:1px solid var(--line)}
.facts dt{font-size:14px;color:var(--muted);line-height:1.35}
.facts dd{margin:0;font-family:var(--serif);font-size:clamp(30px,3.4vw,40px);font-weight:600;line-height:1;color:var(--gold-hi)}
.facts--row{margin-top:40px}
@media (min-width:881px){.facts--row{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* facts that are words, not numbers */
.facts .facts-word dd{font-size:clamp(20px,2.1vw,25px);line-height:1.15}

/* vertical (9:16) showreel */
.film .film-grid{display:grid;grid-template-columns:minmax(260px,400px) 1fr;gap:clamp(24px,5vw,64px);align-items:center}
.film .film-grid .screen{aspect-ratio:9/16;width:100%}
.film .film-grid .chapters{grid-template-columns:1fr;margin-top:0;row-gap:16px}
@media (max-width:880px){
  .film .film-grid{grid-template-columns:1fr}
  .film .film-grid .screen{max-width:400px;margin:0 auto}
  .film .film-grid .chapters{grid-template-columns:repeat(2,1fr);margin-top:8px}
}

/* Services: AI films + before/after gallery */
.mw{margin:8px 0 72px}
.mw-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 24px;margin:40px 0 18px}
.mw-head h3{font-family:var(--serif);font-size:clamp(24px,2.6vw,32px);color:var(--ivory);margin:0}
.mw-head p{color:var(--muted);font-size:15px;max-width:52ch;margin:0}
.mw-films{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.mw-film{margin:0}
.mw-film video{display:block;width:100%;aspect-ratio:9/16;height:auto;object-fit:cover;background:#000;border-radius:14px;border:1px solid rgba(212,175,55,.45)}
.mw-film figcaption{padding:10px 2px 0;font-size:14px;color:var(--muted);line-height:1.35}
.mw-film figcaption b{display:block;color:var(--ivory);font-weight:600}
.mw-pairs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.mw-pair{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:14px;border:1px solid rgba(212,175,55,.35);background:#000}
.mw-side{position:relative;overflow:hidden;border-radius:10px;aspect-ratio:4/5}
.mw-side img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.mw-side span{position:absolute;left:8px;bottom:8px;font-size:12px;font-weight:600;letter-spacing:.04em;padding:4px 9px;border-radius:999px;background:rgba(0,0,0,.72);color:#fff}
.mw-side span.gold{background:var(--gold);color:#050505}
@media (max-width:1040px){.mw-films{grid-template-columns:repeat(3,minmax(0,1fr))}.mw-pairs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.mw-films{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.mw-pairs{grid-template-columns:1fr}}

/* ==========================================================
   Readability boost — 29 Sep 2026
   Bolder headings, labels and prices; brighter, heavier body copy.
   ========================================================== */
h1,h2,h3,.brand-name,.price-row b,.role-list b,.facts dd,.flow-total strong,.book-price strong,.cover .title{font-weight:700}
.lede,.svc p,.price-row p,.price-note,.story dd,.process p,.principles p,.role-list p,.product-body p,.mw-head p,
.direct a span,.facts dt,.next li,.store-note,.pdp-note,.pdp-by,.author p,.hero-place,.hero-status,.gets li,.meta,.row p,.pillar p,.chapters li{font-weight:500}
.svc strong,.process b,.product-body h3,.steps b,.next b,.direct a b,.chapters li b,.mw-film figcaption b,.field label{font-weight:700}
.svc em,.price-row strong,.price strong,.meta b{font-weight:700}
.nav a{font-weight:500}
.btn{font-weight:700}
.hero-proof{font-weight:500;color:rgba(255,255,255,.8)}
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Services hero: text + illustration */
.hero-split{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,4vw,56px);align-items:center}
.hero-split-visual{margin:0;position:relative}
.hero-split-visual img{display:block;width:100%;height:auto;border-radius:20px;box-shadow:0 30px 80px -30px rgba(212,175,55,.35),0 0 0 1px rgba(212,175,55,.18)}
@media (max-width:900px){.hero-split{grid-template-columns:1fr}.hero-split-visual{max-width:520px;margin-inline:auto}}
/* Services hero: modern decorative background */
.ph-deco{position:relative;overflow:hidden}
.ph-deco > .ph-bg{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.ph-deco > .floor{position:relative;z-index:1}
.ph-orbit{transform-box:fill-box;transform-origin:center}
@media (prefers-reduced-motion:no-preference){
  .ph-beam{animation:ph-shimmer 7s ease-in-out infinite}
  .ph-beam2{animation-delay:-3.5s}
  .ph-glow{animation:ph-breathe 9s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
  .ph-nodes circle{animation:ph-pulse 3.6s ease-in-out infinite}
  .ph-nodes circle:nth-child(3n){animation-delay:-1.2s}.ph-nodes circle:nth-child(3n+1){animation-delay:-2.4s}
  .ph-spark circle{animation:ph-pulse 4.8s ease-in-out infinite}
  .ph-spark circle:nth-child(2n){animation-delay:-2.4s}
  @keyframes ph-shimmer{0%,100%{opacity:.75}50%{opacity:1}}
  @keyframes ph-breathe{0%,100%{transform:scale(1);opacity:.9}50%{transform:scale(1.06);opacity:1}}
  @keyframes ph-pulse{0%,100%{opacity:.35}50%{opacity:1}}
}
@media (max-width:900px){.ph-net{display:none}}
.ph-deco .hero-split-visual img{border-radius:0;box-shadow:none;
  -webkit-mask-image:radial-gradient(closest-side,#000 72%,transparent 100%);mask-image:radial-gradient(closest-side,#000 72%,transparent 100%)}
/* Services hero: visible motion (matches homepage energy) */
@media (prefers-reduced-motion:no-preference){
  .ph-beam{transform-box:view-box;animation:ph-sweep 9s ease-in-out infinite}
  .ph-beam2{animation-delay:-4.5s}
  @keyframes ph-sweep{0%,100%{transform:translateX(-90px);opacity:.55}50%{transform:translateX(140px);opacity:1}}
  .ph-flow{stroke-dasharray:14 22;animation:ph-flow 2.8s linear infinite}
  @keyframes ph-flow{to{stroke-dashoffset:-72}}
  .ph-orbit{animation:ph-dash 12s linear infinite}
  .ph-orbit2{animation:ph-dash 18s linear infinite reverse}
  @keyframes ph-dash{to{stroke-dashoffset:-1100}}
  .ph-nodes circle{transform-box:fill-box;transform-origin:center;animation:ph-ping 3s ease-in-out infinite}
  @keyframes ph-ping{0%,100%{transform:scale(1);opacity:.5}50%{transform:scale(1.9);opacity:1}}
  .ph-rise circle{animation:ph-rise 8s linear infinite;opacity:0}
  .ph-rise circle:nth-child(2){animation-delay:-1.4s}.ph-rise circle:nth-child(3){animation-delay:-2.8s}
  .ph-rise circle:nth-child(4){animation-delay:-4.2s}.ph-rise circle:nth-child(5){animation-delay:-5.6s}.ph-rise circle:nth-child(6){animation-delay:-7s}
  @keyframes ph-rise{0%{transform:translateY(0);opacity:0}15%{opacity:1}100%{transform:translateY(-640px);opacity:0}}
  .ph-deco .hero-split-visual img{animation:ph-float 6s ease-in-out infinite}
  @keyframes ph-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
}
@media (prefers-reduced-motion:reduce){.ph-move,.ph-rise{display:none}}
@media (max-width:900px){.ph-move > circle{display:none}}
/* Homepage hero: longer positioning headline, sized to stay readable */
.hero h1.hero-title{font-size:clamp(34px,3.7vw,52px);line-height:1.08;max-width:22ch}
@media (max-width:600px){.hero h1.hero-title{font-size:clamp(31px,8.4vw,38px)}}
/* Homepage hero: hire / follow links */
.hero-links{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:20px 0 34px;max-width:560px}
.hero-links-label{flex-basis:100%;margin-bottom:2px;font:600 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.hero-links a{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 14px;border-radius:999px;border:1px solid rgba(255,255,240,.22);color:var(--ivory);background:rgba(3,5,12,.72);font:600 13.5px/1 var(--sans);text-decoration:none;transition:border-color .2s,color .2s,background .2s}
.hero-links a:hover,.hero-links a:focus-visible{border-color:var(--gold);color:var(--gold-hi)}
.hero-links a.hl-upwork{border-color:var(--gold);color:var(--gold-hi);background:rgba(212,175,55,.12)}
.hero-links a.hl-upwork:hover{background:rgba(212,175,55,.22)}
@media (max-width:600px){.hero-links-label{flex-basis:100%;margin-bottom:2px}.hero-links a{min-height:40px;padding:0 13px}}
/* Work hero: floating live-concept screens */
.work-stack{position:relative;margin:0;aspect-ratio:1/.86;width:100%;max-width:600px;margin-left:auto}
.ws-card{position:absolute;border-radius:14px;overflow:hidden;background:#050814;
  border:1px solid rgba(212,175,55,.55);box-shadow:0 0 0 1px rgba(0,56,168,.35),0 30px 70px -25px rgba(0,0,0,.95),0 0 60px -12px rgba(0,56,168,.65)}
.ws-card img{display:block;width:100%;height:auto}
.ws-bar{display:flex;align-items:center;gap:6px;height:26px;padding:0 10px;background:#0a0f22;border-bottom:1px solid rgba(255,255,240,.08)}
.ws-bar i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,240,.18)}
.ws-bar i:first-child{background:var(--gold)}
.ws-bar span{margin-left:8px;font:600 11px/1 var(--sans);letter-spacing:.04em;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ws-back{top:2%;left:0;width:82%;transform:rotate(-3.5deg);opacity:.92}
.ws-front{bottom:4%;right:0;width:80%;transform:rotate(2.5deg);box-shadow:0 0 0 1px rgba(0,56,168,.35),0 40px 90px -25px rgba(0,0,0,.95),0 0 80px -10px rgba(212,175,55,.45)}
.ws-sweep{position:absolute;inset:26px 0 0;pointer-events:none;background:linear-gradient(105deg,transparent 40%,rgba(241,210,122,.22) 50%,transparent 60%) no-repeat;background-size:260% 100%;background-position:160% 0}
.ws-tag{position:absolute;z-index:3;padding:8px 13px;border-radius:999px;font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;
  background:rgba(5,7,16,.92);border:1px solid rgba(212,175,55,.6);color:var(--gold-hi);box-shadow:0 12px 30px -10px rgba(0,0,0,.9)}
.ws-tag-a{top:-2%;right:6%}
.ws-tag-b{bottom:-3%;left:4%;border-color:rgba(127,162,255,.6);color:#fff}
.ws-live{position:absolute;z-index:3;top:44%;left:-4%;display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:12px;
  background:rgba(6,10,28,.94);border:1px solid rgba(127,162,255,.4);font:600 12.5px/1 var(--sans);color:var(--ivory);box-shadow:0 16px 36px -12px rgba(0,0,0,.9)}
.ws-live i{width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(212,175,55,.2)}
@media (prefers-reduced-motion:no-preference){
  .ws-back{animation:ws-float-a 7s ease-in-out infinite}
  .ws-front{animation:ws-float-b 8s ease-in-out -2s infinite}
  @keyframes ws-float-a{0%,100%{transform:rotate(-3.5deg) translateY(0)}50%{transform:rotate(-2.5deg) translateY(-12px)}}
  @keyframes ws-float-b{0%,100%{transform:rotate(2.5deg) translateY(0)}50%{transform:rotate(1.5deg) translateY(-16px)}}
  .ws-sweep{animation:torch 5.5s ease-in-out infinite}
  .ws-tag-a{animation:ws-bob 5s ease-in-out infinite}
  .ws-tag-b{animation:ws-bob 6s ease-in-out -2.5s infinite}
  .ws-live{animation:ws-bob 6.5s ease-in-out -1s infinite}
  .ws-live i{animation:ws-ping 2s ease-in-out infinite}
  @keyframes ws-bob{50%{transform:translateY(-8px)}}
  @keyframes ws-ping{50%{box-shadow:0 0 0 7px rgba(212,175,55,0)}}
}
@media (max-width:900px){.work-stack{max-width:520px;margin:12px auto 0}.ws-live{left:0}}
@media (max-width:600px){.ws-tag{font-size:10.5px;padding:7px 10px}.ws-live{font-size:11.5px;padding:7px 10px}.ws-bar{height:20px}.ws-bar span{font-size:9.5px}.ws-sweep{inset:20px 0 0}}
/* Work hero: spinning KEDG badge */
.ws-badge{position:absolute;z-index:4;top:-9%;right:-3%;width:29%;aspect-ratio:1;filter:drop-shadow(0 14px 30px rgba(0,0,0,.85)) drop-shadow(0 0 22px rgba(212,175,55,.28))}
.wb-svg{display:block;width:100%;height:100%;overflow:visible}
.wb-text,.wb-orbit{transform-box:view-box;transform-origin:80px 80px}
.wb-logo{position:absolute;left:50%;top:50%;width:40%;height:auto;transform:translate(-50%,-50%)}
.ws-tag-a{right:auto;left:8%;top:-3%}
@media (prefers-reduced-motion:no-preference){
  .wb-text{animation:spin 16s linear infinite}
  .wb-orbit{animation:spin 7s linear infinite reverse}
  .ws-badge{animation:ws-bob 6s ease-in-out -3s infinite}
  .wb-logo{animation:wb-glow 3.5s ease-in-out infinite}
  @keyframes wb-glow{0%,100%{filter:drop-shadow(0 0 0 rgba(212,175,55,0))}50%{filter:drop-shadow(0 0 8px rgba(212,175,55,.75))}}
}
@media (max-width:600px){.ws-badge{width:30%;top:-12%;right:-1%}}
.ws-badge{width:34%;top:-13%;right:-4%}
.ws-tag-a{left:auto;top:auto;right:2%;bottom:-3%}
.ws-tag-b{left:2%}
@media (max-width:600px){.ws-badge{width:33%;top:-14%;right:-1%}.ws-tag-a{right:0}.ws-tag-b{left:0}}
.wb-logo{mix-blend-mode:normal}
.ws-tag-a{right:auto;left:2%}
.ws-tag-b{left:auto;right:2%}
@media (max-width:600px){.ws-tag-a{left:0;right:auto}.ws-tag-b{right:0;left:auto}}
/* Store hero: floating, glowing books */
.book-stage{position:relative;margin:0 0 0 auto;width:100%;max-width:560px;aspect-ratio:1/.92}
.bk{position:absolute;display:block;height:auto;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%),linear-gradient(0deg,transparent 0,#000 5%,#000 95%,transparent 100%);
  -webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%),linear-gradient(0deg,transparent 0,#000 5%,#000 95%,transparent 100%);mask-composite:intersect}
.bk img{display:block;width:100%;height:auto}
.bk-left{width:40%;left:2%;top:16%;transform:rotate(-9deg);opacity:.9;filter:drop-shadow(0 25px 40px rgba(0,0,0,.9)) brightness(.88)}
.bk-right{width:40%;right:2%;top:16%;transform:rotate(9deg);opacity:.9;filter:drop-shadow(0 25px 40px rgba(0,0,0,.9)) brightness(.88)}
.bk-front{width:47%;left:26.5%;top:6%;z-index:2;filter:drop-shadow(0 30px 50px rgba(0,0,0,.95)) drop-shadow(0 0 40px rgba(212,175,55,.35))}
.bk-sweep{position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 40%,rgba(241,210,122,.28) 50%,transparent 60%) no-repeat;background-size:260% 100%;background-position:160% 0}
.bk-floor{position:absolute;left:8%;right:8%;bottom:2%;height:22%;border-radius:50%;background:radial-gradient(50% 50% at 50% 50%,rgba(212,175,55,.55),rgba(212,175,55,.12) 55%,transparent 72%);filter:blur(6px)}
.book-stage .ws-badge{top:-8%;right:-5%;width:30%}
.bk-tag-a{bottom:6%;left:-2%}
.bk-tag-b{bottom:-3%;right:2%;border-color:rgba(127,162,255,.6);color:#fff}
@media (prefers-reduced-motion:no-preference){
  .bk-front{animation:bk-float 6s ease-in-out infinite}
  .bk-left{animation:bk-float-l 7s ease-in-out -2s infinite}
  .bk-right{animation:bk-float-r 7.5s ease-in-out -4s infinite}
  @keyframes bk-float{50%{transform:translateY(-16px)}}
  @keyframes bk-float-l{0%,100%{transform:rotate(-9deg) translateY(0)}50%{transform:rotate(-7deg) translateY(-12px)}}
  @keyframes bk-float-r{0%,100%{transform:rotate(9deg) translateY(0)}50%{transform:rotate(7deg) translateY(-12px)}}
  .bk-sweep{animation:torch 5s ease-in-out infinite}
  .bk-floor{animation:bk-glow 6s ease-in-out infinite}
  @keyframes bk-glow{0%,100%{opacity:.75;transform:scaleX(1)}50%{opacity:1;transform:scaleX(.92)}}
  .bk-tag-a{animation:ws-bob 5s ease-in-out infinite}
  .bk-tag-b{animation:ws-bob 6s ease-in-out -2.5s infinite}
}
@media (max-width:900px){.book-stage{max-width:480px;margin:18px auto 0}}
@media (max-width:600px){.book-stage .ws-badge{width:30%;top:-6%;right:-2%}.bk-tag-a{left:0}.bk-tag-b{right:0}}
.book-stage .ws-badge{top:-13%}
/* Homepage hero: word pop-in, typing line, Nigerian flag */
.hero-place{display:flex;align-items:center;gap:10px}
.ng-flag{display:inline-flex;flex:none;filter:drop-shadow(0 2px 6px rgba(0,0,0,.6))}
.hero-type{margin:16px 0 0;min-height:1.5em;font:600 clamp(18px,1.9vw,24px)/1.4 var(--sans);color:var(--gold-hi);letter-spacing:.01em}
.ht-caret{display:inline-block;width:3px;height:1.05em;margin-left:4px;vertical-align:-.15em;background:var(--gold);border-radius:2px}
@media (prefers-reduced-motion:no-preference){
  .hero-copy > h1.words{animation:none}
  .hero-title.words .w{display:inline-block;animation:word-pop .7s cubic-bezier(.2,.8,.2,1.25) both;animation-delay:calc(.25s + var(--i) * 90ms)}
  @keyframes word-pop{from{opacity:0;transform:translateY(22px) scale(.92)}to{opacity:1;transform:none}}
  .ht-caret{animation:cw-blink 1s steps(1,end) infinite}
}
.hero-type{margin-top:12px}.hero-type + .lede{margin-top:16px}
/* About hero: badge on portrait */
.ab-portrait{position:relative}
.ab-portrait .ab-badge{top:-4%;right:-6%;width:34%;max-width:170px}
@media (max-width:880px){.ab-portrait{max-width:360px;margin:0 auto}.ab-portrait .ab-badge{right:-2%}}
/* Contact hero: contact hub */
.ct-hub{position:relative;width:100%;max-width:520px;aspect-ratio:400/340;margin-left:auto}
.ct-lines{position:absolute;inset:0;width:100%;height:100%}
.ct-hub .ct-badge{top:50%;left:50%;right:auto;width:42%;transform:translate(-50%,-50%)}
.ct-chip{position:absolute;z-index:5;display:grid;gap:3px;min-width:44%;max-width:56%;padding:12px 16px;border-radius:14px;text-decoration:none;
  background:rgba(6,10,28,.94);border:1px solid rgba(212,175,55,.5);box-shadow:0 16px 36px -14px rgba(0,0,0,.9),0 0 26px -10px rgba(0,56,168,.7);transition:border-color .2s,transform .2s}
.ct-chip b{font:700 14px/1 var(--sans);color:var(--gold-hi);letter-spacing:.02em}
.ct-chip span{font:500 12.5px/1.3 var(--sans);color:var(--ivory);overflow-wrap:anywhere}
.ct-chip:hover,.ct-chip:focus-visible{border-color:var(--gold-hi)}
.ct-wa{left:0;top:4%}.ct-mail{right:0;top:4%;text-align:right}.ct-call{left:0;bottom:4%}.ct-up{right:0;bottom:4%;text-align:right;border-color:var(--gold);background:rgba(28,22,4,.94)}
@media (prefers-reduced-motion:no-preference){
  .ct-hub .ct-badge{animation:none}
  .ct-line{animation:ph-flow 2.2s linear infinite}
  .ct-wa{animation:ws-bob 5s ease-in-out infinite}.ct-mail{animation:ws-bob 5.5s ease-in-out -1.5s infinite}
  .ct-call{animation:ws-bob 6s ease-in-out -3s infinite}.ct-up{animation:ws-bob 5.2s ease-in-out -2s infinite}
}
@media (max-width:900px){.ct-hub{max-width:460px;margin:20px auto 0}}
@media (max-width:600px){.ct-chip{padding:10px 12px;min-width:46%}.ct-chip b{font-size:13px}.ct-chip span{font-size:11px}}
/* Homepage: client voices */
.voices{background:linear-gradient(180deg,var(--ink),var(--vault) 30%,var(--vault) 70%,var(--ink))}
.voice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,28px)}
.voice{position:relative;margin:0;display:flex;flex-direction:column;gap:18px;padding:30px 26px 24px;border-radius:20px;
  background:linear-gradient(160deg,rgba(0,56,168,.16),rgba(3,3,3,.6) 60%);border:1px solid rgba(212,175,55,.38);
  box-shadow:0 30px 60px -35px rgba(0,0,0,.9),inset 0 0 0 1px rgba(127,162,255,.08)}
.voice-mark{position:absolute;top:-6px;right:20px;font:700 96px/1 var(--serif);color:rgba(212,175,55,.32)}
.voice blockquote{margin:0;font:600 clamp(22px,2.2vw,27px)/1.3 var(--serif);color:var(--ivory)}
.voice figcaption{display:grid;gap:3px;padding-top:16px;border-top:1px solid var(--line);margin-top:auto}
.voice figcaption b{color:var(--gold-hi);font-weight:700;font-size:16px}
.voice figcaption span{color:var(--muted);font-size:14px}
.voice-via{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted)}
.voice-via::before{content:"";width:8px;height:8px;border-radius:50%;background:#25D366;box-shadow:0 0 0 3px rgba(37,211,102,.18)}
@media (prefers-reduced-motion:no-preference){
  .voice{transition:transform .3s,border-color .3s}.voice:hover{transform:translateY(-6px);border-color:var(--gold)}
}
@media (max-width:880px){.voice-grid{grid-template-columns:1fr}}
.voice blockquote{padding-right:44px}