@layer reset, base, layout, components, motion, responsive;

@layer reset {
  *,*::before,*::after { box-sizing:border-box; }
  body,h1,h2,h3,p,figure { margin:0; }
  button,input,textarea,select { font:inherit; }
  button { color:inherit; cursor:pointer; }
  img,svg,canvas { display:block; max-width:100%; }
  a { color:inherit; text-decoration:none; }
  button,a,input,textarea { -webkit-tap-highlight-color:transparent; }
  [hidden] { display:none !important; }
  template { display:none !important; }
}
@layer base {
  :root {
    --navy:#091d34;
    --navy-deep:#08192e;
    --navy-raised:#0e2844;
    --white:#f1f6fc;
    --blue:#a7ddff;
    --yellow:#f5d6a0;
    --muted:#b5c6d8;
    --line:rgb(176 216 250 / .19);
    --font:'Inter','Avenir Next',Avenir,'Segoe UI',Helvetica,Arial,sans-serif;
    --gutter:clamp(24px,5.3vw,100px);
    --ease:cubic-bezier(.22,1,.36,1);
    color-scheme:dark;
  }
  html { background:var(--navy); scroll-behavior:smooth; scroll-padding-top:108px; }
  body { background:var(--navy); color:var(--white); font:400 16px/1.7 var(--font); -webkit-font-smoothing:antialiased; }
  body.modal-open { overflow:hidden; }
  ::selection { color:var(--navy-deep); background:var(--yellow); }
  :focus-visible { outline:2px solid var(--blue); outline-offset:6px; }
  button:disabled { cursor:wait; }
  h1,h2,h3 { font-weight:300; }
  h2 { font-size:clamp(44px,5.2vw,82px); line-height:1.1; letter-spacing:-.052em; text-wrap:balance; }
  p { text-wrap:pretty; }
  .frame { width:min(1680px,calc(100% - var(--gutter)*2)); margin-inline:auto; }
  .text-blue { color:var(--blue); }
  .eyebrow { font-size:10px; font-weight:500; letter-spacing:.26em; line-height:1.8; text-transform:uppercase; }
  .small-note { color:var(--muted); font-size:12px; letter-spacing:.015em; }
  .skip-link { position:fixed; left:20px; top:15px; padding:12px 20px; z-index:200; color:var(--navy); background:var(--white); border-radius:4px; transform:translateY(-150%); }
  .skip-link:focus { transform:translateY(0); }
  .reading-progress { position:fixed; top:0; left:0; width:100%; height:2px; z-index:60; background:linear-gradient(90deg,var(--blue),var(--yellow)); transform-origin:0 50%; transform:scaleX(0); opacity:.7; pointer-events:none; }
}
@layer layout {
  .site-header { position:absolute; top:0; left:0; right:0; z-index:30; }
  .header-inner { height:112px; display:flex; align-items:center; justify-content:space-between; gap:30px; }
  .brand { width:clamp(240px,22.6vw,356px); display:block; margin-left:-10px; }
  .brand img { width:100%; height:auto; }
  .site-header nav { display:flex; align-items:center; gap:clamp(30px,4.1vw,70px); }
  .nav-link { position:relative; display:flex; align-items:center; gap:12px; font-size:10px; font-weight:500; letter-spacing:.32em; text-transform:uppercase; line-height:1; min-height:44px; white-space:nowrap; transition:color .25s; }
  .nav-link:hover { color:var(--blue); }
  .nav-link:not(.coming-link)::after { content:''; position:absolute; bottom:5px; left:0; width:calc(100% - .32em); height:1px; background:var(--blue); transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease); }
  .nav-link:hover::after { transform:scaleX(1); }
  .coming-link { border-left:1px solid rgb(194 222 248 / .5); padding-left:clamp(30px,3.4vw,58px); }
  .coming-link .status-dot { display:none; }
  .status-dot { display:inline-block; width:5px; height:5px; flex-shrink:0; background:var(--yellow); border-radius:50%; box-shadow:0 0 10px rgb(245 214 160 / .25); }
  .hero { min-height:clamp(780px,100svh,1080px); position:relative; isolation:isolate; overflow:clip; background:radial-gradient(ellipse at 76% 40%,#0e3151 0%,#0a223d 33%,#091d34 69%); }
  .hero-atmosphere { position:absolute; inset:0; z-index:-2; background:radial-gradient(ellipse 50% 20% at 67% 69%,rgb(118 191 250 / .12),transparent 75%),linear-gradient(163deg,transparent 50%,rgb(67 133 188 / .10) 70%,transparent 83%); }
  .hero-scene { position:absolute; top:50%; left:50%; width:100%; max-width:1920px; aspect-ratio:1672/941; transform:translate(-50%,-50%); pointer-events:none; z-index:-1; mix-blend-mode:screen; }
  .scene-drift { position:absolute; inset:0; will-change:transform; }
  .scene-art { width:100%; height:auto; }
  .orb-approved-art { mix-blend-mode:screen; }
  .hero-inner { position:relative; min-height:inherit; display:flex; align-items:center; }
  .hero-copy { position:relative; width:59%; padding-block:120px 140px; }
  .hero-eyebrow { font-size:clamp(10px,.79vw,12px); letter-spacing:.31em; margin-bottom:25px; }
  h1 { font-size:clamp(49px,4.12vw,78px); line-height:1.2; letter-spacing:-.052em; margin-bottom:29px; }
  h1 span { display:block; white-space:nowrap; }
  .hero-description { max-width:510px; width:76%; font-size:clamp(14px,1.13vw,18px); font-weight:400; line-height:1.7; letter-spacing:.015em; color:#c0cede; margin-bottom:43px; }
  .hero-signature { font-size:9px; letter-spacing:.4em; text-transform:uppercase; color:#afc4d9; margin:23px 0 0 2px; display:flex; gap:19px; }
  .orb-caption { position:absolute; right:-9px; top:31%; font-size:10px; letter-spacing:.29em; text-transform:uppercase; line-height:2.25; color:#d1dfed; }
  .orb-caption span { display:block; width:34px; height:1px; background:#c3d9eb; margin-top:16px; }
  .hero-footer { position:absolute; bottom:55px; left:0; right:0; display:flex; align-items:center; justify-content:space-between; z-index:4; }
  .micro-statement { font-size:9px; line-height:1.95; letter-spacing:.28em; text-transform:uppercase; border-left:1px solid #a4bed7; padding-left:17px; }
  .camera-statement { min-width:154px; }
  .scroll-cue { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:flex; align-items:center; gap:16px; padding:12px; color:#bed1e5; font-size:9px; text-transform:uppercase; letter-spacing:.24em; }
  .scroll-cue svg { width:10px; height:23px; stroke:currentColor; stroke-width:1; fill:none; transition:transform .3s; }
  .scroll-cue:hover svg { transform:translateY(4px); }
  .hero-bottom-fade { position:absolute; bottom:0; left:0; right:0; height:50px; background:linear-gradient(transparent,var(--navy)); z-index:-1; pointer-events:none; }
  .section { padding-top:80px; padding-bottom:126px; }
  .section-top { display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--line); padding-top:28px; }
  .section-index { color:#d3e2f1; display:flex; align-items:center; gap:30px; }
  .section-index>span { color:var(--blue); letter-spacing:0; }
  .about-intro { display:grid; grid-template-columns:1.1fr 1fr; gap:100px; align-items:center; margin:84px 0 74px; }
  .about-intro h2 { font-size:clamp(54px,5.65vw,86px); }
  .intro-body { max-width:474px; padding-top:6px; }
  .intro-body p { color:var(--muted); font-size:15px; line-height:1.9; margin-top:20px; }
  .intro-body .lead { margin:0 0 27px; font-size:clamp(22px,2.05vw,32px); letter-spacing:-.03em; color:var(--white); line-height:1.5; font-weight:300; }
  .alignment-study { display:grid; grid-template-columns:.85fr 1.15fr; align-items:center; min-height:388px; overflow:clip; position:relative; border-block:1px solid var(--line); background:radial-gradient(ellipse at 72% 50%,rgb(30 76 119 / .22),transparent 68%); }
  .study-copy { padding:49px 0; position:relative; z-index:1; }
  .study-copy .eyebrow { font-size:9px; letter-spacing:.18em; color:var(--blue); margin-bottom:22px; }
  .study-heading { font-size:clamp(28px,2.7vw,43px); line-height:1.3; letter-spacing:-.04em; font-weight:300; }
  .study-heading span { color:#c6dced; }
  .study-description { margin-top:21px; font-size:13px; line-height:1.8; color:var(--muted); }
  .study-visual { position:relative; align-self:stretch; min-width:0; min-height:370px; }
  .study-visual canvas,.study-static { width:100%; height:100%; position:absolute; inset:0; }
  .study-visual canvas { opacity:0; transition:opacity .3s; }
  .study-visual.ready canvas { opacity:1; }
  .study-visual.ready .study-static { display:none; }
  .study-static { display:flex; align-items:center; }
  .study-static svg { width:100%; }
  figcaption { position:absolute; bottom:21px; right:0; left:0; display:flex; justify-content:space-between; color:#a6bfd6; font-size:8px; letter-spacing:.18em; text-transform:uppercase; padding-left:18px; }
  .perspectives { display:grid; grid-template-columns:1fr 1fr; gap:100px; margin-top:65px; }
  .perspective-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:19px; }
  .perspective-top .eyebrow { color:var(--blue); font-size:9px; letter-spacing:.19em; }
  .perspective-icon { width:33px; height:33px; stroke:var(--blue); stroke-width:.9; opacity:.75; }
  .perspective-warm .perspective-icon { stroke:var(--yellow); }
  .perspective-warm .eyebrow { color:var(--yellow); }
  .perspective h3 { font-size:27px; letter-spacing:-.028em; margin-bottom:15px; }
  .perspective p { color:var(--muted); font-size:14px; line-height:1.9; max-width:500px; }
  .invitation { position:relative; isolation:isolate; overflow:clip; min-height:653px; display:grid; place-items:center; padding:105px 0 135px; background:linear-gradient(180deg,var(--navy),#0b2542 70%,var(--navy)); border-top:1px solid var(--line); }
  .invitation-light { position:absolute; inset:0; z-index:-1; background:radial-gradient(ellipse 50% 50% at 56% 77%,rgb(101 174 232 / .14),transparent 70%),radial-gradient(ellipse 18% 28% at 77% 78%,rgb(238 201 147 / .065),transparent 70%); }
  .invitation-orbit { position:absolute; width:max(100%,1200px); height:auto; bottom:-80px; left:50%; transform:translateX(-50%); z-index:-1; }
  .invitation-inner { text-align:center; }
  .invitation-status { display:flex; justify-content:center; align-items:center; gap:12px; color:#c7dbee; font-size:9px; letter-spacing:.23em; margin-bottom:26px; }
  .invitation h2 { font-size:clamp(48px,5.3vw,84px); line-height:1.12; }
  .invitation h2 span { color:var(--blue); }
  .invitation-copy { color:var(--muted); font-size:14px; line-height:1.9; margin:25px 0 33px; }
  .site-footer { padding-top:30px; padding-bottom:28px; }
  .footer-top { display:flex; justify-content:space-between; align-items:center; padding-bottom:37px; }
  .footer-brand { display:block; width:240px; opacity:.95; }
  .footer-brand img { width:100%; height:auto; }
  .footer-top>p { text-transform:uppercase; font-size:9px; letter-spacing:.28em; color:#c1d4e5; }
  .footer-bottom { border-top:1px solid var(--line); padding-top:24px; display:flex; justify-content:space-between; align-items:center; gap:24px; font-size:10px; color:#aabfd2; }
  .footer-development { margin-left:auto; margin-right:auto; }
  .footer-controls { display:flex; align-items:center; gap:28px; }
  .quiet-button { padding:8px 0; border:0; background:none; font-size:10px; color:#b4cadd; display:inline-flex; gap:8px; align-items:center; min-height:36px; transition:color .2s; }
  .quiet-button:hover { color:var(--white); }
  .quiet-button svg { width:12px; height:12px; stroke:currentColor; stroke-width:1.2; }
  .back-top>span { font-size:16px; }
}
@layer components {
  .demo-button { position:relative; isolation:isolate; display:inline-flex; align-items:center; justify-content:center; gap:35px; border:1px solid transparent; border-radius:99px; min-height:61px; padding:16px 30px; color:var(--white); font-size:15px; font-weight:450; line-height:1.6; letter-spacing:-.015em; background:linear-gradient(var(--navy-deep),var(--navy-deep)) padding-box,linear-gradient(115deg,#82d0ff 2%,#c3e9ff 43%,#f9dfb7 96%) border-box; box-shadow:-5px 0 20px rgb(87 170 240 / .13),5px 0 20px rgb(237 201 155 / .13),inset 0 0 14px rgb(147 211 255 / .06); transition:box-shadow .35s,background .35s,transform .4s var(--ease); }
  .demo-button::after { content:''; position:absolute; inset:0; z-index:-1; border-radius:inherit; background:linear-gradient(100deg,rgb(135 212 255 / .08),rgb(241 207 158 / .04)); opacity:0; transition:opacity .3s; }
  .demo-button:hover { box-shadow:-6px 0 30px rgb(87 170 240 / .25),7px 0 30px rgb(237 201 155 / .20),inset 0 0 17px rgb(147 211 255 / .09); transform:translateY(-2px); }
  .demo-button:hover::after { opacity:1; }
  .demo-button:active { transform:translateY(0); }
  .arrow { width:25px; height:20px; stroke:currentColor; stroke-width:1.05; fill:none; flex-shrink:0; transition:transform .4s var(--ease); }
  .demo-button:hover .arrow { transform:translateX(4px); }
  dialog { border:1px solid rgb(165 210 244 / .3); border-radius:18px; padding:0; background:#0d2844; color:var(--white); max-width:min(590px,calc(100vw - 32px)); width:590px; max-height:calc(100dvh - 40px); overflow:auto; box-shadow:0 30px 100px rgb(4 23 45 / .65); scrollbar-color:#4a6d8d transparent; }
  dialog::backdrop { background:rgb(6 22 42 / .81); backdrop-filter:blur(12px); }
  .dialog-body { position:relative; padding:43px 43px 34px; isolation:isolate; overflow:hidden; }
  .dialog-body>.eyebrow { color:#c5deef; font-size:9px; display:flex; align-items:center; gap:11px; }
  .dialog-close { position:absolute; top:22px; right:22px; z-index:3; display:grid; place-items:center; width:36px; height:36px; background:rgb(25 53 81 / .8); border:1px solid var(--line); border-radius:50%; transition:background .2s; }
  .dialog-close:hover { background:#214969; }
  .dialog-close svg { width:19px; height:19px; stroke:var(--muted); stroke-width:1.2; }
  .dialog-decoration { position:absolute; top:-66px; right:-100px; width:275px; height:275px; border:1px solid rgb(176 215 241 / .12); border-radius:50%; z-index:-1; box-shadow:inset 0 0 60px rgb(123 189 240 / .06),0 0 70px rgb(126 197 252 / .04); }
  .dialog-body h2 { font-size:49px; line-height:1.1; margin:24px 0 19px; }
  .dialog-body>p,.dialog-body #demo-description,.dialog-body #success-view>p { font-size:13px; color:#bcd0e2; line-height:1.8; }
  .preview-notice { margin:17px 0 0; padding:10px 13px; border-left:1px solid var(--yellow); background:rgb(245 214 160 / .05); color:#d7dce2; font-size:11px; line-height:1.7; }
  .preview-notice strong { color:var(--yellow); font-weight:500; }
  form { margin-top:23px; }
  .form-field { display:flex; flex-direction:column; gap:7px; margin-bottom:15px; }
  .form-field label { font-size:11px; font-weight:500; color:#e2ebf5; }
  .form-field label>span:not(.optional) { color:var(--yellow); }
  .optional { color:#a4bbcf; font-weight:400; margin-left:5px; font-size:10px; }
  .form-field input,.form-field textarea { width:100%; border:1px solid #36536f; border-radius:5px; background:rgb(8 29 51 / .65); color:var(--white); font-size:13px; min-height:46px; padding:12px 13px; resize:vertical; transition:border-color .2s,background .2s; }
  .form-field input:hover,.form-field textarea:hover { border-color:#587b9c; }
  .form-field input:focus,.form-field textarea:focus { border-color:var(--blue); background:rgb(14 42 69 / .9); outline:2px solid rgb(167 221 255 / .12); outline-offset:2px; }
  .form-field input::placeholder,.form-field textarea::placeholder { color:#95acc1; opacity:1; }
  .form-field [aria-invalid="true"] { border-color:#f5bfa5; }
  .field-error { color:#ffd1b9; font-size:11px; line-height:1.5; }
  .field-error:empty { display:none; }
  .form-submit { width:100%; min-height:54px; margin-top:8px; font-size:13px; }
  .form-submit:disabled { opacity:.6; transform:none; }
  .form-privacy { color:#a5bdd3; font-size:10px; text-align:center; line-height:1.7; margin-top:14px; }
  .form-status { font-size:12px; line-height:1.8; color:var(--yellow); margin-top:10px; }
  .form-status:empty { display:none; }
  .honey { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
  .success-symbol { margin:37px 0 20px; width:63px; color:var(--blue); }
  .success-symbol svg { fill:none; stroke:currentColor; stroke-width:1; }
  #success-view .demo-button { margin-top:25px; margin-bottom:17px; }
  .privacy-body { padding-top:44px; padding-bottom:44px; }
  .privacy-body p:not(.eyebrow) { margin-top:16px; }
  .privacy-body h2 { font-size:36px; }
  .privacy-preview-note { color:var(--yellow) !important; font-size:11px !important; }
  .noscript-note { padding:18px var(--gutter); text-align:center; font-size:12px; color:var(--muted); }
}
@layer motion {
  @keyframes settle { from { transform:translateY(16px); } to { transform:translateY(0); } }
  .hero-eyebrow { animation:settle 1s var(--ease) both; }
  h1 { animation:settle 1.25s var(--ease) both; }
  .hero-description { animation:settle 1.5s var(--ease) both; }
  .hero-cta,.hero-signature { animation:settle 1.7s var(--ease) both; }
  @keyframes dialog-enter { from { opacity:0; transform:translateY(12px) scale(.99); } to { opacity:1; transform:translateY(0) scale(1); } }
  dialog[open] { animation:dialog-enter .35s var(--ease); }
  .reveal { transition:transform 1s var(--ease),opacity .8s ease; transition-delay:var(--reveal-delay,0s); }
  .motion-ready .reveal:not(.is-visible) { opacity:0; transform:translateY(25px); }
  @supports (animation-timeline: scroll()) {
    @keyframes progress { to { transform:scaleX(1); } }
    .reading-progress { animation:progress linear both; animation-timeline:scroll(root block); }
  }
  @supports (animation-timeline: view()) {
    @keyframes orbit-travel { from { transform:translateX(-50%) translateY(30px) rotate(-2deg); } to { transform:translateX(-50%) translateY(-20px) rotate(1deg); } }
    .invitation-orbit { animation:orbit-travel linear both; animation-timeline:view(); animation-range:entry 0% exit 100%; }
  }
  html[data-motion="off"] { scroll-behavior:auto; }
  html[data-motion="off"] *,html[data-motion="off"] *::before,html[data-motion="off"] *::after { animation:none !important; transition:none !important; }
  html[data-motion="off"] .reveal { opacity:1 !important; transform:none !important; }
  html[data-motion="off"] .scene-drift { transform:none !important; }
  @media (prefers-reduced-motion:reduce) {
    html { scroll-behavior:auto; }
    *,*::before,*::after { animation:none !important; transition:none !important; }
    .reveal { opacity:1 !important; transform:none !important; }
    .scene-drift { transform:none !important; }
  }
}
@layer responsive {
  @media (min-width:1750px) {
    .hero-description { max-width:570px; }
    .hero-copy { padding-bottom:160px; }
    .orb-caption { right:0; }
  }
  @media (max-width:1200px) {
    .header-inner { height:99px; }
    .hero { min-height:800px; }
    .hero-scene { width:112%; left:47.8%; }
    .hero-copy { width:62%; }
    h1 { font-size:clamp(43px,4.25vw,53px); }
    .hero-description { font-size:15px; width:77%; }
    .orb-caption { top:28%; right:-18px; font-size:8px; letter-spacing:.18em; }
    .about-intro,.perspectives { gap:65px; }
    .demo-button { padding-inline:25px; gap:25px; font-size:14px; min-height:58px; }
    .study-copy .eyebrow { letter-spacing:.12em; }
    .footer-controls { gap:20px; }
  }
  @media (min-width:701px) and (max-width:950px) {
    .hero { min-height:800px; }
    .hero-scene { width:136%; left:45%; top:57%; opacity:.85; }
    .hero-copy { width:68%; padding-bottom:145px; }
    .hero-description { width:77%; max-width:340px; }
    h1 { font-size:42px; }
    .hero-inner::before { content:''; position:absolute; inset:0 26% 0 -60px; background:linear-gradient(90deg,rgb(9 29 52 / .8),transparent); z-index:-1; }
    .orb-caption { top:24%; right:0; }
    .about-intro { gap:38px; }
    .about-intro h2 { font-size:58px; }
    .intro-body p { font-size:13px; }
    .alignment-study { grid-template-columns:1fr 1fr; }
    .study-heading { font-size:30px; }
    .perspectives { gap:42px; }
    .perspective h3 { font-size:24px; }
    .footer-development { display:none; }
  }
  @media (max-width:700px) {
    :root { --gutter:25px; }
    html { scroll-padding-top:30px; }
    .header-inner { height:91px; gap:14px; }
    .brand { width:180px; margin-left:-5px; flex-shrink:0; }
    .site-header nav { gap:15px; }
    .nav-link { font-size:8px; letter-spacing:.12em; }
    .coming-link { padding-left:15px; }
    .hero { min-height:1140px; background:radial-gradient(ellipse at 62% 68%,#103453, #091d34 59%); }
    .hero-inner { align-items:flex-start; }
    .hero-copy { padding:137px 0 0; width:100%; }
    .hero-eyebrow { font-size:9px; letter-spacing:.25em; margin-bottom:23px; }
    h1 { font-size:clamp(37px,8.3vw,58px); line-height:1.19; letter-spacing:-.049em; margin-bottom:23px; max-width:530px; }
    h1 span { white-space:normal; }
    .hero-description { width:100%; max-width:465px; font-size:13px; line-height:1.85; margin-bottom:25px; }
    .hero-cta { min-height:56px; font-size:13px; padding:14px 25px; gap:34px; }
    .hero-signature { font-size:8px; gap:15px; letter-spacing:.28em; margin-top:20px; }
    .hero-scene { top:558px; left:50%; width:min(630px,117vw); max-width:none; aspect-ratio:712/738; transform:translateX(-50%); }
    .scene-art { width:100%; height:auto; }
    .scene-drift { transform:none !important; }
    .orb-caption { top:1033px; right:0; font-size:7px; letter-spacing:.12em; line-height:1.8; white-space:nowrap; }
    .orb-caption br { display:none; }
    .orb-caption span { display:none; }
    .hero-footer { bottom:30px; gap:20px; align-items:flex-end; }
    .micro-statement { font-size:8px; letter-spacing:.14em; padding-left:10px; line-height:2; }
    .camera-statement { min-width:auto; }
    .scroll-cue { top:-48px; left:0; transform:none; padding:0; min-height:38px; font-size:8px; gap:12px; }
    .scroll-cue svg { height:19px; }
    .section { padding-top:47px; padding-bottom:65px; }
    .section-top { padding-top:22px; }
    .section-index { font-size:9px; gap:17px; letter-spacing:.17em; }
    .small-note { font-size:9px; max-width:140px; text-align:right; }
    .about-intro { grid-template-columns:1fr; gap:30px; margin:49px 0 45px; }
    .about-intro h2 { font-size:clamp(55px,12.5vw,76px); line-height:1.03; }
    .intro-body { max-width:520px; padding:0; }
    .intro-body .lead { font-size:24px; margin-bottom:17px; }
    .intro-body p { font-size:13px; line-height:1.9; margin-top:14px; }
    .alignment-study { grid-template-columns:1fr; }
    .study-copy { padding:32px 0 0; }
    .study-copy .eyebrow { font-size:8px; letter-spacing:.14em; margin-bottom:17px; }
    .study-heading { font-size:33px; line-height:1.25; }
    .study-description { font-size:12px; margin-top:15px; }
    .study-visual { min-height:260px; margin:0 -17px; }
    figcaption { bottom:15px; font-size:7px; padding-inline:17px; letter-spacing:.12em; }
    .perspectives { grid-template-columns:1fr; gap:34px; margin-top:35px; }
    .perspective+.perspective { padding-top:26px; border-top:1px solid var(--line); }
    .perspective-top { margin-bottom:15px; }
    .perspective h3 { font-size:25px; margin-bottom:11px; }
    .perspective p { font-size:13px; line-height:1.85; }
    .invitation { padding:78px 0 90px; min-height:520px; }
    .invitation-status { font-size:8px; letter-spacing:.15em; margin-bottom:24px; gap:9px; }
    .invitation h2 { font-size:clamp(38px,9vw,58px); line-height:1.15; }
    .invitation-copy { font-size:12px; line-height:1.9; margin:24px auto 29px; max-width:345px; }
    .invitation-copy br { display:none; }
    .invitation-orbit { bottom:-68px; width:1000px; }
    .footer-top { padding-bottom:26px; }
    .footer-brand { width:164px; }
    .footer-top>p { font-size:7px; max-width:120px; text-align:right; line-height:2; letter-spacing:.18em; }
    .footer-bottom { flex-wrap:wrap; gap:8px 20px; padding-top:17px; font-size:9px; }
    .footer-development { display:none; }
    .footer-controls { margin-left:auto; gap:18px; }
    .quiet-button { font-size:9px; }
    .back-top { display:none; }
    dialog { max-width:calc(100vw - 22px); max-height:calc(100dvh - 22px); border-radius:13px; }
    .dialog-body { padding:32px 24px 26px; }
    .dialog-close { top:16px; right:16px; }
    .dialog-body h2 { font-size:42px; margin-top:23px; }
    .dialog-body #demo-description { font-size:12px; }
    .form-field input,.form-field textarea { font-size:16px; }
    .form-field input::placeholder,.form-field textarea::placeholder { font-size:12px; }
    .form-submit { font-size:12px; gap:15px; padding-inline:18px; }
  }
  @media (max-width:370px) {
    :root { --gutter:20px; }
    .brand { width:150px; }
    .site-header nav { gap:11px; }
    .coming-link { padding-left:11px; }
    .nav-link { font-size:7px; }
    h1 { font-size:35px; }
    .hero-copy { padding-top:125px; }
    .hero { min-height:1120px; }
    .hero-description { font-size:12px; }
    .hero-scene { top:548px; }
    .hero-cta { gap:23px; padding-inline:22px; }
    .orb-caption { top:1013px; }
  }
  @media (max-width:700px) and (min-width:500px) {
    .hero { min-height:1240px; }
    .hero-scene { top:535px; }
    .orb-caption { top:1133px; }
  }
  @media (pointer:coarse) {
    .demo-button:hover,.demo-button:active { transform:none; }
    .quiet-button { min-height:44px; }
  }
}

/* V3 background finish: the approved orb is optically composited into a live,
   full-bleed environment. The alignment study, interactions, and copy are unchanged. */
@layer finish {
  body { position:relative; isolation:isolate; }
  #main { position:relative; isolation:isolate; background:
    radial-gradient(ellipse 46% 13% at 73% 14%,rgb(35 77 112 / .36),transparent 100%),
    radial-gradient(ellipse 68% 20% at 12% 37%,rgb(17 49 78 / .23),transparent 100%),
    radial-gradient(ellipse 35% 15% at 95% 48%,rgb(42 75 100 / .11),transparent 100%),
    radial-gradient(ellipse 73% 17% at 65% 83%,rgb(20 58 91 / .18),transparent 100%),
    var(--navy); }
  .hero { background:transparent; }
  .hero-atmosphere { background:
    radial-gradient(ellipse 50% 70% at 71% 39%,rgb(29 77 117 / .22),transparent 85%),
    radial-gradient(ellipse 19% 38% at 89% 51%,rgb(240 198 131 / .032),transparent 100%);
    -webkit-mask-image:linear-gradient(#000 55%,transparent 100%); mask-image:linear-gradient(#000 55%,transparent 100%); }
  .hero-scene { mix-blend-mode:normal; }
  .scene-world { position:absolute; inset:0; width:100%; height:100%; }
  .scene-environment { width:100%; height:100%; overflow:visible; max-width:none; }
  .orb-approved-art { mix-blend-mode:screen; }
  .hero-bottom-fade { height:200px; opacity:0; }
  .about { position:relative; }
  .section-top { border-top-color:rgb(176 216 250 / .14); }
  .invitation { background:transparent; border-top-color:transparent; }
  .invitation::before { content:''; position:absolute; top:0; left:var(--gutter); right:var(--gutter); height:1px;
    background:linear-gradient(90deg,transparent,rgb(176 216 250 / .13) 20%,rgb(176 216 250 / .13) 80%,transparent); }
  .invitation-light { background:
    radial-gradient(ellipse 51% 46% at 55% 73%,rgb(101 174 232 / .09),transparent 90%),
    radial-gradient(ellipse 21% 39% at 79% 66%,rgb(238 201 147 / .04),transparent 100%);
    -webkit-mask-image:linear-gradient(transparent,#000 18%,#000 70%,transparent);mask-image:linear-gradient(transparent,#000 18%,#000 70%,transparent); }
  .invitation-orbit { -webkit-mask-image:linear-gradient(#000 75%,transparent 98%);mask-image:linear-gradient(#000 75%,transparent 98%); }
  @media (max-width:700px) {
    #main { background:
      radial-gradient(ellipse 105% 12% at 66% 22%,rgb(23 66 103 / .26),transparent 90%),
      radial-gradient(ellipse 90% 15% at 14% 49%,rgb(23 56 84 / .17),transparent 95%),
      radial-gradient(ellipse 120% 12% at 60% 85%,rgb(24 63 98 / .15),transparent 100%),var(--navy); }
    .hero { background:transparent; }
    .hero-atmosphere { background:radial-gradient(ellipse 75% 38% at 50% 68%,rgb(25 75 115 / .14),transparent); }
    .scene-world { inset:auto; width:234.83146%; height:127.50678%; left:-110.11236%; top:-12.19512%; }
  }
}

/* V7: every optical component is in the same SVG viewBox, under the same transform.
   The approved silhouette never rotates independently; only 3-D point coordinates move. */
@layer finish {
  #orbital-points { pointer-events:none; }
  #registered-traveler { pointer-events:none; }
  .registered-trail-halo,.registered-trail-core { stroke-dasharray: 9 991; }
  .study-description { max-width:380px; }
}
