/* COSMIC CONVERGENCE — Screenshot-accurate redesign, November 2026
   Uses the exact user-provided visual reference for desktop homepage imagery.
   Working HTML navigation and Netlify forms remain in the source site. */
:root{
  --observatory:#070e1c; --teal:#283b55; --sage:#ebe7df; --parchment:#fbfaf7;
  --sandstone:#eee8de; --gold:#c9a773; --ink:#171f31; --muted:#5a6170;
  --gold-text:#927047; --on-dark:#fbf8f2; --on-dark-muted:#c5bfba;
  --card:#fffdf9; --line:rgba(8,15,31,.14); --line-dark:rgba(201,167,115,.25);
  --radius:0; --wide:1200px;
}
body{background:#fbfaf7;color:var(--ink)}
::selection{background:#d6b886;color:#080e1c}
:focus-visible{outline:2px solid #c89f61;outline-offset:3px}
.btn{background:#09282D;border-color:var(--gold);color:#fffaf0;border-radius:0;letter-spacing:1.7px;transition:background .2s,border-color .2s,transform .2s}
.btn:hover{background:#327A7C;border-color:#ebd2a1}
.btn-outline{color:#15233a;border-color:#b6a07a;background:transparent}
.btn-outline:hover{background:#327A7C;color:#fff}
.status-open{background:#253951;color:#fff}.status-wait{background:#eee5d5;color:#725c3e}
.text-link{color:#927047}
.bg-sage{background:#f1efe9}.bg-sand{background:#e8e0d3}
.bg-dark{background:#09282D}
.bg-dark .lead,.bg-dark p{color:#cbc5c0}
.reading-card{border:1px solid rgba(16,28,44,.18);box-shadow:0 10px 30px rgba(6,17,34,.04)}
.reading-card::before{height:1px;background:var(--gold)}
.reading-card .btn{color:#fff;border-color:var(--gold)}
.reading-card.is-waitlist .btn{color:#192840}
.reading-card.is-waitlist .btn:hover{color:#fff}
.reading-card .card-no,.eyebrow{color:#8c693e}
.reading-price{color:#19263b}
.form-card{border-top-color:var(--gold)}
.note-box{border-left-color:var(--gold)}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#a9855a;box-shadow:0 0 0 3px rgba(201,167,115,.2)}
/* Pages: actual semantic, working navigation styled like reference */
.topline{display:none!important}
.site-header.cosmic-header{position:sticky;top:0;background:#09282D;border-bottom:1px solid rgba(201,167,115,.27);backdrop-filter:none;z-index:60}
.cosmic-header .container{width:min(calc(100% - 44px),1320px)}
.cosmic-header .header-inner{min-height:74px;gap:22px}
.cosmic-header .brand{gap:16px;min-width:0}
.cosmic-header .brand img{width:54px;height:54px;flex:none}
.cosmic-header .brand-title,.cosmic-footer .brand-title{font:500 clamp(15px,1.45vw,21px)/1.2 var(--serif);text-transform:uppercase;letter-spacing:3px;color:#f3ede1;white-space:nowrap}
.cosmic-header .brand-sub,.cosmic-footer .brand-sub{font:500 9px/1.4 var(--sans);text-transform:uppercase;letter-spacing:2.6px;color:#b3c0d3;margin-top:4px;white-space:nowrap}
.cosmic-header .nav-links{gap:clamp(16px,2.2vw,38px)}
.cosmic-header .nav-links a{color:#eee9e3;font-size:10px;padding:28px 0;border-bottom:1px solid transparent;letter-spacing:2px}
.cosmic-header .nav-links a:hover,.cosmic-header .nav-links a[aria-current=page]{color:#fff;border-bottom-color:#dfbc80}
.cosmic-header .header-action{font-size:10px;padding:10px 18px;min-height:41px;background:transparent;border:1px solid #aa8a5a;color:#fff;white-space:nowrap}
.cosmic-header .header-action:hover{background:rgba(201,167,115,.1)}
.cosmic-header .menu-toggle{color:#fff;border-color:var(--gold)}
.cosmic-header .nav-tag{display:none}
.page-hero{background:linear-gradient(90deg,rgba(9,40,45,.90) 0%,rgba(9,40,45,.76) 48%,rgba(9,40,45,.40)),url('reference/hero-reference.webp') center 54% / cover no-repeat; padding:105px 0 95px;border-bottom:1px solid rgba(201,167,115,.35)}
.page-hero h1,.page-hero h1 em{color:#f6efe1}
.page-hero h1 em{color:#dabd92}
.page-hero .lead{color:#f1e8de;max-width:720px}
.page-hero .eyebrow{color:#dcc195}
.page-hero .btn-outline{border-color:#c4a77b;color:#f6eddb}
.page-hero .btn-outline:hover{background:rgba(201,167,115,.24)}
.page-hero .status-wait{background:rgba(201,167,115,.24);color:#f7e5c3}
.reference-visual-section{background:#09282D;color:#f6efe3;padding:28px 0}
.reference-visual-layout{display:grid;grid-template-columns:minmax(210px,420px) 1fr;gap:clamp(24px,5vw,80px);align-items:center}
.reference-visual-layout img{width:100%;aspect-ratio:1.48;object-fit:cover;border:1px solid #b99d78;box-shadow:0 24px 35px rgba(0,0,0,.22)}
.reference-visual-layout h2,.reference-visual-layout h2 em{color:#f8eedf}
.reference-visual-layout h2 em{color:#d9b888}
.reference-visual-layout .lead{color:#dfd3c6}
.reference-visual-layout .text-link{color:#e3bc80;margin-top:10px}
.reference-visual-layout .eyebrow{color:#e0c29b}
/* Screenshot-style footer, in place of old multi-column footer. */
.footer.cosmic-footer{position:relative;background:#09282D;color:#e6decf;padding:22px 0 10px;overflow:hidden;border-top:1px solid rgba(201,167,115,.2)}
.cosmic-footer:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.22;background:repeating-radial-gradient(ellipse at 35% 160%,transparent 0,transparent 22px,rgba(202,160,102,.35) 23px,transparent 24px)}
.cosmic-footer .container{width:min(calc(100% - 70px),1260px)}
.cosmic-footer-inner{position:relative;display:grid;grid-template-columns:minmax(290px,1fr) auto minmax(150px,.6fr);align-items:center;gap:30px;min-height:78px}
.cosmic-footer .brand{display:flex;align-items:center;margin:0;gap:16px}
.cosmic-footer .brand img{width:57px;height:57px}
.cosmic-footer .brand-title{font-size:17px;letter-spacing:2.7px}
.cosmic-footer .brand-sub{font-size:9px}
.cosmic-footer-nav{display:flex;gap:19px;align-items:center;white-space:nowrap}
.cosmic-footer .cosmic-footer-nav a{display:inline;margin:0;color:#f0eae1;font:500 10px var(--sans);letter-spacing:1.8px;text-transform:uppercase}
.cosmic-footer .cosmic-footer-nav a:hover{color:#d7b88c}
.cosmic-footer-nav span{color:#9b7950;font-size:11px}
.cosmic-footer .footer-motto{justify-self:end;text-align:left;margin:0!important;font:italic 21px/1.3 var(--serif);color:#eed0a1}
.cosmic-footer-legal{position:relative;margin-top:12px;padding-top:8px;font-size:10px;color:#a2a6b2;opacity:.8;border-top:1px solid rgba(201,167,115,.1)}
/* The screenshot homepage, with live HTML link hitboxes on desktop. */
.cosmic-homepage{background:#fcfaf7}
.reference-hero{position:relative;aspect-ratio:1312 / 429;background:#09282D url('reference/hero-reference.webp') center top / 100% 100% no-repeat;isolation:isolate}
.reference-desktop-header{position:absolute;top:0;left:0;width:100%;height:5.4vw;min-height:48px;z-index:15}
.reference-screen-nav{position:relative;width:100%;height:100%}
.reference-link{position:absolute;display:block;top:0;height:100%;z-index:2}
.reference-link:hover{background:rgba(201,167,115,.06)}
.reference-link:focus-visible{outline:2px solid #e7be83;outline-offset:-3px}
.reference-link.brand-hit{left:1.5%;width:39%}
.reference-link.nav-celestial{left:51.2%;width:9%}
.reference-link.nav-terrestrial{left:60.8%;width:12.1%}
.reference-link.nav-within{left:73.5%;width:8%}
.reference-link.nav-reading{left:82.2%;top:9%;height:67%;width:13.7%}
.reference-hero-desktop-accessible{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.mobile-cosmic-header,.reference-hero-mobile-copy{display:none!important}
.reference-worlds{background:#fbfaf7;padding:0 1.75% 21px}
.reference-worlds-heading{font:500 clamp(9px,1vw,12px)/1.2 var(--sans);color:#1d2430;text-transform:uppercase;letter-spacing:3.3px;text-align:center;margin:0;padding:27px 0 28px}
.reference-worlds-heading span{padding:0 17px;color:#72727b}
.reference-world-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px;align-items:stretch}
.reference-world-tile{display:block;position:relative;overflow:hidden;background:#09282D;border-radius:1px;transition:filter .2s,transform .2s;aspect-ratio:411 / 569;border:1px solid #262a30}
.reference-world-tile img{width:100%;height:100%;object-fit:fill;display:block}
.reference-world-tile:hover{filter:brightness(1.12);transform:translateY(-2px);box-shadow:0 6px 20px rgba(9,40,45,.18)}
.reference-world-tile:focus-visible{outline:3px solid #a47e4a;outline-offset:2px}
/* Buttons, forms and collections on interior pages remain readable and functional. */
@media(max-width:1150px){
 .cosmic-header .header-action{display:none}
 .cosmic-header .menu-toggle{display:block}
 .cosmic-header .nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:#09282D;padding:12px 24px 20px;border-bottom:1px solid #887251;flex-direction:column;gap:0}
 .cosmic-header .nav-links.open{display:flex}
 .cosmic-header .nav-links a{border-bottom:1px solid rgba(201,167,115,.22);padding:14px 2px;color:#fff}
 .cosmic-header .nav-request{display:block!important;color:#f0cb8a!important}
 .cosmic-footer-inner{grid-template-columns:1fr auto;row-gap:22px}
 .cosmic-footer .footer-motto{display:none}
}
@media(max-width:760px){
 .reference-desktop-header{display:none!important}
 .mobile-cosmic-header{display:block!important;position:relative!important}
 .reference-hero{min-height:460px;aspect-ratio:auto;background:linear-gradient(180deg,rgba(4,8,17,.20),rgba(3,8,18,.20)),url('reference/hero-mobile.webp') center center / cover no-repeat;display:flex;align-items:center;justify-content:center;text-align:center;padding:70px 19px 105px}
 .reference-hero-mobile-copy{display:block!important;max-width:620px}
 .reference-hero-mobile-copy .hero-kicker{font:500 11px var(--sans);letter-spacing:3.5px;text-transform:uppercase;color:#f1ede7}
 .reference-hero-mobile-copy h1{font:400 clamp(49px,9.6vw,82px)/.98 var(--serif);color:#f9f4ef;text-wrap:balance;text-shadow:0 4px 18px #070d1a}
 .reference-hero-mobile-copy>p:last-child{font:italic 500 clamp(22px,5vw,28px)/1.25 var(--serif);color:#f7efe7;margin-top:24px;text-shadow:0 2px 10px #0a1121}
 .reference-worlds{padding:0 16px 28px}
 .reference-worlds-heading{padding:24px 0;letter-spacing:2px;font-size:10px;line-height:1.8}
 .reference-worlds-heading span{padding:0 6px}
 .reference-world-grid{grid-template-columns:1fr;gap:16px;max-width:445px;margin-inline:auto}
 .reference-world-tile{aspect-ratio:411 / 569}
 .reference-world-tile img{height:100%;width:100%;object-fit:fill}
 .reference-visual-layout{grid-template-columns:1fr}
 .reference-visual-layout img{max-height:270px}
 .cosmic-footer .container{width:min(calc(100% - 32px),1260px)}
 .cosmic-footer-inner{grid-template-columns:1fr;justify-items:center;text-align:center;gap:22px}
 .cosmic-footer .brand{flex-wrap:nowrap}
 .cosmic-footer .brand-title{font-size:clamp(13px,3.4vw,17px);letter-spacing:1.9px}
 .cosmic-footer .brand-sub{font-size:8px;letter-spacing:1.8px}
 .cosmic-footer-nav{gap:9px;flex-wrap:wrap;justify-content:center}
 .cosmic-footer .cosmic-footer-nav a{font-size:9px;letter-spacing:1.1px}
 .cosmic-footer-legal{text-align:center;font-size:10px}
}
@media(max-width:390px){.cosmic-header .brand-title{font-size:12px;letter-spacing:1px}.cosmic-header .brand-sub{font-size:7px;letter-spacing:1px}.cosmic-header .brand img{width:38px;height:38px}}
@media(prefers-reduced-motion:reduce){.reference-world-tile{transition:none}}

/* ===================== Clean homepage (real text over artwork) ===================== */
.page-hero{background:linear-gradient(90deg,rgba(9,40,45,.90) 0%,rgba(9,40,45,.74) 48%,rgba(9,40,45,.38)),url('reference/hero-clean.webp') center 60% / cover no-repeat}
.home-clean{background:#fbf9f4}
.home-clean .home-header{position:absolute;top:0;left:0;right:0;background:linear-gradient(180deg,rgba(9,40,45,.55),rgba(9,40,45,0));border-bottom:0;z-index:20}
.home-clean .home-header .header-inner{min-height:84px}
.home-clean .home-header .brand-sub{color:#9fb2cc}
.home-clean .home-header .header-action{border-color:#c9a773;color:#fbf6ea;padding:11px 16px;letter-spacing:2.6px}
.home-clean .home-header .nav-links a{letter-spacing:2.6px;font-size:10.5px}
.home-hero{position:relative;height:clamp(460px,33.6vw,700px);background:#09282D url('reference/hero-clean.webp') center 55% / cover no-repeat;color:#f8f2e6;text-align:center}
.home-hero::after{content:'';position:absolute;inset:auto 0 0 0;height:30%;background:linear-gradient(180deg,rgba(9,40,45,0),rgba(9,40,45,.25))}
.home-hero-copy{position:absolute;left:50%;top:38%;transform:translateX(-50%);width:min(92%,900px);z-index:1}
.home-kicker{font:500 clamp(12px,1.12vw,16px)/1 var(--sans);letter-spacing:.38em;text-transform:uppercase;color:#f1ead9;margin:0 0 .55em}
.home-hero h1{font:500 clamp(38px,3.75vw,60px)/1.1 var(--serif);color:#fbf6ec;letter-spacing:.005em;margin:0;text-shadow:0 2px 24px rgba(0,0,0,.55)}
.home-tagline{font:italic 400 clamp(17px,1.62vw,26px)/1.3 var(--serif);color:#efe6d4;margin:.35em 0 0;text-shadow:0 2px 18px rgba(0,0,0,.6)}
.star-rule{display:flex;align-items:center;justify-content:center;gap:10px;color:#e9d3a3;font-size:12px;line-height:1}
.star-rule i{display:block;width:72px;height:1px;background:linear-gradient(90deg,rgba(201,167,115,0),rgba(201,167,115,.8))}
.star-rule i:last-child{transform:scaleX(-1)}
.home-hero .star-rule{margin-top:22px}
.home-worlds{background:#fbf9f4;padding:26px 0 24px}
.home-worlds-label{font:500 11px/1 var(--sans);letter-spacing:.34em;text-transform:uppercase;color:#2a2f3c;text-align:center;margin:0 0 26px}
.home-worlds-label span{margin:0 26px;color:#7d6a4c}
.world-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;width:min(calc(100% - 48px),1400px);margin:0 auto}
.world-tile{position:relative;aspect-ratio:422/569;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;text-align:center;padding:0 26px 24px;color:#f6efe2;background-color:#09282D;background-size:cover;background-position:center top;border:1px solid rgba(201,167,115,.28);overflow:hidden;isolation:isolate}
.world-tile::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(9,40,45,0) 44%,rgba(9,40,45,.35) 60%,rgba(9,40,45,.62) 100%)}
.t-celestial{background-image:url('reference/celestial-clean.webp')}
.t-terrestrial{background-image:url('reference/terrestrial-clean.webp')}
.t-within{background-image:url('reference/within-clean.webp')}
.world-tile .t-the{font:500 13px/1 var(--sans);letter-spacing:.32em;text-transform:uppercase;color:#f3ecdf;margin:0 0 4px}
.world-tile h3{font:500 clamp(30px,2.9vw,44px)/1.05 var(--serif);color:#fbf6ec;margin:0 0 14px;letter-spacing:.01em}
.world-tile .t-label{font:500 11px/1.3 var(--sans);letter-spacing:.3em;text-transform:uppercase;color:#e1bd84;margin:0 0 9px}
.world-tile .t-plain{color:#efe8db}
.world-tile .t-desc{font:400 14.5px/1.55 var(--sans);color:#f1ebe0;max-width:290px;margin:4px 0 22px}
.world-tile .star-rule{margin-bottom:24px}
.world-tile .star-rule i{width:68px}
.t-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:62%;padding:12px 24px;border:1px solid #c9a773;color:#f8f1e3;font:500 11px/1 var(--sans);letter-spacing:.26em;text-transform:uppercase;background:rgba(9,40,45,.25);transition:background .2s,color .2s}
.t-btn:hover,.t-btn:focus-visible{background:#c9a773;color:#09282D}
.home-clean .cosmic-footer{margin-top:0}
@media (max-width:1000px){
  .home-clean .home-header{position:sticky;background:#09282D;border-bottom:1px solid rgba(201,167,115,.27)}
  .home-hero{height:auto;min-height:440px;background-position:center 60%}
  .home-hero-copy{position:relative;left:auto;top:auto;transform:none;margin:0 auto;padding:130px 0 120px}
  .world-cards{grid-template-columns:1fr;max-width:460px;gap:14px}
}
@media (max-width:600px){
  .home-hero{min-height:520px;background-size:auto 100%;background-position:center}
  .home-hero-copy{padding:150px 0 140px}
  .home-kicker{letter-spacing:.26em}
  .home-worlds-label{letter-spacing:.2em;line-height:1.8}
  .home-worlds-label span{display:block;height:0;overflow:hidden;margin:0}
  .world-cards{width:calc(100% - 28px)}
  .world-tile{padding:0 20px 22px}
}
@media (prefers-reduced-motion:reduce){.t-btn{transition:none}}
/* align the card text like the reference: titles on one line across, divider + button at the bottom */
.world-tile{justify-content:flex-start;padding-top:72%}
.world-tile .star-rule{margin-top:auto}
.world-tile .t-desc{margin-bottom:18px}
@media (max-width:1000px){.world-tile{padding-top:min(72%,330px)}}
.world-tile{overflow:visible;height:auto}
@media (max-width:600px){.home-hero-copy{padding:205px 0 130px}}
.world-tile{aspect-ratio:auto}

/* Holiday tab (limited edition — remove with holiday.html) */
.cosmic-header .nav-links a.nav-holiday{color:#e1bd84}
.cosmic-header .nav-links a.nav-holiday:hover,.cosmic-header .nav-links a.nav-holiday[aria-current=page]{color:#f3d7a3;border-bottom-color:#dfbc80}
