.preview{text-align:center;padding:6px 12px;background:var(--blue);color:#fff;font-size:.75rem;font-weight:700;letter-spacing:.06em}header nav{display:flex;align-items:center;gap:22px}header nav a{text-decoration:none;font-weight:700;font-size:.9rem}.section-top{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:end;margin-bottom:42px}.section-top h2{margin-top:12px}.section-top p,.studio p{color:var(--mute);max-width:54ch}.eyebrow,.tag,.number{color:var(--blue);font-weight:700;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase}.featured{display:grid;grid-template-columns:1fr 1fr;border:2px solid var(--line);background:var(--card);border-radius:28px;overflow:hidden}.featured .copy,.demo{padding:clamp(24px,4vw,40px)}.featured h3{font-size:clamp(1.8rem,3vw,2.6rem);margin:18px 0}.featured p{color:var(--mute);margin-bottom:18px}.featured button,.card button{border:0;cursor:pointer}.featured .btn{background:var(--blue);color:white}.demo{background:linear-gradient(140deg,var(--tint),color-mix(in srgb,var(--pink) 17%,var(--card)));display:grid;place-items:center}.sheet{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:24px;width:100%;box-shadow:0 12px 40px #5b3bff18}.sheet h3{font-size:1.3rem}.row{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);padding:14px 0}.good{color:var(--blue)}.small{color:var(--mute);font-size:.83rem;margin-top:15px}.cards,.cases{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.card{display:flex;flex-direction:column;border:2px solid var(--line);border-radius:28px;padding:30px;background:var(--card);min-height:245px}.card h3{font-size:1.55rem;margin:14px 0}.card p{color:var(--mute);margin-bottom:24px}.card button{margin-top:auto;align-self:start;background:transparent;color:var(--blue);font:700 1rem 'Hanken Grotesk',sans-serif;padding:0}.case{border-top:2px solid var(--line);padding:22px 0}.case h3{font-size:1.6rem;margin:12px 0}.case p{color:var(--mute)}.studio{display:grid;grid-template-columns:1fr 1fr;gap:40px}.studio h2{margin-top:14px}.studio p+p{margin-top:20px}.contact .tag{color:white}.contact h2{margin-top:15px}.contact .btn{display:inline-flex;text-decoration:none}#details{width:min(640px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow:auto;border:1px solid var(--line);border-radius:28px;background:var(--card);color:var(--ink);padding:clamp(24px,5vw,42px)}#details::backdrop{background:#0d0a2680;backdrop-filter:blur(12px)}#details h2{font-size:2rem;margin:12px 0 18px}#details p{color:var(--mute);margin-bottom:15px}#details .status{border-top:1px solid var(--line);padding-top:18px;font-size:.9rem}#details button{border:0;border-radius:100px;background:var(--blue);color:#fff;padding:13px 20px;font:700 1rem 'Hanken Grotesk',sans-serif;cursor:pointer}@media(max-width:760px){header nav{gap:10px}header nav a:not(.btn){display:inline;font-size:.72rem}header nav .btn{display:none}.logo{height:27px}.section-top,.featured,.studio,.cards,.cases{grid-template-columns:1fr}.contact{gap:12px}.row{font-size:.85rem}}
.featured a.btn{text-decoration:none}.offer-link{display:inline-block;background:none;border:0;color:var(--blue);font:700 1rem 'Hanken Grotesk',sans-serif;margin:12px 0 0 14px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.card.principal{grid-column:1 / -1;background:linear-gradient(120deg,var(--card),var(--tint));border-color:var(--blue)}.card.principal h3{font-size:clamp(1.8rem,4vw,2.5rem)}@media(max-width:760px){.card.principal{grid-column:auto}}

.product-hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:30px}.product-orbit{position:relative;width:min(100%,360px);aspect-ratio:1;margin:auto;display:grid;place-items:center}.orbit-ring{position:absolute;inset:10%;border:1px solid var(--blue);border-radius:50%;opacity:.45}.orbit-ring:after{content:"";position:absolute;inset:13%;border:1px solid var(--pink);border-radius:50%}.orbit-core{display:grid;place-items:center;border-radius:50%;width:35%;aspect-ratio:1;background:var(--blue);color:white;font:800 2rem Bricolage Grotesque}.orbit-dot{position:absolute;inset:0;animation:product-spin 12s linear infinite}.orbit-dot:after{content:"";display:block;position:absolute;top:8%;left:46%;width:8%;aspect-ratio:1;border-radius:50%;background:var(--pink)}.orbit-dot.two{animation-duration:10s;animation-direction:reverse}.orbit-dot.two:after{top:19%;background:var(--aqua)}.orbit-dot.three{animation-duration:16s}.orbit-dot.three:after{top:1%;background:var(--blue)}@keyframes product-spin{to{transform:rotate(360deg)}}html[data-motion="reduced"] .orbit-dot{animation-play-state:paused}@media(prefers-reduced-motion:reduce){.orbit-dot{animation:none}}@media(max-width:760px){.product-hero{grid-template-columns:1fr}.product-orbit{width:min(70%,240px)}}.section-top .btn{display:inline-flex;margin-top:20px;text-decoration:none}
.orbit-core img{width:65%;height:auto;filter:brightness(0) invert(1)}

/* Orbital positions are driven by the same frame-based approach as the service spheres. */
.orbit-dot{inset:auto;width:8%;aspect-ratio:1;border-radius:50%;background:var(--pink);animation:none;transform:translate(-50%,-50%);z-index:1}.orbit-dot:after{content:none}.orbit-dot.two{background:var(--aqua)}.orbit-dot.three{background:var(--blue)}

.product-list{padding-top:clamp(36px,5vw,72px)}.product-intro{max-width:800px;margin-bottom:clamp(28px,4vw,48px)}.product-intro h1{font-size:clamp(2.1rem,4vw,3.8rem);line-height:1.08;margin:14px 0 18px}.product-intro .lead{color:var(--mute)}.product-cards .card h2{font-size:clamp(1.5rem,2.3vw,2rem);margin:14px 0}.product-cards .card .btn{align-self:flex-start;margin-top:auto;text-decoration:none;color:white;font:700 1rem Hanken Grotesk,sans-serif;cursor:pointer}.product-cards .card button.btn{border:0}
.product-cards .card button.btn{background:linear-gradient(120deg,var(--blue),var(--pink));color:#fff;padding:14px 26px;border-radius:999px}
.product-cards .card button.btn:focus-visible{outline:3px solid var(--ink);outline-offset:3px}