:root{
  --bg:#07090d;--panel:#0d1118;--panel2:#121824;--text:#f4f6f8;--muted:#a8b0bd;
  --line:#232b38;--accent:#7bb9ff;--accent2:#c7a768;--navy:#0f1d2d;--gold:#c79a3b;
  --max:1500px;--radius:22px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:
radial-gradient(circle at 80% -10%,rgba(67,116,174,.22),transparent 34rem),
linear-gradient(180deg,#080a0f 0%,#07090d 60%,#0a0d12 100%);
color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Avenir Next","Segoe UI",Arial,sans-serif;line-height:1.55}
a{color:inherit;text-decoration:none}.wrap{width:min(calc(100% - 40px),var(--max));margin:auto}
header{position:sticky;top:0;z-index:10;background:rgba(7,9,13,.82);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.06)}
nav{height:110px;padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{font-weight:750;letter-spacing:.02em}.navlinks{display:flex;gap:26px;align-items:center;color:#c9d0d9;font-size:14px}.navlinks a:hover{color:white}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 20px;border:1px solid #364050;border-radius:999px;font-weight:650;font-size:14px;transition:.2s}.btn:hover{transform:translateY(-1px);border-color:#6b7b90}.btn.primary{background:#eef5ff;color:#07101a;border-color:#eef5ff}
.hero{padding:100px 0 74px}.hero>.wrap{width:min(calc(100% - 40px),var(--max))}.eyebrow{font-size:13px;text-transform:uppercase;letter-spacing:.18em;color:#aeb9c9;font-weight:750}.hero h1{font-size:clamp(54px,8vw,104px);line-height:.92;letter-spacing:-.06em;margin:18px 0 26px;max-width:1000px}.hero .lead{font-size:clamp(20px,2.4vw,30px);line-height:1.35;color:#c7ced8;max-width:850px;margin:0 0 34px}.actions{display:flex;gap:12px;flex-wrap:wrap}
.wave{height:64px;display:flex;align-items:center;gap:5px;margin-top:58px;opacity:.75}.wave i{display:block;width:4px;border-radius:4px;background:linear-gradient(#a8d2ff,#4b80bb);height:var(--h)}
.metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;padding:0 0 92px}.metric{border:1px solid var(--line);border-radius:18px;padding:24px;background:rgba(255,255,255,.025)}.metric b{display:block;font-size:28px;letter-spacing:-.03em}.metric span{color:var(--muted);font-size:13px}
section{padding:86px 0;border-top:1px solid rgba(255,255,255,.06)}.section-head{display:grid;grid-template-columns:1fr 2fr;gap:50px;margin-bottom:42px}.section-head h2{font-size:clamp(34px,4vw,56px);letter-spacing:-.045em;margin:0}.section-head p{color:var(--muted);font-size:18px;margin:4px 0 0;max-width:720px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.card{background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.018));border:1px solid var(--line);border-radius:var(--radius);padding:28px}.card h3{font-size:20px;margin:0 0 8px}.card p{color:var(--muted);margin:0}.tag{display:inline-block;border:1px solid #303a48;border-radius:999px;padding:5px 10px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#bcc6d3;margin-bottom:20px}
.samples{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.sample{border:1px solid var(--line);border-radius:20px;padding:24px;background:#0b0f15}.sample-top{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.sample h3{margin:0;font-size:19px}.sample p{margin:5px 0 16px;color:var(--muted);font-size:14px}.sample .pending{font-size:12px;color:#8793a3;border-top:1px solid #222b36;padding-top:14px}
.credits{columns:2;column-gap:54px}.credit{break-inside:avoid;margin:0 0 28px}.credit h3{margin:0 0 7px;font-size:20px}.credit p{color:var(--muted);margin:0}
.quote{font-family:Georgia,"Times New Roman",serif;font-size:clamp(30px,4vw,54px);line-height:1.2;letter-spacing:-.025em;max-width:950px;margin:0}
.contact{display:flex;align-items:flex-end;justify-content:space-between;gap:30px}.contact h2{font-size:clamp(42px,5vw,72px);letter-spacing:-.05em;margin:0 0 12px}.contact p{color:var(--muted);margin:0}
footer{padding:32px 0 48px;color:#7f8997;font-size:13px;border-top:1px solid rgba(255,255,255,.06)}
/* LinguaSlate */
.ls-body{background:radial-gradient(circle at 85% 0,rgba(199,154,59,.12),transparent 32rem),linear-gradient(180deg,#0b1520,#0f1d2d 55%,#0a1119);}.ls-body .brand{color:#f2e5c8}.ls-hero h1{font-size:clamp(46px,7vw,88px);max-width:1050px}.gold{color:#d5ad5b}.ls-body .btn.primary{background:var(--gold);border-color:var(--gold);color:#111}.ls-body .tag{border-color:rgba(199,154,59,.35);color:#e3c98f}.ls-body .card{border-color:rgba(199,154,59,.18)}.ls-wordmark{display:flex;flex-direction:column;gap:2px}.ls-wordmark strong{font-size:20px;letter-spacing:.03em}.ls-wordmark small{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#c2aa7a}
.note{border-left:2px solid var(--gold);padding:3px 0 3px 18px;color:#c6ced8;font-size:15px;margin-top:28px}
@media(max-width:820px){.navlinks a:not(.keep){display:none}.hero{padding-top:72px}.metrics{grid-template-columns:repeat(2,1fr)}.section-head{grid-template-columns:1fr;gap:14px}.grid{grid-template-columns:1fr}.samples{grid-template-columns:1fr}.credits{columns:1}.contact{align-items:flex-start;flex-direction:column}}
@media(max-width:520px){.wrap{width:min(calc(100% - 26px),var(--max))}.hero h1{font-size:52px}.metrics{grid-template-columns:1fr 1fr}.metric{padding:18px}.metric b{font-size:22px}}

/* V2 refinements — approved dark direction retained */
.brand-logo{display:flex;align-items:center;min-width:294px}
.brand-logo img{display:block;height:90px;width:auto;max-width:367px;object-fit:contain;object-position:left center}
.hero-main{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(520px,.96fr);gap:58px;align-items:center;position:relative;overflow:visible}
.hero-copy{min-width:0;position:relative;z-index:4}
.hero-visual{position:relative;min-width:0;max-width:700px;justify-self:end;z-index:1;transform-origin:center center}
.hero-portrait{margin:0;position:relative;border:1px solid #263140;border-radius:30px;padding:9px;background:linear-gradient(145deg,rgba(123,185,255,.16),rgba(255,255,255,.025));box-shadow:0 28px 90px rgba(0,0,0,.42);overflow:hidden}
.hero-media-frame{position:relative;overflow:hidden;border-radius:22px;background:#080b10;transform-style:preserve-3d;will-change:transform;transition:transform .22s ease-out,box-shadow .22s ease-out;box-shadow:0 18px 48px rgba(0,0,0,.24);touch-action:pan-y}
.hero-media-frame img{display:block;width:100%;aspect-ratio:7/5;object-fit:cover;object-position:center center;filter:saturate(.93) contrast(1.035);transform:translate3d(var(--hero-img-x,0px),var(--hero-img-y,0px),0) scale(1.028);will-change:transform;transition:transform .18s ease-out;pointer-events:none;user-select:none}
.hero-media-frame.is-dragging{transition:none;cursor:grabbing}
.hero-media-frame.is-dragging img{transition:none}
@media(hover:hover) and (pointer:fine){.hero-media-frame{cursor:grab}}
@media(prefers-reduced-motion:reduce){.hero-media-frame,.hero-media-frame img{transform:none!important;transition:none!important}.hero-media-frame{cursor:default!important}}
.hero-portrait figcaption{padding:13px 9px 7px;color:#aeb9c9;font-size:13px;letter-spacing:.11em;text-transform:uppercase}
.hero-monogram{position:absolute;right:22px;bottom:34px;width:82px;height:82px;padding:10px;border:1px solid rgba(255,204,0,.44);border-radius:22px;background:rgba(6,7,10,.90);box-shadow:0 16px 38px rgba(0,0,0,.42);backdrop-filter:blur(10px)}
.hero-monogram img{display:block;width:100%;height:100%;object-fit:contain}
.btn.small{min-height:38px;padding:0 15px;font-size:12px}

.player-card{grid-column:1/-1;position:relative;padding:32px;background:radial-gradient(circle at 8% 10%,rgba(123,185,255,.13),transparent 24rem),linear-gradient(145deg,#0e141d,#090d13);overflow:hidden}
.player-card:before{content:"";position:absolute;inset:0;border-radius:20px;border:1px solid rgba(123,185,255,.55);pointer-events:none;box-shadow:inset 0 0 34px rgba(104,128,255,.05)}
.demo-audio{display:none}
.player-console{display:grid;grid-template-columns:86px 1fr;gap:24px;align-items:center;margin-top:18px}
.play-orb{width:78px;height:78px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:radial-gradient(circle at 35% 30%,#8ed0ff,#4778c7 48%,#8b55ce 82%);color:white;font-size:25px;cursor:pointer;box-shadow:0 0 0 7px rgba(98,156,232,.07),0 18px 48px rgba(67,113,196,.34);transition:.2s}
.play-orb:hover{transform:scale(1.045);box-shadow:0 0 0 8px rgba(98,156,232,.1),0 20px 56px rgba(74,126,216,.5)}
.is-playing .play-orb{animation:pulsePlayer 1.5s ease-in-out infinite}
@keyframes pulsePlayer{50%{box-shadow:0 0 0 14px rgba(98,156,232,.03),0 20px 62px rgba(98,156,232,.55)}}
.player-track{min-width:0}
.visual-wave{height:76px;display:flex;align-items:center;gap:4px;padding:8px 2px}
.visual-wave i{display:block;flex:1;min-width:2px;height:var(--bar-h);border-radius:99px;background:#334050;transition:background .15s,filter .15s}
.visual-wave i.played{background:linear-gradient(180deg,#9ee1ff,#668dff 55%,#bd72ff);filter:drop-shadow(0 0 5px rgba(113,184,255,.55))}

.player-seek{width:100%;height:3px;margin:1px 0 5px;appearance:none;border-radius:99px;background:#28313d;cursor:pointer}
.player-seek::-webkit-slider-thumb{appearance:none;width:13px;height:13px;border-radius:50%;background:#eef7ff;box-shadow:0 0 0 4px rgba(123,185,255,.14)}
.player-time{display:flex;justify-content:space-between;color:#8592a3;font:600 11px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace}
.demo-actions{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:20px;padding-top:18px;border-top:1px solid #222c38;color:#8390a0;font-size:12px}
.player-card .tag{background:rgba(123,185,255,.08);border-color:rgba(123,185,255,.28)}
.profile-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.profile-block{border:1px solid var(--line);border-radius:22px;padding:28px;background:rgba(255,255,255,.022)}
.profile-block h3{font-size:23px;line-height:1.2;letter-spacing:-.025em;margin:0 0 10px}
.profile-block p{color:var(--muted);margin:0}





/* V9 hero depth/arrival treatment */
.hero-copy,.hero-visual{will-change:transform,opacity}
.hero-copy.hero-arrival{animation:heroCopyArrival .68s cubic-bezier(.2,.78,.22,1) .02s both}
.hero-visual.hero-arrival{animation:heroVisualArrival 1.52s cubic-bezier(.16,.88,.20,1.06) .14s both}
@keyframes heroCopyArrival{
  0%{opacity:0;transform:translate3d(-46px,10px,0)}
  100%{opacity:1;transform:translate3d(0,0,0)}
}
@keyframes heroVisualArrival{
  0%{opacity:.04;transform:translate3d(-52vw,46px,0) rotateZ(-5.5deg) scale(.86);filter:blur(7px)}
  34%{opacity:.76;transform:translate3d(-24vw,24px,0) rotateZ(-3.0deg) scale(.92);filter:blur(3px)}
  68%{opacity:1;transform:translate3d(20px,-7px,0) rotateZ(.85deg) scale(1.018);filter:blur(0)}
  84%{transform:translate3d(-7px,4px,0) rotateZ(-.28deg) scale(.996)}
  94%{transform:translate3d(3px,-1px,0) rotateZ(.10deg) scale(1.002)}
  100%{opacity:1;transform:translate3d(0,0,0) rotateZ(0) scale(1);filter:blur(0)}
}
.hero-media-frame::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(circle at var(--hero-light-x,50%) var(--hero-light-y,50%),rgba(255,255,255,.16),rgba(255,255,255,.045) 16%,transparent 38%);opacity:0;transition:opacity .22s ease}
@media(hover:hover) and (pointer:fine){.hero-media-frame:hover::after{opacity:.78}}
@media(prefers-reduced-motion:reduce){
  .hero-copy.hero-arrival,.hero-visual.hero-arrival{animation:none!important}
  .hero-media-frame::after{display:none!important}
}


/* V11 cinematic headline assembly + synchronized logo reveal */
.hero-title{position:relative}
.hero-word{
  display:inline-block;will-change:transform,opacity,filter;color:inherit;
  --dx:0px;--dy:0px;--rot:0deg;--sc:1;
}
.hero-word.w-a{--dx:10px;--dy:-11px;--rot:-3deg}
.hero-word.hero-word-voice{--dx:-18px;--dy:14px;--rot:-3.5deg;--sc:.78}
.hero-word.w-built{--dx:17px;--dy:-13px;--rot:2.5deg}
.hero-word.w-for{--dx:-11px;--dy:10px;--rot:-2deg}
.hero-word.w-story{--dx:20px;--dy:9px;--rot:1.8deg}
.hero-word.w-character{--dx:-18px;--dy:-10px;--rot:-1.6deg}
.hero-word.w-and{--dx:12px;--dy:12px;--rot:2deg}
.hero-word.w-scale{--dx:-10px;--dy:-8px;--rot:-1.8deg}
.hero-title.title-awaiting .hero-word{
  opacity:0;filter:blur(5px);
  transform:translate3d(var(--dx),var(--dy),0) rotate(var(--rot)) scale(var(--sc));
}
.hero-title.is-assembling .hero-word{
  animation:heroWordAssemble .62s cubic-bezier(.18,.78,.22,1) forwards;
  animation-delay:calc(.08s + (var(--i) * .065s));
}
.hero-title.is-assembling .hero-word-voice{
  animation-name:heroVoiceAssemble;
  animation-duration:.78s;
  animation-delay:.02s;
}
.hero-title.title-settled .hero-word{
  opacity:1!important;filter:none!important;transform:none!important;animation:none!important;
  color:inherit!important;text-shadow:none!important;
}
@keyframes heroWordAssemble{
  0%{opacity:0;filter:blur(5px);transform:translate3d(var(--dx),var(--dy),0) rotate(var(--rot)) scale(var(--sc))}
  58%{opacity:1;filter:blur(.8px);transform:translate3d(2px,-1px,0) rotate(.15deg) scale(1.012)}
  100%{opacity:1;filter:blur(0);transform:translate3d(0,0,0) rotate(0) scale(1)}
}
@keyframes heroVoiceAssemble{
  0%{opacity:0;filter:blur(7px);color:#ffcc00;text-shadow:0 0 0 rgba(255,204,0,0);transform:translate3d(var(--dx),var(--dy),0) rotate(var(--rot)) scale(var(--sc))}
  50%{opacity:1;filter:blur(.5px);color:#ffcc00;text-shadow:0 0 24px rgba(255,204,0,.58);transform:translate3d(1px,-2px,0) rotate(.15deg) scale(1.055)}
  78%{text-shadow:0 0 14px rgba(255,204,0,.28);transform:translate3d(0,0,0) rotate(0) scale(.99)}
  100%{opacity:1;filter:blur(0);color:inherit;text-shadow:none;transform:translate3d(0,0,0) rotate(0) scale(1)}
}
[data-logo-reveal].logo-awaiting{
  opacity:0;filter:brightness(0) blur(10px);
  transform:translate3d(0,8px,0) scale(.92);
}
[data-logo-reveal].logo-awaken{animation:logoAwaken .72s cubic-bezier(.18,.82,.2,1) both}
@keyframes logoAwaken{
  0%{opacity:0;filter:brightness(0) blur(10px);transform:translate3d(0,8px,0) scale(.92)}
  45%{opacity:.72;filter:brightness(.72) blur(3px);transform:translate3d(0,-2px,0) scale(1.025)}
  72%{opacity:1;filter:brightness(1.18) drop-shadow(0 0 13px rgba(255,204,0,.24)) blur(0);transform:translate3d(0,0,0) scale(1.01)}
  100%{opacity:1;filter:none;transform:translate3d(0,0,0) scale(1)}
}
@media(prefers-reduced-motion:reduce){
  .hero-title.title-awaiting .hero-word,.hero-title.is-assembling .hero-word,.hero-title.title-settled .hero-word{
    animation:none!important;opacity:1!important;filter:none!important;transform:none!important
  }
  [data-logo-reveal].logo-awaiting,[data-logo-reveal].logo-awaken{
    animation:none!important;opacity:1!important;filter:none!important;transform:none!important
  }
}

/* Go to top */
.go-top{
  position:fixed;right:24px;bottom:24px;z-index:80;width:48px;height:48px;border-radius:50%;
  border:1px solid rgba(255,204,0,.58);background:rgba(7,9,13,.88);color:#ffcc00;
  display:grid;place-items:center;font-size:24px;line-height:1;box-shadow:0 14px 34px rgba(0,0,0,.38);
  backdrop-filter:blur(12px);cursor:pointer;opacity:0;visibility:hidden;pointer-events:none;
  transform:translate3d(0,12px,0) scale(.94);transition:opacity .22s ease,transform .22s ease,visibility .22s ease,border-color .2s ease;
}
.go-top.is-visible{opacity:1;visibility:visible;pointer-events:auto;transform:translate3d(0,0,0) scale(1)}
.go-top:hover{border-color:#ffcc00;transform:translate3d(0,-2px,0) scale(1.04)}
.go-top:focus-visible{outline:2px solid #ffcc00;outline-offset:3px}

@media(prefers-reduced-motion:reduce){.go-top{transition:none}}
@media(max-width:620px){.go-top{right:14px;bottom:14px;width:44px;height:44px}}

/* Expansive visual portfolio */
.portfolio-review-note{margin:0 0 48px;padding:16px 18px;border:1px solid rgba(255,204,0,.30);border-radius:14px;background:rgba(255,204,0,.045);color:#c8d0da}
.portfolio-review-note b{color:var(--yellow)}
.visual-group{margin:0 0 74px}
.visual-group-head{display:flex;justify-content:space-between;align-items:end;gap:30px;border-bottom:1px solid var(--line);padding:0 0 16px;margin:0 0 18px}
.visual-group-head h3{font-size:clamp(28px,3vw,42px);letter-spacing:-.04em;margin:0 0 8px}
.visual-group-head p{color:var(--muted);font-size:17px;max-width:780px;margin:0}
.visual-group-head>span{color:#9ba5b3;font-size:12px;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.visual-wall{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.visual-card{margin:0;border:1px solid var(--line);border-radius:22px;overflow:hidden;background:#0a0d12}
.visual-frame{height:clamp(500px,43vw,650px);position:relative;display:flex;align-items:center;justify-content:center;background:#040609}
.visual-frame img{display:block;width:100%;height:100%;object-fit:contain}
.media-number,.video-number{position:absolute;top:14px;left:14px;z-index:3;background:rgba(3,4,6,.90);border:1px solid rgba(255,204,0,.82);color:var(--yellow);font-size:12px;font-weight:900;letter-spacing:.08em;border-radius:9px;padding:7px 9px;box-shadow:0 8px 24px rgba(0,0,0,.34)}
.visual-card figcaption{padding:14px 16px 16px;display:flex;justify-content:space-between;gap:18px;align-items:start}
.visual-card figcaption b{font-size:14px}
.visual-card figcaption span{color:var(--muted);font-size:11px;text-align:right;max-width:55%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stage-copy{margin:4px 0 76px;border:1px solid var(--line);border-radius:24px;padding:34px;background:linear-gradient(145deg,rgba(255,204,0,.045),rgba(255,255,255,.018))}
.stage-copy h3{font-size:30px;margin:0 0 12px;letter-spacing:-.035em}.stage-copy p{color:var(--muted);margin:0;max-width:960px;font-size:17px}
.video-heading{display:flex;justify-content:space-between;gap:32px;align-items:end;margin:0 0 34px}.video-heading h3{font-size:clamp(34px,4vw,54px);letter-spacing:-.04em;margin:0 0 10px}.video-heading p{color:var(--muted);margin:0;max-width:900px;font-size:17px}
.video-group{margin:0 0 62px}
.expanded-video-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.expanded-video-card{border:1px solid var(--line);border-radius:22px;overflow:hidden;background:#0a0d12}
.expanded-video-player{position:relative;background:#020305;min-height:340px;display:flex;align-items:center;justify-content:center}
.expanded-video-player video{display:block;width:100%;aspect-ratio:16/9;max-height:620px;object-fit:contain;background:#020305}
.expanded-video-meta{padding:16px 18px 18px}
.expanded-video-meta h4{font-size:19px;margin:0 0 6px;letter-spacing:-.02em}
.expanded-video-meta p{margin:0;color:var(--muted);font-size:12px;text-transform:capitalize}

.ls-logo{display:block;line-height:0}
.ls-logo img{display:block;width:270px;max-height:62px;object-fit:contain;object-position:left center}

@media(max-width:980px){
.hero-main{grid-template-columns:1fr .62fr;gap:34px}
.brand-logo img{height:79px;max-width:324px}
.navlinks{gap:18px}
.profile-grid{grid-template-columns:1fr}
}
@media(max-width:820px){
.hero-main{grid-template-columns:1fr}
.hero-visual{justify-self:start;max-width:680px}
.hero-portrait{max-width:680px}
.hero-portrait img{aspect-ratio:3/2}
.hero-monogram{right:12px;bottom:42px;width:74px;height:74px}
.player-console{grid-template-columns:68px 1fr;gap:16px}
.play-orb{width:62px;height:62px;font-size:20px}
.visual-wave{height:62px}
.ls-logo img{width:220px}
}

@media(max-width:520px){
.brand-logo{min-width:145px}
.brand-logo img{width:165px;max-height:48px}
.player-card{padding:21px}
.player-console{grid-template-columns:1fr}
.play-orb{width:58px;height:58px}
.demo-actions{align-items:flex-start;flex-direction:column}
.editorial-gallery figcaption{flex-direction:column;gap:3px}
}


/* V3 media/refinement pass */
@media(max-width:980px){
  nav{height:102px;padding-top:16px}.collage-studio{grid-column:2;grid-row:1}.collage-katha{grid-column:2;grid-row:2/4}.collage-csr{grid-column:1;grid-row:3/6}.collage-awards{grid-column:2;grid-row:4}.collage-stage{grid-column:2;grid-row:5}
}
@media(max-width:820px){
  nav{height:96px;padding-top:14px}
  .brand-logo{min-width:228px}.brand-logo img{height:72px;max-width:294px}
  .hero>.wrap{width:min(calc(100% - 40px),var(--max))}
  .hero-visual{max-width:744px}.hero-monogram{right:12px}.collage-main img{object-position:42% 38%}.collage-katha{grid-column:2;grid-row:2/4}.collage-csr{grid-column:1;grid-row:3/6}.collage-awards{grid-column:2;grid-row:4}.collage-stage{grid-column:2;grid-row:5}.video-heading{margin-top:48px}
}
@media(max-width:520px){
  nav{height:86px;padding-top:10px}.brand-logo{min-width:180px}.brand-logo img{height:60px;max-width:246px}
  .media-collage figure,.collage-main,.collage-studio,.collage-katha,.collage-csr,.collage-awards,.collage-stage{grid-column:1;grid-row:auto}.collage-main img{object-position:42% center}
  .media-collage figcaption{flex-direction:column;gap:3px}.stage-copy{padding:22px}.video-meta{padding:19px}
}


/* V5 visual portfolio responsive rules */
@media(max-width:980px){
  .hero-main{grid-template-columns:1fr .72fr;gap:36px}
  .hero-visual{max-width:640px}
  .visual-frame{height:clamp(420px,54vw,560px)}
  .expanded-video-player{min-height:280px}
}
@media(max-width:820px){
  .hero-main{grid-template-columns:1fr}
  .hero-visual{justify-self:start;max-width:700px}
  .hero-portrait{max-width:700px}
  .hero-media-frame img{aspect-ratio:7/5}
  .hero-monogram{right:22px;bottom:52px;width:74px;height:74px}
  .visual-wall,.expanded-video-grid{grid-template-columns:1fr}
  .visual-frame{height:min(82vw,700px)}
  .visual-group-head{align-items:start;flex-direction:column;gap:8px}
}
@media(max-width:520px){
  .visual-frame{height:86vw;min-height:330px}
  .visual-card figcaption{flex-direction:column;gap:5px}
  .visual-card figcaption span{max-width:100%;text-align:left}
  .stage-copy{padding:24px}
  .expanded-video-player{min-height:210px}
}

.mc-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;margin-top:28px}
.mc-card{margin:0;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#06080b}
.mc-frame{position:relative;height:320px;background:#030507}
.mc-frame img{display:block;width:100%;height:100%;object-fit:cover}
@media(max-width:980px){.mc-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.mc-frame{height:300px}}
@media(max-width:620px){.mc-gallery{grid-template-columns:1fr}.mc-frame{height:72vw;min-height:300px}}

.video-safety-badge{position:absolute;top:14px;right:14px;z-index:4;padding:7px 10px;border-radius:999px;font-size:10px;font-weight:900;letter-spacing:.08em;background:rgba(0,0,0,.88);backdrop-filter:blur(6px)}
.video-safety-badge.reference{border:1px solid #c79a31;color:#ffd76b}.video-safety-badge.restricted{border:1px solid #c45555;color:#ff9b9b}.video-reference-card{border-color:rgba(199,154,49,.55)}.video-restricted-card{border-color:rgba(196,85,85,.68)}


/* =========================================================
   V12 · CINEMATIC VOICE-FIRST MOTION SYSTEM · 4 OCT 2026
   Rollback: rollback-website-pre-cinematic-v12-2026-10-04
   ========================================================= */

:root{
  --brand-yellow:#ffcc00;
  --brand-yellow-soft:#ffe36a;
  --cinema-ease:cubic-bezier(.16,.84,.18,1);
}

/* Slow-motion hero: approximately 3× the V11 entrance cadence. */
.hero-copy.hero-arrival{
  animation-duration:2.04s;
  animation-delay:.06s;
}
.hero-visual.hero-arrival{
  animation-duration:4.56s;
  animation-delay:.42s;
}
.hero-title.is-assembling .hero-word{
  animation-duration:1.86s;
  animation-delay:calc(.24s + (var(--i) * .195s));
}
.hero-title.is-assembling .hero-word-voice{
  animation-duration:2.34s;
  animation-delay:.06s;
}
[data-logo-reveal].logo-awaken{
  animation:logoAwakenV12 2.16s var(--cinema-ease) both;
}
@keyframes logoAwakenV12{
  0%{opacity:0;filter:brightness(0) blur(13px);transform:translate3d(0,11px,0) scale(.89)}
  38%{opacity:.48;filter:brightness(.52) blur(7px);transform:translate3d(0,4px,0) scale(.95)}
  68%{opacity:.94;filter:brightness(1.12) blur(1px) drop-shadow(0 0 18px rgba(255,204,0,.18));transform:translate3d(0,-1px,0) scale(1.018)}
  84%{opacity:1;filter:brightness(1.08) drop-shadow(0 0 11px rgba(255,204,0,.14));transform:translate3d(0,0,0) scale(1.006)}
  100%{opacity:1;filter:none;transform:translate3d(0,0,0) scale(1)}
}

/* The photo monogram begins visually around the T-shirt, swivels out, then docks. */
.hero-monogram.monogram-emerge-shirt{
  animation:monogramFromShirt 2.16s cubic-bezier(.18,.82,.18,1) both;
  transform-origin:50% 50%;
  z-index:8;
}
@keyframes monogramFromShirt{
  0%{
    opacity:0;
    transform:translate3d(-205px,-116px,0) rotate(-228deg) scale(.12);
    filter:brightness(.45) blur(12px) drop-shadow(0 0 0 rgba(255,204,0,0));
  }
  22%{
    opacity:.42;
    transform:translate3d(-190px,-106px,0) rotate(-178deg) scale(.28);
    filter:brightness(.72) blur(7px) drop-shadow(0 0 24px rgba(255,204,0,.34));
  }
  52%{
    opacity:.94;
    transform:translate3d(-96px,-62px,0) rotate(-72deg) scale(.72);
    filter:brightness(1.18) blur(1.8px) drop-shadow(0 0 32px rgba(255,204,0,.48));
  }
  76%{
    opacity:1;
    transform:translate3d(10px,5px,0) rotate(12deg) scale(1.10);
    filter:brightness(1.16) blur(0) drop-shadow(0 0 24px rgba(255,204,0,.34));
  }
  90%{
    transform:translate3d(-4px,-2px,0) rotate(-4deg) scale(.985);
    filter:brightness(1.05) drop-shadow(0 0 13px rgba(255,204,0,.22));
  }
  100%{
    opacity:1;
    transform:translate3d(0,0,0) rotate(0) scale(1);
    filter:none;
  }
}

/* Typed professional introduction. */
.hero-lead{
  position:relative;
  min-height:calc(2.7em + 8px);
}
.hero-lead.lead-awaiting{
  opacity:0;
}
.hero-lead.is-typing,
.hero-lead.lead-settled{
  opacity:1;
}
.hero-lead.is-typing::after{
  content:"";
  display:inline-block;
  width:2px;
  height:1.05em;
  margin-left:6px;
  vertical-align:-.11em;
  background:var(--brand-yellow);
  box-shadow:0 0 12px rgba(255,204,0,.55);
  animation:typingCaret .62s steps(1,end) infinite;
}
.hero-lead.lead-glow{
  animation:leadFinalGlow 1.15s ease-out both;
}
@keyframes typingCaret{50%{opacity:.15}}
@keyframes leadFinalGlow{
  0%{text-shadow:0 0 0 rgba(255,204,0,0)}
  38%{color:#eef2f7;text-shadow:0 0 18px rgba(255,204,0,.22)}
  100%{color:#c7ced8;text-shadow:none}
}

/* Hero wave becomes a living doorway into Voice Samples. */
.hero-wave-link{
  width:max-content;
  max-width:100%;
  height:auto;
  min-height:68px;
  display:inline-flex;
  align-items:center;
  gap:17px;
  margin-top:54px;
  padding:7px 13px 7px 1px;
  border-radius:18px;
  opacity:.9;
  transition:transform .35s var(--cinema-ease),opacity .3s ease,background .3s ease;
  cursor:pointer;
}
.hero-wave-link:hover,
.hero-wave-link:focus-visible{
  transform:translate3d(5px,-2px,0);
  opacity:1;
  background:linear-gradient(90deg,rgba(255,204,0,.035),transparent);
  outline:none;
}
.wave-bars{
  height:64px;
  display:flex;
  align-items:center;
  gap:5px;
}
.wave-bars i{
  transform-origin:center;
  animation:heroWaveLiving 2.45s ease-in-out infinite alternate;
  filter:drop-shadow(0 0 0 rgba(255,204,0,0));
}
.wave-bars i:nth-child(2n){animation-duration:1.92s}
.wave-bars i:nth-child(3n){animation-duration:2.88s}
.wave-bars i:nth-child(4n){animation-duration:2.18s}
.wave-bars i:nth-child(5n){animation-duration:3.1s}
.wave-bars i:nth-child(1){animation-delay:-.15s}.wave-bars i:nth-child(2){animation-delay:-.78s}
.wave-bars i:nth-child(3){animation-delay:-1.42s}.wave-bars i:nth-child(4){animation-delay:-.32s}
.wave-bars i:nth-child(5){animation-delay:-1.08s}.wave-bars i:nth-child(6){animation-delay:-.56s}
.wave-bars i:nth-child(7){animation-delay:-1.62s}.wave-bars i:nth-child(8){animation-delay:-.22s}
.wave-bars i:nth-child(9){animation-delay:-1.2s}.wave-bars i:nth-child(10){animation-delay:-.68s}
.wave-bars i:nth-child(11){animation-delay:-1.84s}.wave-bars i:nth-child(12){animation-delay:-.4s}
.wave-bars i:nth-child(13){animation-delay:-1.32s}.wave-bars i:nth-child(14){animation-delay:-.9s}
.wave-bars i:nth-child(15){animation-delay:-1.54s}.wave-bars i:nth-child(16){animation-delay:-.12s}
.wave-bars i:nth-child(17){animation-delay:-1.02s}.wave-bars i:nth-child(18){animation-delay:-.48s}
.hero-wave-link:hover .wave-bars i,
.hero-wave-link:focus-visible .wave-bars i{
  background:linear-gradient(180deg,#fff0a1,var(--brand-yellow) 44%,#608fbe);
  filter:drop-shadow(0 0 7px rgba(255,204,0,.3));
}
.wave-label{
  color:#aeb9c9;
  font-size:11px;
  font-weight:750;
  letter-spacing:.15em;
  text-transform:uppercase;
  white-space:nowrap;
}
.hero-wave-link:hover .wave-label{color:#f4f0d5}
@keyframes heroWaveLiving{
  0%{transform:scaleY(.58) translateY(2px);opacity:.52}
  48%{transform:scaleY(1.13) translateY(-1px);opacity:.96}
  100%{transform:scaleY(.76) translateY(1px);opacity:.72}
}

/* The automatic post-landing diagonal "cursor" showcase. */
.hero-media-frame.is-showcasing{
  transition:none;
}
.hero-media-frame.is-showcasing img{
  transition:none;
}
.hero-media-frame.is-showcasing::after{
  opacity:.92!important;
  background:
    radial-gradient(circle at var(--hero-light-x,50%) var(--hero-light-y,50%),rgba(255,240,179,.19),rgba(255,255,255,.075) 13%,transparent 35%);
}

/* Voice Samples is the first substantial section after the hero. */
.voice-theatre{
  position:relative;
  min-height:min(940px,92vh);
  display:flex;
  align-items:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 78% 30%,rgba(255,204,0,.055),transparent 26rem),
    radial-gradient(circle at 16% 78%,rgba(89,145,211,.10),transparent 32rem),
    linear-gradient(180deg,#05070a 0%,#090c11 54%,#06080b 100%);
}
.voice-theatre::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(115deg,transparent 12%,rgba(255,255,255,.018) 44%,transparent 68%);
  transform:translateX(-42%);
  opacity:.7;
}
.voice-theatre-head{
  margin-bottom:30px;
}
.voice-theatre-head h2{
  font-size:clamp(46px,6vw,86px);
}
.voice-theatre-head p{
  max-width:820px;
}
.samples{position:relative}
.player-card.voice-stage{
  min-height:500px;
  display:grid;
  grid-template-columns:minmax(0,.82fr) minmax(380px,1.18fr);
  grid-template-areas:
    "head story"
    "console console"
    "actions actions";
  gap:20px 46px;
  align-items:start;
  padding:38px 40px 30px;
  border-color:rgba(255,204,0,.26);
  border-radius:28px;
  background:
    radial-gradient(circle at 82% 18%,rgba(255,204,0,.075),transparent 25rem),
    radial-gradient(circle at 12% 84%,rgba(78,136,199,.13),transparent 32rem),
    linear-gradient(145deg,#0c1016,#05070a 72%);
  box-shadow:0 34px 100px rgba(0,0,0,.42),inset 0 0 70px rgba(255,255,255,.012);
  transition:border-color .45s ease,box-shadow .45s ease,transform .45s var(--cinema-ease);
}
.player-card.voice-stage:before{
  border-color:rgba(255,204,0,.22);
  box-shadow:inset 0 0 54px rgba(255,204,0,.025);
}
.voice-stage.is-playing{
  border-color:rgba(255,204,0,.58);
  box-shadow:0 42px 125px rgba(0,0,0,.58),0 0 70px rgba(255,204,0,.055),inset 0 0 90px rgba(255,204,0,.025);
}
.voice-stage-aurora{
  position:absolute;
  inset:-30%;
  z-index:0;
  pointer-events:none;
  opacity:.36;
  background:
    conic-gradient(from 110deg at 62% 44%,transparent 0 20%,rgba(255,204,0,.065) 29%,transparent 38% 60%,rgba(100,160,225,.055) 70%,transparent 80%);
  filter:blur(46px);
  transform:rotate(-10deg) scale(1.18);
  transition:opacity .6s ease;
}
.voice-stage.is-playing .voice-stage-aurora{
  opacity:.92;
  animation:voiceAurora 9s linear infinite;
}
@keyframes voiceAurora{to{transform:rotate(350deg) scale(1.22)}}
.voice-stage .sample-top,
.voice-stage .voice-story,
.voice-stage .player-console,
.voice-stage .demo-actions{position:relative;z-index:2}
.voice-stage .sample-top{grid-area:head}
.voice-now{
  display:block;
  margin-bottom:9px;
  color:var(--brand-yellow);
  font-size:10px;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.voice-stage .sample-top h3{
  font-size:clamp(29px,3.2vw,48px);
  line-height:1.02;
  letter-spacing:-.045em;
  max-width:620px;
}
.voice-stage .sample-top p{font-size:15px;margin-top:11px}
.voice-stage .tag{
  background:rgba(255,204,0,.055);
  border-color:rgba(255,204,0,.28);
  color:#eadf9a;
}
.voice-story{
  grid-area:story;
  align-self:center;
  min-height:190px;
  padding:24px 0 16px 26px;
  border-left:1px solid rgba(255,204,0,.22);
  opacity:.32;
  transform:translate3d(16px,8px,0);
  filter:blur(1.6px);
  transition:opacity .7s ease,transform .8s var(--cinema-ease),filter .7s ease;
}
.voice-story>span{
  display:block;
  margin-bottom:12px;
  color:#c4a900;
  font-size:10px;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.voice-story p{
  margin:0!important;
  color:#d9dde3!important;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(19px,2vw,28px)!important;
  line-height:1.4;
  max-width:720px;
}
.voice-stage.is-playing .voice-story{
  opacity:1;
  transform:translate3d(0,0,0);
  filter:none;
}
.voice-stage .player-console{
  grid-area:console;
  grid-template-columns:96px 1fr;
  gap:28px;
  align-items:center;
  margin-top:6px;
  padding-top:22px;
  border-top:1px solid rgba(255,255,255,.07);
}
.play-orb{
  position:relative;
  width:88px;
  height:88px;
  overflow:hidden;
  border:1px solid rgba(255,222,71,.52);
  background:
    radial-gradient(circle at 34% 28%,#fff4a9 0,#ffd71d 18%,#c79800 44%,#203346 74%,#0a1018 100%);
  color:#080a0d;
  box-shadow:0 0 0 8px rgba(255,204,0,.045),0 20px 58px rgba(0,0,0,.5),0 0 34px rgba(255,204,0,.12);
}
.play-orb::after{
  content:"";
  position:absolute;
  inset:-40%;
  background:linear-gradient(115deg,transparent 34%,rgba(255,255,255,.55) 49%,transparent 63%);
  transform:translateX(-70%) rotate(8deg);
  transition:transform .7s var(--cinema-ease);
}
.play-orb:hover::after{transform:translateX(70%) rotate(8deg)}
.play-orb:hover{
  transform:scale(1.045);
  box-shadow:0 0 0 9px rgba(255,204,0,.065),0 24px 68px rgba(0,0,0,.56),0 0 40px rgba(255,204,0,.22);
}
.is-playing .play-orb{
  animation:pulsePlayerV12 2.5s ease-in-out infinite;
}
@keyframes pulsePlayerV12{
  50%{box-shadow:0 0 0 18px rgba(255,204,0,.018),0 24px 74px rgba(0,0,0,.58),0 0 48px rgba(255,204,0,.21)}
}
.voice-wave-shell{
  position:relative;
  height:148px;
  overflow:hidden;
  border-radius:18px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.012),rgba(255,255,255,.002)),
    radial-gradient(circle at 50% 50%,rgba(255,204,0,.025),transparent 62%);
}
.voice-wave-shell::before,
.voice-wave-shell::after{
  content:"";
  position:absolute;
  left:0;right:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.09),transparent);
  pointer-events:none;
}
.voice-wave-shell::before{top:33%}.voice-wave-shell::after{top:66%}
.voice-wave-canvas{
  display:block;
  width:100%;
  height:100%;
}
.voice-playhead{
  position:absolute;
  top:13%;
  bottom:13%;
  left:calc(var(--voice-progress,0) * 100%);
  width:1px;
  background:linear-gradient(180deg,transparent,var(--brand-yellow),transparent);
  box-shadow:0 0 12px rgba(255,204,0,.45);
  opacity:.6;
  transition:left .08s linear;
  pointer-events:none;
}
.player-seek{
  height:2px;
  margin:6px 0 8px;
  background:linear-gradient(90deg,rgba(255,204,0,.6) 0 calc(var(--voice-progress,0) * 100%),#28313d calc(var(--voice-progress,0) * 100%) 100%);
}
.player-seek::-webkit-slider-thumb{
  width:12px;height:12px;
  background:var(--brand-yellow-soft);
  box-shadow:0 0 0 4px rgba(255,204,0,.09),0 0 18px rgba(255,204,0,.22);
}
.player-time{color:#8f96a0}
.voice-stage .demo-actions{grid-area:actions;border-color:rgba(255,255,255,.07)}
.sample-queue-card{
  opacity:.62;
  background:linear-gradient(145deg,rgba(255,255,255,.024),rgba(255,255,255,.009));
  transition:opacity .3s ease,transform .35s var(--cinema-ease),border-color .3s ease;
}
.sample-queue-card:hover{opacity:.9;transform:translateY(-3px);border-color:rgba(255,204,0,.16)}
.sample-queue-card .pending::before{
  content:"Queued for the listening theatre · ";
  color:#b9a74b;
}

/* Scroll choreography. JS continuously supplies transforms while elements enter. */
.cinema-item{
  will-change:transform,opacity,filter;
  transform-origin:center;
  backface-visibility:hidden;
}
.section-head.cinema-item h2,
.credit.cinema-item h3,
.profile-block.cinema-item h3{
  transition:text-shadow .24s ease,color .24s ease;
}
.metric,
.card,
.credit,
.profile-block{
  position:relative;
  overflow:hidden;
}
.metric::after,
.card::after,
.profile-block::after{
  content:"";
  position:absolute;
  inset:-45% -80%;
  pointer-events:none;
  background:linear-gradient(110deg,transparent 42%,rgba(255,239,166,.055) 49%,rgba(122,182,246,.05) 52%,transparent 60%);
  transform:translateX(-28%) rotate(6deg);
  opacity:0;
  transition:opacity .3s ease,transform .8s var(--cinema-ease);
}
.metric:hover::after,
.card:hover::after,
.profile-block:hover::after{
  opacity:1;
  transform:translateX(28%) rotate(6deg);
}
.metric:hover,
.card:hover,
.profile-block:hover{
  border-color:rgba(255,204,0,.20);
}

/* Dark-room transition for the visual portfolio. */
body,
header,
#stage{
  transition:background-color .75s ease,background .75s ease,border-color .75s ease;
}
#stage{
  position:relative;
  isolation:isolate;
}
#stage::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:0;
  transition:opacity .85s ease;
  background:
    radial-gradient(circle at 50% 9%,rgba(255,204,0,.035),transparent 24rem),
    radial-gradient(circle at 16% 52%,rgba(68,106,151,.055),transparent 34rem),
    #020305;
}
body.visual-room-active #stage::before{opacity:1}
body.visual-room-active header{background:rgba(2,3,5,.91)}
body.visual-room-active #stage{border-color:rgba(255,255,255,.035)}
body.visual-room-active .visual-card,
body.visual-room-active .mc-card,
body.visual-room-active .expanded-video-card{
  box-shadow:0 24px 75px rgba(0,0,0,.46);
}
.visual-card img,
.mc-card img{
  cursor:zoom-in;
  transition:transform .65s var(--cinema-ease),filter .55s ease;
}
.visual-card:hover img,
.mc-card:hover img{
  transform:scale(1.018);
  filter:saturate(1.02) contrast(1.02);
}

/* Fullscreen editorial lightbox for the visual portfolio. */
.cinema-lightbox{
  position:fixed;
  inset:0;
  z-index:300;
  display:grid;
  grid-template-columns:84px minmax(0,1fr) 84px;
  grid-template-rows:minmax(0,1fr) auto;
  align-items:center;
  gap:14px;
  padding:26px;
  background:rgba(0,0,0,.94);
  backdrop-filter:blur(18px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .4s ease,visibility .4s ease;
}
.cinema-lightbox.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.cinema-lightbox-stage{
  min-width:0;
  min-height:0;
  height:calc(100vh - 118px);
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:24px;
  overflow:hidden;
  background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.025),transparent 45%);
}
.cinema-lightbox-stage img{
  display:block;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  opacity:0;
  transform:scale(.965);
  transition:opacity .35s ease,transform .55s var(--cinema-ease);
}
.cinema-lightbox.is-open .cinema-lightbox-stage img{
  opacity:1;
  transform:scale(1);
}
.cinema-lightbox-btn{
  width:58px;height:58px;
  justify-self:center;
  border-radius:50%;
  border:1px solid rgba(255,204,0,.28);
  background:rgba(11,13,17,.82);
  color:#f2f3f5;
  font-size:24px;
  cursor:pointer;
  transition:transform .25s ease,border-color .25s ease,background .25s ease;
}
.cinema-lightbox-btn:hover{transform:scale(1.06);border-color:rgba(255,204,0,.7);background:rgba(19,20,20,.94)}
.cinema-lightbox-close{
  position:absolute;
  top:24px;right:26px;
  z-index:2;
}
.cinema-lightbox-caption{
  grid-column:1/-1;
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:center;
  padding:0 8px;
  color:#929aa6;
  font-size:12px;
  letter-spacing:.05em;
}
.cinema-lightbox-caption strong{color:#f1d553;font-size:13px}
body.lightbox-open{overflow:hidden}

/* Give sections a quieter, more continuous editorial transition. */
main>section:not(.hero){
  scroll-margin-top:108px;
}
main>section .wrap{
  position:relative;
}

/* Reduced motion: preserve composition, remove choreography. */
@media(prefers-reduced-motion:reduce){
  .wave-bars i,
  .voice-stage.is-playing .voice-stage-aurora,
  .is-playing .play-orb{animation:none!important}
  .hero-lead.lead-awaiting{opacity:1!important}
  .cinema-item{opacity:1!important;transform:none!important;filter:none!important}
  .hero-monogram.monogram-emerge-shirt{animation:none!important;opacity:1!important;transform:none!important;filter:none!important}
}

/* Responsive cinematic player and monogram path. */
@media(max-width:980px){
  .player-card.voice-stage{
    grid-template-columns:1fr;
    grid-template-areas:"head" "story" "console" "actions";
    min-height:0;
  }
  .voice-story{
    min-height:0;
    padding:18px 0 8px;
    border-left:0;
    border-top:1px solid rgba(255,204,0,.18);
  }
}
@media(max-width:820px){
  .voice-theatre{min-height:0}
  .voice-theatre-head h2{font-size:clamp(42px,11vw,68px)}
  .player-card.voice-stage{padding:26px 22px 24px;gap:16px}
  .voice-stage .player-console{grid-template-columns:74px 1fr;gap:17px}
  .play-orb{width:70px;height:70px;font-size:21px}
  .voice-wave-shell{height:112px}
  .hero-monogram.monogram-emerge-shirt{
    animation-name:monogramFromShirtMobile;
  }
  @keyframes monogramFromShirtMobile{
    0%{opacity:0;transform:translate3d(-92px,-104px,0) rotate(-210deg) scale(.14);filter:brightness(.45) blur(10px)}
    48%{opacity:.88;transform:translate3d(-48px,-62px,0) rotate(-86deg) scale(.68);filter:brightness(1.15) blur(2px) drop-shadow(0 0 26px rgba(255,204,0,.42))}
    78%{opacity:1;transform:translate3d(7px,4px,0) rotate(10deg) scale(1.08);filter:brightness(1.12) drop-shadow(0 0 20px rgba(255,204,0,.28))}
    100%{opacity:1;transform:none;filter:none}
  }
}
@media(max-width:620px){
  .hero-wave-link{margin-top:38px}
  .wave-label{display:none}
  .player-card.voice-stage{border-radius:22px}
  .voice-stage .sample-top{display:block}
  .voice-stage .sample-top .tag{margin-top:12px}
  .voice-stage .player-console{grid-template-columns:1fr}
  .play-orb{justify-self:start}
  .voice-wave-shell{height:104px}
  .voice-story p{font-size:19px!important}
  .cinema-lightbox{
    grid-template-columns:48px minmax(0,1fr) 48px;
    padding:14px;
  }
  .cinema-lightbox-stage{height:calc(100vh - 112px)}
  .cinema-lightbox-btn{width:42px;height:42px;font-size:19px}
  .cinema-lightbox-close{top:14px;right:14px}
  .cinema-lightbox-caption{font-size:10px}
}


/* V12 detail pass: monogram launch trail + voice-section arrival cue. */
.hero-monogram::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:180px;
  height:2px;
  pointer-events:none;
  opacity:0;
  transform-origin:right center;
  background:linear-gradient(90deg,transparent,rgba(255,204,0,.08),rgba(255,234,128,.72));
  filter:blur(.2px) drop-shadow(0 0 8px rgba(255,204,0,.28));
}
.hero-monogram.monogram-emerge-shirt::before{
  animation:monogramTrail 2.16s ease-out both;
}
@keyframes monogramTrail{
  0%,18%{opacity:0;transform:translate3d(-185px,-104px,0) rotate(28deg) scaleX(.18)}
  42%{opacity:.72;transform:translate3d(-128px,-78px,0) rotate(22deg) scaleX(.72)}
  68%{opacity:.34;transform:translate3d(-36px,-24px,0) rotate(12deg) scaleX(.42)}
  100%{opacity:0;transform:translate3d(0,0,0) rotate(0) scaleX(.05)}
}
.voice-theatre.is-arriving .voice-stage{
  animation:voiceTheatreArrival 1.15s var(--cinema-ease) both;
}
@keyframes voiceTheatreArrival{
  0%{box-shadow:0 34px 100px rgba(0,0,0,.42),0 0 0 rgba(255,204,0,0)}
  46%{box-shadow:0 38px 112px rgba(0,0,0,.5),0 0 62px rgba(255,204,0,.075)}
  100%{box-shadow:0 34px 100px rgba(0,0,0,.42),0 0 0 rgba(255,204,0,0)}
}
@media(prefers-reduced-motion:reduce){
  .hero-monogram.monogram-emerge-shirt::before,
  .voice-theatre.is-arriving .voice-stage{animation:none!important}
}


/* Listening-state focus: supporting copy appears only when the sample is active. */
.voice-story{
  opacity:0;
  filter:blur(6px);
  transform:translate3d(18px,10px,0) scale(.985);
}
.voice-theatre-head,
.sample-queue-card{
  transition:opacity .55s ease,filter .55s ease,transform .65s var(--cinema-ease);
}
.voice-theatre.is-listening .voice-theatre-head{
  opacity:.36;
  filter:blur(.45px);
  transform:translate3d(0,-8px,0) scale(.992);
}
.voice-theatre.is-listening .sample-queue-card{
  opacity:.28;
  filter:saturate(.72);
}
.voice-theatre.is-listening .voice-stage{
  transform:scale(1.006);
}
@media(prefers-reduced-motion:reduce){
  .voice-theatre.is-listening .voice-theatre-head,
  .voice-theatre.is-listening .voice-stage,
  .voice-theatre.is-listening .sample-queue-card{transform:none!important}
}


/* Hero supporting controls wait for the story/text, then arrive with the branding. */
.hero-actions.support-awaiting,
.hero-wave-link.support-awaiting{
  opacity:0;
  transform:translate3d(-14px,10px,0);
  pointer-events:none;
}
.hero-actions.support-reveal,
.hero-wave-link.support-reveal{
  animation:heroSupportReveal 1.45s var(--cinema-ease) both;
}
@keyframes heroSupportReveal{
  0%{opacity:0;filter:blur(5px);transform:translate3d(-14px,10px,0)}
  54%{opacity:1;filter:blur(.4px);transform:translate3d(2px,-1px,0)}
  100%{opacity:1;filter:none;transform:translate3d(0,0,0)}
}
@media(prefers-reduced-motion:reduce){
  .hero-actions.support-awaiting,
  .hero-wave-link.support-awaiting,
  .hero-actions.support-reveal,
  .hero-wave-link.support-reveal{
    opacity:1!important;transform:none!important;filter:none!important;animation:none!important;pointer-events:auto!important
  }
}


/* V12.1 · cinematic return-to-top glide */
.top-flight-layer{
  --top-flight-y:0px;
  --top-flight-progress:0;
  position:fixed;
  inset:0;
  z-index:79;
  pointer-events:none;
  opacity:0;
  visibility:hidden;
  transition:opacity .24s ease,visibility .24s ease;
}
body.returning-top .top-flight-layer{
  opacity:1;
  visibility:visible;
}
.top-flight-rail{
  position:absolute;
  right:47px;
  top:26px;
  bottom:73px;
  width:1px;
  opacity:.52;
  background:linear-gradient(
    180deg,
    transparent 0,
    rgba(255,204,0,.16) 18%,
    rgba(255,204,0,.34) 52%,
    rgba(255,204,0,.10) 82%,
    transparent 100%
  );
  box-shadow:0 0 12px rgba(255,204,0,.06);
}
.top-flight-comet{
  position:absolute;
  right:42px;
  bottom:68px;
  width:11px;
  height:11px;
  border-radius:50%;
  transform:translate3d(0,var(--top-flight-y),0);
  background:#ffe66d;
  border:1px solid rgba(255,244,181,.9);
  box-shadow:
    0 0 0 5px rgba(255,204,0,.045),
    0 0 18px rgba(255,204,0,.52),
    0 0 42px rgba(255,204,0,.18);
  will-change:transform;
}
.top-flight-comet::after{
  content:"";
  position:absolute;
  left:50%;
  top:10px;
  width:1px;
  height:92px;
  transform:translateX(-50%);
  background:linear-gradient(180deg,rgba(255,225,89,.55),rgba(255,204,0,.10),transparent);
  filter:blur(.15px);
}
.top-flight-glow{
  position:absolute;
  right:18px;
  top:0;
  bottom:0;
  width:58px;
  opacity:.14;
  background:linear-gradient(90deg,transparent,rgba(255,204,0,.025),transparent);
  filter:blur(8px);
}
.go-top.is-returning{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:none!important;
  border-color:rgba(255,204,0,.95);
  background:rgba(5,6,8,.96);
  box-shadow:0 14px 36px rgba(0,0,0,.45),0 0 24px rgba(255,204,0,.10);
  transform:translate3d(0,0,0) scale(.94);
}
.go-top.is-returning span{
  animation:topArrowLift .72s ease-in-out infinite alternate;
}
@keyframes topArrowLift{
  from{transform:translate3d(0,2px,0);opacity:.72}
  to{transform:translate3d(0,-3px,0);opacity:1}
}

/* During the return flight, suppress the section-by-section reverse choreography.
   The page itself glides; cards and headings remain calm. */
body.returning-top #stage::before,
body.returning-top header,
body.returning-top .cinema-item,
body.returning-top .metric::after,
body.returning-top .card::after,
body.returning-top .profile-block::after{
  transition:none!important;
}

/* Quiet arrival cue rather than replaying the hero animation. */
body.top-arrived .brand-logo img{
  animation:topArrivalLogo .82s ease-out both;
}
@keyframes topArrivalLogo{
  0%{filter:none}
  42%{filter:brightness(1.15) drop-shadow(0 0 14px rgba(255,204,0,.22))}
  100%{filter:none}
}

@media(max-width:620px){
  .top-flight-rail{right:36px;bottom:63px}
  .top-flight-comet{right:31px;bottom:58px}
  .top-flight-glow{right:7px;width:58px}
}
@media(prefers-reduced-motion:reduce){
  .top-flight-layer{display:none!important}
  .go-top.is-returning span,
  body.top-arrived .brand-logo img{animation:none!important}
}


/* V12.2 · staged hero actions and first-fold composition */
.hero{
  min-height:calc(100svh - 110px);
}
.hero-cta-stack{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  width:max-content;
  max-width:100%;
  margin-top:clamp(96px,10vh,128px);
  gap:34px;
}
.hero-cta-stack .hero-wave-link{
  margin-top:0;
}
.hero-cta-stack .wave-label{
  font-size:12px;
  letter-spacing:.16em;
  color:#c3ccd8;
}
.hero-work-link{
  position:relative;
  margin-left:174px;
  padding:0 0 8px;
  color:#aeb9c9;
  font-size:11px;
  font-weight:760;
  letter-spacing:.15em;
  text-transform:uppercase;
  white-space:nowrap;
  transition:color .28s ease,transform .34s var(--cinema-ease);
}
.hero-work-link::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:1px;
  transform-origin:left center;
  transform:scaleX(.42);
  background:linear-gradient(90deg,rgba(255,204,0,.72),rgba(123,185,255,.40),transparent);
  transition:transform .42s var(--cinema-ease),opacity .3s ease;
  opacity:.62;
}
.hero-work-link:hover,
.hero-work-link:focus-visible{
  color:#f4f6f8;
  transform:translate3d(3px,0,0);
  outline:none;
}
.hero-work-link:hover::after,
.hero-work-link:focus-visible::after{
  transform:scaleX(1);
  opacity:1;
}
.hero-cta-stack.support-awaiting{
  opacity:0;
  transform:translate3d(-14px,10px,0);
  pointer-events:none;
}
.hero-cta-stack.support-reveal{
  animation:heroSupportReveal 1.45s var(--cinema-ease) both;
}
@media(max-width:980px){
  .hero-cta-stack{
    margin-top:82px;
    gap:30px;
  }
  .hero-work-link{margin-left:0}
}
@media(max-width:620px){
  .hero{
    min-height:calc(100svh - 110px);
  }
  .hero-cta-stack{
    margin-top:74px;
    gap:34px;
  }
  .hero-cta-stack .wave-label{display:inline}
  .hero-work-link{
    margin-left:0;
    font-size:10px;
  }
}
@media(prefers-reduced-motion:reduce){
  .hero-cta-stack.support-awaiting,
  .hero-cta-stack.support-reveal{
    opacity:1!important;
    transform:none!important;
    animation:none!important;
    pointer-events:auto!important;
  }
}


/* V12.3 · stable hero geometry + wave-first CTA reveal */
.hero-wave-flourish{
  width:max-content;
  min-height:64px;
  display:flex;
  align-items:center;
  opacity:1;
  transform-origin:center;
}
.hero-wave-flourish.wave-awaiting{
  opacity:0;
  transform:translate3d(-16px,8px,0) scale(.94);
}
.hero-wave-flourish.wave-solo{
  animation:heroWaveSolo 1s cubic-bezier(.2,.78,.2,1) both;
}
.hero-wave-flourish.wave-settled{
  opacity:1;
  transform:none;
}
@keyframes heroWaveSolo{
  0%{
    opacity:0;
    filter:blur(5px);
    transform:translate3d(-22px,8px,0) scale(.90) rotate(-1.8deg);
  }
  28%{
    opacity:1;
    filter:blur(.5px);
    transform:translate3d(8px,-4px,0) scale(1.045) rotate(.8deg);
  }
  54%{
    transform:translate3d(-5px,3px,0) scale(.985) rotate(-.35deg);
  }
  78%{
    transform:translate3d(3px,-1px,0) scale(1.012) rotate(.12deg);
  }
  100%{
    opacity:1;
    filter:none;
    transform:translate3d(0,0,0) scale(1) rotate(0);
  }
}
.hero-wave-flourish .wave-bars{
  height:64px;
}
.hero-cta-buttons{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  min-height:46px;
}
.hero-cta-buttons.cta-buttons-awaiting{
  opacity:0;
  transform:translate3d(0,12px,0) scale(.985);
  pointer-events:none;
}
.hero-cta-buttons.cta-buttons-reveal{
  animation:heroCtaButtonsReveal 1.45s var(--cinema-ease) both;
}
@keyframes heroCtaButtonsReveal{
  0%{
    opacity:0;
    filter:blur(5px);
    transform:translate3d(0,12px,0) scale(.985);
  }
  46%{
    opacity:1;
    filter:blur(.4px);
    transform:translate3d(0,-2px,0) scale(1.012);
  }
  100%{
    opacity:1;
    filter:none;
    transform:translate3d(0,0,0) scale(1);
  }
}
.hero-cta-buttons .btn{
  min-width:148px;
}
.hero-cta-buttons .hero-work-button{
  min-width:196px;
}
.hero-cta-stack{
  gap:34px;
}
@media(max-width:620px){
  .hero-cta-buttons{
    gap:10px;
  }
  .hero-cta-buttons .btn,
  .hero-cta-buttons .hero-work-button{
    min-width:0;
  }
}
@media(prefers-reduced-motion:reduce){
  .hero-wave-flourish.wave-awaiting,
  .hero-wave-flourish.wave-solo,
  .hero-wave-flourish.wave-settled,
  .hero-cta-buttons.cta-buttons-awaiting,
  .hero-cta-buttons.cta-buttons-reveal{
    opacity:1!important;
    filter:none!important;
    transform:none!important;
    animation:none!important;
    pointer-events:auto!important;
  }
}

.hero-wave-flourish .wave-bars i{
  display:block;
  width:4px;
  border-radius:4px;
  height:var(--h);
  background:linear-gradient(#a8d2ff,#4b80bb);
}


/* V12.4 · optical hero alignment + restored editorial CTA interactions */
@media(min-width:981px){
  /* Align the top of the headline block with the outer portrait card.
     The eyebrow remains above as a separate kicker, gaining deliberate breathing room. */
  .hero h1.hero-title{
    margin-top:90px;
  }
  /* The title shift replaces the former large CTA spacer, so the actions stay
     inside the first fold instead of being pushed down with the copy. */
  .hero-cta-stack{
    margin-top:0;
  }
}

/* Restore the V12.2 CTA language: living wave + text link, then the
   understated Selected Work link with the animated yellow underline. */
.hero-wave-flourish{
  width:max-content;
  max-width:100%;
}
.hero-wave-flourish.cta-disabled,
.hero-wave-flourish.wave-awaiting{
  pointer-events:none;
}
.hero-wave-flourish.wave-settled{
  pointer-events:auto;
}
.hero-wave-flourish .wave-label{
  opacity:1;
  transform:none;
  transition:
    opacity .48s ease,
    transform .55s var(--cinema-ease),
    color .28s ease;
}
.hero-wave-flourish .wave-label.cta-label-awaiting{
  opacity:0;
  transform:translate3d(-8px,4px,0);
}
.hero-work-link.cta-secondary-awaiting{
  opacity:0;
  transform:translate3d(-8px,6px,0);
  pointer-events:none;
}
.hero-wave-flourish .wave-label.cta-text-reveal,
.hero-work-link.cta-text-reveal{
  animation:heroCtaTextReveal 1.45s var(--cinema-ease) both;
}
@keyframes heroCtaTextReveal{
  0%{opacity:0;filter:blur(4px);transform:translate3d(-8px,6px,0)}
  52%{opacity:1;filter:blur(.3px);transform:translate3d(2px,-1px,0)}
  100%{opacity:1;filter:none;transform:translate3d(0,0,0)}
}

/* Make the wave itself feel tactile again. */
.hero-wave-link{
  transition:
    transform .35s var(--cinema-ease),
    opacity .3s ease,
    background .3s ease,
    box-shadow .35s ease;
}
.hero-wave-link:hover,
.hero-wave-link:focus-visible{
  transform:translate3d(5px,-2px,0);
  opacity:1;
  background:linear-gradient(90deg,rgba(255,204,0,.048),rgba(255,204,0,.012) 52%,transparent);
  box-shadow:0 0 34px rgba(255,204,0,.035);
  outline:none;
}
.hero-wave-link:hover .wave-bars i,
.hero-wave-link:focus-visible .wave-bars i{
  background:linear-gradient(180deg,#fff0a1,var(--brand-yellow) 44%,#608fbe);
  filter:drop-shadow(0 0 7px rgba(255,204,0,.34));
}
.hero-wave-link:hover .wave-label,
.hero-wave-link:focus-visible .wave-label{
  color:#f4f0d5;
  text-shadow:0 0 14px rgba(255,204,0,.16);
}

/* Preserve the earlier elegant underline interaction. */
.hero-work-link{
  opacity:1;
  pointer-events:auto;
  transition:
    color .28s ease,
    transform .34s var(--cinema-ease),
    opacity .45s ease;
}
.hero-work-link::after{
  background:linear-gradient(90deg,rgba(255,204,0,.82),rgba(123,185,255,.38),transparent);
}
.hero-work-link:hover::after,
.hero-work-link:focus-visible::after{
  transform:scaleX(1);
  opacity:1;
}

@media(max-width:980px){
  .hero-title{
    margin-top:18px;
  }
  .hero-cta-stack{
    margin-top:82px;
  }
}
@media(prefers-reduced-motion:reduce){
  .hero-wave-flourish .wave-label.cta-label-awaiting,
  .hero-work-link.cta-secondary-awaiting,
  .hero-wave-flourish .wave-label.cta-text-reveal,
  .hero-work-link.cta-text-reveal{
    opacity:1!important;
    filter:none!important;
    transform:none!important;
    animation:none!important;
    pointer-events:auto!important;
  }
}


/* V12.5 · headline hold, spacing, CTA depth, typography, LinguaSlate parity */

/* Global navigation and eyebrow scale-up requested for the desktop experience. */
.navlinks{
  font-size:16px;
}
.eyebrow{
  font-size:15px;
}

/* Let the yellow VOICE moment register for ~0.7s longer before the
   headline settles and the 0.5s type-on pause begins. */
.hero-title.is-assembling .hero-word-voice{
  animation-duration:3.04s;
}
@keyframes heroVoiceAssemble{
  0%{
    opacity:0;
    filter:blur(7px);
    color:#ffcc00;
    text-shadow:0 0 0 rgba(255,204,0,0);
    transform:translate3d(var(--dx),var(--dy),0) rotate(var(--rot)) scale(var(--sc));
  }
  42%{
    opacity:1;
    filter:blur(.6px);
    color:#ffcc00;
    text-shadow:0 0 25px rgba(255,204,0,.60);
    transform:translate3d(1px,-2px,0) rotate(.15deg) scale(1.055);
  }
  78%{
    opacity:1;
    filter:none;
    color:#ffcc00;
    text-shadow:0 0 16px rgba(255,204,0,.34);
    transform:translate3d(0,0,0) rotate(0) scale(1);
  }
  89%{
    color:#ffd83f;
    text-shadow:0 0 10px rgba(255,204,0,.20);
    transform:translate3d(0,0,0) rotate(0) scale(1);
  }
  100%{
    opacity:1;
    filter:none;
    color:inherit;
    text-shadow:none;
    transform:translate3d(0,0,0) rotate(0) scale(1);
  }
}

/* Add ~0.5 cm of extra air between the hero headline and typed paragraph. */
.hero h1.hero-title{
  margin-bottom:45px;
}

/* Drop the wave + both CTA texts by about two CSS inches as one unit. */
@media(min-width:981px){
  .hero-cta-stack{
    margin-top:192px;
  }
}

/* CTA type increased by ~2px/points while preserving the editorial hierarchy. */
.hero-cta-stack .wave-label{
  font-size:14px;
}
.hero-work-link{
  font-size:13px;
}

/* No physical displacement on hover: only tone, glow and underline energy. */
.hero-wave-link:hover,
.hero-wave-link:focus-visible{
  transform:none;
  background:linear-gradient(90deg,rgba(255,204,0,.052),rgba(255,204,0,.014) 54%,transparent);
  box-shadow:0 0 36px rgba(255,204,0,.05);
}
.hero-wave-link:hover .wave-label,
.hero-wave-link:focus-visible .wave-label{
  color:var(--brand-yellow);
  text-shadow:0 0 16px rgba(255,204,0,.23);
}
.hero-work-link:hover,
.hero-work-link:focus-visible{
  color:var(--brand-yellow);
  transform:none;
}

/* Make the underline easier to register even before hover, while retaining
   the animated expansion to the full width of the final word. */
.hero-work-link::after{
  height:2px;
  transform:scaleX(.68);
  opacity:.82;
  box-shadow:0 0 8px rgba(255,204,0,.08);
}
.hero-work-link:hover::after,
.hero-work-link:focus-visible::after{
  transform:scaleX(1);
  opacity:1;
  box-shadow:0 0 11px rgba(255,204,0,.15);
}

/* LinguaSlate: use the same headline-distance rhythm as the Gaurav hero
   and force a high-contrast reverse treatment for the dark header. */
@media(min-width:981px){
  .ls-hero h1{
    margin-top:90px;
    margin-bottom:45px;
  }
}
.ls-logo img{
  filter:brightness(0) invert(1);
  opacity:.96;
}

/* Keep compact layouts proportionate rather than inheriting desktop offsets. */
@media(max-width:980px){
  .navlinks{font-size:15px}
  .eyebrow{font-size:14px}
  .hero-cta-stack{margin-top:92px}
  .hero h1.hero-title{margin-bottom:38px}
  .ls-hero h1{margin-top:30px;margin-bottom:38px}
}
@media(max-width:620px){
  .hero-cta-stack .wave-label{font-size:12px}
  .hero-work-link{font-size:11px}
}


/* V12.5 geometry lock: keep portrait top aligned to the headline even though
   the CTA unit is intentionally pushed much farther down. */
@media(min-width:981px){
  .hero-visual{
    align-self:start;
    margin-top:113px;
  }
}
@media(max-width:980px){
  .hero-visual{
    align-self:auto;
    margin-top:0;
  }
}


/* V12.6 · longer VOICE hold + slower typing + left-to-right CTA sweep */
.hero-title.is-assembling .hero-word-voice{
  animation-duration:3.44s;
}

/* The waveform + Hear the Voice reveal as one horizontal wipe over ~3s. */
.hero-wave-flourish.wave-solo{
  animation:heroWaveRevealV126 3s cubic-bezier(.2,.72,.18,1) both;
  overflow:hidden;
  will-change:clip-path,opacity,filter;
}
@keyframes heroWaveRevealV126{
  0%{
    opacity:0;
    filter:blur(5px);
    clip-path:inset(0 100% 0 0 round 16px);
  }
  18%{
    opacity:.55;
    filter:blur(2.8px);
  }
  55%{
    opacity:.92;
    filter:blur(.7px);
  }
  100%{
    opacity:1;
    filter:none;
    clip-path:inset(0 0 0 0 round 16px);
  }
}

/* Another +2px from V12.5. */
.hero-cta-stack .wave-label{
  font-size:16px;
}
.hero-work-link{
  font-size:15px;
}

@media(max-width:620px){
  .hero-cta-stack .wave-label{font-size:14px}
  .hero-work-link{font-size:13px}
}
@media(prefers-reduced-motion:reduce){
  .hero-wave-flourish.wave-solo{
    animation:none!important;
    opacity:1!important;
    filter:none!important;
    clip-path:none!important;
  }
}


/* V12.7 · logo scale + longer VOICE hold + slower type-on + 4.1s CTA sweep */
@media(min-width:981px){
  /* 10% larger while preserving the exact top-left anchor of the current mark. */
  .brand-logo img{
    transform:scale(1.10);
    transform-origin:left top;
  }
}

.hero-title.is-assembling .hero-word-voice{
  animation-duration:3.74s;
}

.hero-wave-flourish.wave-solo{
  animation-duration:9s;
}


/* V12.8 · fixed-layout typewriter: words occupy final positions from frame one */
.hero-lead.is-typing::after{
  display:none;
}
.lead-type-layer{
  display:inline;
}
.lead-word-slot{
  display:inline;
  white-space:nowrap;
}
.lead-char{
  position:relative;
  opacity:0;
}
.lead-char.is-visible{
  opacity:1;
}
.lead-char.is-current::after{
  content:"";
  position:absolute;
  right:-4px;
  top:.05em;
  width:2px;
  height:1.05em;
  background:var(--brand-yellow);
  box-shadow:0 0 12px rgba(255,204,0,.55);
  animation:typingCaret .62s steps(1,end) infinite;
  pointer-events:none;
}
@media(prefers-reduced-motion:reduce){
  .lead-char{opacity:1!important}
  .lead-char.is-current::after{display:none!important}
}


/* V12.9 · headline language + disciplined typed-copy measure */
@media(min-width:981px){
  /* Keep the typed paragraph visually under the headline instead of letting it
     run toward the portrait. This right edge aligns with the headline's
     story/character line at the audited wide-desktop composition. */
  .hero .lead.hero-lead{
    max-width:640px;
    text-align:left;
    text-indent:0;
  }
}
.lead-phrase-slot{
  white-space:nowrap;
}


/* V12.10 · headline motion tuning for “with depth … soul” */
.hero-word.w-with{--dx:15px;--dy:-12px;--rot:2.2deg}
.hero-word.w-depth{--dx:-12px;--dy:10px;--rot:-1.9deg}
.hero-word.w-soul{--dx:-10px;--dy:-8px;--rot:-1.8deg}


/* V12.11 · cinematic intro soundtrack controls */
.cinematic-audio-dock{
  position:fixed;
  left:24px;
  bottom:22px;
  z-index:92;
  display:flex;
  align-items:center;
  gap:7px;
  padding:5px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:999px;
  background:rgba(5,7,10,.76);
  box-shadow:0 14px 38px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.025);
  backdrop-filter:blur(14px);
  opacity:.82;
  transition:opacity .28s ease,border-color .28s ease,background .28s ease,transform .32s var(--cinema-ease);
}
.cinematic-audio-dock:hover,
.cinematic-audio-dock:focus-within{
  opacity:1;
  border-color:rgba(255,204,0,.20);
  background:rgba(7,9,12,.92);
}
.cinematic-audio-play,
.cinematic-audio-mute{
  appearance:none;
  border:0;
  color:#b8c1cd;
  background:transparent;
  font:inherit;
  cursor:pointer;
}
.cinematic-audio-play{
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:34px;
  padding:0 12px 0 9px;
  border-radius:999px;
  font-size:11px;
  font-weight:760;
  letter-spacing:.08em;
  text-transform:uppercase;
  white-space:nowrap;
  transition:color .25s ease,background .25s ease;
}
.cinematic-audio-play:hover,
.cinematic-audio-play:focus-visible{
  color:#f5e9a5;
  background:rgba(255,204,0,.045);
  outline:none;
}
.cinematic-audio-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#758296;
  box-shadow:0 0 0 4px rgba(117,130,150,.055);
  transition:background .25s ease,box-shadow .25s ease,transform .25s ease;
}
.cinematic-audio-dock.is-active .cinematic-audio-dot{
  background:var(--brand-yellow);
  box-shadow:0 0 0 4px rgba(255,204,0,.055),0 0 15px rgba(255,204,0,.28);
  animation:cinematicSoundPulse 1.8s ease-in-out infinite;
}
@keyframes cinematicSoundPulse{
  50%{transform:scale(1.18);box-shadow:0 0 0 7px rgba(255,204,0,.025),0 0 18px rgba(255,204,0,.34)}
}
.cinematic-audio-mute{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.07);
  font-size:13px;
  transition:color .25s ease,border-color .25s ease,background .25s ease;
}
.cinematic-audio-mute:hover,
.cinematic-audio-mute:focus-visible{
  color:var(--brand-yellow);
  border-color:rgba(255,204,0,.24);
  background:rgba(255,204,0,.04);
  outline:none;
}
.cinematic-audio-mute.is-muted{
  color:#687383;
  opacity:.72;
}
.cinematic-audio-dock.has-error{
  border-color:rgba(255,132,100,.25);
}
@media(max-width:620px){
  .cinematic-audio-dock{
    left:12px;
    bottom:12px;
    max-width:calc(100vw - 24px);
  }
  .cinematic-audio-play{
    font-size:10px;
    letter-spacing:.06em;
  }
}
@media(prefers-reduced-motion:reduce){
  .cinematic-audio-dot{animation:none!important}
}


/* V12.11b · first-entry sound gate */
body.cinematic-entry-gated{
  overflow:hidden;
}
.cinematic-entry-gate{
  position:fixed;
  inset:0;
  z-index:1000;
  display:grid;
  place-items:center;
  padding:clamp(28px,6vw,90px);
  background:
    radial-gradient(circle at 50% 44%,rgba(255,204,0,.045),transparent 29%),
    radial-gradient(circle at 50% 100%,rgba(77,131,190,.055),transparent 34%),
    #030508;
  opacity:1;
  transition:opacity .72s var(--cinema-ease),filter .72s ease;
}
.cinematic-entry-gate.is-leaving{
  opacity:0;
  filter:blur(8px);
  pointer-events:none;
}
.cinematic-entry-panel{
  width:min(880px,100%);
  text-align:center;
  transform:translateY(-2vh);
}
.cinematic-entry-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:26px;
  color:var(--brand-yellow);
  font-size:12px;
  font-weight:820;
  letter-spacing:.26em;
  text-transform:uppercase;
}
.cinematic-entry-kicker::before,
.cinematic-entry-kicker::after{
  content:"";
  width:34px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,204,0,.68));
}
.cinematic-entry-kicker::after{
  transform:scaleX(-1);
}
.cinematic-entry-panel h1{
  max-width:850px;
  margin:0 auto;
  color:#f5f7fa;
  font-size:clamp(38px,5.2vw,78px);
  line-height:.99;
  letter-spacing:-.045em;
  text-wrap:balance;
}
.cinematic-entry-panel > p{
  max-width:720px;
  margin:30px auto 0;
  color:#c0c9d5;
  font-size:clamp(16px,1.7vw,21px);
  line-height:1.55;
}
.cinematic-entry-panel .cinematic-entry-wink{
  margin-top:13px;
  color:#7f8b9b;
  font-size:13px;
  letter-spacing:.02em;
}
.cinematic-entry-actions{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  gap:13px;
  margin-top:38px;
}
.cinematic-entry-actions button{
  appearance:none;
  min-height:48px;
  padding:0 20px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.13);
  font:inherit;
  font-size:13px;
  font-weight:780;
  letter-spacing:.025em;
  cursor:pointer;
  transition:
    transform .28s var(--cinema-ease),
    color .25s ease,
    background .25s ease,
    border-color .25s ease,
    box-shadow .3s ease;
}
.cinematic-entry-sound{
  color:#080a0e;
  background:#f7f8fa;
  box-shadow:0 10px 34px rgba(0,0,0,.32);
}
.cinematic-entry-sound:hover,
.cinematic-entry-sound:focus-visible{
  transform:translateY(-2px);
  background:var(--brand-yellow);
  border-color:var(--brand-yellow);
  box-shadow:0 12px 40px rgba(255,204,0,.12);
  outline:none;
}
.cinematic-entry-silent{
  color:#aeb8c6;
  background:rgba(255,255,255,.018);
}
.cinematic-entry-silent:hover,
.cinematic-entry-silent:focus-visible{
  color:#f0f3f7;
  border-color:rgba(255,204,0,.28);
  background:rgba(255,204,0,.035);
  outline:none;
}
.cinematic-entry-actions button:disabled{
  opacity:.55;
  cursor:wait;
  transform:none;
}
.cinematic-entry-gate.has-error .cinematic-entry-kicker{
  color:#ffb38d;
}
.cinematic-audio-dock[hidden]{
  display:none!important;
}
@media(max-width:620px){
  .cinematic-entry-panel{
    transform:none;
  }
  .cinematic-entry-panel h1{
    font-size:clamp(36px,11vw,54px);
  }
  .cinematic-entry-panel > p{
    font-size:16px;
  }
  .cinematic-entry-actions{
    flex-direction:column;
  }
  .cinematic-entry-actions button{
    width:100%;
    max-width:340px;
  }
}
@media(prefers-reduced-motion:reduce){
  .cinematic-entry-gate{
    transition:none!important;
  }
  .cinematic-entry-actions button{
    transition:none!important;
  }
}


/* V12.14 · storm-synced portrait arrival + larger entry gate typography */
.hero-visual.hero-arrival{
  animation-name:heroVisualArrivalV1214;
}
@keyframes heroVisualArrivalV1214{
  0%{
    opacity:.03;
    transform:translate3d(-54vw,54px,0) rotateZ(-6.5deg) scale(.84);
    filter:blur(9px);
  }
  24%{
    opacity:.46;
    transform:translate3d(-37vw,35px,0) rotateZ(-4.6deg) scale(.89);
    filter:blur(5.5px);
  }
  30%{
    opacity:.58;
    transform:translate3d(-42vw,42px,0) rotateZ(-7.2deg) scale(.875);
    filter:blur(6.4px);
  }
  36%{
    opacity:.78;
    transform:translate3d(-27vw,20px,0) rotateZ(-3.2deg) scale(.93);
    filter:blur(3px);
  }
  56%{
    opacity:.94;
    transform:translate3d(-11vw,10px,0) rotateZ(-1.1deg) scale(.965);
    filter:blur(1.4px);
  }
  61%{
    opacity:1;
    transform:translate3d(-14vw,20px,0) rotateZ(-2.4deg) scale(.952);
    filter:blur(1.8px);
  }
  67%{
    opacity:1;
    transform:translate3d(34px,-10px,0) rotateZ(1.45deg) scale(1.028);
    filter:blur(.25px);
  }
  78%{
    transform:translate3d(-14px,7px,0) rotateZ(-.52deg) scale(.994);
    filter:none;
  }
  89%{
    transform:translate3d(6px,-2px,0) rotateZ(.17deg) scale(1.003);
  }
  96%{
    transform:translate3d(-2px,1px,0) rotateZ(-.05deg) scale(.999);
  }
  100%{
    opacity:1;
    transform:translate3d(0,0,0) rotateZ(0) scale(1);
    filter:none;
  }
}

.cinematic-entry-kicker{
  font-size:14px;
}
.cinematic-entry-panel .cinematic-entry-wink{
  font-size:15px;
}
.cinematic-entry-actions button{
  min-height:56px;
  padding:0 26px;
  font-size:15px;
}


/* V12.21 · staged black-screen entrance and progressive interface reveal */

/* Sound-only prelude: after the entry choice disappears, the site is true black.
   No header, portrait, copy, CTA or floating replay control is visible yet. */
body.cinematic-hero-prelude{
  overflow:hidden;
  background:#000;
}
body.cinematic-hero-prelude header,
body.cinematic-hero-prelude .hero-copy,
body.cinematic-hero-prelude .hero-visual,
body.cinematic-hero-prelude .cinematic-audio-dock{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
body.cinematic-hero-prelude main > :not(.hero),
body.cinematic-hero-prelude footer{
  visibility:hidden!important;
}

/* From the first frame of portrait flight until the top identity reveal, the
   header/nav and the English/Hindi descriptor remain completely absent. */
body.cinematic-intro-active header{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
body.cinematic-intro-active .hero-copy > .eyebrow{
  opacity:0;
  visibility:hidden;
  transform:translate3d(0,-8px,0);
}
body.cinematic-intro-active .hero-portrait figcaption{
  opacity:0;
  visibility:hidden;
  transform:translate3d(0,9px,0);
}

/* Portrait starts genuinely off the extreme left edge, then keeps the existing
   storm-synced directional jolts before settling into its final grid position. */
.hero-visual.hero-arrival{
  animation-name:heroVisualArrivalV1221;
}
@keyframes heroVisualArrivalV1221{
  0%{
    opacity:.02;
    transform:translate3d(-112vw,54px,0) rotateZ(-7deg) scale(.82);
    filter:blur(10px);
  }
  12%{
    opacity:.18;
    transform:translate3d(-86vw,48px,0) rotateZ(-6.2deg) scale(.85);
    filter:blur(8px);
  }
  24%{
    opacity:.46;
    transform:translate3d(-52vw,35px,0) rotateZ(-4.6deg) scale(.89);
    filter:blur(5.5px);
  }
  30%{
    opacity:.58;
    transform:translate3d(-58vw,42px,0) rotateZ(-7.2deg) scale(.875);
    filter:blur(6.4px);
  }
  36%{
    opacity:.78;
    transform:translate3d(-34vw,20px,0) rotateZ(-3.2deg) scale(.93);
    filter:blur(3px);
  }
  56%{
    opacity:.94;
    transform:translate3d(-13vw,10px,0) rotateZ(-1.1deg) scale(.965);
    filter:blur(1.4px);
  }
  61%{
    opacity:1;
    transform:translate3d(-16vw,20px,0) rotateZ(-2.4deg) scale(.952);
    filter:blur(1.8px);
  }
  67%{
    opacity:1;
    transform:translate3d(34px,-10px,0) rotateZ(1.45deg) scale(1.028);
    filter:blur(.25px);
  }
  78%{
    transform:translate3d(-14px,7px,0) rotateZ(-.52deg) scale(.994);
    filter:none;
  }
  89%{
    transform:translate3d(6px,-2px,0) rotateZ(.17deg) scale(1.003);
  }
  96%{
    transform:translate3d(-2px,1px,0) rotateZ(-.05deg) scale(.999);
  }
  100%{
    opacity:1;
    transform:translate3d(0,0,0) rotateZ(0) scale(1);
    filter:none;
  }
}

/* Caption arrives only with the shirt monogram. */
body.cinematic-intro-active .hero-portrait figcaption.caption-awaken{
  visibility:visible;
  animation:heroCaptionAwakenV1221 1.15s var(--cinema-ease) both;
}
@keyframes heroCaptionAwakenV1221{
  0%{opacity:0;transform:translate3d(0,10px,0);filter:blur(5px)}
  55%{opacity:.72;transform:translate3d(0,2px,0);filter:blur(1px)}
  100%{opacity:1;transform:translate3d(0,0,0);filter:none}
}

/* The site chrome arrives with the top Gaurav identity: navigation and the
   English/Hindi descriptor are withheld until this exact stage. */
body.cinematic-intro-active header.cinematic-header-awaken{
  visibility:visible;
  pointer-events:auto;
  animation:cinematicHeaderAwakenV1221 1.45s var(--cinema-ease) both;
}
@keyframes cinematicHeaderAwakenV1221{
  0%{opacity:0;transform:translate3d(0,-14px,0);filter:blur(8px)}
  58%{opacity:.78;transform:translate3d(0,-2px,0);filter:blur(1.5px)}
  100%{opacity:1;transform:translate3d(0,0,0);filter:none}
}

body.cinematic-intro-active .hero-copy > .eyebrow.eyebrow-awaken{
  visibility:visible;
  animation:heroEyebrowAwakenV1221 1.35s var(--cinema-ease) both;
}
@keyframes heroEyebrowAwakenV1221{
  0%{opacity:0;transform:translate3d(-14px,0,0);filter:blur(5px)}
  100%{opacity:1;transform:translate3d(0,0,0);filter:none}
}

/* The invitation copy vanishes before the storm begins, leaving a clean black
   beat rather than letting the storm start underneath fading text. */
.cinematic-entry-gate.is-sound-starting .cinematic-entry-panel{
  opacity:0;
  transform:translateY(-2vh) scale(.985);
  transition:opacity .20s ease,transform .24s var(--cinema-ease);
}

@media(prefers-reduced-motion:reduce){
  body.cinematic-hero-prelude header,
  body.cinematic-hero-prelude .hero-copy,
  body.cinematic-hero-prelude .hero-visual,
  body.cinematic-hero-prelude .cinematic-audio-dock{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }
  body.cinematic-hero-prelude main > :not(.hero),
  body.cinematic-hero-prelude footer{
    visibility:visible!important;
  }
  body.cinematic-intro-active header,
  body.cinematic-intro-active .hero-copy > .eyebrow,
  body.cinematic-intro-active .hero-portrait figcaption{
    opacity:1!important;
    visibility:visible!important;
    transform:none!important;
    filter:none!important;
    animation:none!important;
  }
}


/* V12.21b · only the portrait is allowed on screen while it is flying. */
body.cinematic-intro-active{
  overflow-x:hidden;
}
body.cinematic-photo-flight .hero-copy,
body.cinematic-photo-flight .cinematic-audio-dock{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}


/* V12.30 · Hear the Voice enters only after the waveform is fully formed.
   Give the label its own left-to-right reveal instead of a generic fade. */
.hero-wave-flourish .wave-label.cta-text-reveal{
  animation:heroHearLabelRevealV1230 1.45s var(--cinema-ease) both;
  overflow:hidden;
  white-space:nowrap;
}
@keyframes heroHearLabelRevealV1230{
  0%{
    opacity:0;
    filter:blur(3px);
    transform:translate3d(-5px,2px,0);
    clip-path:inset(0 100% 0 0);
  }
  24%{
    opacity:.72;
    filter:blur(1.7px);
  }
  100%{
    opacity:1;
    filter:none;
    transform:translate3d(0,0,0);
    clip-path:inset(0 0 0 0);
  }
}


/* V12.32 · semantic phrase lift
   “depth, character and soul” first occupies some of the future lead-copy
   territory, then rises and compresses into its final headline position.
   VOICE keeps its existing yellow choreography unchanged. */
@media(min-width:981px){
  .hero-title.is-assembling .w-depth{
    --meaning-start-y:88px;
    --meaning-early-y:78px;
    --meaning-mid-y:56px;
  }
  .hero-title.is-assembling .w-character{
    --meaning-start-y:124px;
    --meaning-early-y:108px;
    --meaning-mid-y:76px;
  }
  .hero-title.is-assembling .w-and{
    --meaning-start-y:160px;
    --meaning-early-y:138px;
    --meaning-mid-y:96px;
  }
  .hero-title.is-assembling .w-soul{
    --meaning-start-y:196px;
    --meaning-early-y:168px;
    --meaning-mid-y:116px;
  }
  .hero-title.is-assembling .w-depth,
  .hero-title.is-assembling .w-character,
  .hero-title.is-assembling .w-and,
  .hero-title.is-assembling .w-soul{
    animation:none!important;
    opacity:0;
    filter:blur(8px);
    transform:translate3d(0,var(--meaning-start-y,88px),0) scale(1.14);
    transform-origin:50% 58%;
  }

  .hero-title.is-assembling .w-depth.meaning-beat-active,
  .hero-title.is-assembling .w-character.meaning-beat-active,
  .hero-title.is-assembling .w-and.meaning-beat-active,
  .hero-title.is-assembling .w-soul.meaning-beat-active{
    animation:heroMeaningLiftV1232 4.72s cubic-bezier(.14,.74,.14,1) forwards!important;
  }
}
@keyframes heroMeaningLiftV1232{
  0%{
    opacity:0;
    filter:blur(8px);
    transform:translate3d(0,var(--meaning-start-y,88px),0) scale(1.14);
  }
  14%{
    opacity:.94;
    filter:blur(2.2px);
    transform:translate3d(0,var(--meaning-early-y,78px),0) scale(1.115);
  }
  40%{
    opacity:1;
    filter:blur(.5px);
    transform:translate3d(0,var(--meaning-mid-y,56px),0) scale(1.075);
  }
  68%{
    opacity:1;
    filter:none;
    transform:translate3d(0,10px,0) scale(1.018);
  }
  84%{
    transform:translate3d(0,-4px,0) scale(.994);
  }
  100%{
    opacity:1;
    filter:none;
    transform:translate3d(0,0,0) scale(1);
  }
}
@media(max-width:980px){
  .hero-title.is-assembling .w-depth,
  .hero-title.is-assembling .w-character,
  .hero-title.is-assembling .w-and,
  .hero-title.is-assembling .w-soul{
    animation:none!important;
    opacity:0;
  }

  .hero-title.is-assembling .w-depth.meaning-beat-active,
  .hero-title.is-assembling .w-character.meaning-beat-active,
  .hero-title.is-assembling .w-and.meaning-beat-active,
  .hero-title.is-assembling .w-soul.meaning-beat-active{
    animation:heroMeaningLiftMobileV1232 3.7s cubic-bezier(.14,.74,.14,1) forwards!important;
  }
}
@keyframes heroMeaningLiftMobileV1232{
  0%{opacity:0;filter:blur(6px);transform:translate3d(0,34px,0) scale(1.075)}
  35%{opacity:1;filter:blur(.5px);transform:translate3d(0,24px,0) scale(1.045)}
  76%{opacity:1;filter:none;transform:translate3d(0,-2px,0) scale(.996)}
  100%{opacity:1;filter:none;transform:translate3d(0,0,0) scale(1)}
}


/* Cinematic entry: hide pointer immediately after either entry choice. */
body.cinematic-cursor-hidden,
body.cinematic-cursor-hidden *{
  cursor:none!important;
}


/* V12.34 · crisp Hear-the-Voice reveal + cinematic scrollbar discipline */

/* During the governed opening, the viewport is locked and the scrollbar is
   completely absent. This prevents the bright browser-edge rail from breaking
   the black-screen cinematic frame. */
html.cinematic-viewport-active{
  overflow:hidden!important;
  scrollbar-width:none!important;
  background:#000;
}
html.cinematic-viewport-active::-webkit-scrollbar{
  width:0!important;
  height:0!important;
  display:none!important;
}
html.cinematic-viewport-active body{
  overflow:hidden!important;
  background:#000;
}

/* Once the cinematic opening is complete, restore a quiet graphite scrollbar
   instead of the browser's bright default treatment. */
html{
  scrollbar-color:#4b535e #080b10;
  scrollbar-width:thin;
}
html::-webkit-scrollbar{
  width:9px;
  height:9px;
  background:#080b10;
}
html::-webkit-scrollbar-track{
  background:#080b10;
}
html::-webkit-scrollbar-thumb{
  background:#4b535e;
  border:2px solid #080b10;
  border-radius:999px;
}
html::-webkit-scrollbar-thumb:hover{
  background:#68727e;
}

/* The parent itself stays sharp and stationary. Individual bars now build
   the waveform one-by-one from left to right. */
.hero-wave-flourish.wave-solo{
  animation:none!important;
  opacity:1!important;
  filter:none!important;
  transform:none!important;
  clip-path:none!important;
  overflow:visible!important;
}
.hero-wave-flourish.wave-solo .wave-bars i{
  animation:heroWaveBarRevealV1234 .35s cubic-bezier(.16,.84,.18,1) both!important;
  animation-delay:calc(var(--wave-i,0) * .18s)!important;
  filter:none!important;
}
@keyframes heroWaveBarRevealV1234{
  0%{
    opacity:0;
    transform:scaleY(.12);
  }
  58%{
    opacity:1;
    transform:scaleY(1.10);
  }
  100%{
    opacity:1;
    transform:scaleY(1);
  }
}

/* “HEAR THE VOICE” types on cleanly after the wave has formed. No blur:
   fourteen discrete character steps across 3.5 seconds, completing at 8.5s.
   The Hear chord then remains underneath/fades for another 0.5s. */
.hero-wave-flourish .wave-label.cta-hear-type{
  opacity:1!important;
  filter:none!important;
  transform:none!important;
  clip-path:inset(0 100% 0 0);
  animation:heroHearTypeV1234 2.80s steps(14,end) both!important;
}
@keyframes heroHearTypeV1234{
  0%{
    opacity:1;
    filter:none;
    clip-path:inset(0 100% 0 0);
  }
  100%{
    opacity:1;
    filter:none;
    clip-path:inset(0 0 0 0);
  }
}


@media(prefers-reduced-motion:reduce){
  .hero-wave-flourish.wave-solo .wave-bars i{
    animation:none!important;
    opacity:1!important;
    transform:none!important;
  }
  .hero-wave-flourish .wave-label.cta-hear-type{
    animation:none!important;
    opacity:1!important;
    clip-path:none!important;
    transform:none!important;
  }
}


/* V12.39 · 16-beat headline score.
   WITH softly fades in near the end of beat 2. The semantic words do not
   travel from their old lower staging positions: each appears at its final
   headline coordinate on its assigned beat, with only a compact impact pulse. */
.hero-title.is-assembling .w-with{
  animation:none!important;
  opacity:0;
  filter:blur(2px);
  transform:none;
}
.hero-title.is-assembling .w-with.with-beat-visible{
  animation:heroWithFadeV1239 .42s ease-out forwards!important;
}
@keyframes heroWithFadeV1239{
  0%{opacity:0;filter:blur(2px)}
  100%{opacity:.82;filter:none}
}

.hero-title.is-assembling .w-depth,
.hero-title.is-assembling .w-character,
.hero-title.is-assembling .w-and,
.hero-title.is-assembling .w-soul{
  animation:none!important;
  opacity:0;
  filter:none;
  transform:none;
}
.hero-title.is-assembling .w-depth.meaning-beat-active,
.hero-title.is-assembling .w-character.meaning-beat-active,
.hero-title.is-assembling .w-and.meaning-beat-active,
.hero-title.is-assembling .w-soul.meaning-beat-active{
  animation:heroMeaningBeatHitV1239 .30s cubic-bezier(.18,.88,.20,1) forwards!important;
}
@keyframes heroMeaningBeatHitV1239{
  0%{opacity:0;filter:none;transform:translate3d(0,0,0) scale(.94)}
  58%{opacity:1;filter:none;transform:translate3d(0,0,0) scale(1.025)}
  100%{opacity:1;filter:none;transform:translate3d(0,0,0) scale(1)}
}

@media(prefers-reduced-motion:reduce){
  .hero-title.is-assembling .w-with,
  .hero-title.is-assembling .w-depth,
  .hero-title.is-assembling .w-character,
  .hero-title.is-assembling .w-and,
  .hero-title.is-assembling .w-soul{
    animation:none!important;
    opacity:1!important;
    filter:none!important;
    transform:none!important;
  }
}


/* V12.45 · butter-smooth scroll path.
   Scroll reveals are one-way and compositor-light: no per-frame blur,
   rotation or scale reversal while the user flings the page. */
html{
  background:#07090d;
  overscroll-behavior-y:none;
}
body{
  background-color:#07090d;
  min-height:100vh;
}
body.cinema-enhanced .cinema-item{
  opacity:0;
  transform:translate3d(0,18px,0);
  filter:none!important;
  will-change:auto;
  transition:
    opacity .46s ease-out,
    transform .66s cubic-bezier(.16,.84,.18,1);
}
body.cinema-enhanced .cinema-item.cinema-visible{
  opacity:1;
  transform:translate3d(0,0,0);
}

/* Fast-scroll protection: remove the expensive glass/transition layers while
   the page is moving at high velocity, then restore them after 150ms idle. */
body.fast-scroll header{
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  background:rgba(7,9,13,.97)!important;
}
body.fast-scroll .cinema-item,
body.fast-scroll #stage::before,
body.fast-scroll .visual-card img,
body.fast-scroll .mc-card img,
body.fast-scroll .metric::after,
body.fast-scroll .card::after,
body.fast-scroll .profile-block::after{
  transition:none!important;
}
body.fast-scroll .cinema-item{
  filter:none!important;
}
