.questions-layout { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:clamp(2rem,5vw,5rem); align-items:start; }
.questions-copy { min-width:0; }
.questions-copy .head__title { font-size:clamp(2.3rem,4vw,3.75rem); }
.tech-deck { position:sticky; top:100px; align-self:start; min-width:0; color:#f7f4ec; background:#17191c; border:1px solid #39434a; border-radius:18px; padding:1.5rem; box-shadow:0 28px 45px -30px #17191c88; isolation:isolate; }
.tech-deck__top { display:flex; justify-content:space-between; gap:1rem; font-size:.8rem; color:#b9c4c8; }
.tech-deck__count { font-variant-numeric:tabular-nums; }
/* The animated stage can extend beyond its box; it must never intercept controls. */
.tech-deck__stage, .tech-deck__stage * { pointer-events:none; }
.tech-deck__choices, .tech-deck__controls { position:relative; z-index:2; }
.tech-deck__stage { position:relative; min-height:350px; display:grid; align-items:center; margin-block:1rem; perspective:900px; }
.tech-deck__orbit { position:absolute; width:85%; aspect-ratio:1; border:1px solid #53616b; border-radius:50%; top:0; left:8%; transform:rotateX(64deg) rotateZ(-30deg); }
.tech-deck__orbit::after { content:""; position:absolute; inset:18px; border:1px dashed #ff713c88; border-radius:50%; }
.tech-deck__slide { position:relative; padding:1.5rem; border:1px solid #56616a; border-radius:10px; background:linear-gradient(135deg,#30383f,#1d2228 70%); box-shadow:8px 10px 0 -2px #252b30,8px 10px 0 -1px #56616a,16px 20px 0 -3px #202529,16px 20px 0 -2px #39434a; }
.tech-deck__slide[hidden] { display:none; }
.tech-deck__symbol { display:grid; place-items:center; width:60px; height:60px; border:1px solid #ff713c; border-radius:12px; color:#ff895b; font-family:var(--display); font-size:1.35rem; font-weight:600; letter-spacing:-.04em; margin-bottom:1.1rem; }
.tech-deck__slide h3 { font-family:var(--display); font-size:clamp(2rem,3.1vw,3rem); letter-spacing:-.04em; margin:0 0 .65rem; color:#fff; }
.tech-deck__statement { font-size:1.1rem; line-height:1.35; margin:0 0 .7rem; }
.tech-deck__description { color:#b9c4c8; font-size:.9rem; line-height:1.55; margin:0; }
.tech-deck__choices { display:grid; grid-template-columns:repeat(auto-fit,minmax(90px,1fr)); gap:.4rem; margin-top:1.5rem; }
.tech-deck button { cursor:pointer; color:inherit; font:inherit; }
.tech-deck__choices button { background:transparent; border:1px solid #53616b; border-radius:6px; padding:.6rem .65rem; font-size:.76rem; min-height:44px; }
.tech-deck__choices button:hover { border-color:#ff895b; background:#ffffff08; }
.tech-deck__choices button[aria-pressed=true] { background:#ff713c; border-color:#ff713c; color:#17191c; }
.tech-deck__controls { display:flex; justify-content:space-between; gap:.5rem; padding-top:1rem; margin-top:1rem; border-top:1px solid #39434a; }
.tech-deck__controls[hidden] { display:none; }
.tech-deck__controls button { border:0; background:transparent; min-height:44px; min-width:44px; font-size:.8rem; }
.tech-deck button:focus-visible { outline:2px solid #ffad8b; outline-offset:4px; }
.tech-deck.is-animated .tech-deck__slide { animation:tech-enter .65s cubic-bezier(.2,.8,.3,1) both,tech-float 5s ease-in-out .65s infinite; }
.tech-deck.is-animated .tech-deck__orbit { animation:tech-orbit 16s linear infinite; }
.tech-deck.is-paused .tech-deck__slide { animation-play-state:running,paused; }
.tech-deck.is-paused .tech-deck__orbit { animation-play-state:paused; }
@keyframes tech-enter { from { opacity:0; transform:translateY(25px) rotateY(-12deg); } to { opacity:1; transform:translateY(0) rotateY(0); } }
@keyframes tech-float { 0%,100% { transform:translateY(0) rotate(-.5deg); } 50% { transform:translateY(-8px) rotate(.5deg); } }
@keyframes tech-orbit { to { transform:rotateX(64deg) rotateZ(330deg); } }
@media(max-width:850px) { .questions-layout { grid-template-columns:1fr; } .tech-deck { position:relative; top:auto; width:100%; max-width:560px; justify-self:center; } }
@media(max-height:760px) and (min-width:851px) { .tech-deck { top:85px; padding:1rem; } .tech-deck__stage { min-height:280px; margin:.5rem 0; } .tech-deck__symbol { width:40px; height:40px; margin-bottom:.5rem; } .tech-deck__slide { padding:1rem; } .tech-deck__choices { margin-top:1.25rem; } .tech-deck__controls { margin-top:.5rem; padding-top:.25rem; } }
@media(prefers-reduced-motion:reduce) { .tech-deck * { animation:none!important; } }
