/* Current portfolio. Colors and motion rules: DESIGN_SYSTEM.md.
   Cascade is kept in source order, with superseded declarations removed. */
:root { --bg:#0c0d12; --fg:#f9f8f8; --muted:#a1a1ac; --line:#ffffff21; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:24px; }
body { margin:0; background:#02040a; color:var(--fg); position:relative; }
a { color:inherit; text-decoration:none; }
button { font:inherit; cursor:pointer; }
.mono { font:10px "DM Mono",monospace; letter-spacing:.14em; text-transform:uppercase; }
.skip-link { position:fixed; left:20px; top:-90px; z-index:10000; padding:16px; background:var(--blue); }
.skip-link:focus { top:15px; }
.page-shell { position:relative; max-width:1480px; width:calc(100% - 96px); margin:114px auto 74px; }
.nav { height:100px; position:absolute; left:0; right:0; top:0; z-index:15; display:flex; align-items:center; padding:0 5.5%; gap:5%; }
.logo { font-weight:700; letter-spacing:-.07em; font-size:23px; }
.logo span { margin-left:3px; }
.links { display:flex; gap:29px; text-transform:uppercase; }
.links a { padding:10px 0; }
.links a:first-child::after { content:none; display:block; width:3px; height:3px; border-radius:50%; margin:9px auto -12px; }
.hero { height:700px; position:relative; isolation:isolate; }
.white-halo { position:absolute; width:268px; height:268px; left:50%; top:-62px; transform:translateX(-50%); border-radius:50%; background:#f8f9ff; box-shadow:0 0 40px #e1e1ff22,0 0 110px #7876ff14; z-index:1; }
.character-wrap { position:absolute; left:50%; bottom:0; transform:translateX(-50%); height:770px; width:510px; z-index:4; pointer-events:none; overflow:hidden; }
.hero-character { width:100%; height:100%; object-fit:contain; object-position:center bottom; animation:characterArrival 1.8s cubic-bezier(.18,.7,.2,1) both; }
.hero-title-group { position:absolute; left:5.5%; top:250px; z-index:6; }
.eyebrow { letter-spacing:.16em; display:flex; align-items:center; gap:9px; margin:0 0 24px; }
.eyebrow span { width:4px; height:4px; }
.hero h1 { position:relative; font-size:clamp(52px,6.2vw,94px); line-height:.88; margin:0; text-transform:uppercase; isolation:isolate; }
.hero h1::before { position:absolute; width:113px; height:102px; left:-19px; top:-15px; border-radius:48% 52% 62% 38%/41% 39% 61% 59%; z-index:-1; animation:blobMorph 12s ease-in-out infinite alternate; }
.hero h1 .outline { color:transparent; -webkit-text-stroke:1px #f8f7ff; }
.hero h1 b { font:inherit; }
.text-link { display:inline-flex; align-items:center; gap:34px; letter-spacing:.17em; text-transform:uppercase; padding:15px 0; margin-top:25px; }
.text-link span { font-size:24px; letter-spacing:0; transition:transform .3s; }
.text-link:hover span { transform:translateX(8px); }
.hero-copy { position:absolute; right:5.5%; z-index:6; }
.hero-copy p { margin:0; min-height:124px; }
.hero-signature { display:block; margin-top:25px; letter-spacing:.06em; }
.hero-signature i { font-style:normal; margin-left:20px; }
.red-blob { display:none; position:absolute; z-index:-1; left:-34px; top:58px; width:58px; height:75px; border-radius:65% 35% 42% 58%/60% 34% 66% 40%; animation:blobMorph 9s ease-in-out infinite alternate-reverse; }
.hero-bottom { position:absolute; left:5.5%; right:5.5%; display:flex; align-items:end; justify-content:space-between; z-index:6; }
.hero-work-link { display:grid; gap:11px; }
.scroll-note span { margin-left:18px; }
.section-pad { padding-left:5.5%; padding-right:5.5%; }
.work-section { padding-top:80px; padding-bottom:74px; background:linear-gradient(180deg,#04060b26,#080b122e); border-bottom:1px solid var(--line); position:relative; }
.section-head { display:flex; justify-content:space-between; align-items:end; margin-bottom:38px; }
.section-head h2 { margin:20px 0 0; }
.services-intro h2 { margin:20px 0 0; }
.section-head>p { margin:0 0 5px; }
.projects { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; position:relative; }
.project { min-width:0; }
.project-preview { display:block; transition:transform .3s,box-shadow .3s; background:#0c0d12; }
.project-preview:hover { transform:translateY(-6px); }
.chrome { height:26px; display:flex; align-items:center; justify-content:space-between; gap:5px; padding:0 9px; border-bottom:1px solid #ffffff10; font:6px "DM Mono",monospace; }
.chrome>span:first-child { display:flex; gap:3px; }
.chrome i { width:3px; height:3px; border-radius:50%; }
.chrome>span:nth-child(2) { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.project-preview video { width:100%; aspect-ratio:16/10; object-fit:cover; background:#0b0c13; }
.view-project { position:absolute; bottom:9px; right:9px; background:#0c0b16e3; border:1px solid #ffffff25; padding:7px 9px; font:7px "DM Mono",monospace; letter-spacing:.04em; transition:background .2s; }
.project-meta { display:flex; justify-content:space-between; align-items:center; padding:22px 0 0; gap:7px; }
.project-meta .mono { letter-spacing:.1em; }
.project-meta h3 { letter-spacing:-.05em; margin:8px 0 0; }
.project-meta>a { height:33px; width:33px; display:grid; place-items:center; border:1px solid #ffffff25; border-radius:50%; font-size:19px; }
.project-meta>a:hover { background:var(--blue); }
.services-section { padding-top:85px; padding-bottom:95px; display:grid; grid-template-columns:1fr 1.12fr; gap:10%; position:relative; background:#06091033; }
.services-intro>p:not(.mono) { margin-top:23px; }
.service-orbit { width:96px; height:96px; border:1px solid #6052c455; margin-top:35px; border-radius:50%; position:relative; display:grid; place-items:center; font-size:37px; }
.service-orbit i { position:absolute; inset:-7px 9px; border:1px solid #635de256; border-radius:50%; transform:rotate(-40deg); }
.service-orbit::after { content:none; position:absolute; right:9px; top:9px; border-radius:50%; width:5px; height:5px; }
.services-list { padding-top:19px; }
.services-list details { border-top:1px solid var(--line); }
.services-list details:last-child { border-bottom:1px solid var(--line); }
summary { display:flex; align-items:center; gap:22px; cursor:pointer; list-style:none; padding:24px 0; }
summary::-webkit-details-marker { display:none; }
summary>.mono { font-size:8px; }
summary h3 { letter-spacing:-.03em; margin:0; }
summary b { margin-left:auto; font-size:21px; font-weight:400; transition:transform .2s; }
details[open] summary b { transform:rotate(45deg); }
details>p { font-size:12px; line-height:1.85; color:#a6a0b2; padding:0 25px 24px 37px; margin:0; }
.footer { padding-top:58px; padding-bottom:27px; background:linear-gradient(160deg,#1713284d,#05081033); border-top:1px solid #51406c55; position:relative; }
.footer-main { display:flex; align-items:end; justify-content:space-between; gap:30px; }
.footer h2 { font-size:clamp(60px,9vw,130px); line-height:.85; margin:23px 0 0; }
.footer-main>div { padding-bottom:5px; margin-left:auto; margin-right:7%; }
.footer-main p { line-height:1.5; letter-spacing:-.03em; }
.back-top { width:66px; height:66px; display:grid; place-items:center; border:1px solid #7b6ba566; border-radius:50%; font-size:27px; }
.back-top:hover { background:var(--blue); }
.fine { margin-top:65px; padding-top:23px; border-top:1px solid #ffffff19; display:flex; justify-content:space-between; gap:20px; }
@keyframes characterArrival{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes blobMorph{to{border-radius:35% 65% 37% 63%/58% 62% 38% 42%;transform:rotate(12deg) scale(.94)}}
@media (min-width:1550px) {
  .hero-title-group { left:7%; }
  .hero-copy { right:7%; width:245px; }
  .hero h1 { font-size:97px; }
  .hero { height:750px; }
  .character-wrap { height:815px; width:545px; }
  .hero-copy { top:280px; }
  .hero-title-group { top:280px; }
}
@media (max-width:1100px) {
  .page-shell { width:calc(100% - 44px); margin-top:90px; }
  .nav { padding:0 4%; gap:35px; }
  .links { margin-left:auto; }
  .hero { height:650px; }
  .character-wrap { height:700px; width:440px; left:51%; }
  .white-halo { width:230px; height:230px; }
  .hero-title-group { left:4%; top:240px; }
  .hero h1 { font-size:7vw; }
  .hero-copy { right:4%; width:185px; top:230px; }
  .hero-copy h2 { font-size:21px; }
  .hero-copy p { font-size:11px; }
  .chapter { font-size:6px; }
  .hero-bottom { left:4%; right:4%; }
  .section-pad { padding-left:4%; padding-right:4%; }
  .projects { gap:17px; }
  .project-meta h3 { font-size:20px; }
  .project-meta .mono { font-size:5.5px; }
  .services-section { gap:7%; }
  summary { gap:13px; }
  summary h3 { font-size:17px; }
}
@media (max-width:760px) {
  .page-shell { margin:67px auto 22px; border-radius:17px; }
  .nav { height:72px; }
  .logo { font-size:18px; }
  .hero { border-radius:17px 17px 0 0; }
  .character-wrap { bottom:auto; }
  .hero-title-group { left:6%; }
  .hero h1 { font-size:clamp(43px,9.7vw,72px); line-height:.91; }
  .eyebrow { margin-bottom:16px; }
  .hero h1::before { width:70px; height:72px; top:-9px; left:-10px; }
  .text-link { font-size:7px; gap:18px; margin-top:12px; padding:10px 0; }
  .text-link span { font-size:20px; }
  .hero-copy { padding-right:10px; }
  .hero-copy h2 { margin:15px 0 13px; }
  .hero-copy h2 br { display:none; }
  .red-blob { left:-10px; top:45px; height:57px; width:44px; opacity:.55; }
  .hero-bottom { left:6%; right:6%; }
  .scroll-note span { margin-left:5px; }
  .section-pad { padding-left:6%; padding-right:6%; }
  .work-section { padding-top:53px; padding-bottom:50px; }
  .section-head { display:block; margin-bottom:28px; }
  .section-head>p { margin-top:18px; }
  .projects { grid-template-columns:1fr; gap:34px; }
  .project-preview video { aspect-ratio:16/9; }
  .chrome { height:27px; }
  .chrome i { width:4px; height:4px; }
  .project-meta { padding-top:17px; }
  .view-project { font-size:8px; }
  .services-section { grid-template-columns:1fr; gap:24px; padding-top:52px; padding-bottom:56px; }
  .services-intro h2 br { display:none; }
  .service-orbit { display:none; }
  .services-list { padding-top:0; }
  summary { padding:22px 0; gap:15px; }
  details>p { padding-left:28px; }
  .footer { padding-top:43px; padding-bottom:25px; }
  .footer-main { flex-wrap:wrap; align-items:center; gap:22px; }
  .footer-main>div { margin:0; width:calc(100% - 80px); }
  .back-top { width:52px; height:52px; font-size:24px; }
  .fine { flex-wrap:wrap; margin-top:35px; }
  .fine>span:first-child { width:100%; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  * { animation:none !important; transition:none !important; }
  *::before { animation:none !important; transition:none !important; }
  *::after { animation:none !important; transition:none !important; }
}
body.studio-final .hero { isolation:isolate; }
.dexter-stage { position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.dexter-rule { position:absolute; transform:scaleX(0) skewY(-2deg); transform-origin:25% 50%; }
body.studio-final .dexter-title { position:relative; filter:drop-shadow(0 3px 22px #030208); }
body.studio-final .dexter-title::after { content:""; position:absolute; left:-2%; right:3%; top:45%; height:11%; mix-blend-mode:screen; opacity:0; transform:translateX(-60%) skewY(-3deg); animation:dexterCut 7.6s steps(1) infinite; }
.dexter-rule { animation:dexterRule 7.6s cubic-bezier(.15,.8,.22,1) infinite; }
@keyframes dexterRule{0%,10%{opacity:0;transform:scaleX(0) skewY(-2deg)}17%{opacity:1;transform:scaleX(1.1) skewY(-2deg)}27%,65%{opacity:.65;transform:scaleX(.95) skewY(-2deg)}78%,100%{opacity:0;transform:scaleX(1) skewY(-2deg)}}
@keyframes dexterCut{0%,14%,69%,100%{opacity:0;transform:translateX(-60%) skewY(-3deg)}16%,18%,72%,74%{opacity:1;transform:translateX(0) skewY(-3deg)}}
@keyframes dexterCaption{0%,20%,84%,100%{opacity:0}29%,73%{opacity:1}}
@media (max-width:650px) {
  .dexter-rule { left:0; right:-55%; top:43%; }
  body.studio-final .dexter-title { font-size:clamp(62px,15.5vw,100px); }
}
@media (prefers-reduced-motion:reduce) {
  .dexter-rule { animation:none; opacity:.6; transform:none; }
  body.studio-final .dexter-title { filter:none; }
  body.studio-final .dexter-title::after { animation:none; filter:none; }
}
body.studio-final .dexter-title { animation:dexterType 7.6s cubic-bezier(.16,1,.3,1) both infinite; }
.dexter-stage { z-index:5; border-radius:inherit; }
.dexter-rule { left:3%; right:56%; top:46%; height:1px; opacity:.5; }
@media (max-width:760px) {
  body.studio-final .dexter-title { font-size:clamp(43px,9.7vw,72px); }
  .dexter-rule { left:5%; right:45%; top:36%; }
}
@media (prefers-reduced-motion:reduce) {
  body.studio-final .dexter-title { animation:none; }
}
@media (max-width:760px) {
  .character-wrap { top:43px; height:445px; width:296px; left:64%; }
  .white-halo { top:48px; width:165px; height:165px; left:64%; }
  .hero-title-group { top:255px; }
}
.space-background { position:fixed; inset:0; z-index:0; pointer-events:none; }
body::before { content:""; position:fixed; inset:0; z-index:1; pointer-events:none; background:linear-gradient(115deg,#03071955,#02040b24 55%,#10071c50); }
.page-shell { z-index:2; }
body { display:flow-root; }
.hero { border-bottom:1px solid #ffffff14; }
.image-credit { line-height:1.6; margin:23px 0 0; }
.image-credit a { text-decoration:underline; text-underline-offset:3px; }
.image-credit a:hover { color:#fff; }
.space-background { background-size:auto 300%; background-position:center top; }
.galaxy-position { position:absolute; left:50%; top:51%; width:min(84vw,1060px); aspect-ratio:1; transform:translate(-50%,-50%); pointer-events:none; opacity:.6; }
.round-galaxy { display:block; width:100%; height:100%; object-fit:contain; will-change:transform; }
@keyframes galaxyTurn{to{transform:rotate(360deg)}}
.category-section { padding-top:78px; padding-bottom:80px; border-bottom:1px solid var(--line); background:linear-gradient(180deg,#05070e18,#0c0b181c); }
.category-section .section-head>p { max-width:265px; }
.category-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; align-items:start; }
.category { min-width:0; }
.category-restaurant { --glow:255,126,91; }
.category-driving { --glow:154,132,255; }
.category-trigger { display:block; width:100%; padding:0; background:#101019c9; color:#fff; text-align:left; transition:transform .3s,box-shadow .3s; }
.category-trigger:hover { transform:translateY(-4px); }
.window-bar { height:27px; display:flex; align-items:center; gap:4px; padding:0 12px; border-bottom:1px solid rgba(var(--glow),.2); }
.window-bar>i { width:4px; height:4px; border-radius:50%; }
.window-bar>span { font:6px "DM Mono",monospace; letter-spacing:.13em; margin:auto; }
.window-bar>b { font-size:11px; font-weight:400; color:#c5bbd5; }
.category-image { display:block; position:relative; height:162px; overflow:hidden; background:#12121b; }
.category-image::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,#03020a00 15%,#080612b8); }
.category-image img { height:100%; width:100%; object-fit:cover; opacity:.82; transition:transform .6s; }
.category-trigger:hover img { transform:scale(1.035); }
.category-image-caption { position:absolute; left:18px; right:18px; bottom:18px; z-index:1; letter-spacing:-.045em; max-width:210px; line-height:1.1; }
.category-driving img { object-position:center 65%; }
.category-caption { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:20px 18px; }
.category-caption strong { font-size:25px; letter-spacing:-.05em; display:block; }
.category-caption small { display:block; margin-top:8px; letter-spacing:.03em; }
.category-caption>b { height:33px; width:33px; border:1px solid rgba(var(--glow),.45); border-radius:50%; display:grid; place-items:center; color:rgba(var(--glow),1); font-size:23px; font-weight:400; transition:transform .4s; }
.is-open .category-caption>b { transform:rotate(45deg); }
.wheel-panel { padding-top:25px; transform-origin:top center; animation:wheelPop .65s cubic-bezier(.16,1,.3,1) both; }
.wheel-panel[hidden] { display:none; }
.wheel-stage { position:relative; width:100%; aspect-ratio:1; height:auto; min-height:300px; max-height:360px; --orbit-radius:clamp(78px,7.4vw,112px); --node-width:clamp(106px,9.6vw,142px); isolation:isolate; }
.wheel-stage::before { content:""; position:absolute; left:50%; top:50%; width:8px; height:35px; border-left:1px solid rgba(var(--glow),.6); transform:translate(-50%,calc(-50% - 53px)); opacity:.7; }
.wheel-guide { position:absolute; left:50%; top:50%; width:calc(var(--orbit-radius)*2); height:calc(var(--orbit-radius)*2); border:1px solid rgba(var(--glow),.32); border-radius:50%; transform:translate(-50%,-50%); box-shadow:0 0 20px rgba(var(--glow),.11),inset 0 0 20px rgba(var(--glow),.07); }
.wheel-guide::before { content:""; position:absolute; inset:-16px; border:1px dashed rgba(var(--glow),.13); border-radius:50%; }
.wheel-guide::after { content:""; position:absolute; border:1px dashed rgba(var(--glow),.13); border-radius:50%; }
.wheel-guide::after { inset:15px; border-style:solid; opacity:.7; }
.wheel-center { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:62px; height:62px; display:flex; align-items:center; justify-content:center; flex-direction:column; border:1px solid rgba(var(--glow),.4); border-radius:50%; box-shadow:0 0 18px rgba(var(--glow),.14); gap:4px; }
.wheel-center>span { font-size:19px; color:#eee5f6; letter-spacing:-.05em; }
.wheel-center>small { font:5px "DM Mono",monospace; letter-spacing:.05em; text-transform:uppercase; }
.concept-orbit { position:absolute; inset:0; animation:conceptOrbit 40s linear infinite; transform-origin:center; }
.orbit-node { position:absolute; left:50%; top:50%; width:var(--node-width); transform:translate(-50%,-50%) rotate(var(--node-angle)) translateX(var(--orbit-radius)) rotate(calc(var(--node-angle)*-1)); }
.orbit-window { width:100%; display:block; padding:0; background:#14101e; color:#fff; text-align:left; animation:conceptCounterOrbit 40s linear infinite; transform-origin:center; transition:box-shadow .25s; }
.orbit-window:hover { z-index:3; }
.orbit-chrome { display:flex; height:13px; align-items:center; gap:3px; padding-left:6px; }
.orbit-chrome i { width:2px; height:2px; border-radius:50%; background:rgba(var(--glow),.75); }
.orbit-label { display:flex; align-items:center; justify-content:space-between; gap:2px; line-height:1.2; padding:7px 6px; }
.orbit-label>b { font-weight:400; color:rgb(var(--glow)); font-size:10px; }
.mini-site { display:block; position:relative; aspect-ratio:1.7; overflow:hidden; background:var(--mini-bg); color:var(--mini-fg); }
.mini-nav { position:absolute; top:5px; left:6px; right:6px; font-size:3px; font-weight:700; z-index:2; letter-spacing:.06em; }
.mini-nav>i { float:right; font-style:normal; }
.mini-image { position:absolute; right:5%; top:23%; height:65%; width:46%; background-size:cover; background-position:center; border-radius:2px; }
.mini-site>strong { position:absolute; left:6%; top:32%; font:7px/1.05 Georgia,serif; letter-spacing:-.03em; width:52%; z-index:1; }
.mini-rule { position:absolute; bottom:19%; left:6%; height:3px; width:17%; background:var(--mini-accent); }
.mini-immersive { color:#fff; }
.mini-immersive .mini-image { inset:0; width:100%; height:100%; border-radius:0; }
.mini-immersive::after { content:""; position:absolute; inset:0; background:#0008; }
.mini-immersive>strong { top:39%; text-align:center; left:10%; width:80%; font-size:8px; }
.mini-immersive .mini-rule { left:41%; bottom:15%; z-index:1; }
.mini-split .mini-image { width:44%; right:0; top:0; height:100%; border-radius:0; }
.mini-split>strong { font-family:"Space Grotesk",sans-serif; font-size:6.5px; font-weight:500; }
.mini-split .mini-nav { right:48%; }
.wheel-toolbar { display:flex; align-items:center; justify-content:space-between; gap:6px; margin-top:6px; padding:0 5px; }
.wheel-pause { border:1px solid rgba(var(--glow),.3); border-radius:20px; padding:7px 9px; white-space:nowrap; }
.category-note { line-height:1.8; margin:30px 0 0; max-width:640px; }
.category.is-paused .concept-orbit { animation-play-state:paused; }
.category.is-paused .orbit-window { animation-play-state:paused; }
.category.dialog-paused .concept-orbit { animation-play-state:paused; }
.category.dialog-paused .orbit-window { animation-play-state:paused; }
.wheel-stage:hover .concept-orbit { animation-play-state:paused; }
.wheel-stage:hover .orbit-window { animation-play-state:paused; }
.wheel-stage:focus-within .concept-orbit { animation-play-state:paused; }
.wheel-stage:focus-within .orbit-window { animation-play-state:paused; }
@keyframes wheelPop{from{opacity:0;transform:translateY(-20px) scale(.82)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes conceptOrbit{to{transform:rotate(360deg)}}
@keyframes conceptCounterOrbit{to{transform:rotate(-360deg)}}
.dialog-open { overflow:hidden; }
.concept-dialog { padding:0; width:min(1130px,94vw); height:min(850px,92vh); max-width:none; max-height:none; color:#f4ecfa; overflow:hidden; }
.concept-dialog[open] { display:flex; flex-direction:column; animation:wheelPop .4s cubic-bezier(.16,1,.3,1); }
.concept-dialog::backdrop { background:#03020aca; backdrop-filter:blur(10px); }
.concept-dialog-bar { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:17px 22px; border-bottom:1px solid #ffffff1f; flex-shrink:0; }
.concept-dialog-bar .mono { font-size:7px; color:#a797bd; }
.concept-dialog-bar h2 { font-size:19px; letter-spacing:-.04em; font-weight:400; margin:5px 0 0; }
.preview-size-controls { display:flex; gap:4px; margin-left:auto; border:1px solid #ffffff1f; padding:3px; border-radius:7px; }
.preview-size-controls button { background:none; border:0; color:#a094b5; padding:7px 12px; font-size:10px; border-radius:4px; }
.preview-size-controls button.active { color:#fff; }
.dialog-close { border:1px solid #ffffff30; color:#fff; background:none; border-radius:50%; width:32px; height:32px; display:grid; place-items:center; font-size:23px; font-weight:400; padding:0; line-height:1; }
.concept-demo-scroll { overflow:auto; min-height:0; flex:1; background:#09080d; scroll-behavior:smooth; }
.concept-demo { width:100%; min-height:100%; margin:0 auto; transition:max-width .35s; max-width:100%; }
.concept-demo-scroll.is-mobile .concept-demo { max-width:390px; box-shadow:0 0 0 1px #ffffff21; margin-top:15px; margin-bottom:15px; border-radius:9px; overflow:hidden; }
.concept-dialog-bottom { display:flex; align-items:center; justify-content:space-between; padding:12px 22px; border-top:1px solid #ffffff17; font-size:8px; color:#a99cb9; flex-shrink:0; }
.sample-site { background:var(--sample-bg); color:var(--sample-fg); container-type:inline-size; min-height:100%; }
.sample-nav { padding:23px 5%; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid color-mix(in srgb,var(--sample-fg) 15%,transparent); gap:20px; }
.sample-nav strong { font-size:12px; letter-spacing:.08em; }
.sample-nav>span { font-size:9px; opacity:.65; }
.sample-hero { position:relative; min-height:480px; display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:7%; padding:55px 5% 65px; overflow:hidden; }
.sample-photo { height:355px; width:100%; object-fit:cover; grid-column:2; grid-row:1; object-position:center; border-radius:2px; }
.sample-copy { grid-column:1; grid-row:1; position:relative; z-index:1; }
.sample-eyebrow { font-size:8px; letter-spacing:.15em; text-transform:uppercase; color:var(--sample-accent); }
.sample-copy h3 { font:clamp(30px,4.2vw,57px)/1.02 Georgia,serif; letter-spacing:-.055em; font-weight:400; margin:24px 0 22px; }
.sample-copy>p { font-size:12px; line-height:1.8; max-width:280px; opacity:.75; }
.sample-cta { font-size:9px; padding:14px 18px; margin-top:16px; border:0; background:var(--sample-accent); color:var(--sample-bg); display:inline-flex; gap:20px; align-items:center; }
.sample-cta:hover { filter:brightness(1.1); }
.sample-cta span { font-size:16px; }
.sample-index { position:absolute; bottom:25px; left:5%; font-size:6px; letter-spacing:.2em; opacity:.6; }
.sample-details { padding:65px 8% 70px; border-top:1px solid color-mix(in srgb,var(--sample-fg) 15%,transparent); scroll-margin-top:20px; }
.sample-details h3 { font:35px/1.15 Georgia,serif; letter-spacing:-.04em; font-weight:400; max-width:540px; margin:20px 0; }
.sample-details>p { font-size:12px; line-height:1.9; opacity:.8; max-width:590px; }
.sample-features { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:40px; }
.sample-features>div { border-top:1px solid color-mix(in srgb,var(--sample-fg) 25%,transparent); padding-top:20px; position:relative; }
.sample-features span { font-size:8px; opacity:.6; }
.sample-features h4 { font-size:15px; font-weight:400; line-height:1.3; letter-spacing:-.03em; margin:15px 20px 0 0; }
.sample-features i { position:absolute; right:0; top:20px; font-style:normal; }
.sample-footer { padding:27px 5%; display:flex; justify-content:space-between; gap:20px; border-top:1px solid color-mix(in srgb,var(--sample-fg) 15%,transparent); font-size:8px; }
.sample-footer strong { letter-spacing:.06em; }
.sample-footer span { opacity:.65; }
.sample-immersive .sample-nav { background:var(--sample-bg); }
.sample-immersive .sample-hero { display:flex; justify-content:center; align-items:center; text-align:center; min-height:530px; padding:60px 8%; }
.sample-immersive .sample-hero::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,#0007,#000a); }
.sample-immersive .sample-photo { position:absolute; inset:0; height:100%; width:100%; border-radius:0; }
.sample-immersive .sample-copy { z-index:1; }
.sample-immersive .sample-copy>p { margin-left:auto; margin-right:auto; max-width:390px; }
.sample-immersive .sample-copy h3 { font-size:clamp(35px,5vw,66px); }
.sample-immersive .sample-index { z-index:1; }
.sample-split .sample-hero { gap:0; padding:0; min-height:480px; grid-template-columns:1fr 1.05fr; }
.sample-split .sample-copy { padding:55px 10%; }
.sample-split .sample-photo { height:100%; min-height:480px; border-radius:0; }
.sample-split .sample-copy h3 { font-family:"Space Grotesk",sans-serif; font-size:clamp(30px,4vw,54px); letter-spacing:-.06em; }
.sample-split .sample-index { left:5%; bottom:20px; }
.asset-credits { margin-top:15px; }
.asset-credits summary { padding:0; display:inline; font-size:9px; text-decoration:underline; cursor:pointer; }
.asset-credits p { line-height:1.8; max-width:900px; padding:0; margin:14px 0; }
.asset-credits a { text-decoration:underline; }
@container (max-width:550px) {
  .sample-nav { padding:20px 6%; }
  .sample-nav strong { font-size:10px; }
  .sample-nav>span { font-size:7px; }
  .sample-hero { display:flex; flex-direction:column; padding:35px 6% 50px; min-height:0; align-items:stretch; }
  .sample-copy { order:0; }
  .sample-photo { order:1; height:240px; margin-top:30px; }
  .sample-copy h3 { font-size:39px; }
  .sample-copy>p { font-size:12px; }
  .sample-index { bottom:18px; left:6%; }
  .sample-details { padding:40px 6%; }
  .sample-details h3 { font-size:29px; }
  .sample-features { grid-template-columns:1fr; gap:25px; }
  .sample-features h4 { font-size:17px; }
  .sample-footer { flex-direction:column; gap:12px; padding:25px 6%; }
  .sample-immersive .sample-hero { min-height:500px; }
  .sample-immersive .sample-photo { margin:0; }
  .sample-immersive .sample-copy h3 { font-size:41px; }
  .sample-split .sample-hero { display:flex; padding:0; min-height:0; }
  .sample-split .sample-copy { padding:40px 6% 20px; }
  .sample-split .sample-photo { height:250px; min-height:250px; margin-top:20px; }
  .sample-split .sample-copy h3 { font-size:40px; }
  .sample-split .sample-index { bottom:15px; color:white; }
}
@media (min-width:1550px) {
  .wheel-stage { --orbit-radius:112px; --node-width:142px; min-height:350px; }
  .category-image { height:180px; }
}
@media (max-width:1100px) {
  .category-grid { gap:20px; }
  .category-image-caption { font-size:18px; }
  .category-caption { padding:17px 14px; }
  .category-caption strong { font-size:23px; }
  .category-caption small { font-size:7px; }
  .wheel-stage { --orbit-radius:clamp(72px,7.5vw,90px); --node-width:clamp(96px,10vw,123px); min-height:280px; }
  .orbit-label { font-size:6px; }
}
@media (max-width:760px) {
  .nav { padding:0 5%; }
  .galaxy-position { width:135vw; top:49%; opacity:.55; }
  .space-background { background-size:auto 300%; background-position:center top; }
  .category-section { padding-top:52px; padding-bottom:55px; }
  .category-grid { grid-template-columns:1fr; gap:27px; }
  .category-image { height:190px; }
  .category-image-caption { left:20px; bottom:24px; max-width:250px; }
  .category-caption { padding:20px; }
  .window-bar { height:28px; }
  .window-bar>span { font-size:7px; }
  .wheel-panel { padding-top:16px; }
  .wheel-stage { max-height:none; aspect-ratio:auto; max-width:365px; margin:0 auto; }
  .orbit-label { font-size:8px; padding:8px; }
  .orbit-chrome { height:15px; }
  .mini-nav { font-size:4px; }
  .mini-site>strong { font-size:8px; }
  .mini-immersive>strong { font-size:9px; }
  .mini-split>strong { font-size:8px; }
  .wheel-toolbar { max-width:340px; margin:5px auto 0; padding:0 7px; }
  .wheel-toolbar>.mono { font-size:7px; }
  .wheel-pause { font-size:7px; }
  .category-note { font-size:9px; }
  .concept-dialog { height:94dvh; width:96vw; }
  .concept-dialog-bar { padding:13px 12px; gap:9px; }
  .concept-dialog-bar h2 { font-size:15px; }
  .concept-dialog-bar .mono { font-size:5.5px; }
  .preview-size-controls button { font-size:8px; padding:6px; }
  .dialog-close { height:28px; width:28px; font-size:21px; flex-shrink:0; }
  .concept-dialog-bottom { font-size:6px; padding:10px 12px; }
  .sample-copy h3 { font-size:37px; }
  .sample-immersive .sample-copy h3 { font-size:40px; }
  .asset-credits summary { font-size:8px; }
}
@media (max-width:380px) {
  .category-caption strong { font-size:25px; }
}
@media (prefers-reduced-motion:reduce) {
  .round-galaxy { animation:none !important; }
  .concept-orbit { animation:none !important; }
  .orbit-window { animation:none !important; }
  .wheel-panel { animation:none !important; }
  .concept-orbit { transform:rotate(0); }
  .orbit-window { transform:rotate(0); }
  .concept-demo-scroll { scroll-behavior:auto; }
  .concept-demo { transition:none; }
}
@media (min-width:761px) {
  .nav { gap:3%; }
  .links { gap:20px; font-size:9px; }
}
.wheel-stage { overflow:clip; overflow-clip-margin:14px; }
@media (max-width:760px) {
  .wheel-stage { --orbit-radius:85px; --node-width:126px; height:310px; min-height:310px; }
}
@media (max-width:380px) {
  .wheel-stage { --orbit-radius:77px; --node-width:113px; height:292px; min-height:292px; }
}
.white-halo.sun-stage { background:transparent; box-shadow:none; overflow:visible; isolation:isolate; }
.sun-video { position:absolute; left:-10%; top:-10%; width:120%; height:120%; object-fit:cover; border-radius:50%; mix-blend-mode:screen; z-index:1; mask-image:radial-gradient(circle,#000 0%,#000 55%,#000d 61%,transparent 71%); -webkit-mask-image:radial-gradient(circle,#000 0%,#000 55%,#000d 61%,transparent 71%); }
.solar-aura { position:absolute; inset:-42%; border-radius:50%; background:radial-gradient(circle,#ffca4540 0%,#ff97272b 32%,#ff3c1518 48%,transparent 68%); filter:blur(12px); animation:solarBreath 7s ease-in-out infinite alternate; z-index:0; }
@keyframes solarBreath{from{opacity:.65;transform:scale(.94)}to{opacity:1;transform:scale(1.07)}}
@media (prefers-reduced-motion:reduce) {
  .solar-aura { animation:none; }
}
.page-shell { scroll-margin-top:140px; }
:root { --solar:#ffb34d; --solar-rgb:255,157,51; }
.page-shell { border:0; border-radius:0; box-shadow:none; background:none; }
.solar-window { position:relative; border:1px solid var(--solar-border); border-radius:24px; }
.solar-window::after { content:""; position:absolute; inset:-2px; z-index:9; pointer-events:none; border-radius:inherit; padding:2px; background:conic-gradient(from 20deg,#ff9a2b70,#fff3c9ed 12%,#ff5b216e 24%,#ffc26bac 38%,#fff5d1d9 48%,#ff77204d 62%,#ffd58daa 77%,#ff8f2380 90%,#ff9a2b70); mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); mask-composite:exclude; }
.work-section { margin-top:38px; border-radius:24px; scroll-margin-top:30px; }
.category-section { margin-top:38px; border-radius:24px; scroll-margin-top:30px; }
.services-section { margin-top:38px; border-radius:24px; scroll-margin-top:30px; }
.footer { margin-top:38px; border-radius:24px; scroll-margin-top:30px; }
.hero { --reveal:50%; border-top-color:transparent; border-radius:24px; background:radial-gradient(ellipse at 50% 50%,#11142442,#03050a66 70%); }
.hero-new { position:absolute; inset:0; border-radius:inherit; }
.hero-character { filter:hue-rotate(115deg) saturate(1.15) drop-shadow(0 12px 22px #0007); }
.service-orbit { border-color:#ffb85a44; }
.service-orbit i { border-color:#ffb85a44; }
summary>.mono { color:#c9ab89; }
.back-top { border-color:#ffbd7355; }
a:focus-visible { outline-color:#ffd59b; }
button:focus-visible { outline-color:#ffd59b; }
summary:focus-visible { outline-color:#ffd59b; }
.nav { background:none; border-radius:24px 24px 0 0; }
.hero-old { display:none; position:absolute; inset:0; border-radius:inherit; overflow:hidden; pointer-events:none; background:#67635c; }
.comparison-ready .hero-old { display:block; }
.legacy-site { position:absolute; inset:0; padding:117px 4.5% 35px; color:#47453c; background:linear-gradient(180deg,#19191b 0,#282725 96px,#b3ac94 128px,#c8c1a7 70%,#a49d87); font:13px/1.55 Arial,sans-serif; filter:saturate(.45); }
.legacy-masthead { display:flex; flex-direction:column; gap:3px; padding:0 21px 16px; border-bottom:5px ridge #9b9989; color:#253955; }
.legacy-masthead>span { font:bold 24px Georgia,serif; letter-spacing:.06em; color:#585d64; text-shadow:1px 1px #ece8d2; }
.legacy-masthead strong { font-size:12px; letter-spacing:.06em; }
.legacy-masthead small { font-size:10px; color:#747163; }
.legacy-ticker { font-size:10px; color:#55594c; background:#a39f8c; border:1px inset #d2cbb0; padding:6px 12px; margin:13px 0; }
.legacy-columns { display:grid; grid-template-columns:17% 1fr 22%; gap:18px; }
.legacy-menu { font-size:11px; border:1px ridge #d1cab1; background:#b0ab99; padding:10px; display:flex; flex-direction:column; gap:9px; align-self:start; }
.legacy-menu>b { background:#596676; color:#d7d6c9; padding:5px; font-size:12px; margin:-10px -10px 0; }
.legacy-menu>span { color:#3d5067; text-decoration:underline; border-bottom:1px solid #8b8878; padding-bottom:4px; }
.legacy-badge { font:bold 8px/1.4 Verdana,sans-serif; text-align:center; background:#8b8e87; border:2px outset #c2c3b6; padding:7px 2px; color:#3c413e; margin:14px 0 4px; transform:rotate(-3deg); }
.legacy-menu>small { font-size:8px; color:#726d60; }
.legacy-content { padding:10px 14px 0; border:1px solid #a7a18e; background:#d0c9af8a; min-width:0; }
.legacy-content>small { font-size:8px; color:#817b68; }
.legacy-content h2 { font:bold clamp(22px,3.2vw,45px)/1.05 Georgia,serif; color:#55594f; margin:15px 0 20px; letter-spacing:-.035em; }
.legacy-content p { font-size:11px; max-width:420px; color:#77715e; }
.legacy-content hr { border:0; border-top:2px groove #b6b09b; }
.legacy-placeholder { height:75px; max-width:260px; display:flex; align-items:center; gap:10px; color:#918a72; font:10px Verdana,sans-serif; border:1px inset #b9b29d; background:#c4bda5; margin:15px 0; }
.legacy-placeholder>span { font-size:32px; margin-left:12px; color:#8d8c78; }
.legacy-construction { font:bold 9px Verdana,sans-serif; padding:9px 5px; background:repeating-linear-gradient(135deg,#aaa489 0 8px,#c4bda2 8px 16px); border:1px solid #a39c84; text-align:center; color:#5f5b4c; }
.legacy-content .legacy-more { font-size:9px; color:#565f71; text-decoration:underline; }
.legacy-news { background:#bab39b; border:2px ridge #d4cbb0; padding:10px; font-size:11px; align-self:start; }
.legacy-news>b { font-size:10px; color:#775b48; }
.legacy-news>div { font-size:9px; border-top:1px dashed #958e77; padding-top:15px; margin-top:24px; }
.legacy-news strong { display:inline-block; font:14px monospace; letter-spacing:3px; background:#6f7269; color:#d5d8b9; padding:4px 6px; margin-top:8px; }
.legacy-bottom { position:absolute; bottom:28px; left:5.5%; font-size:9px; color:#67614f; }
.legacy-bottom small { font-size:8px; opacity:.75; }
.legacy-dust { position:absolute; inset:0; border-radius:inherit; opacity:.8; background:radial-gradient(ellipse at 17% 28%,#e1d4af63,transparent 48%),radial-gradient(ellipse at 12% 94%,#6e5c4180,transparent 55%),radial-gradient(circle at 7% 22%,#b7aa82aa 0 1px,transparent 2px) 0 0/71px 89px,radial-gradient(circle at 66% 11%,#ece0bc88 0 .6px,transparent 1.5px) 0 0/43px 67px; box-shadow:inset 0 0 90px #3b332977; pointer-events:none; }
.compare-handle { display:none; position:absolute; left:clamp(29px,var(--reveal),calc(100% - 29px)); top:50%; width:56px; height:56px; transform:translate(-50%,-50%); border:1px solid #ffe8b9; border-radius:50%; z-index:14; cursor:ew-resize; touch-action:none; user-select:none; -webkit-user-select:none; outline-offset:6px; }
.comparison-ready .compare-handle { display:grid; place-items:center; }
.compare-handle>span { display:flex; align-items:center; gap:7px; font-size:23px; line-height:1; }
.compare-handle i { height:15px; width:1px; background:#ffcb87; box-shadow:0 0 4px #ffae4e; }
.compare-handle>small { position:absolute; top:65px; font:6px "DM Mono",monospace; letter-spacing:.16em; color:#ffdfac; padding:5px 7px; border-radius:4px; background:#0a0909cc; }
.comparison-dragging .compare-handle { box-shadow:0 0 3px #fff3da,0 0 26px #ff9919aa,inset 0 0 12px #ffc57644; }
.compare-labels { display:none; position:absolute; bottom:16px; left:5.5%; right:5.5%; z-index:12; pointer-events:none; justify-content:space-between; gap:20px; font:7px "DM Mono",monospace; letter-spacing:.12em; color:#ffe0ae; }
.comparison-ready .compare-labels { display:flex; }
.compare-labels>span { padding:8px 10px; border:1px solid #b79e7855; border-radius:5px; }
.compare-labels>span:last-child { text-align:right; }
.compare-labels i { font-style:normal; letter-spacing:.025em; display:block; margin-top:4px; }
.hero-bottom { bottom:76px; }
.sr-only { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.hero.reveal-paused::after { animation-play-state:paused !important; }
.hero.reveal-paused .hero-new * { animation-play-state:paused !important; }
.category { --glow:var(--solar-rgb); }
.project-preview { border:1px solid var(--solar-border); box-shadow:var(--solar-shadow); border-radius:17px; }
.category-trigger { border:1px solid var(--solar-border); box-shadow:var(--solar-shadow); border-radius:17px; }
.orbit-window { border:1px solid var(--solar-border); box-shadow:var(--solar-shadow); }
.concept-dialog { border:1px solid var(--solar-border); box-shadow:var(--solar-shadow); }
.project-preview video { border-radius:0 0 15px 15px; }
.view-project { border-color:#ffc16e44; border-radius:5px; }
.project-preview:hover .view-project { background:#75431a; }
.chrome { background:#18140f; }
.window-bar { background:#18140f; }
.orbit-chrome { background:#18140f; }
.concept-dialog-bar { background:#18140f; }
.chrome i { background:#d9984d; }
.window-bar>i { background:#d9984d; }
.orbit-window { border-radius:10px; }
.orbit-label { background:#17120e; border-radius:0 0 9px 9px; }
.wheel-center { background:#18120cc7; }
.wheel-pause { background:#21170fbb; border-color:#ffbd6d44; }
.wheel-pause:hover { background:#49301d; }
.concept-dialog { border-radius:20px; background:#13100d; }
.preview-size-controls button.active { background:#5b361c; }
.dialog-close:hover { background:#68401f; }
@media (min-width:1550px) {
  .legacy-content h2 { font-size:48px; }
  .legacy-content p { font-size:12px; }
  .legacy-placeholder { height:100px; }
}
@media (max-width:1100px) {
  .legacy-columns { grid-template-columns:19% 1fr 17%; gap:12px; }
  .legacy-menu { padding:8px; font-size:9px; }
  .legacy-menu>b { margin:-8px -8px 0; }
  .legacy-news { font-size:9px; padding:7px; }
  .legacy-content { padding:9px 11px; }
  .legacy-content p { font-size:10px; }
  .legacy-masthead>span { font-size:21px; }
}
@media (max-width:760px) {
  .page-shell { margin-top:28px; width:calc(100% - 28px); }
  .solar-window { border-radius:19px; }
  .work-section { border-radius:19px; }
  .category-section { border-radius:19px; }
  .services-section { border-radius:19px; }
  .footer { border-radius:19px; }
  .work-section { margin-top:25px; }
  .category-section { margin-top:25px; }
  .services-section { margin-top:25px; }
  .footer { margin-top:25px; }
  .nav { border-radius:19px 19px 0 0; }
  .hero-copy p { min-height:0; }
  .compare-handle { width:48px; height:48px; left:clamp(25px,var(--reveal),calc(100% - 25px)); top:49%; }
  .compare-handle>small { top:56px; }
  .compare-labels { bottom:17px; left:6%; right:6%; font-size:6px; gap:10px; }
  .compare-labels>span { padding:7px 8px; }
  .legacy-site { padding:108px 6% 35px; }
  .legacy-masthead { padding:0 4px 15px; border-bottom-width:4px; }
  .legacy-masthead>span { font-size:20px; }
  .legacy-masthead strong { font-size:10px; max-width:190px; }
  .legacy-masthead small { font-size:8px; }
  .legacy-ticker { font-size:8px; line-height:1.5; margin:13px 0; padding:7px; }
  .legacy-columns { grid-template-columns:27% 1fr; gap:9px; }
  .legacy-menu { font-size:8px; padding:6px; gap:10px; }
  .legacy-menu>b { font-size:9px; padding:6px; margin:-6px -6px 0; }
  .legacy-menu>small { font-size:7px; }
  .legacy-badge { font-size:6px; padding:5px 1px; }
  .legacy-news { display:none; }
  .legacy-content { padding:9px 8px; }
  .legacy-content>small { font-size:6px; }
  .legacy-content h2 { font-size:27px; margin:17px 0 18px; }
  .legacy-content p { font-size:10px; line-height:1.7; }
  .legacy-placeholder { height:85px; gap:6px; font-size:8px; }
  .legacy-placeholder>span { font-size:25px; margin-left:6px; }
  .legacy-construction { font-size:7px; padding:10px 4px; line-height:1.7; }
  .legacy-content .legacy-more { font-size:8px; }
  .legacy-bottom { bottom:80px; left:6%; font-size:7px; max-width:230px; }
  .legacy-bottom small { font-size:7px; }
  .project-preview { border-radius:16px; }
  .category-trigger { border-radius:16px; }
  .concept-dialog { border-radius:16px; }
}
.video-play-hint { margin:28px 0 0; text-align:right; line-height:1.8; letter-spacing:.06em; }
.project-preview::after { content:"▷ Vorschau beim Darüberfahren"; position:absolute; left:10px; bottom:10px; max-width:calc(100% - 130px); padding:7px 9px; background:#100d09e8; border:1px solid #ffbd6d44; border-radius:5px; color:#f6d4a4; font:6px/1.4 "DM Mono",monospace; transition:opacity .2s; pointer-events:none; }
.project-preview.is-playing::after { opacity:0; }
@media (hover:none) {
  .project-preview::after { display:none; }
  .video-play-hint { display:none; }
}
:root { --solar-border:#ffe1a7e6; --solar-shadow:0 0 3px #fff2c9d9,0 0 13px #ffb3338c,0 0 32px #ff6b183d,inset 0 0 16px #ffb52b1c; }
body { font-family:var(--studio-body); }
.hero h1 { font-family:var(--studio-display); font-weight:700; letter-spacing:-.065em; text-shadow:0 2px 15px #000b; }
.section-head h2 { font-family:var(--studio-display); font-weight:700; letter-spacing:-.065em; text-shadow:0 2px 15px #000b; }
.services-intro h2 { font-family:var(--studio-display); font-weight:700; letter-spacing:-.065em; text-shadow:0 2px 15px #000b; }
.footer h2 { font-family:var(--studio-display); font-weight:700; letter-spacing:-.065em; text-shadow:0 2px 15px #000b; }
.section-head h2 em { font-family:inherit; font-weight:inherit; font-style:normal; letter-spacing:inherit; }
.services-intro h2 em { font-family:inherit; font-weight:inherit; font-style:normal; letter-spacing:inherit; }
.footer h2 em { font-family:inherit; font-weight:inherit; font-style:normal; letter-spacing:inherit; }
.hero-copy { top:244px; }
.hero-copy h2 { font-family:var(--studio-display); letter-spacing:-.04em; margin:16px 0 20px; color:#fff; }
.hero-copy p { font-size:15px; line-height:1.8; }
.hero-copy::before { content:""; position:absolute; inset:-25px -23px -22px; z-index:-1; border-radius:24px; background:radial-gradient(ellipse,#03060baf,transparent 76%); pointer-events:none; }
.chapter { font-size:10px; letter-spacing:.13em; }
.section-number { font-size:10px; letter-spacing:.13em; }
.eyebrow { font-size:10px; color:#f4e7d8; }
.hero-signature { font-size:11px; }
.hero-work-link strong { font-size:16px; font-weight:650; }
.hero-work-link>.mono { font-size:9px; color:#cec2b3; }
.links a { font-weight:600; }
.section-head>p { font-size:15px; line-height:1.85; color:#e2dce0; font-weight:500; text-shadow:0 2px 9px #000; }
.services-intro>p:not(.mono) { font-size:15px; line-height:1.85; color:#e2dce0; font-weight:500; text-shadow:0 2px 9px #000; }
.section-head { gap:35px; }
.section-head>p { max-width:310px; }
.section-head h2 { font-size:clamp(39px,4.8vw,70px); line-height:1.09; }
.services-intro h2 { font-size:clamp(39px,4.8vw,70px); line-height:1.09; }
.project-meta h3 { font-family:var(--studio-display); font-weight:650; font-size:27px; }
.project-meta .mono { font-size:9px; color:#ded1c1; }
.category-caption strong { font-family:var(--studio-display); font-weight:700; }
.category-caption small { font-size:11px; color:#e3d5c3; }
.category-image-caption { font-family:var(--studio-display); font-size:22px; font-weight:650; text-shadow:0 2px 12px #000; }
.category-note { font-size:12px; }
summary h3 { font-family:var(--studio-display); font-size:22px; font-weight:650; color:#fff; }
.services-list details>p { font-size:14px; line-height:1.9; color:#dfd8df; font-weight:500; }
.orbit-label { font-size:8px; font-weight:600; color:#f5e9dc; }
.wheel-toolbar>.mono { font-size:8px; color:#e5c7a5; }
.wheel-pause { font-size:8px; color:#e5c7a5; }
.wheel-center>small { font-size:6px; color:#e7cba5; }
.chrome { font-size:8px; color:#ddd0bf; }
.window-bar>span { font-size:8px; color:#e2c9a8; }
.view-project { font-size:8px; }
.video-play-hint { font-size:9px; color:#e2cdb1; }
.project-preview::after { font-size:7px; }
.fine { color:#d8cabc; }
.contact-note { font-size:12px; }
.fine { font-size:9px; }
.footer-main p { font-size:23px; font-weight:600; color:#f5eee6; }
.image-credit { font-size:10px; color:#c4b9c7; }
.asset-credits { font-size:10px; color:#c4b9c7; }
.asset-credits p { font-size:10px; color:#c4b9c7; }
.solar-window { background:linear-gradient(135deg,#07090ed4,#080b128c 60%,#110e09a1); }
.project-preview { position:relative; overflow:visible; }
.category-trigger { position:relative; overflow:visible; }
.orbit-window { position:relative; overflow:visible; }
.chrome { border-radius:16px 16px 0 0; }
.window-bar { border-radius:16px 16px 0 0; }
.category-caption { border-radius:0 0 16px 16px; }
.orbit-chrome { border-radius:9px 9px 0 0; }
.solar-aura { will-change:transform,opacity; }
.sun-video { filter:none; transform:translateZ(0); backface-visibility:hidden; }
@media (max-width:1250px) {
  .nav { gap:3%; }
  .links { font-size:9px; gap:16px; }
  .hero-copy { width:205px; right:4%; }
  .hero-copy h2 { font-size:26px; }
  .hero-copy p { font-size:13px; }
  .project-meta .mono { font-size:7px; }
}
@media (max-width:760px) {
  .hero { overflow-clip-margin:18px; height:940px; }
  .hero-copy { top:520px; left:6%; right:6%; }
  .hero-copy h2 { margin-bottom:17px; }
  .hero-copy p { font-size:14px; line-height:1.85; max-width:420px; }
  .hero-copy::before { inset:-18px -10px -12px; }
  .hero-signature { font-size:10px; margin-top:18px; }
  .links { letter-spacing:.04em; }
  .nav { gap:10px; }
  .eyebrow { font-size:7px; letter-spacing:.07em; }
  .chapter { font-size:9px; }
  .section-number { font-size:9px; }
  .section-head h2 { font-size:39px; line-height:1.1; }
  .services-intro h2 { font-size:39px; line-height:1.1; }
  .section-head>p { font-size:14px; }
  .services-intro>p:not(.mono) { font-size:14px; }
  .section-head>p { max-width:310px; }
  .project-meta h3 { font-size:26px; }
  .project-meta .mono { font-size:9px; }
  .category-caption strong { font-size:28px; }
  .category-caption small { font-size:11px; }
  .category-image-caption { font-size:25px; }
  summary h3 { font-size:20px; }
  .services-list details>p { font-size:13px; }
  .footer h2 { font-size:70px; }
  .footer-main p { font-size:20px; }
  .fine { font-size:8px; gap:15px; }
  .hero-work-link strong { font-size:12px; }
  .hero-work-link>.mono { font-size:7px; }
  .hero-bottom { bottom:82px; }
  .video-play-hint { font-size:8px; }
  .chrome { font-size:8px; }
  .image-credit { font-size:9px; }
  .asset-credits { font-size:9px; }
  .asset-credits p { font-size:9px; }
}
@media (max-width:380px) {
  .logo { font-size:16px; }
  .section-head h2 { font-size:36px; }
  .services-intro h2 { font-size:36px; }
}
@media (max-width:760px) {
  .hero { border-top-color:var(--solar-border); }
}
body { overflow-x:clip; }
.comparison-overlay { position:absolute; left:0; right:0; top:-70px; bottom:0; overflow:hidden; pointer-events:none; z-index:11; }
@media (max-width:760px) {
  .hero { overflow:visible; }
  .hero-new { overflow:hidden; }
}
.space-background { background:#02040a !important; }
.static-starfield { position:absolute; inset:0; width:100%; height:100%; display:block; }
.galaxy-position { isolation:isolate; }
.round-galaxy { animation:none !important; }
.galaxy-dust { position:absolute; inset:0; width:100%; height:100%; display:block; opacity:.78; pointer-events:none; border-radius:50%; -webkit-mask-image:radial-gradient(circle, #000 0 52%, #000b 63%, transparent 72%); mask-image:radial-gradient(circle, #000 0 52%, #000b 63%, transparent 72%); }
.galaxy-rotator::after { content:none; position:absolute; inset:10%; pointer-events:none; border-radius:50%; background:radial-gradient(circle,transparent 15%,rgba(115,147,190,.055) 42%,rgba(151,181,213,.09) 59%,transparent 72%); }
.solar-window { box-shadow:0 0 3px #ffe1a080,0 0 19px #ffaf395a,0 0 38px #ff8a182a,inset 0 0 12px #ffb32115; }
.comparison-overlay { filter:drop-shadow(0 0 9px rgba(255,178,72,.38)); }
a:focus-visible { outline:2px solid var(--neon-green) !important; outline-offset:5px; }
button:focus-visible { outline:2px solid var(--neon-green) !important; outline-offset:5px; }
summary:focus-visible { outline:2px solid var(--neon-green) !important; outline-offset:5px; }
.compare-handle:focus-visible { outline:2px solid var(--neon-green) !important; outline-offset:5px; }
.dexter-title span { text-wrap:balance; }
.section-head h2 { text-wrap:balance; }
.services-intro h2 { text-wrap:balance; }
.links { font-size:11px !important; font-weight:700; letter-spacing:.11em; }
.links a { color:#eef3e8 !important; text-shadow:0 0 10px #ffffff35; }
.hero-copy h2 { font-size:clamp(28px,2.55vw,38px); font-weight:700; line-height:1.09; text-shadow:0 2px 18px #000b; }
.hero-copy p { color:#f0f1eb; font-weight:500; text-shadow:0 1px 8px #000b; }
.hero-copy { width:min(27%,350px); }
.chapter { font-weight:700; color:var(--neon-green) !important; text-shadow:0 0 10px #19e50f35; }
.scroll-note { font-weight:700; color:var(--neon-green) !important; text-shadow:0 0 10px #19e50f35; }
.hero-work-link > .mono { font-weight:700; color:var(--neon-green) !important; text-shadow:0 0 10px #19e50f35; }
.hero-signature { font-weight:700; color:var(--neon-green) !important; text-shadow:0 0 10px #19e50f35; }
.section-number { font-weight:700; }
.contact-note { font-weight:700; color:var(--neon-green) !important; text-shadow:0 0 10px #19e50f35; }
.scroll-note { font-size:10px !important; padding:9px 12px; background:#0d1b12b8; border:1px solid #19e50f45; border-radius:5px; }
.compare-handle small { font-size:9px !important; font-weight:800; letter-spacing:.14em; }
.compare-labels > span { background:#0c1b13e8; border-color:#19e50f6e; font-size:9px; font-weight:800; color:#f3ffe9; }
.compare-labels i { font-size:8px; color:#d5e7d0; }
.text-link { font-weight:800; font-size:11px; }
.text-link:hover { color:var(--neon-green); }
.hero-action { display:inline-flex; align-items:center; gap:18px; padding:12px 15px; margin-top:12px; border-radius:6px; font-size:11px; letter-spacing:.025em; transition:background .25s,box-shadow .25s; }
.footer .contact-note { font-size:12px; }
@media (max-width:760px) {
  .links { font-size:8px !important; gap:10px !important; }
  .hero-copy { width:auto; }
  .hero-copy h2 { font-size:29px; }
  .hero-action { font-size:10px; padding:10px 12px; }
  .scroll-note { font-size:8px !important; padding:7px; }
  .compare-labels > span { font-size:7px; }
  .compare-labels i { font-size:6px; }
}
.red-blob { filter:blur(1px) !important; opacity:.48 !important; }
.hero h1 b { color:#19e50f !important; text-shadow:0 0 18px #19e50f8c; }
.hero-action { border:1px solid #d5ffa8 !important; font-weight:900 !important; }
.text-link { border-bottom:2px solid #19e50f !important; }
.compare-handle > span { color:#c8ffa3 !important; }
.links a:hover { color:#19e50f !important; }
.project-meta a:hover { color:#19e50f !important; }
.back-top:hover { color:#19e50f !important; }
.section-number { display:inline-block; padding:5px 9px; background:#19e50f19; border:1px solid #19e50f63; border-radius:3px; }
.hero-copy .chapter { color:var(--neon-green) !important; background:#153116ab; border-left:3px solid #19e50f; padding:6px 8px; }
@media (max-width:760px) {
  .hero h1::before { box-shadow:0 0 15px #19e50f90,0 0 38px #87ff4752 !important; }
  .hero-action { box-shadow:0 0 14px #19e50f6d !important; }
}
.solar-window::after { animation:none !important; opacity:.84 !important; }
.galaxy-dust { mix-blend-mode:normal; }
.galaxy-rotator::after { mix-blend-mode:normal; }
html.studio-tab-hidden .wheel-panel { animation-play-state:paused !important; }
@media (prefers-reduced-motion:reduce) {
  .solar-window::after { animation:none !important; }
}
.dexter-title .outline { -webkit-text-stroke:1.4px #8eff86 !important; text-shadow:0 0 3px #daffda,0 0 12px #4aff2f,0 0 28px #14ec22,0 0 50px #16b91e !important; }
.dexter-title b { color:#39ff14 !important; text-shadow:0 0 18px #39ff14aa !important; }
.dexter-rule { background:linear-gradient(90deg,transparent,#0fbf17 16%,#c6ffbd 45%,#39ff14 72%,transparent) !important; box-shadow:0 0 12px #39ff14,0 0 25px #13cc27b3 !important; }
body.studio-final .dexter-title::after { background:linear-gradient(90deg,transparent,#39ff1499,transparent) !important; }
@keyframes dexterType {
 0%,7%{opacity:0;transform:translateY(35px);filter:blur(6px)}
 17%,70%{opacity:1;transform:translateY(0);filter:blur(0)}
 72%{transform:translateX(-7px);text-shadow:10px 0 #39ff14}
 74%{transform:translateX(5px);text-shadow:-7px 0 #39ff14}
 77%,100%{opacity:1;transform:translateX(0);text-shadow:none}
}
.hero h1::before { background:radial-gradient(circle,#dfffce,#39ff14 53%,#137b15) !important; }
.red-blob { background:#39ff14 !important; box-shadow:0 0 42px #39ff1480 !important; }
.hero-action { color:#07200b !important; }
.hero-action span { color:#073909 !important; }
.compare-labels>span { border-color:#39ff1480 !important; background:#07190fda !important; }
.compare-handle { border-color:#d2ffca !important; background:radial-gradient(circle,#163f1b,#07120af2 72%) !important; }
.compare-handle>span { color:#d9ffd3 !important; }
.compare-handle small { color:#d9ffd3 !important; }
.section-head h2 em { color:#06370c !important; -webkit-text-stroke:1.2px var(--neon-green); text-shadow:none; filter:drop-shadow(0 0 1px #19e50f99) drop-shadow(0 0 5px #0e8f1966); }
.services-intro h2 em { color:#06370c !important; -webkit-text-stroke:1.2px var(--neon-green); text-shadow:none; filter:drop-shadow(0 0 1px #19e50f99) drop-shadow(0 0 5px #0e8f1966); }
.footer h2 em { color:#06370c !important; -webkit-text-stroke:1.2px var(--neon-green); text-shadow:none; filter:drop-shadow(0 0 1px #19e50f99) drop-shadow(0 0 5px #0e8f1966); }
.category.is-open .category-trigger { border-color:#39ff1499 !important; }
.category-trigger:hover { border-color:#39ff1499 !important; }
.project-preview:hover { border-color:#39ff1499 !important; }
.orbit-window:hover { border-color:#39ff1499 !important; }
.hero.comparison-ready { --slider-margin:26px; }
.hero.comparison-ready .compare-handle { left:clamp(var(--slider-margin),var(--reveal),calc(100% - var(--slider-margin))) !important; top:50% !important; transform:translate(-50%,-50%) !important; width:52px; height:52px; display:grid !important; place-items:center; }
@media (max-width:760px) {
  .hero.comparison-ready { --slider-margin:23px; }
  .hero.comparison-ready .compare-handle { width:46px; height:46px; }
}
.hero.comparison-ready .comparison-overlay { position:absolute !important; inset:0 !important; overflow:hidden !important; border-radius:inherit !important; pointer-events:none !important; filter:none !important; }
.hero.comparison-ready .comparison-overlay::before { content:"" !important; display:block !important; position:absolute !important; top:0 !important; bottom:0 !important; width:3px !important; height:auto !important; transform:translateX(-50%) !important; border:0 !important; border-radius:0 !important; background:linear-gradient(90deg,#ffa52e 0%,#fffbe9 50%,#ff9a25 100%) !important; box-shadow:0 0 4px 1px #ffe1a5c9,0 0 12px 3px #ffae44a0,0 0 25px 6px #ff882c64 !important; pointer-events:none !important; z-index:13 !important; }
.hero.solar-window { border-top-color:#ffca73 !important; }
.hero.solar-window::after { clip-path:none !important; -webkit-clip-path:none !important; animation:none !important; opacity:1 !important; background:linear-gradient(180deg,#ffcf81 0%,#ffad44 100%) !important; }
.hero.comparison-ready .hero-new { position:absolute; z-index:17 !important; overflow:visible; }
.hero.comparison-ready .hero-new .white-halo.sun-stage { z-index:11 !important; isolation:isolate; }
.hero.comparison-ready .hero-new .character-wrap { z-index:12 !important; }
.hero.comparison-ready .comparison-overlay { z-index:18 !important; }
.hero.comparison-ready .compare-labels { z-index:19 !important; }
.hero.comparison-ready .compare-handle { z-index:20 !important; }
.hero .dexter-title .outline { -webkit-text-stroke:1.25px #adffa6 !important; text-shadow:0 0 2px rgba(210,255,206,.55),
    0 0 7px rgba(57,255,20,.40),
    0 0 16px rgba(20,220,32,.18) !important; }
.hero .dexter-title b { text-shadow:0 0 7px rgba(57,255,20,.40) !important; }
.hero .dexter-title > .outline { color:transparent !important; -webkit-text-fill-color:transparent !important; -webkit-text-stroke:1.45px #23d92a !important; }
.hero .dexter-title > span:not(.outline) { color:#f7fff5 !important; -webkit-text-fill-color:#f7fff5 !important; -webkit-text-stroke:0 !important; text-shadow:0 0 2px rgba(255,255,255,.16) !important; filter:none !important; }
.hero .dexter-title > b { color:#18e524 !important; text-shadow:0 0 5px rgba(24,229,36,.60),0 0 9px rgba(9,159,25,.38) !important; }
.hero h1::before { opacity:.35 !important; box-shadow:0 0 12px rgba(25,229,15,.39),0 0 30px rgba(18,166,35,.19) !important; }
.hero .red-blob { opacity:.23 !important; box-shadow:0 0 24px rgba(25,229,15,.35) !important; }
.logo span { color:var(--neon-green) !important; text-shadow:0 0 6px rgba(22,225,31,.77) !important; }
.links a:last-child span { color:var(--neon-green) !important; text-shadow:0 0 6px rgba(22,225,31,.77) !important; }
.section-number { color:var(--neon-green) !important; text-shadow:0 0 6px rgba(22,225,31,.77) !important; }
.service-orbit { color:var(--neon-green) !important; text-shadow:0 0 6px rgba(22,225,31,.77) !important; }
.category-note { color:var(--neon-green) !important; text-shadow:0 0 6px rgba(22,225,31,.77) !important; }
.hero-signature i { color:var(--neon-green) !important; text-shadow:0 0 6px rgba(22,225,31,.77) !important; }
summary b { color:var(--neon-green) !important; text-shadow:0 0 6px rgba(22,225,31,.77) !important; }
.scroll-note span { color:var(--neon-green) !important; text-shadow:0 0 6px rgba(22,225,31,.77) !important; }
.text-link span { color:var(--neon-green) !important; text-shadow:0 0 6px rgba(22,225,31,.77) !important; }
.eyebrow span { background:#25f128 !important; box-shadow:0 0 14px rgba(25,235,35,.88) !important; }
.service-orbit::after { background:#25f128 !important; box-shadow:0 0 14px rgba(25,235,35,.88) !important; }
.links a:first-child::after { background:#25f128 !important; box-shadow:0 0 14px rgba(25,235,35,.88) !important; }
.hero-action { box-shadow:0 0 17px rgba(36,240,30,.78),0 0 36px rgba(22,213,34,.33) !important; }
.hero-action:hover { box-shadow:0 0 17px rgba(36,240,30,.94),0 0 36px rgba(22,213,34,.41) !important; }
.compare-handle { box-shadow:0 0 3px #f0ffed,0 0 16px rgba(25,238,24,.88),0 0 35px rgba(25,238,24,.42) !important; }
.category.is-open .category-trigger { box-shadow:0 0 8px rgba(36,238,29,.92),0 0 26px rgba(25,230,30,.34) !important; }
.category-trigger:hover { box-shadow:0 0 8px rgba(36,238,29,.92),0 0 26px rgba(25,230,30,.34) !important; }
.project-preview:hover { box-shadow:0 0 8px rgba(36,238,29,.92),0 0 26px rgba(25,230,30,.34) !important; }
.orbit-window:hover { box-shadow:0 0 8px rgba(36,238,29,.92),0 0 26px rgba(25,230,30,.34) !important; }
.space-background .galaxy-position { z-index:1; }
.space-background .galaxy-rotator { isolation:isolate; }
.space-background .galaxy-rotator > .round-galaxy { z-index:0; }
.space-background .static-starfield { z-index:3; pointer-events:none; opacity:.84; }
.project-preview video { display:block !important; visibility:visible !important; opacity:1 !important; background-color:#090d13 !important; }
.space-background .galaxy-position { opacity:1 !important; }
.space-background .galaxy-rotator > .galaxy-dust { position:absolute !important; inset:0 !important; z-index:5 !important; opacity:.20 !important; mix-blend-mode:screen !important; pointer-events:none !important; mask-image:radial-gradient(circle,#000 0 55%,#000e 64%,transparent 73%) !important; -webkit-mask-image:radial-gradient(circle,#000 0 55%,#000e 64%,transparent 73%) !important; }

:root { --studio-body:"Manrope",Arial,sans-serif; --studio-display:"Archivo",Arial,sans-serif; --neon-green:#19e50f; --neon-green-soft:rgba(25,229,15,.2); --accent:#19e50f; --contrast:#19e50f; --blue:#19e50f; --red:#ffae3c; }
.space-background { background:#02040a; overflow:hidden; }
.space-background .galaxy-position { opacity:1; }
.galaxy-rotator { position:relative; width:100%; height:100%; animation:galaxyTurn 300s linear infinite; will-change:transform; }
.space-background .galaxy-rotator > .round-galaxy { position:absolute; left:50%; top:50%; width:112%; height:auto; max-width:none; transform:translate(-50.78125%,-51.74825%); opacity:1; animation:none; will-change:auto; mask-image:none; -webkit-mask-image:none; object-fit:contain; }
.hero.solar-window { border-top-color:#ffca73; }
.hero.solar-window::after { clip-path:none; -webkit-clip-path:none; animation:none; opacity:1; background:linear-gradient(180deg,#ffcf81 0%,#ffad44 100%); }
.hero h1::before { content:none; }
.hero .red-blob { background:#19e50f; filter:none; box-shadow:0 0 12px rgba(25,229,15,.35); opacity:.23; }
.hero-action { color:#06200a; }
html.studio-tab-hidden .galaxy-rotator { animation-play-state:paused !important; }
html.studio-tab-hidden .concept-orbit { animation-play-state:paused !important; }
html.studio-tab-hidden .orbit-window { animation-play-state:paused !important; }
html.studio-tab-hidden .hero-new * { animation-play-state:paused !important; }
.category.orbit-offscreen .concept-orbit { animation-play-state:paused; }
.category.orbit-offscreen .orbit-window { animation-play-state:paused; }
.hero.reveal-paused .solar-aura { animation-play-state:paused; }
@media (max-width:760px) {
  .galaxy-rotator { animation-duration:360s; }
}
@media (prefers-reduced-motion:reduce) {
  .galaxy-rotator { animation:none !important; }
}
.hero-action { background:linear-gradient(130deg,#23d92a,#19e50f) !important; border-color:#39ff14 !important; }
.hero-action:hover { background:#39ff14 !important; }
.hero.comparison-ready .comparison-overlay::before { left:var(--reveal) !important; }
.hero .dexter-title > .outline { text-shadow:none !important; filter:drop-shadow(0 0 1px #39ff14c4) drop-shadow(0 0 4px #0e8f197a) !important; }
@media (max-width:760px) {
  .hero.comparison-ready .hero-new { overflow:hidden; }
  .hero-title-group { z-index:13; }
}
@media (max-width:380px) {
  .nav { height:96px; flex-wrap:wrap; align-content:center; gap:3px; padding-top:12px; padding-bottom:12px; }
  .links { flex-basis:100%; margin-left:0; justify-content:space-between; gap:8px !important; font-size:8px !important; }
  .hero { height:980px; }
}
/* Recorded Eclipsio corona added around the unchanged original sun.
   The source ring radius is 176/512: 145.455% aligns it to the sun's radius.
   Only this additional media layer is larger; the existing sun keeps its size. */
.solar-corona-layer {
  position:absolute; left:-22.7275%; top:-22.7275%; width:145.455%; height:145.455%;
  z-index:2; pointer-events:none; mix-blend-mode:screen;
  mask-image:radial-gradient(circle closest-side,transparent 0 62%,#000 68%,#000 92%,transparent 100%);
  -webkit-mask-image:radial-gradient(circle closest-side,transparent 0 62%,#000 68%,#000 92%,transparent 100%);
}
.solar-corona-plate,.solar-corona-video {
  position:absolute; inset:0; width:100%; height:100%; display:block; object-fit:contain;
}
.solar-corona-video { opacity:0; transition:opacity .6s ease; }
.solar-corona-video.is-ready { opacity:1; }
@media(prefers-reduced-motion:reduce) { .solar-corona-video { display:none; } }

/* Compact rounded control center, clear of both text columns. */
.character-wrap.control-center-wrap { width:min(28vw,400px); height:min(28vw,400px); bottom:165px; }
.hero-character.control-center-image { filter:drop-shadow(0 12px 22px #0009); }
@media (min-width:1550px) {
  .character-wrap.control-center-wrap { width:420px; height:420px; bottom:160px; left:54%; }
}
@media (max-width:1100px) {
  .character-wrap.control-center-wrap { width:27vw; height:27vw; max-width:300px; max-height:300px; top:170px; bottom:auto; left:53%; }
}
@media (max-width:760px) {
  .character-wrap.control-center-wrap { width:min(220px,70%); height:auto; aspect-ratio:1; top:43px; bottom:auto; left:64%; }
}

/* A real floor plate grounds the console from the middle of the desktop hero. */
.control-floor { position:absolute; inset:32% 0 0; z-index:2; overflow:hidden; border-radius:0 0 26px 26px; pointer-events:none; }
.control-floor img { display:block; width:100%; height:100%; object-fit:cover; object-position:center top; }
.control-center-wrap::before { content:""; position:absolute; z-index:-1; left:2%; right:2%; bottom:10%; height:13%; border-radius:50%; background:radial-gradient(ellipse,#000d 0 25%,#0007 50%,transparent 72%); }
@media (max-width:760px) {
  .control-floor { top:0; border-radius:0 0 19px 19px; }
  .control-floor img { position:absolute; left:50%; transform:translateX(-50%); width:max(100%,700px); object-fit:fill; }
}