/* Bessel — a quiet, full-bleed astronomical instrument. */
:root { --fg:#edf0f6; --muted:#aab5c9; --detail:#aab8e0; --pad:clamp(28px,5.55vw,112px); --inset:0px; --radius:0px; }
:root { --safe-top:env(safe-area-inset-top,0px); --safe-right:env(safe-area-inset-right,0px); --safe-bottom:env(safe-area-inset-bottom,0px); --safe-left:env(safe-area-inset-left,0px); }
html { height:auto; min-height:100%; padding:0; }
body { min-height:100svh; }
button,a { -webkit-tap-highlight-color:transparent; }
button { touch-action:manipulation; }
::selection { background:#b3bfdf; color:#080c14; }
.frame { min-height:100svh; border:0; margin:0; border-radius:0; background:#080c14; padding-top:var(--safe-top); padding-bottom:var(--safe-bottom); }
.art:after { background:linear-gradient(90deg,rgba(7,11,20,.72),rgba(7,11,20,.25) 45%,transparent 75%),linear-gradient(0deg,rgba(7,11,20,.9),transparent 28%); }
.nebula { opacity:.72; }
.stage>img:not(.nebula) { opacity:.65; }
.stage .orb { stroke-opacity:.7; }
.sky-ticks { opacity:.7; }
.site-header { background:transparent; backdrop-filter:none; -webkit-backdrop-filter:none; border:0; }
.bar { min-height:112px; padding:0 var(--pad); grid-template-columns:1fr auto auto; gap:54px; }
.brand { gap:12px; min-height:44px; }
.brand img { width:40px; height:40px; }
.wordmark { font-size:38px; }
.site-header nav { gap:32px; font-size:14px; }
.site-header nav :is(a,button) { padding:12px 4px; min-height:44px; color:#bac3d4; transition:color .2s; }
.site-header nav :is(a,button):hover { color:#fff; }
.header-action { border:0; border-bottom:1px solid #778297; border-radius:0; background:none; box-shadow:none; padding:10px 0; gap:24px; font-size:14px; min-height:44px; font-family:inherit; line-height:inherit; color:var(--fg); cursor:pointer; }
.header-action:hover { background:none; border-color:#e6eaf1; }
.hero { padding:clamp(100px,15svh,200px) var(--pad) 80px; max-width:none; width:100%; }
.status { padding:0; margin:0 0 30px; border:0; border-radius:0; background:none; backdrop-filter:none; -webkit-backdrop-filter:none; color:#b9c3d7; font-size:11px; font-weight:500; letter-spacing:.17em; text-transform:uppercase; gap:14px; }
.status:before { display:none; }
.status-line { height:1px; width:30px; background:#c7a879; }
h1 { font-family:"Bessel Urbanist",sans-serif; font-size:clamp(64px,7.6vw,116px); font-weight:480; line-height:1.01; letter-spacing:-.045em; margin:0 0 28px; }
h1 span { color:#c1cbe1; }
.lede { color:#acb7cb; max-width:500px; font-size:18px; line-height:1.65; margin:0 0 32px; text-wrap:pretty; }
.ctas { gap:28px; align-items:center; }
.btn { min-height:54px; padding:0 22px; border:0; border-radius:5px; gap:30px; font-family:inherit; line-height:inherit; font-weight:500; font-size:14px; cursor:pointer; transition:background .2s,color .2s,box-shadow .2s; }
.btn-primary { background:#e7ecf6; color:#111725; border:1px solid #e7ecf6; box-shadow:0 2px 12px #080c1420; }
.btn-primary:hover { background:#fff; filter:none; box-shadow:0 4px 24px #aab8e01a; }
.btn-secondary { padding:0; color:#d4dbea; border:0; background:transparent; gap:18px; }
.btn-secondary:hover { color:#fff; }
.arrow,.header-action>span { display:inline-block; font-size:18px; font-weight:400; transition:transform .2s; }
.btn:hover .arrow,.route-email:hover .arrow,.header-action:hover>span { transform:translate(2px,-2px); }
.btn-primary:hover .arrow { transform:translateX(3px); }
.availability { display:flex; align-items:center; gap:8px; font-size:12px; line-height:1.5; color:#9ca9bf; margin:22px 0 0; }
.availability>span { width:4px; height:4px; border-radius:50%; background:#b89b72; flex:none; }
.site-footer { display:flex; justify-content:space-between; align-items:center; gap:20px; margin:0 var(--pad); padding:24px 0 26px; border-top:1px solid #b6c2db26; position:relative; z-index:2; color:#9ca9bf; font-size:12px; }
.footer-note,.legal { position:static; margin:0; color:inherit; font-size:inherit; }
.footer-note { letter-spacing:.01em; }
.legal { flex:none; }
.skip-link { position:fixed; top:calc(12px + var(--safe-top)); left:calc(12px + var(--safe-left)); z-index:20; transform:translateY(-200%); background:#edf0f6; color:#080c14; padding:12px 18px; border-radius:4px; }
.skip-link:focus { transform:none; }
:focus-visible { outline:2px solid #d4b586; outline-offset:5px; }
.hero:focus-visible { outline:1px solid #d4b586; outline-offset:-8px; }
dialog.sheet { inset:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left); width:min(640px,calc(100vw - var(--safe-left) - var(--safe-right) - 40px)); max-height:calc(100svh - var(--safe-top) - var(--safe-bottom) - 48px); border-radius:14px; background:linear-gradient(145deg,#182238,#101827 68%); border:1px solid #70809d50; box-shadow:0 36px 120px #0009; }
dialog.sheet::backdrop { background:#02050c99; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.sheet-in { padding:38px 40px 40px; }
.sheet-head { margin-bottom:30px; align-items:center; }
.sheet h2 { font-family:"Bessel Urbanist",sans-serif; font-size:32px; font-weight:500; letter-spacing:-.025em; }
.close { width:44px; height:44px; font-size:23px; border-color:#8f9bb63d; transition:background .2s; }
.close:hover { background:#ffffff14; }
.sheet p { color:#b4bfd2; font-size:15px; line-height:1.75; }
.sheet .sheet-lede { font-family:"Bessel Urbanist",sans-serif; color:#edf0f6; font-size:30px; line-height:1.2; letter-spacing:-.025em; margin-bottom:24px; }
.sheet-contact { margin-top:28px; padding-top:22px; border-top:1px solid #72829d40; display:flex; justify-content:space-between; align-items:center; gap:16px; font-size:13px; color:#a7b4cc; }
.sheet-contact :is(a,button) { display:inline-flex; align-items:center; min-height:44px; gap:16px; padding:0; border:0; background:none; font:inherit; text-decoration:none; color:#e0e6f1; cursor:pointer; }
.sheet-contact :is(a,button):hover { color:#fff; }
.approach-steps { list-style:none; margin:26px 0 0; padding:0; }
.approach-steps li { display:grid; grid-template-columns:28px minmax(0,1fr); gap:16px; padding:16px 0; border-top:1px solid #72829d40; }
.step-number { padding-top:3px; color:#bea982; font-size:11px; line-height:1.6; font-variant-numeric:tabular-nums; }
.approach-steps h3 { margin:0 0 6px; color:#e4eaf4; font-size:16px; font-weight:500; line-height:1.4; }
.approach-steps p { margin:0; font-size:14px; line-height:1.65; }
.approach-steps+.sheet-contact { margin-top:0; }
.contact-route { padding:22px 0; border-top:1px solid #72829d40; }
.contact-route:last-child { padding-bottom:0; }
.contact-route h3 { margin:0 0 7px; font-family:"Bessel Urbanist",sans-serif; font-size:22px; font-weight:500; line-height:1.2; letter-spacing:-.015em; }
.contact-route p { margin:0 0 12px; }
.route-email { display:inline-flex; align-items:center; gap:14px; min-height:44px; color:#e4eaf4; font-size:14px; text-decoration:underline; text-decoration-color:#72829d; text-underline-offset:5px; }
.route-email:hover { color:#fff; text-decoration-color:currentColor; }
.route-email .arrow { flex:none; }
.sheet details { padding:0; }
.sheet summary { box-sizing:border-box; min-height:64px; padding:19px 0; font-size:15px; align-items:center; line-height:1.5; }
.sheet summary:after { flex:0 0 20px; text-align:center; font-size:22px; font-weight:300; line-height:1; }
.sheet details p { margin:0; padding:0 24px 24px 0; }
.sheet details a { text-underline-offset:4px; }
@media (prefers-reduced-motion:no-preference) {
  .hero>.status,.hero>h1,.hero>.lede,.hero>.ctas,.hero>.availability { animation:arrive .85s cubic-bezier(.2,.65,.25,1) both; }
  .hero>h1 { animation-delay:.07s; }
  .hero>.lede { animation-delay:.14s; }
  .hero>.ctas { animation-delay:.21s; }
  .hero>.availability { animation-delay:.28s; }
  dialog.sheet[open] { animation:sheet-arrive .25s ease-out both; }
  @keyframes arrive { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:none; } }
  @keyframes sheet-arrive { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
}
@media (max-width:1000px) {
  .bar { min-height:96px; gap:38px; }
  .hero { padding-top:clamp(140px,21svh,240px); padding-bottom:64px; }
}
@media (max-width:700px) {
  :root { --pad:26px; }
  .bar { min-height:88px; padding:0 var(--pad); grid-template-columns:1fr auto; gap:20px; }
  .brand { gap:9px; }
  .brand img { width:32px; height:32px; }
  .wordmark { font-size:31px; }
  .site-header nav { gap:20px; font-size:13px; }
  .header-action { display:none; }
  .stage { --sw:max(760px,calc(78cqh*1.7777778)); --px:.73; --py:0; }
  .art:after { background:linear-gradient(0deg,#080c14 0,rgba(8,12,20,.96) 20%,rgba(8,12,20,.6) 55%,rgba(8,12,20,.12) 85%); }
  .hero { padding:clamp(170px,26svh,250px) var(--pad) 32px; }
  .status { font-size:10px; letter-spacing:.1em; gap:10px; margin-bottom:22px; }
  .status-line { width:22px; }
  h1 { font-size:clamp(42px,10.6vw,70px); letter-spacing:-.04em; line-height:1.05; margin-bottom:22px; }
  .lede { font-size:16px; line-height:1.6; max-width:420px; margin-bottom:26px; }
  .ctas { flex-direction:row; gap:12px; align-items:stretch; }
  .btn { width:auto; min-height:52px; }
  .btn-primary { flex:1 1 100%; }
  .btn-secondary { min-height:44px; font-size:13px; justify-content:flex-start; }
  .availability { margin-top:15px; font-size:12px; }
  .site-footer { padding:20px 0 23px; margin:0 var(--pad); font-size:12px; }
  .sheet-in { padding:24px; }
  .sheet h2 { font-size:28px; }
  .sheet-head { margin-bottom:24px; }
  .sheet .sheet-lede { font-size:27px; }
}
@media (max-width:370px) {
  :root { --pad:20px; }
  .bar { gap:12px; }
  .site-header nav { gap:12px; }
  .brand img { width:29px; height:29px; }
  .wordmark { font-size:28px; }
  .status { font-size:9px; }
  h1 { font-size:39px; }
}
@media (max-height:800px) and (min-width:701px) {
  .bar { min-height:88px; }
  .hero { padding-top:52px; padding-bottom:36px; }
  h1 { font-size:clamp(60px,7vw,94px); }
  .status { margin-bottom:22px; }
  .lede { margin-bottom:24px; }
  .site-footer { padding-top:18px; padding-bottom:18px; }
}
@media (min-width:520px) and (max-width:700px) {
  .hero { padding-top:140px; }
  .btn-primary { flex:0 1 auto; }
  .ctas { gap:26px; }
  .footer-note { max-width:none; }
}
@media (max-width:700px) and (max-height:740px) {
  .bar { min-height:76px; }
  .hero { padding-top:100px; padding-bottom:28px; }
}
@media (max-width:519px) and (min-height:741px) {
  .hero { padding-top:150px; padding-bottom:72px; }
}
@media (max-width:370px) and (max-height:740px) {
  .hero { padding-top:60px; }
  .footer-note { max-width:175px; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none!important; transition:none!important; }
}
.bar,.hero { padding-left:max(var(--pad),var(--safe-left)); padding-right:max(var(--pad),var(--safe-right)); }
.site-footer { margin-left:max(var(--pad),var(--safe-left)); margin-right:max(var(--pad),var(--safe-right)); }
