/* astra1 2026-11-03 — integrated motion, theatrical scale, readable foreground. */
main .scene-opening{position:relative;isolation:isolate;min-height:min(1000px,100svh);padding:clamp(145px,13vw,340px) 4vw 100px;background:#030a07;overflow:hidden;display:flex;align-items:center}
.scene-media{position:absolute;inset:0 0 0 23%;z-index:-2;overflow:hidden}.scene-media img,.scene-media video{position:absolute;width:100%;height:100%;object-fit:cover;object-position:65% 50%;inset:0}.scene-media video{opacity:0;transition:opacity 1s}.scene-media.is-playing video{opacity:1}.scene-media:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#030a07 0%,#030a07d9 12%,#030a0755 36%,transparent 60%),linear-gradient(0deg,#030a07 0%,transparent 25%,transparent 85%,#030a0788)}
.scene-copy{width:58%;max-width:1550px;padding:0!important}.scene-eyebrow{display:block;letter-spacing:.19em;font-size:clamp(10px,.75vw,21px);color:#b8d6c6;margin-bottom:clamp(35px,4vw,110px)}main .scene-opening h1{font-family:inherit;font-size:clamp(65px,7.6vw,240px);letter-spacing:-.065em;line-height:1.02;font-weight:400;margin:0 0 35px;max-width:none}main .scene-opening h1 i{font-family:Georgia,serif;color:#ff202d;-webkit-text-fill-color:#ff202d;background:none;font-weight:400;text-shadow:0 0 45px #f9192728}.scene-copy>p{font-size:clamp(17px,1.3vw,32px);max-width:30em;line-height:1.55;color:#b8cec1;margin:0 0 32px}.scene-cta{display:inline-flex;align-items:center;gap:50px;padding:18px 0;border-bottom:1px solid #ff2538;color:#e0eadf;font-size:clamp(13px,.9vw,23px)}.scene-cta span{font-size:25px}.scene-cta:hover{color:#ff3440}.scene-bottom{position:absolute;bottom:28px;left:4vw;right:4vw;display:flex;align-items:center;justify-content:space-between;color:#97aa9e;font-size:10px;letter-spacing:.17em}.scene-motion{color:#e0eadf;background:#06120bb3;border:1px solid #87b29b55;border-radius:30px;padding:12px 23px;cursor:pointer;font:inherit;letter-spacing:.08em}.scene-counter{color:#ff3440}.scene-social .scene-copy{width:65%}.scene-social h1{font-size:clamp(60px,7.3vw,220px)!important}.scene-ai .scene-media{left:27%}.scene-repair .scene-media img,.scene-repair .scene-media video{object-position:60% 50%}
main .scene-thinking{padding:clamp(50px,6vw,160px) 4vw;background:#0b211b;display:grid;grid-template-columns:.9fr 1.1fr;gap:3vw 8vw;position:relative;overflow:hidden}.scene-thinking:after{content:'';width:40vw;height:3px;position:absolute;bottom:0;right:0;background:linear-gradient(90deg,transparent,#ff1830,transparent);box-shadow:0 -10px 80px 15px #f5122420}.scene-steps{display:flex;flex-direction:column;gap:0}.scene-steps button{display:flex;align-items:center;gap:24px;text-align:left;background:transparent;border:0;border-bottom:1px solid #91bba332;padding:26px 0;color:#9fb9ac;font:inherit;font-size:clamp(18px,1.7vw,42px);cursor:pointer;transition:color .2s,transform .3s}.scene-steps button span{font-size:11px;letter-spacing:.1em;color:#ff2836}.scene-steps button[aria-pressed=true]{color:#f0f3e9;transform:translateX(12px)}.scene-steps button[aria-pressed=true]:after{content:'●';font-size:10px;color:#ff2836;margin-left:auto}.scene-explanation>span{font-size:10px;letter-spacing:.18em;color:#9bbbaf}.scene-explanation h2{font-size:clamp(35px,4.2vw,120px)!important;letter-spacing:-.05em;line-height:1.05;margin:25px 0!important;max-width:13ch}.scene-explanation p{font-size:clamp(18px,1.4vw,34px);color:#bbd3c6;max-width:32em}.scene-explanation:not([hidden]){animation:scene-in .45s ease both}.scene-context{grid-column:2;font-size:clamp(14px,1vw,24px);max-width:38em;color:#92b0a0;line-height:1.7}.scene-context br{display:none}.scene-interlude{position:relative;margin:0;padding:0 4vw;background:#06110c}.scene-interlude img{display:block;width:100%;max-height:1000px;object-fit:cover;border-radius:3vw}.scene-interlude figcaption{padding:22px 0;color:#9bb7a7;font-size:10px;letter-spacing:.16em}
@keyframes scene-in{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media(min-width:2200px){main .scene-opening{min-height:92svh}.scene-media{inset:0 0 0 28%}}
@media(max-width:700px){main .scene-opening{min-height:900px;min-height:110svh;padding:140px 6vw 40px;align-items:flex-start}.scene-copy,.scene-social .scene-copy{width:100%}.scene-eyebrow{margin-bottom:28px}main .scene-opening h1,.scene-social h1{font-size:14vw!important;margin-bottom:25px}.scene-copy>p{font-size:16px;max-width:30em}.scene-media,.scene-ai .scene-media{inset:31% -25% 0 -20%}.scene-media img,.scene-media video{object-position:center bottom}.scene-media:after{background:linear-gradient(0deg,#030a07,transparent 22%,transparent 40%,#030a07 90%)}.scene-copy{z-index:1}.scene-cta{padding:12px 0;font-size:13px}.scene-bottom{bottom:22px;left:6vw;right:6vw}.scene-bottom>span:first-child{font-size:8px;max-width:8em;line-height:1.8}main .scene-thinking{grid-template-columns:1fr;padding:45px 6vw;gap:40px}.scene-steps button{padding:18px 0}.scene-explanation h2{font-size:42px!important;max-width:15ch}.scene-context{grid-column:1;font-size:14px}.scene-interlude{padding:0}.scene-interlude img{border-radius:0;aspect-ratio:1.1;object-fit:cover}.scene-interlude figcaption{padding:20px 6vw}.scene-counter{display:none}}
.no-motion .scene-explanation{animation:none}.no-motion .scene-media video{opacity:0}.scene-opening button:focus-visible,.scene-steps button:focus-visible,.scene-cta:focus-visible{outline:2px solid #c8f2dd;outline-offset:6px}@media(prefers-reduced-motion:reduce){.scene-explanation{animation:none}.scene-media video{display:none}.scene-steps button{transition:none}}
/* Distinct scenes explain the service through an action. */
main .lab-section{display:grid;grid-template-columns:1.25fr 1fr;gap:7vw;align-items:center;padding:clamp(80px,9vw,250px) 4vw;background:#06110c}.lab-editorial h2{font-size:clamp(38px,4vw,115px)!important;line-height:1.08!important}.lab-editorial p{font-size:clamp(16px,1.15vw,28px);line-height:1.65;color:#a9bfb3}.lab-editorial .eyebrow{font-size:10px;color:#a6bcae}.interactive-theatre{min-width:0;position:relative;background:radial-gradient(ellipse at 50% 60%,#0f382a 0,transparent 68%);padding:35px 0}.lab-caption{font-size:10px;letter-spacing:.16em;color:#b2c9bc}.interactive-theatre svg{width:100%;height:auto;display:block}.city-focus{transform-origin:450px 470px;transition:transform .8s,opacity .8s;transform:scaleX(2.2);opacity:.6}.local-theatre[data-state="1"] .city-focus{transform:translate(-95px,-25px) scale(.8);opacity:1}.local-theatre[data-state="2"] .city-focus{transform:translate(100px,-65px) scale(.48);opacity:1}.city-block{transition:opacity .7s}.local-theatre[data-state="2"] .city-block:nth-child(3n){opacity:.3}.lab-controls{display:flex;gap:5px;flex-wrap:wrap;border-top:1px solid #88ad9833;padding-top:20px}.lab-controls button{font:inherit;font-size:clamp(12px,.8vw,20px);color:#a7c2b2;background:transparent;border:1px solid #9ac5ae44;border-radius:100px;padding:12px 18px;cursor:pointer;transition:background .3s,color .3s}.lab-controls button[aria-pressed=true]{background:#ff2235;color:#030a07;border-color:#ff2235}.lab-controls button:focus-visible{outline:2px solid #cff1df;outline-offset:4px}.lab-output{font-size:clamp(17px,1.2vw,30px);line-height:1.55;min-height:4.8em;color:#d2e2d7;margin:25px 0 12px}.interactive-theatre>small{font-size:11px;line-height:1.6;color:#91a99c;display:block}.call-orbit{position:relative;width:100%;aspect-ratio:1.2;margin:35px 0}.call-core{position:absolute;inset:31% 33%;border-radius:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;background:radial-gradient(circle at 30% 20%,#628a78,#0a2318 50%,#020805);box-shadow:inset 0 0 3px #cce7d6,0 0 0 9px #122b20,0 0 0 10px #6b95804d,0 30px 70px #000,0 0 55px #f5223420;z-index:2}.call-core>span{font:italic clamp(40px,4vw,100px) Georgia;color:#ff263c}.call-core small{font-size:8px;letter-spacing:.12em;text-align:center;color:#b4cbbd}.call-point{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);width:42px;height:42px;border:1px solid #7ca58d88;border-radius:50%;display:grid;place-items:center;color:#b1d0bd;background:#0d2319;font-size:10px;transition:all .6s}.call-ring{position:absolute;inset:9%;border:1px dashed #85b39944;border-radius:50%;background:repeating-conic-gradient(from 0deg,transparent 0deg 34deg,#69a38533 35deg 36deg);mask-image:radial-gradient(circle,transparent 36%,#000 37%,#000 68%,transparent 69%)}.call-theatre[data-state="1"] .call-point:nth-child(even){background:#b7192c;color:white;box-shadow:0 0 30px #f41a3544;transform:translate(-50%,-50%) scale(1.15)}.call-theatre[data-state="2"] .call-point:last-of-type{background:#d5f0df;color:#052012;box-shadow:0 0 50px #8fecc966;transform:translate(-50%,-50%) scale(1.4)}.call-theatre[data-state="2"] .call-core{box-shadow:inset 0 0 3px #cce7d6,0 0 0 9px #122b20,0 0 0 10px #6b95804d,0 0 80px #93d5b044}
.story-fan{position:relative;height:clamp(340px,31vw,800px);margin:60px 0 30px;perspective:1000px}.story-fan article{position:absolute;inset:7% 15%;padding:26px;border:1px solid #739980;background:linear-gradient(140deg,#294c3b,#081a12 60%);border-radius:20px;box-shadow:0 25px 50px #000a;transition:transform .65s,opacity .65s;transform:translateX(-20%) rotate(-13deg) scale(.85);opacity:.6}.story-fan article:nth-child(2){transform:translateX(20%) rotate(13deg) scale(.85)}.story-fan article:nth-child(3){transform:translateY(20px) scale(.85)}.story-fan article>span{font-size:9px;letter-spacing:.13em;color:#b5c9bc}.story-fan article strong{display:block;font-size:clamp(37px,4vw,95px);line-height:1;letter-spacing:-.06em;font-weight:400;margin:25px 0;color:#e0ebdf}.story-fan article p{font-size:12px;color:#a7c7b2}.story-aperture{width:35%;aspect-ratio:1;border-radius:50%;margin-left:auto;background:radial-gradient(circle at 40% 35%,#07110b 15%,#ff2338 17%,#460513 29%,#e6162a 36%,#07120d 40%,#4a7e60 45%,#082016 70%);box-shadow:0 20px 50px #000a,0 0 25px #ff173622}.editor-theatre:not([data-state]) .story-fan article:first-child,.editor-theatre[data-state="0"] .story-fan article:first-child,.editor-theatre[data-state="1"] .story-fan article:nth-child(2),.editor-theatre[data-state="2"] .story-fan article:nth-child(3){transform:translateY(-10px) rotate(-2deg);opacity:1;z-index:3;border-color:#ff283a}
.recovery-network{position:relative;height:clamp(340px,31vw,800px);display:flex;justify-content:space-between;align-items:center}.network-node{position:relative;z-index:2;border:1px solid #86ba9e88;padding:30px 15px;border-radius:15px;background:linear-gradient(135deg,#254936,#07170f);width:38%;text-align:center;font-size:11px;letter-spacing:.14em;box-shadow:0 25px 50px #000a}.network-node span,.recovery-vault span{display:block;color:#abcbb8;font-size:12px;margin-top:15px;letter-spacing:0}.network-wire{position:absolute;height:2px;left:30%;right:30%;top:50%;background:#d61a30;box-shadow:0 0 30px 5px #db143655;transition:background .4s}.network-orbit{position:absolute;right:-2%;top:22%;width:42%;aspect-ratio:1;border:1px dashed #ff2638;transform:rotate(-30deg);border-radius:30px;transition:transform .8s,border-color .8s}.recovery-vault{position:absolute;bottom:5%;left:31%;font-size:10px;letter-spacing:.1em;color:#9ac1ac;text-align:center;border-top:1px solid #8ab69d66;padding-top:18px}.recovery-theatre[data-state="1"] .network-orbit{transform:rotate(30deg);border-style:solid}.recovery-theatre[data-state="1"] .website{box-shadow:0 0 70px #ff1b3b44,inset 0 0 25px #ff223822}.recovery-theatre[data-state="2"] .network-wire{background:#9de6b8;box-shadow:0 0 30px 5px #8adfa544}.recovery-theatre[data-state="2"] .network-orbit{transform:rotate(0);border-color:#a6eac2}.recovery-theatre[data-state="2"] .website{border-color:#a6eac2}
@media(max-width:850px){main .lab-section{grid-template-columns:1fr;padding:65px 6vw;gap:35px}.lab-editorial{grid-row:1}.lab-editorial h2{font-size:11vw!important}.lab-output{min-height:5em}.call-core small{font-size:7px}.call-point{width:32px;height:32px}.story-fan{height:410px}.story-fan article strong{font-size:55px}.recovery-network{height:370px}.lab-controls button{padding:10px 13px}}
.no-motion .interactive-theatre *{transition:none!important}@media(prefers-reduced-motion:reduce){.interactive-theatre *{transition:none!important}}

/* Explicit positions also work under the preview strict style CSP. */
.call-point:nth-of-type(1){left:90.000%;top:50.000%}
.call-point:nth-of-type(2){left:82.361%;top:73.511%}
.call-point:nth-of-type(3){left:62.361%;top:88.042%}
.call-point:nth-of-type(4){left:37.639%;top:88.042%}
.call-point:nth-of-type(5){left:17.639%;top:73.511%}
.call-point:nth-of-type(6){left:10.000%;top:50.000%}
.call-point:nth-of-type(7){left:17.639%;top:26.489%}
.call-point:nth-of-type(8){left:37.639%;top:11.958%}
.call-point:nth-of-type(9){left:62.361%;top:11.958%}
.call-point:nth-of-type(10){left:82.361%;top:26.489%}