/* Light, depth and an opening sequence. Content remains visible without JavaScript. */
.hero-line{display:block}
.hero{position:relative}
.ambient{height:950px}
.ambient i{background:radial-gradient(ellipse,#a8e7ebaa 0,#b5eeeb66 34%,transparent 70%);animation-duration:13s}
.ambient i+i{background:radial-gradient(ellipse,#ceeadf88,#d8efee44 38%,transparent 70%)}
.ambient-orbit{position:absolute;border:1px solid #9accc12e;border-radius:50%;pointer-events:none}
.orbit-one{width:1160px;height:460px;left:calc(50% - 190px);top:-190px;transform:rotate(-28deg);box-shadow:0 -10px 60px #b0ece01b,inset 0 10px 50px #c2f4eb1a;animation:orbit-drift 19s ease-in-out infinite}
.orbit-two{width:1000px;height:440px;right:calc(50% - 110px);top:15px;transform:rotate(24deg);opacity:.55;box-shadow:0 15px 50px #bdeade14;animation:orbit-drift 23s ease-in-out infinite reverse}
.ambient-pointer{position:absolute;width:650px;height:540px;left:calc(50% - 325px);top:0;background:radial-gradient(ellipse,#92dce02e,transparent 68%);transform:translate3d(var(--scene-x,0px),var(--scene-y,0px),0);transition:transform 1.1s cubic-bezier(.18,.72,.25,1)}
@keyframes orbit-drift{50%{translate:25px 19px;scale:1.035}}
.opening-halo{position:absolute;width:960px;height:640px;top:-70px;left:calc(50% - 480px);border-radius:50%;background:radial-gradient(ellipse,transparent 44%,#b3e9e541 57%,transparent 72%);opacity:0;pointer-events:none}
.intro-playing .opening-halo{animation:halo-open 2.3s cubic-bezier(.16,.7,.3,1) both}
@keyframes halo-open{0%{opacity:0;transform:scale(.65)}35%{opacity:.75}100%{opacity:0;transform:scale(1.55)}}
[data-theme=dark] .ambient{opacity:.7}
[data-theme=dark] .ambient i{background:radial-gradient(ellipse,#3e907150,transparent 68%)}
[data-theme=dark] .ambient i+i{background:radial-gradient(ellipse,#2c637640,transparent 70%)}
[data-theme=dark] .ambient-orbit{border-color:#76b7aa19}
.ai-word{background-image:linear-gradient(110deg,#254a3e 12%,#398782 42%,#517f9a 54%,#345d4d 76%);background-size:240% 100%;animation:text-shimmer 7s ease-in-out infinite}
[data-theme=dark] .ai-word{background-image:linear-gradient(110deg,#e7f6ed 12%,#9bdfc7 42%,#a6dfe9 54%,#d5ebdb 76%)}

/* A gradient mask reveals the type before the blur resolves. No loading overlay. */
.intro-pending .hero-eyebrow,.intro-pending .hero-line,.intro-pending .hero-intro,.intro-pending .hero-actions,.intro-pending .hero-footnote,.intro-pending #work>.section-kicker,.intro-pending .project-manga{opacity:0}
.intro-playing .hero-eyebrow,.intro-playing .hero-line,.intro-playing .hero-intro,.intro-playing .hero-actions,.intro-playing .hero-footnote,.intro-playing #work>.section-kicker,.intro-playing .project-manga{
  animation:light-reveal 1.8s cubic-bezier(.22,.65,.25,1) var(--entry-delay,0s) both;
  mask-image:linear-gradient(90deg,#000 33.333%,transparent 66.667%);
  mask-size:300% 100%;mask-repeat:no-repeat;
  -webkit-mask-image:linear-gradient(90deg,#000 33.333%,transparent 66.667%);
  -webkit-mask-size:300% 100%;-webkit-mask-repeat:no-repeat;
}
.intro-playing .hero-eyebrow{--entry-delay:0s;--entry-rise:6px}
.intro-playing .hero-line:first-child{--entry-delay:.1s;--entry-rise:8px}
.intro-playing .hero-line:last-child{--entry-delay:.24s;--entry-rise:10px}
.intro-playing .hero-intro{--entry-delay:.36s;--entry-rise:10px}
.intro-playing .hero-actions{--entry-delay:.52s;--entry-rise:12px}
.intro-playing .hero-footnote{--entry-delay:.63s;--entry-rise:8px}
.intro-playing #work>.section-kicker{--entry-delay:.64s;--entry-rise:12px}
.intro-playing .project-manga{--entry-delay:.72s;--entry-rise:20px}
@keyframes light-reveal{
  0%{opacity:0;filter:blur(16px);transform:translateY(var(--entry-rise,10px));mask-position:100% 0;-webkit-mask-position:100% 0}
  15%{opacity:1}
  70%{filter:blur(0)}
  100%{opacity:1;filter:blur(0);transform:translateY(0);mask-position:0 0;-webkit-mask-position:0 0}
}
.intro-playing .floating-nav{animation:nav-arrive 1s cubic-bezier(.16,1,.3,1) both}
.intro-playing .wordmark,.intro-playing .top-status{animation:edge-arrive 1.2s ease .15s both}
@keyframes nav-arrive{from{opacity:0;translate:0 -13px;filter:blur(5px)}to{opacity:1;translate:0 0;filter:blur(0)}}
@keyframes edge-arrive{from{opacity:0;translate:0 6px}to{opacity:1;translate:0 0}}
.intro-replay{display:none;align-items:center;gap:5px;border-left:1px solid var(--line);padding:0 0 0 13px;font-size:9px;color:var(--muted);letter-spacing:.3px;line-height:1.5}
.motion-enhanced .intro-replay{display:inline-flex}
.intro-replay svg{width:11px;height:11px;transition:rotate .7s ease}
.intro-replay:hover{color:var(--accent)}
.intro-replay:hover svg{rotate:-70deg}

/* A soft moving glint, spaced far enough apart to let the page rest. */
.hero-eyebrow{position:relative;overflow:hidden;isolation:isolate}
.hero-eyebrow::after{content:"";position:absolute;inset:-50% -30%;background:linear-gradient(110deg,transparent 39%,#ffffffc9 49%,transparent 59%);transform:translateX(-110%);animation:pill-glint 9s ease-in-out 2.4s infinite;pointer-events:none;z-index:-1}
@keyframes pill-glint{0%,78%{transform:translateX(-110%);opacity:0}79%{opacity:.7}95%{transform:translateX(110%);opacity:.7}100%{transform:translateX(110%);opacity:0}}
[data-theme=dark] .hero-eyebrow::after{background:linear-gradient(110deg,transparent 40%,#b7efcc36 50%,transparent 60%)}
.floating-nav{isolation:isolate}
.floating-nav .nav-glider{position:absolute;top:5px;left:0;height:32px;border-radius:20px;background:var(--soft);border:1px solid #91b4a519;z-index:-1;pointer-events:none;transition:transform .5s cubic-bezier(.18,.8,.25,1),width .5s cubic-bezier(.18,.8,.25,1),opacity .2s;opacity:0}
.motion-enhanced .floating-nav a.active{background:transparent}
.motion-enhanced .project-stage{transform:perspective(1500px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .65s cubic-bezier(.2,.65,.25,1),box-shadow .65s,border-color .65s;transform-style:preserve-3d}
.motion-enhanced .project-stage.is-hovered{transition:transform .16s ease-out,box-shadow .5s,border-color .5s;box-shadow:0 25px 65px -28px #194d4150,0 2px 10px #2a534c0c;border-color:#6b9c8780}
html[data-theme=dark].motion-enhanced .project-stage.is-hovered{box-shadow:0 22px 65px -20px #0008,0 0 24px #89dbc110;border-color:#8bbdac80}
.project-stage::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:radial-gradient(500px circle at var(--pointer-x,50%) var(--pointer-y,50%),#ffffff16,transparent 65%);opacity:0;transition:opacity .6s;border-radius:inherit}
.project-stage.is-hovered::after{opacity:1}
.motion-enhanced .page-front{translate:calc(var(--depth-x,0px) * 1.2) calc(var(--depth-y,0px) * 1.2)}
.motion-enhanced .page-middle{translate:calc(var(--depth-x,0px) * .6) calc(var(--depth-y,0px) * .6)}
.motion-enhanced .page-back{translate:calc(var(--depth-x,0px) * .3) calc(var(--depth-y,0px) * .3)}
.motion-enhanced .comic-page{transition:transform .7s cubic-bezier(.2,.7,.3,1),translate .6s cubic-bezier(.2,.7,.3,1)}
.motion-enhanced .consumer-window{translate:calc(var(--depth-x,0px) * .6) calc(var(--depth-y,0px) * .6);transition:transform .7s,translate .6s cubic-bezier(.2,.7,.3,1)}
.motion-enhanced .evidence-floating{translate:calc(var(--depth-x,0px) * 1.1) calc(var(--depth-y,0px) * 1.1);transition:translate .6s cubic-bezier(.2,.7,.3,1)}
.motion-enhanced .is-hovered .evidence-floating{animation-play-state:paused}
.motion-enhanced .hero .button{translate:var(--magnet-x,0px) var(--magnet-y,0px);transition:translate .35s cubic-bezier(.18,.8,.25,1),transform .25s,box-shadow .25s}
.motion-enhanced .hero .button:hover{box-shadow:0 8px 30px #2e6d4533,0 0 0 4px #74b59b12}
.js-motion .reveal{transition:opacity 1s ease,transform 1.1s cubic-bezier(.16,.7,.2,1),filter 1s ease}
.js-motion .reveal:not(.is-visible){transform:translateY(28px);filter:blur(5px)}
.js-motion .reveal.is-visible{filter:blur(0)}
.exploration-row .exploration-icon{transition:transform .45s cubic-bezier(.18,.8,.25,1),box-shadow .45s,border-color .45s}
.exploration-row:hover .exploration-icon{transform:rotate(-7deg) translateY(-2px);box-shadow:0 5px 20px #35735512;border-color:#9ab6a470}
.case-dialog[open]{animation:case-unfold .55s cubic-bezier(.16,1,.3,1) both}
.note-dialog[open]{animation:note-unfold .42s cubic-bezier(.16,1,.3,1) both}
@keyframes case-unfold{from{opacity:0;transform:translateY(28px) scale(.97);filter:blur(5px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}
@keyframes note-unfold{from{opacity:0;transform:translateY(15px) scale(.97)}to{opacity:1;transform:none}}
.case-dialog[open] .case-hero>.eyebrow{animation:case-content-in .6s ease .12s both}
.case-dialog[open] .case-hero>h1{animation:case-content-in .7s ease .2s both}
.case-dialog[open] .case-lead,.case-dialog[open] .case-facts{animation:case-content-in .7s ease .28s both}
@keyframes case-content-in{from{opacity:0;filter:blur(4px);translate:0 8px}to{opacity:1;filter:blur(0);translate:0 0}}
@media(max-width:800px){.ambient-orbit{opacity:.35}.orbit-one{width:850px;left:40%;top:-130px}.orbit-two{width:750px;right:50%;top:20px}}
@media(max-width:560px){.hero-footnote{gap:8px;letter-spacing:.2px}.intro-replay{font-size:7px;padding-left:8px;gap:4px}.intro-replay svg{width:9px;height:9px}.ambient{height:750px}.opening-halo{width:600px;height:500px;left:calc(50% - 300px);top:-100px}.floating-nav .nav-glider{top:4px;height:30px}}
@media(pointer:coarse){.motion-enhanced .project-stage{transform:none!important}.ambient-pointer{display:none}}
@media(prefers-reduced-motion:reduce){
  .intro-pending .hero-eyebrow,.intro-pending .hero-line,.intro-pending .hero-intro,.intro-pending .hero-actions,.intro-pending .hero-footnote,.intro-pending #work>.section-kicker,.intro-pending .project-manga{opacity:1}
  .intro-playing .hero-eyebrow,.intro-playing .hero-line,.intro-playing .hero-intro,.intro-playing .hero-actions,.intro-playing .hero-footnote,.intro-playing #work>.section-kicker,.intro-playing .project-manga{mask:none;-webkit-mask:none;filter:none;opacity:1;transform:none}
  .motion-enhanced .intro-replay{display:none}.opening-halo{display:none}.motion-enhanced .project-stage{transform:none!important}
  .js-motion .reveal:not(.is-visible){filter:none;transform:none;opacity:1}
  .motion-enhanced .comic-page,.motion-enhanced .consumer-window,.motion-enhanced .evidence-floating,.motion-enhanced .hero .button{translate:none}
}
