:root {
  --bg: #060806;
  --surface: #0b0f0b;
  --surface-2: #101610;
  --line: rgba(230, 255, 230, 0.13);
  --text: #f2f7f1;
  --muted: #9ba69b;
  --green: #88ff38;
  --green-2: #42d80a;
  --orange: #ff7a1a;
  --display: "Space Grotesk", sans-serif;
  --body: "DM Sans", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body { margin: 0; color: var(--text); background: var(--bg); font-family: var(--body); overflow-x: hidden; }
body::before { content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 50; opacity: .22; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.15'/%3E%3C/svg%3E"); }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
::selection { background: var(--green); color: #071006; }

#particle-field { position: fixed; inset: 0; z-index: 0; opacity: .38; pointer-events: none; }
.cursor-glow { position: fixed; z-index: 0; width: 500px; height: 500px; border-radius: 50%; pointer-events: none; transform: translate(-50%, -50%); background: radial-gradient(circle, rgba(82, 255, 28, .09), transparent 66%); }
.site-header, main, footer { position: relative; z-index: 2; }
.section-shell { width: min(1380px, calc(100% - 72px)); margin-inline: auto; }

.site-header { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: min(1500px, calc(100% - 48px)); height: 100px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); z-index: 20; }
.brand { display: inline-flex; gap: 11px; align-items: center; font-family: var(--display); font-weight: 700; letter-spacing: -.04em; font-size: 17px; }
.brand > span:last-child > span { color: var(--green); font-size: 10px; letter-spacing: .14em; margin-left: 4px; }
.brand-mark { width: 31px; height: 31px; display: grid; grid-template-columns: repeat(3, 1fr); align-items: end; gap: 3px; transform: skewY(-13deg); }
.brand-mark i { display: block; background: var(--green); box-shadow: 0 0 13px rgba(136,255,56,.35); }
.brand-mark i:nth-child(1) { height: 48%; }.brand-mark i:nth-child(2) { height: 100%; }.brand-mark i:nth-child(3) { height: 72%; }
.desktop-nav { display: flex; gap: 40px; font-size: 13px; color: #c3ccc2; }
.desktop-nav a { position: relative; }
.desktop-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -9px; height: 1px; background: var(--green); transition: right .25s; }
.desktop-nav a:hover::after { right: 0; }
.header-actions { display: flex; gap: 24px; align-items: center; }
.language-switch { border: 0; background: transparent; color: #667066; display: flex; gap: 8px; cursor: pointer; font-size: 11px; }
.language-switch span.active { color: var(--green); }
.contact-link { border: 1px solid var(--line); padding: 11px 16px; font-size: 12px; transition: .25s; }
.contact-link:hover { border-color: var(--green); color: var(--green); }

.hero { min-height: 890px; display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; padding-top: 132px; }
.eyebrow { display: flex; align-items: center; gap: 11px; color: var(--green); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; font-weight: 700; }
.eyebrow > span:first-child { width: 26px; height: 1px; background: var(--green); box-shadow: 0 0 8px var(--green); }
.hero h1, .section-heading h2, .manifesto h2, .contact h2 { font: 600 clamp(58px, 6.25vw, 104px)/.93 var(--display); letter-spacing: -.07em; margin: 28px 0; }
.hero h1 em, .manifesto h2 em, .contact h2 em { color: var(--green); font-style: normal; text-shadow: 0 0 38px rgba(136,255,56,.14); }
.hero-intro { max-width: 590px; color: #b5bdb5; font-size: clamp(17px, 1.4vw, 21px); line-height: 1.6; }
.hero-actions { display: flex; align-items: center; gap: 32px; margin-top: 38px; }
.button { display: inline-flex; align-items: center; justify-content: space-between; min-width: 235px; padding: 18px 19px; font-size: 13px; font-weight: 700; }
.button-primary { background: var(--green); color: #081006; box-shadow: 0 0 40px rgba(136,255,56,.12); }
.button-primary b { font-size: 17px; }
.text-link { display: inline-flex; align-items: center; gap: 12px; color: #bcc5bb; font-size: 13px; }
.text-link i { color: var(--green); font-style: normal; }
.hero-proof { display: flex; gap: clamp(28px, 4vw, 64px); padding-top: 66px; margin-top: 64px; border-top: 1px solid var(--line); }
.hero-proof div { display: flex; gap: 12px; align-items: start; }
.hero-proof strong { font: 600 27px/1 var(--display); color: var(--text); }
.hero-proof span { font-size: 10px; line-height: 1.35; color: #727d72; text-transform: uppercase; letter-spacing: .09em; }

.hero-visual { min-height: 620px; position: relative; display: grid; place-items: center; perspective: 1200px; }
.hero-visual::before { content: ""; position: absolute; width: 76%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(100,255,45,.12), rgba(6,8,6,0) 65%); filter: blur(8px); }
.hero-visual::after { content: ""; position: absolute; width: 80%; height: 80%; border: 1px solid rgba(136,255,56,.08); border-radius: 50%; transform: rotateX(68deg); }
.orbital-stage { width: 390px; height: 390px; transform-style: preserve-3d; position: relative; display: grid; place-items: center; transition: transform .12s ease-out; animation: stage-float 5s ease-in-out infinite; }
.core { width: 154px; height: 154px; position: relative; transform-style: preserve-3d; animation: core-spin 16s linear infinite; }
.core-face { position: absolute; width: 154px; height: 154px; background: rgba(11,18,11,.82); border: 1px solid rgba(136,255,56,.5); box-shadow: inset 0 0 45px rgba(136,255,56,.09), 0 0 25px rgba(136,255,56,.06); display: grid; place-items: center; color: var(--green); font: 700 52px var(--display); letter-spacing: -.09em; backdrop-filter: blur(8px); }
.face-front { transform: translateZ(77px); }.face-back { transform: rotateY(180deg) translateZ(77px); }.face-right { transform: rotateY(90deg) translateZ(77px); }.face-left { transform: rotateY(-90deg) translateZ(77px); }.face-top { transform: rotateX(90deg) translateZ(77px); }.face-bottom { transform: rotateX(-90deg) translateZ(77px); }
.orbit { position: absolute; inset: 24px; border: 1px solid rgba(136,255,56,.26); border-radius: 50%; transform-style: preserve-3d; }
.orbit-a { transform: rotateX(69deg) rotateZ(20deg); animation: orbit-turn 13s linear infinite; }
.orbit-b { transform: rotateY(70deg) rotateZ(-22deg); animation: orbit-turn 17s linear reverse infinite; }
.orbit-c { inset: 0; border-color: rgba(255,122,26,.15); transform: rotateX(35deg) rotateY(52deg); animation: orbit-turn 24s linear infinite; }
.satellite { width: 11px; height: 11px; position: absolute; border-radius: 50%; background: var(--green); box-shadow: 0 0 18px var(--green); }
.satellite-a { top: 54px; right: 66px; animation: satellite 5s ease-in-out infinite; }.satellite-b { bottom: 70px; left: 43px; background: var(--orange); box-shadow: 0 0 16px var(--orange); animation: satellite 7s ease-in-out reverse infinite; }.satellite-c { right: 8px; top: 52%; width: 6px; height: 6px; animation: satellite 4s ease-in-out infinite; }
.visual-label { position: absolute; z-index: 3; display: flex; gap: 12px; align-items: center; font-size: 9px; text-transform: uppercase; letter-spacing: .13em; color: #8b968a; }
.visual-label b { color: var(--green); font-weight: 500; }.label-top { top: 14%; left: 11%; }.label-right { right: 0; top: 38%; }.label-bottom { bottom: 15%; left: 18%; }

.signal-strip { overflow: hidden; border-block: 1px solid var(--line); background: rgba(12,17,12,.7); transform: rotate(-1deg) scale(1.02); }
.marquee { display: flex; width: max-content; align-items: center; padding: 19px 0; animation: marquee 28s linear infinite; font: 600 12px var(--display); letter-spacing: .18em; color: #a5aea4; will-change: transform; }
.marquee-group { display: flex; flex: 0 0 auto; min-width: 100vw; align-items: center; justify-content: space-around; gap: 31px; padding-right: 31px; }
.marquee-group > * { flex: 0 0 auto; }
.marquee i { color: var(--green); font-style: normal; }

.services { padding-block: 170px; }
.section-heading { display: grid; grid-template-columns: 1fr .9fr; column-gap: 80px; align-items: end; margin-bottom: 70px; }
.section-heading .eyebrow { grid-column: 1/-1; }
.section-heading h2 { font-size: clamp(46px, 5vw, 78px); margin-bottom: 0; }
.section-heading > p:last-child { color: var(--muted); max-width: 480px; line-height: 1.7; font-size: 16px; padding-bottom: 4px; }
.service-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.service-card { position: relative; min-height: 430px; padding: 30px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: rgba(7,10,7,.74); overflow: hidden; transform-style: preserve-3d; transition: border-color .3s, background .3s; }
.service-card::before { content: ""; position: absolute; inset: auto -20% -50% -20%; height: 70%; background: radial-gradient(circle, rgba(136,255,56,.1), transparent 65%); opacity: 0; transition: opacity .3s; }
.service-card:hover { border-color: rgba(136,255,56,.5); background: #0a100a; }.service-card:hover::before { opacity: 1; }
.service-index { color: #4d584d; font-size: 10px; letter-spacing: .14em; }
.service-icon { height: 130px; position: relative; margin-top: 28px; transform: translateZ(28px); }
.service-card h3 { font: 600 25px var(--display); letter-spacing: -.04em; margin: 15px 0 12px; }
.service-card p { color: #939e93; line-height: 1.55; font-size: 14px; min-height: 66px; }
.service-card ul { padding: 0; margin: 24px 0 0; display: flex; flex-wrap: wrap; gap: 7px; list-style: none; }
.service-card li { border: 1px solid var(--line); padding: 6px 8px; color: #7e897e; font-size: 9px; text-transform: uppercase; letter-spacing: .07em; }
.icon-web span { position: absolute; border: 1px solid rgba(136,255,56,.5); width: 80px; height: 54px; left: calc(50% - 40px); top: 31px; background: rgba(136,255,56,.025); transform: skewY(-8deg); box-shadow: 10px 10px 0 rgba(136,255,56,.04); }.icon-web span:nth-child(2) { transform: translate(-18px, -15px) skewY(-8deg); opacity: .55; }.icon-web span:nth-child(3) { transform: translate(18px, 15px) skewY(-8deg); opacity: .25; }
.icon-software span { position: absolute; width: 72px; height: 72px; border: 1px solid rgba(136,255,56,.45); left: calc(50% - 36px); top: 20px; transform: rotate(30deg) skew(-6deg); }.icon-software span:nth-child(2) { transform: translateY(17px) rotate(30deg) skew(-6deg); opacity:.55; }.icon-software span:nth-child(3) { width: 12px; height: 12px; background: var(--green); border:0; box-shadow:0 0 18px var(--green); left:calc(50% - 6px); top:50px; }
.icon-mobile span:first-child { position:absolute; width:55px; height:98px; border:1px solid rgba(136,255,56,.55); border-radius:10px; left:calc(50% - 27px); top:5px; transform:rotate(12deg); }.icon-mobile span:last-child { position:absolute; width:32px; height:2px; background:var(--green); left:calc(50% - 12px); top:55px; transform:rotate(12deg); box-shadow:0 0 12px var(--green); }
.icon-bot span { position:absolute; width:17px; height:17px; border:1px solid var(--green); border-radius:50%; box-shadow:0 0 10px rgba(136,255,56,.2); }.icon-bot span:nth-child(1){left:25%;top:24px}.icon-bot span:nth-child(2){right:25%;top:24px}.icon-bot span:nth-child(3){left:38%;bottom:22px}.icon-bot span:nth-child(4){right:30%;bottom:29px}.icon-bot::before,.icon-bot::after{content:"";position:absolute;width:48%;height:1px;background:rgba(136,255,56,.35);left:27%;top:48px;transform:rotate(25deg)}.icon-bot::after{transform:rotate(-38deg);top:65px}

.manifesto { border-block: 1px solid var(--line); background: linear-gradient(135deg, rgba(15,23,14,.8), rgba(6,8,6,.95)); }
.manifesto-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 110px; padding-block: 150px; }
.manifesto-sticky { align-self: start; position: sticky; top: 80px; }
.manifesto h2 { font-size: clamp(50px, 5.3vw, 82px); }
.step { display: grid; grid-template-columns: 70px 1fr; padding: 35px 0 42px; border-top: 1px solid var(--line); }
.step > span { color: var(--green); font-size: 10px; letter-spacing: .12em; }
.step h3 { margin: 0 0 13px; font: 600 28px var(--display); letter-spacing: -.04em; }
.step p { color: #929c91; line-height: 1.7; margin: 0; max-width: 550px; }

.work { padding-block: 170px; }
.work-grid { display: grid; grid-template-columns: 1.45fr 1fr; gap: 18px; }
.project { border: 1px solid var(--line); background: #090c09; overflow: hidden; transition: border-color .3s, transform .3s; }
.project:hover { border-color: rgba(136,255,56,.5); transform: translateY(-3px); }
.project-main { grid-row: span 2; }
.project-art { min-height: 310px; display: grid; place-items: center; position: relative; overflow: hidden; border-bottom: 1px solid var(--line); }
.project-main .project-art { min-height: 640px; }
.project-meta { padding: 22px; display: flex; justify-content: space-between; align-items: end; }
.project-meta p { margin: 0 0 8px; color: var(--green); font-size: 9px; text-transform: uppercase; letter-spacing: .13em; }
.project-meta h3 { margin: 0; font: 600 19px var(--display); letter-spacing: -.035em; }.project-meta > b { color: var(--green); }
.art-digital { background: radial-gradient(circle at 55% 45%, rgba(136,255,56,.11), transparent 42%), linear-gradient(145deg,#0c120c,#060806); perspective:900px; }
.window { width: 68%; aspect-ratio: 1.35; border: 1px solid rgba(136,255,56,.46); background: rgba(9,15,9,.8); transform: rotateY(-15deg) rotateX(9deg) rotateZ(-3deg); box-shadow: 35px 35px 80px rgba(0,0,0,.5), inset 0 0 60px rgba(136,255,56,.03); padding:20px; }
.window i { display:inline-block;width:7px;height:7px;border-radius:50%;background:#334033;margin-right:4px}.window i:first-child{background:var(--orange)}
.window b { display:block;font:700 clamp(23px,4vw,58px) var(--display);color:var(--green);margin-top:19%;letter-spacing:-.08em}.window span{display:block;width:57%;height:5px;background:linear-gradient(90deg,var(--green),transparent);margin-top:20px}
.art-shop { background: radial-gradient(circle, rgba(255,122,26,.12), transparent 56%), #0b0d0a; perspective:700px; }
.print-object { width:130px;height:130px;position:relative;transform-style:preserve-3d;transform:rotateX(-20deg) rotateY(35deg);animation:core-spin 18s linear infinite}.print-object i{position:absolute;inset:0;border:1px solid rgba(255,122,26,.5);background:rgba(255,122,26,.035)}.print-object i:nth-child(1){transform:translateZ(45px)}.print-object i:nth-child(2){transform:rotateY(90deg) translateZ(45px)}.print-object i:nth-child(3){transform:rotateX(90deg) translateZ(45px)}
.project-muted { opacity:.56; }.art-future { background:repeating-linear-gradient(-45deg,transparent 0 18px,rgba(255,255,255,.018) 18px 19px); }.art-future span{font:600 42px/.85 var(--display);letter-spacing:-.07em;color:#273027}

.contact { min-height: 820px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; position: relative; }
.contact .eyebrow { justify-content:center }.contact h2 { font-size:clamp(70px,9vw,140px);margin:26px 0}.contact > p:not(.eyebrow){max-width:600px;color:var(--muted);font-size:17px;line-height:1.65}
.contact-email { margin-top:35px;padding:17px 0;border:0;border-bottom:1px solid var(--green);background:transparent;cursor:pointer;font:600 clamp(18px,2vw,25px) var(--display);color:var(--green);display:flex;gap:34px;align-items:center }.contact-email span{font-size:16px}
.social-row { display:flex;gap:30px;margin-top:52px;color:#758075;font-size:11px;text-transform:uppercase;letter-spacing:.1em}.social-row a:hover{color:var(--green)}
.contact-orbit { position:absolute;width:620px;height:620px;border:1px solid rgba(136,255,56,.08);border-radius:50%;animation:orbit-turn 25s linear infinite}.contact-orbit::before,.contact-orbit::after{content:"";position:absolute;border:1px solid rgba(136,255,56,.06);border-radius:50%;inset:65px}.contact-orbit::after{inset:145px}.contact-orbit i{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 16px var(--green)}.contact-orbit i:nth-child(1){top:16%;left:13%}.contact-orbit i:nth-child(2){right:3%;top:48%;background:var(--orange);box-shadow:0 0 16px var(--orange)}.contact-orbit i:nth-child(3){bottom:7%;left:35%}

footer { width:min(1500px,calc(100% - 48px));margin:auto;padding:34px 0;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);color:#667066;font-size:10px;text-transform:uppercase;letter-spacing:.08em}footer>div{display:flex;gap:20px}footer .brand{color:var(--text);text-transform:none;letter-spacing:normal}

.reveal { opacity: 0; transform: translateY(25px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.65,.25,1); }
.reveal.visible { opacity: 1; transform: translateY(0); }
@keyframes core-spin { to { transform: rotateX(360deg) rotateY(360deg); } }
@keyframes orbit-turn { to { rotate: 360deg; } }
@keyframes stage-float { 0%,100% { translate: 0 -7px; } 50% { translate: 0 8px; } }
@keyframes satellite { 0%,100% { translate: 0 -8px; opacity:.55 } 50% { translate: 8px 10px; opacity:1 } }
@keyframes marquee { to { transform: translateX(-50%); } }

@media (max-width: 1050px) {
  .hero { grid-template-columns: 1fr; padding-top:170px; padding-bottom:80px; }.hero-copy{max-width:780px}.hero-visual{min-height:560px}.service-grid{grid-template-columns:repeat(2,1fr)}.manifesto-grid{gap:60px}.project-main .project-art{min-height:520px}
}
@media (max-width: 760px) {
  .section-shell { width: min(100% - 34px, 680px); }.site-header{width:calc(100% - 30px);height:78px}.desktop-nav{display:none}.contact-link{display:none}.brand>span:last-child>span{display:none}.hero{padding-top:130px}.hero h1{font-size:clamp(51px,15vw,76px)}.hero-intro{font-size:16px}.hero-actions{align-items:flex-start;flex-direction:column}.hero-proof{gap:22px;justify-content:space-between}.hero-proof div{display:block}.hero-proof span{display:block;margin-top:7px}.hero-visual{min-height:470px;transform:scale(.85);margin-inline:-30px}.orbital-stage{width:340px;height:340px}.visual-label{display:none}.services,.work{padding-block:110px}.section-heading{display:block}.section-heading h2{font-size:45px}.section-heading>p:last-child{margin-top:25px}.service-grid{grid-template-columns:1fr}.service-card{min-height:380px}.manifesto-grid{grid-template-columns:1fr;padding-block:100px}.manifesto-sticky{position:static}.work-grid{grid-template-columns:1fr}.project-main{grid-row:auto}.project-main .project-art{min-height:400px}.project-art{min-height:280px}.contact{min-height:700px}.contact-orbit{width:420px;height:420px}.contact h2{font-size:70px}.social-row{gap:17px;flex-wrap:wrap;justify-content:center}footer{width:calc(100% - 34px);flex-direction:column;gap:22px;text-align:center}.cursor-glow{display:none}
}
@media (prefers-reduced-motion: reduce) { *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none} }

/* Contact composer */
dialog.email-dialog {
  position: fixed;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  width: min(580px, calc(100vw - 32px));
  max-width: none;
  margin: 0;
  padding: 42px;
  overflow: hidden;
  color: var(--text);
  background:
    radial-gradient(circle at 85% 10%, rgba(136, 255, 56, .12), transparent 34%),
    linear-gradient(145deg, #101610 0%, #070a07 72%);
  border: 1px solid rgba(136, 255, 56, .35);
  border-radius: 2px;
  box-shadow: 0 34px 110px rgba(0, 0, 0, .82), inset 0 1px 0 rgba(255, 255, 255, .04);
}
dialog.email-dialog::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(136,255,56,.06) 1px, transparent 1px),
    linear-gradient(rgba(136,255,56,.06) 1px, transparent 1px);
  background-size: 38px 38px;
  mask-image: linear-gradient(to bottom right, black, transparent 62%);
}
dialog.email-dialog::backdrop {
  background: rgba(1, 4, 1, .82);
  backdrop-filter: blur(12px) saturate(.7);
}
dialog.email-dialog[open] { animation: dialog-in .28s cubic-bezier(.2,.75,.25,1); }
.email-dialog .eyebrow,
.email-dialog h2,
.email-dialog > p,
.email-dialog .email-options { position: relative; z-index: 1; }
.email-dialog h2 {
  max-width: 430px;
  margin: 24px 0 14px;
  color: var(--text);
  font: 600 clamp(32px, 5vw, 46px)/.98 var(--display);
  letter-spacing: -.06em;
}
.email-dialog > p:not(.eyebrow):not(.copy-feedback) {
  max-width: 450px;
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.65;
}
.dialog-close {
  position: absolute;
  z-index: 3;
  top: 17px;
  right: 18px;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: #a5afa4;
  background: rgba(8, 12, 8, .7);
  font: 400 23px/1 var(--body);
  cursor: pointer;
  transition: .2s ease;
}
.dialog-close:hover { color: #071006; border-color: var(--green); background: var(--green); transform: rotate(5deg); }
.email-options {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 30px;
}
.email-options a,
.email-options button {
  min-height: 66px;
  padding: 0 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 0;
  color: var(--text);
  background: rgba(15, 22, 15, .9);
  font: 600 13px var(--body);
  text-align: left;
  cursor: pointer;
  transition: transform .2s ease, color .2s ease, border-color .2s ease, background .2s ease;
}
.email-options a:hover,
.email-options button:hover {
  transform: translateY(-2px);
  color: var(--green);
  border-color: rgba(136,255,56,.72);
  background: rgba(136,255,56,.07);
}
.email-options a span,
.email-options button b { color: var(--green); font-weight: 500; }
.copy-feedback {
  position: relative;
  z-index: 1;
  min-height: 18px;
  margin: 16px 0 0;
  color: var(--green);
  font-size: 12px;
}
@keyframes dialog-in {
  from { opacity: 0; transform: translate(-50%, calc(-50% + 18px)) scale(.975); }
  to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}
@media (max-width: 580px) {
  dialog.email-dialog { padding: 34px 20px 22px; }
  .email-dialog h2 { padding-right: 35px; font-size: 34px; }
  .email-options { grid-template-columns: 1fr; }
  .email-options a, .email-options button { min-height: 58px; }
}
/* Responsive 3D core */
.orbital-stage {
  --stage-size: clamp(350px, 33vw, 430px);
  --core-size: clamp(148px, 13.5vw, 176px);
  width: min(var(--stage-size), 92vw);
  height: min(var(--stage-size), 92vw);
}

.core {
  width: var(--core-size);
  height: var(--core-size);
}

.core-face {
  inset: 0;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  padding-inline: clamp(12px, 1.4vw, 19px);
  overflow: hidden;
  white-space: nowrap;
  text-align: center;
  line-height: 1;
  letter-spacing: .02em;
  text-shadow: 0 0 18px rgba(136, 255, 56, .22);
}

.face-front  { transform: translateZ(calc(var(--core-size) * .5)); }
.face-back   { transform: rotateY(180deg) translateZ(calc(var(--core-size) * .5)); }
.face-right  { transform: rotateY(90deg) translateZ(calc(var(--core-size) * .5)); }
.face-left   { transform: rotateY(-90deg) translateZ(calc(var(--core-size) * .5)); }
.face-top    { transform: rotateX(90deg) translateZ(calc(var(--core-size) * .5)); }
.face-bottom { transform: rotateX(-90deg) translateZ(calc(var(--core-size) * .5)); }

@media (max-width: 1050px) {
  .orbital-stage {
    --stage-size: clamp(360px, 55vw, 430px);
    --core-size: clamp(152px, 21vw, 176px);
  }
}

@media (max-width: 760px) {
  .hero-visual {
    min-height: clamp(390px, 110vw, 470px);
    margin-inline: 0;
    transform: none;
  }

  .orbital-stage {
    --stage-size: min(88vw, 350px);
    --core-size: clamp(124px, 38vw, 148px);
    width: var(--stage-size);
    height: var(--stage-size);
  }

  .core-face {
    padding-inline: 11px;
  }
}