/* Self-hosted fonts (SIL Open Font License; licences are in /fonts). Latin subset, variable weights. */
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 500 700; font-display: swap; src: url(/fonts/cormorant-garamond-latin.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Cormorant Garamond"; font-style: italic; font-weight: 500 600; font-display: swap; src: url(/fonts/cormorant-garamond-italic-latin.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 400 700; font-display: swap; src: url(/fonts/plus-jakarta-sans-latin.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
/* New Earth Entrepreneurs sales page. Body text 19px, every pair AA or better. */
:root {
  --night: #0B1A11;
  --deep: #14281C;
  --leaf: #3F7A56;
  --sprout: #8FD3A8;
  --gold: #E9C46A;
  --cream: #F7F3E8;
  --paper: #FFFDF7;
  --ink: #13201A;
  --soft-ink: #3E4F45;
  --mist: #C9D6C8;
  --line: rgba(19, 32, 26, 0.12);
  --serif: "Cormorant Garamond", "Times New Roman", Times, Georgia, serif;
  --sans: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --r: 22px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 19px;
  line-height: 1.65;
  overflow-x: hidden;
}
img, svg { max-width: 100%; }
a { color: inherit; }
h1, h2, h3 { font-family: var(--serif); font-weight: 700; line-height: 1.02; letter-spacing: -0.01em; margin: 0 0 18px; }
h2 { font-size: clamp(42px, 7vw, 76px); }
h3 { font-size: 28px; line-height: 1.15; }
p { margin: 0 0 18px; }
strong { font-weight: 700; }

.skip { position: absolute; left: -999px; top: 8px; background: var(--gold); color: var(--ink); padding: 10px 16px; border-radius: 10px; z-index: 100; }
.skip:focus { left: 8px; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; border-radius: 6px; }

.wrap { width: 100%; max-width: 1160px; margin: 0 auto; padding: 0 20px; position: relative; z-index: 2; }
.narrow { max-width: 780px; }
.center { text-align: center; }
.two { display: grid; gap: 48px; align-items: center; }
@media (min-width: 900px) { .two { grid-template-columns: 1fr 1fr; gap: 72px; } }

.sec { position: relative; padding: 110px 0; overflow: hidden; }
.light { background: var(--paper); }
.cream { background: var(--cream); }
.dark { background: var(--night); color: #F3F1E7; }
.dark p { color: var(--mist); }
.dark h2, .dark h3 { color: #FFFFFF; }
.gold { color: var(--gold) !important; }
.kicker { font-family: var(--sans); font-size: 18px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--leaf); margin-bottom: 14px; }
.big { font-size: clamp(21px, 2.6vw, 26px); line-height: 1.5; color: var(--soft-ink); }

/* Buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 52px; padding: 14px 26px; border-radius: 999px;
  font-family: var(--sans); font-weight: 700; font-size: 18px; line-height: 1.25; text-align: center; text-decoration: none;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.btn:hover { transform: translateY(-2px); }
.btn-gold { background: var(--gold); color: var(--ink); box-shadow: 0 0 0 0 rgba(233, 196, 106, .55), 0 14px 34px -12px rgba(233, 196, 106, .7); }
.btn-gold:hover { box-shadow: 0 0 0 6px rgba(233, 196, 106, .18), 0 18px 40px -12px rgba(233, 196, 106, .8); }
.btn-green { background: var(--leaf); color: #fff; box-shadow: 0 14px 34px -14px rgba(63, 122, 86, .8); }
.btn-big { min-height: 62px; padding: 18px 34px; font-size: 19px; }
.btn-small { min-height: 44px; padding: 10px 18px; font-size: 16px; background: var(--gold); color: var(--ink); }
.btn-full { width: 100%; }
.btn-big.btn-gold { animation: breathe 4.5s ease-in-out infinite; }
@keyframes breathe { 0%, 100% { box-shadow: 0 0 0 0 rgba(233,196,106,.45), 0 14px 34px -12px rgba(233,196,106,.7); } 50% { box-shadow: 0 0 0 12px rgba(233,196,106,0), 0 14px 34px -12px rgba(233,196,106,.7); } }

/* Nav */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 20px; color: #fff;
  transition: background .3s ease, backdrop-filter .3s ease, box-shadow .3s ease;
}
.nav.solid { background: rgba(11, 26, 17, .82); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 1px 0 rgba(255,255,255,.08); }
.brand { display: inline-flex; align-items: center; gap: 10px; font-family: var(--serif); font-size: 24px; font-weight: 700; text-decoration: none; color: #fff; }
.brand em { font-style: italic; font-weight: 500; color: var(--sprout); }
.brand-logo { width: 40px; height: 40px; filter: drop-shadow(0 0 10px rgba(143, 211, 168, .35)); }
@media (max-width: 520px) { .brand span:last-child { font-size: 21px; } .nav .btn-small { display: none; } }

/* Aurora + grain */
.grain { position: absolute; inset: 0; z-index: 1; pointer-events: none; opacity: .09; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.aurora { position: absolute; inset: -20%; z-index: 0; pointer-events: none; }
.aurora.soft { opacity: .55; }
.blob { position: absolute; border-radius: 50%; opacity: .7; will-change: transform; }
.b1 { width: 55vw; height: 55vw; max-width: 760px; max-height: 760px; left: 5%; top: 10%; background: radial-gradient(circle, #2F8A5B, transparent 65%); animation: drift1 18s ease-in-out infinite alternate; }
.b2 { width: 45vw; height: 45vw; max-width: 620px; max-height: 620px; right: 0; top: 25%; background: radial-gradient(circle, rgba(233,196,106,.75), transparent 65%); animation: drift2 22s ease-in-out infinite alternate; }
.b3 { width: 50vw; height: 50vw; max-width: 680px; max-height: 680px; left: 35%; bottom: 0; background: radial-gradient(circle, #1F6F7A, transparent 65%); animation: drift3 26s ease-in-out infinite alternate; }
@keyframes drift1 { to { transform: translate(18%, 12%) scale(1.15); } }
@keyframes drift2 { to { transform: translate(-22%, 10%) scale(.9); } }
@keyframes drift3 { to { transform: translate(-15%, -18%) scale(1.2); } }

/* Hero */
.hero {
  position: relative; min-height: 100svh; overflow: hidden;
  display: grid; align-items: center;
  background: radial-gradient(120% 90% at 50% 0%, #133522 0%, var(--night) 60%);
  color: #fff; padding: 120px 0 90px;
}
.hero-inner { pointer-events: none; position: relative; z-index: 3; width: 100%; max-width: 1160px; margin: 0 auto; padding: 0 20px; }
.eyebrow {
  display: flex; align-items: center; gap: 16px; margin: 0 0 26px; max-width: 46ch;
  font-family: var(--serif); font-style: italic; font-weight: 600; font-size: clamp(22px, 2.5vw, 30px); line-height: 1.2; letter-spacing: .02em;
  color: var(--gold); text-shadow: 0 0 26px rgba(233, 196, 106, .5);
}
.eyebrow::before, .eyebrow::after { content: ""; flex: none; width: 44px; height: 1px; background: linear-gradient(90deg, transparent, var(--gold)); }
.eyebrow::after { background: linear-gradient(270deg, transparent, var(--gold)); }
@media (max-width: 560px) { .eyebrow::before { width: 22px; } .eyebrow::after { display: none; } }
.hero-title { font-size: clamp(52px, 9.4vw, 124px); line-height: .92; letter-spacing: -0.015em; margin: 0 0 28px; max-width: 13ch; }
.hero-title .line { display: block; }
.hero-title .line + .line { margin-top: .22em; font-size: .62em; line-height: 1.05; max-width: 19ch; font-weight: 600; }
.glow { background: linear-gradient(100deg, #FFFFFF 0%, var(--sprout) 35%, var(--gold) 70%, #FFFFFF 100%); background-size: 220% auto; -webkit-background-clip: text; background-clip: text; color: transparent; animation: shimmer 9s linear infinite; }
@keyframes shimmer { to { background-position: -220% center; } }
.strike { position: relative; white-space: nowrap; color: rgba(255,255,255,.92); }
.strike::after { content: ""; position: absolute; left: -2%; right: -2%; top: 54%; height: .09em; background: var(--gold); border-radius: 4px; transform-origin: left; transform: scaleX(0); animation: strike 1s .9s cubic-bezier(.7,0,.2,1) forwards; }
@keyframes strike { to { transform: scaleX(1); } }
.hero-sub { font-size: clamp(20px, 2.3vw, 24px); line-height: 1.55; color: #DCE6DA; max-width: 36ch; margin-bottom: 22px; }
.nos { list-style: none; display: flex; flex-wrap: wrap; gap: 10px; padding: 0; margin: 0 0 34px; }
.nos li { padding: 8px 14px 8px 34px; border-radius: 999px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); color: #F0F4EE; font-size: 16px; position: relative; }
.nos li::before { content: "✕"; position: absolute; left: 13px; color: var(--gold); font-weight: 700; }
.hero-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 26px; }
.link-soft { color: var(--sprout); font-weight: 600; text-decoration: none; border-bottom: 1px solid rgba(143,211,168,.5); padding-bottom: 2px; }

/* Space: the Core Offer as a sun, the offer ecosystem as planets joined by strings, a rocket and a UFO.
   Every motion is transform or opacity only, so phones keep it smooth. Labels stay level. */
.stars { position: absolute; left: 0; top: 0; width: 1px; height: 1px; z-index: 1; box-shadow: 663px 970px 0 0 rgba(255,255,255,.35),1333px 49px 0 0 rgba(255,255,255,.9),748px 596px 0 0 rgba(255,255,255,.7),76px 88px 0 0 rgba(255,255,255,.35),143px 246px 0 0 rgba(255,255,255,.35),121px 846px 0 1px rgba(255,255,255,.9),457px 645px 0 1px rgba(255,255,255,.9),1181px 599px 0 0 rgba(255,255,255,.9),452px 47px 0 1px rgba(255,255,255,.7),593px 429px 0 0 rgba(255,255,255,.9),1169px 315px 0 1px rgba(255,255,255,.7),211px 595px 0 1px rgba(255,255,255,.7),762px 99px 0 1px rgba(255,255,255,.9),1155px 61px 0 1px rgba(255,255,255,.7),1016px 696px 0 1px rgba(255,255,255,.35),1591px 321px 0 0 rgba(255,255,255,.35),740px 306px 0 0 rgba(255,255,255,.7),1431px 798px 0 0 rgba(255,255,255,.9),1176px 307px 0 1px rgba(255,255,255,.35),703px 746px 0 0 rgba(255,255,255,.5),1247px 74px 0 0 rgba(255,255,255,.35),337px 775px 0 0 rgba(255,255,255,.7),1001px 431px 0 0 rgba(255,255,255,.9),1565px 571px 0 1px rgba(255,255,255,.5),696px 711px 0 0 rgba(255,255,255,.35),1187px 816px 0 0 rgba(255,255,255,.9),191px 967px 0 0 rgba(255,255,255,.35),1427px 680px 0 0 rgba(255,255,255,.9),1497px 718px 0 0 rgba(255,255,255,.35),582px 733px 0 0 rgba(255,255,255,.5),46px 963px 0 0 rgba(255,255,255,.5),344px 625px 0 0 rgba(255,255,255,.35),120px 223px 0 0 rgba(255,255,255,.7),1512px 253px 0 0 rgba(255,255,255,.35),1016px 82px 0 0 rgba(255,255,255,.35),822px 562px 0 0 rgba(255,255,255,.7),881px 884px 0 1px rgba(255,255,255,.5),1446px 425px 0 0 rgba(255,255,255,.35),472px 154px 0 0 rgba(255,255,255,.7),309px 237px 0 1px rgba(255,255,255,.7),24px 496px 0 1px rgba(255,255,255,.7),538px 288px 0 0 rgba(255,255,255,.7),858px 547px 0 0 rgba(255,255,255,.5),257px 707px 0 1px rgba(255,255,255,.9),935px 921px 0 1px rgba(255,255,255,.35),815px 408px 0 0 rgba(255,255,255,.9),986px 649px 0 0 rgba(255,255,255,.9),390px 68px 0 0 rgba(255,255,255,.35),332px 112px 0 0 rgba(255,255,255,.9),209px 0px 0 1px rgba(255,255,255,.7),1098px 103px 0 0 rgba(255,255,255,.9),144px 895px 0 0 rgba(255,255,255,.35),304px 649px 0 0 rgba(255,255,255,.5),1233px 372px 0 0 rgba(255,255,255,.9),236px 869px 0 0 rgba(255,255,255,.35),983px 495px 0 0 rgba(255,255,255,.9),295px 104px 0 1px rgba(255,255,255,.5),1516px 271px 0 0 rgba(255,255,255,.7),1057px 23px 0 0 rgba(255,255,255,.5),300px 706px 0 1px rgba(255,255,255,.9),1552px 540px 0 0 rgba(255,255,255,.9),1425px 865px 0 0 rgba(255,255,255,.5),342px 364px 0 0 rgba(255,255,255,.5),1303px 228px 0 1px rgba(255,255,255,.7),490px 837px 0 0 rgba(255,255,255,.7),409px 530px 0 0 rgba(255,255,255,.5),1497px 29px 0 0 rgba(255,255,255,.5),967px 265px 0 0 rgba(255,255,255,.5),915px 827px 0 1px rgba(255,255,255,.5),746px 82px 0 0 rgba(255,255,255,.9); animation: twinkle 5s ease-in-out infinite; }
.stars.s2 { box-shadow: 464px 481px 0 0 rgba(255,255,255,.5),418px 494px 0 1px rgba(255,255,255,.9),981px 931px 0 1px rgba(255,255,255,.5),1317px 86px 0 1px rgba(255,255,255,.9),795px 801px 0 1px rgba(255,255,255,.7),979px 910px 0 0 rgba(255,255,255,.35),1302px 340px 0 0 rgba(255,255,255,.35),948px 411px 0 1px rgba(255,255,255,.9),1484px 162px 0 0 rgba(255,255,255,.7),56px 154px 0 1px rgba(255,255,255,.35),1343px 149px 0 1px rgba(255,255,255,.35),1346px 959px 0 0 rgba(255,255,255,.7),1123px 561px 0 0 rgba(255,255,255,.9),29px 818px 0 1px rgba(255,255,255,.9),1078px 767px 0 0 rgba(255,255,255,.35),398px 845px 0 0 rgba(255,255,255,.9),515px 217px 0 0 rgba(255,255,255,.7),1564px 600px 0 0 rgba(255,255,255,.5),1114px 429px 0 0 rgba(255,255,255,.9),1515px 362px 0 0 rgba(255,255,255,.35),1027px 133px 0 1px rgba(255,255,255,.7),1072px 522px 0 0 rgba(255,255,255,.35),1590px 187px 0 1px rgba(255,255,255,.9),1589px 818px 0 0 rgba(255,255,255,.7),289px 484px 0 1px rgba(255,255,255,.9),1139px 63px 0 0 rgba(255,255,255,.35),1590px 108px 0 1px rgba(255,255,255,.9),508px 195px 0 0 rgba(255,255,255,.9),1581px 100px 0 1px rgba(255,255,255,.35),1150px 28px 0 0 rgba(255,255,255,.35),666px 627px 0 1px rgba(255,255,255,.7),1418px 283px 0 0 rgba(255,255,255,.35),1039px 964px 0 0 rgba(255,255,255,.5),1145px 914px 0 0 rgba(255,255,255,.35),280px 426px 0 0 rgba(255,255,255,.35),905px 323px 0 0 rgba(255,255,255,.7),877px 74px 0 0 rgba(255,255,255,.5),250px 918px 0 0 rgba(255,255,255,.5),292px 259px 0 0 rgba(255,255,255,.35),449px 764px 0 0 rgba(255,255,255,.35),997px 166px 0 1px rgba(255,255,255,.7),330px 723px 0 0 rgba(255,255,255,.35),694px 431px 0 0 rgba(255,255,255,.5),652px 94px 0 1px rgba(255,255,255,.5),39px 346px 0 1px rgba(255,255,255,.35),902px 720px 0 0 rgba(255,255,255,.35),678px 529px 0 1px rgba(255,255,255,.5),1049px 983px 0 0 rgba(255,255,255,.9),468px 995px 0 0 rgba(255,255,255,.9),543px 278px 0 0 rgba(255,255,255,.7); animation-delay: -2.5s; }
@keyframes twinkle { 50% { opacity: .35; } }
.hero > .stars { position: absolute; }
.space { --size: 560px; position: absolute; z-index: 2; right: 3%; top: 50%; width: var(--size); height: var(--size); margin-top: calc(var(--size) / -2); }
.space .stars { left: calc(-50vw + 50%); top: -200px; pointer-events: none; }
.web { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.web ellipse { fill: none; stroke: rgba(143,211,168,.16); stroke-width: 1; }
.web line { stroke: rgba(233,196,106,.5); stroke-width: 1.3; stroke-dasharray: 3 7; stroke-linecap: round; animation: flow 3s linear infinite; }
.web polygon { fill: none; stroke: rgba(143,211,168,.45); stroke-width: 1.3; }
@keyframes flow { to { stroke-dashoffset: -20; } }
.sun { position: absolute; z-index: 5; left: 50%; top: 50%; width: calc(var(--size) * .25); aspect-ratio: 1; translate: -50% -50%; border-radius: 50%; display: grid; place-items: center; text-align: center; pointer-events: none;
  background: radial-gradient(circle at 35% 30%, #FFF4CF 0%, #F3D88E 25%, #E9C46A 55%, #B9862F 100%);
  box-shadow: 0 0 0 10px rgba(233,196,106,.12), 0 0 60px 18px rgba(233,196,106,.45), 0 0 140px 40px rgba(233,196,106,.18); }
.sun::before { content: ""; position: absolute; inset: -22%; border-radius: 50%; background: conic-gradient(from 0deg, transparent, rgba(255,236,170,.35), transparent 30%, rgba(255,236,170,.25), transparent 60%, rgba(255,236,170,.35), transparent 85%); animation: spin 30s linear infinite; z-index: -1; }
.sun span { font-family: var(--serif); font-weight: 700; font-style: italic; font-size: calc(var(--size) * .052); line-height: .95; color: #13201A; }
.pl { position: absolute; left: 50%; top: 50%; display: grid; justify-items: center; gap: 5px; padding: 6px; border: 0; background: none; cursor: pointer; color: inherit; font: inherit; will-change: transform; -webkit-tap-highlight-color: transparent; }
.ball { display: block; width: var(--d); aspect-ratio: 1; border-radius: 50%; position: relative; transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s;
  background: radial-gradient(circle at 32% 28%, #fff 0%, var(--c1) 22%, var(--c2) 78%, #08130C 100%);
  box-shadow: 0 0 18px color-mix(in srgb, var(--c1) 50%, transparent), inset -5px -7px 12px rgba(0,0,0,.45); }
.pl:hover .ball, .pl.on .ball { transform: scale(1.25); box-shadow: 0 0 0 4px rgba(233,196,106,.5), 0 0 30px var(--c1), inset -5px -7px 12px rgba(0,0,0,.45); }
.ringed .ball::after { content: ""; position: absolute; left: -45%; right: -45%; top: 41%; height: 18%; border-radius: 50%; border: 2px solid rgba(233,196,106,.85); transform: rotate(-18deg); }
.banded .ball { background: radial-gradient(circle at 32% 28%, rgba(255,255,255,.9) 0%, transparent 30%), repeating-linear-gradient(170deg, var(--c1) 0 7px, var(--c2) 7px 12px, var(--c1) 12px 16px), var(--c2); }
.pl b { white-space: nowrap; padding: 3px 10px; border-radius: 999px; background: rgba(11,26,17,.85); border: 1px solid rgba(143,211,168,.45); color: #EEF6EF; font: 600 14px var(--sans); }
.pl.on b { background: var(--gold); color: var(--ink); border-color: var(--gold); }
.rocket, .ufo { position: absolute; left: 50%; top: 50%; z-index: 7; padding: 6px; border: 0; background: none; cursor: pointer; will-change: transform; -webkit-tap-highlight-color: transparent; }
.rocket svg { display: block; width: calc(var(--size) * .055); min-width: 24px; transition: transform .2s; }
.rocket.dizzy svg { animation: dizzy 1.4s cubic-bezier(.3,.1,.3,1); }
@keyframes dizzy { 30% { transform: rotate(540deg) scale(1.3); } 60% { transform: rotate(700deg) scale(.9); } 80% { transform: rotate(690deg); } 100% { transform: rotate(720deg); } }
.flame { transform-origin: 20px 44px; animation: flame .18s ease-in-out infinite alternate; }
.rocket.boost .flame { animation-duration: .06s; transform: scaleY(1.8); }
@keyframes flame { to { transform: scaleY(.6); } }
.ufo svg { position: relative; display: block; width: calc(var(--size) * .14); min-width: 54px; }
.ufo .lt { animation: blink 1.2s steps(2) infinite; } .ufo .lt:nth-of-type(2) { animation-delay: .4s; }
@keyframes blink { 50% { opacity: .2; } }
.ufo.wave .alien { animation: wave .6s ease-in-out 3; transform-origin: 40px 30px; }
@keyframes wave { 25% { transform: rotate(-14deg); } 75% { transform: rotate(14deg); } }
.beam { position: absolute; left: 50%; top: 70%; width: 70%; height: 0; translate: -50% 0; clip-path: polygon(30% 0, 70% 0, 100% 100%, 0 100%); background: linear-gradient(rgba(233,196,106,.75), rgba(233,196,106,0)); transition: height .35s ease; pointer-events: none; }
.ufo.beaming .beam { height: 140%; }
.bubble { position: absolute; z-index: 9; left: 0; top: 0; width: max-content; max-width: 230px; padding: 10px 14px; border-radius: 16px; background: #fff; color: var(--ink); font: 700 15px/1.3 var(--sans); box-shadow: 0 12px 30px -10px rgba(0,0,0,.6); opacity: 0; transform: translate(-50%, -100%) scale(.6); transition: opacity .25s, transform .3s cubic-bezier(.2,1.4,.4,1); pointer-events: none; }
.bubble.show { opacity: 1; transform: translate(-50%, calc(-100% - 12px)) scale(1); }
.bubble::after { content: ""; position: absolute; left: 50%; bottom: -7px; width: 14px; height: 14px; background: #fff; transform: translateX(-50%) rotate(45deg); }
.pl-card { position: absolute; z-index: 8; left: 50%; bottom: -14px; translate: -50% 0; width: min(360px, 92%); padding: 14px 18px; border-radius: 18px; text-align: center; display: grid; gap: 2px;
  background: rgba(11,26,17,.86); border: 1px solid rgba(233,196,106,.4); box-shadow: 0 18px 40px -20px rgba(0,0,0,.8); }
.pl-card strong { font-family: var(--serif); font-size: 24px; color: var(--gold); line-height: 1.1; }
.pl-card span { font-size: 16px; line-height: 1.4; color: #E3ECE1; }
.pl-card.pop { animation: pop .35s cubic-bezier(.2,1.4,.4,1); }
@keyframes pop { from { transform: scale(.92); opacity: .4; } }
@keyframes spin { to { transform: rotate(360deg); } }
@media (max-width: 1360px) { .space { --size: 500px; right: 0; } }
@media (max-width: 1180px) {
  .hero { padding-bottom: 40px; }
  .space { --size: 470px; position: relative; right: auto; top: auto; margin: 50px auto 120px; opacity: 1; }
  .pl-card { bottom: -96px; }
  .space .stars { top: -500px; }
}
@media (max-width: 720px) {
  .hero { padding-bottom: 30px; }
  .space { --size: 350px; position: relative; right: auto; top: auto; margin: 40px auto 110px; opacity: 1; }
  .pl b { font-size: 12px; padding: 2px 8px; }
  .pl-card { bottom: -96px; }
  .space .stars { top: -500px; }
}
@media (max-width: 370px) { .space { --size: 310px; } }

/* Marquee */
.marquee { background: var(--gold); color: var(--ink); overflow: hidden; padding: 18px 0; border-block: 1px solid rgba(0,0,0,.1); }
.track { display: flex; width: max-content; gap: 28px; align-items: center; animation: slide 32s linear infinite; font-family: var(--serif); font-size: clamp(24px, 3.4vw, 38px); font-weight: 600; font-style: italic; }
.track i { font-style: normal; font-size: .6em; color: var(--deep); }
@keyframes slide { to { transform: translateX(-50%); } }

/* Aha */
.aha { position: relative; overflow: hidden; padding: 120px 0; background: linear-gradient(135deg, var(--deep), #0E2F24 60%, #12352A); }
.aha blockquote { margin: 0 auto; }
.aha p { font-family: var(--serif); font-size: clamp(32px, 5vw, 58px); line-height: 1.15; color: #fff; font-weight: 500; letter-spacing: -0.015em; margin: 0; }
.hl { color: var(--ink); background: linear-gradient(transparent 8%, var(--gold) 8%, var(--gold) 92%, transparent 92%); padding: 0 .12em; -webkit-box-decoration-break: clone; box-decoration-break: clone; background-size: 0% 100%; background-repeat: no-repeat; transition: background-size 1.2s cubic-bezier(.7,0,.2,1) .3s; }
.in .hl, .hl.in { background-size: 100% 100%; }
.aha .reveal.in .hl { background-size: 100% 100%; }

/* Switch */
.switch { position: relative; display: inline-grid; grid-template-columns: 1fr 1fr; padding: 6px; border-radius: 999px; background: var(--cream); border: 1px solid var(--line); margin: 6px 0 34px; }
.sw-btn { position: relative; z-index: 2; border: 0; background: none; cursor: pointer; padding: 12px 22px; min-height: 48px; border-radius: 999px; font: 700 17px/1.2 var(--sans); color: var(--soft-ink); transition: color .3s; }
.sw-btn.on { color: #fff; }
.sw-pill { position: absolute; z-index: 1; top: 6px; bottom: 6px; left: 6px; width: calc(50% - 6px); border-radius: 999px; background: var(--leaf); transition: transform .45s cubic-bezier(.7,0,.2,1), background .3s; transform: translateX(100%); }
.switch[data-show="old"] .sw-pill { transform: translateX(0); background: #5B4A3A; }
.ways { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; counter-reset: w; }
.ways li { position: relative; display: grid; padding: 24px 26px 24px 78px; border-radius: var(--r); background: #fff; border: 1px solid var(--line); box-shadow: 0 10px 30px -22px rgba(19,32,26,.35); min-height: 88px; align-items: center; counter-increment: w; overflow: hidden; }
.ways li::before { content: "0" counter(w); position: absolute; left: 24px; top: 50%; transform: translateY(-50%); font-family: var(--serif); font-size: 28px; font-weight: 700; color: var(--leaf); }
.ways .old, .ways .new { grid-area: 1 / 1; font-size: 21px; line-height: 1.4; transition: opacity .45s ease, transform .45s ease; }
.ways[data-show="new"] .old { opacity: 0; transform: translateY(-14px); }
.ways[data-show="new"] .new { opacity: 1; transform: none; font-weight: 600; }
.ways[data-show="old"] .new { opacity: 0; transform: translateY(14px); }
.ways[data-show="old"] .old { opacity: 1; transform: none; color: #5B4A3A; text-decoration: line-through; text-decoration-color: rgba(91,74,58,.45); }
.ways[data-show="old"] li::before { color: #8A6E55; }
.ways[data-show="old"] li { background: #F3EEE6; }
.ways li:nth-child(2) span { transition-delay: .05s; } .ways li:nth-child(3) span { transition-delay: .1s; } .ways li:nth-child(4) span { transition-delay: .15s; } .ways li:nth-child(5) span { transition-delay: .2s; }

/* Wheel */
.wheel-box { position: relative; max-width: 520px; margin: 0 auto; width: 100%; }
.wheel { width: 100%; height: auto; display: block; overflow: visible; }
.petal { cursor: pointer; transition: transform .4s cubic-bezier(.2,.8,.2,1), opacity .3s; transform-origin: 0 0; outline: none; }
.petal path { fill: rgba(143, 211, 168, .14); stroke: rgba(143, 211, 168, .55); stroke-width: 1.2; transition: fill .3s, stroke .3s; }
.petal text { fill: #E8F3EA; font: 600 12.5px var(--sans); text-anchor: middle; dominant-baseline: middle; pointer-events: none; }
.petal:hover path, .petal:focus-visible path { fill: rgba(143, 211, 168, .3); }
.petal.on path { fill: var(--gold); stroke: var(--gold); }
.petal.on text { fill: var(--ink); }
.hub { fill: var(--deep); stroke: rgba(233,196,106,.6); stroke-width: 1.5; }
.wheel-text { position: absolute; left: 50%; top: 0; width: 34%; aspect-ratio: 1; transform: translate(-50%, 0); margin-top: calc(50% - 17%); display: grid; place-items: center; text-align: center; pointer-events: none; }
.wheel-text strong { font-family: var(--serif); color: var(--gold); font-size: clamp(17px, 3.2vw, 24px); line-height: 1.1; }
.wheel-caption { min-height: 2.8em; margin: 18px auto 0; max-width: 30ch; text-align: center; font-size: 20px; color: #F3F1E7 !important; }
.wheel-keys { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 22px; }
.wheel-keys button { border: 1px solid rgba(143,211,168,.45); background: rgba(255,255,255,.04); color: #E8F3EA; border-radius: 999px; padding: 10px 16px; min-height: 44px; font: 600 16px var(--sans); cursor: pointer; }
.wheel-keys button[aria-pressed="true"] { background: var(--gold); color: var(--ink); border-color: var(--gold); }

/* How we work: glass tiles with glowing edges, an icon each, and a light that follows the pointer */
.deep { background: radial-gradient(90% 70% at 80% 0%, #1B3A28 0%, var(--deep) 55%, #0E1F15 100%); color: #F3F1E7; }
.deep h2 { color: #fff; }
.bento { display: grid; gap: 16px; grid-template-columns: 1fr; }
@media (min-width: 720px) { .bento { grid-template-columns: repeat(3, 1fr); } .t-wide { grid-column: span 2; } }
.tile { --bg: #12261A; position: relative; overflow: hidden; border-radius: var(--r); padding: 28px 26px 28px; min-height: 200px;
  display: flex; flex-direction: column; justify-content: flex-end; gap: 4px;
  border: 1px solid transparent;
  background: linear-gradient(var(--bg), var(--bg)) padding-box, linear-gradient(140deg, rgba(143,211,168,.65), rgba(233,196,106,.08) 45%, rgba(143,211,168,.35)) border-box;
  box-shadow: 0 20px 40px -30px rgba(0,0,0,.8);
  transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease; }
.tile::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .3s;
  background: radial-gradient(280px circle at var(--mx, 50%) var(--my, 0%), rgba(233,196,106,.18), transparent 60%); }
.tile:hover { transform: translateY(-5px); box-shadow: 0 30px 50px -30px rgba(0,0,0,.9), 0 0 0 1px rgba(233,196,106,.35); }
.tile:hover::before { opacity: 1; }
.tile h3 { position: relative; margin: 0; font-size: clamp(28px, 3vw, 34px); color: #fff; }
.tile p { position: relative; margin: 0; color: var(--mist); }
.tile .n { position: absolute; top: 24px; right: 24px; font: 700 15px var(--sans); letter-spacing: .12em; color: rgba(233,196,106,.85); }
.tile .ico { position: relative; width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; margin-bottom: auto;
  background: radial-gradient(circle at 30% 25%, rgba(143,211,168,.35), rgba(143,211,168,.08)); border: 1px solid rgba(143,211,168,.4); }
.tile .ico svg { width: 26px; height: 26px; fill: none; stroke: var(--sprout); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.tile .ico + .n + h3 { margin-top: 26px; }
.t-dark { --bg: #0A1710; }
.t-green { --bg: #2F6446; background: linear-gradient(150deg, #3F7A56, #24503A) padding-box, linear-gradient(140deg, rgba(255,255,255,.5), rgba(255,255,255,.05)) border-box; }
.t-green .ico { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.35); } .t-green .ico svg { stroke: #fff; } .t-green .n { color: #fff; }
.t-gold { --bg: #E9C46A; background: linear-gradient(120deg, #E9C46A, #F3D88E 50%, #E2B653) padding-box, linear-gradient(140deg, #FFF2C6, #C99A3A) border-box; }
.t-gold::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.55) 50%, transparent 65%); transform: translateX(-100%); animation: shine 5s ease-in-out infinite; }
@keyframes shine { 60%, 100% { transform: translateX(100%); } }
.t-gold h3 { color: var(--ink); font-size: clamp(44px, 6vw, 72px); font-style: italic; } .t-gold .n { color: var(--ink); }
.t-gold .ico { background: rgba(19,32,26,.08); border-color: rgba(19,32,26,.25); } .t-gold .ico svg { stroke: var(--ink); }
.t-gold::before { background: radial-gradient(280px circle at var(--mx, 50%) var(--my, 0%), rgba(255,255,255,.35), transparent 60%); }

/* Journey */
.journey { list-style: none; padding: 0 0 0 38px; margin: 40px 0 46px; position: relative; }
.journey::before { content: ""; position: absolute; left: 11px; top: 8px; bottom: 8px; width: 3px; border-radius: 3px; background: rgba(63,122,86,.2); }
.journey::after { content: ""; position: absolute; left: 11px; top: 8px; width: 3px; border-radius: 3px; height: var(--fill, 0%); background: linear-gradient(var(--leaf), var(--gold)); transition: height .2s linear; }
.journey li { position: relative; padding: 0 0 34px 18px; }
.journey li::before { content: ""; position: absolute; left: -34px; top: 6px; width: 19px; height: 19px; border-radius: 50%; background: var(--paper); border: 3px solid var(--leaf); z-index: 1; transition: background .3s, box-shadow .3s; }
.journey li.in::before { background: var(--gold); border-color: var(--gold); box-shadow: 0 0 0 6px rgba(233,196,106,.25); }
.journey .when { display: inline-block; font: 700 14px var(--sans); letter-spacing: .1em; text-transform: uppercase; color: #2F6446; background: rgba(63,122,86,.12); padding: 4px 10px; border-radius: 999px; margin-bottom: 8px; }
.journey h3 { margin: 0 0 6px; font-size: clamp(24px, 2.8vw, 30px); }
.journey p { margin: 0; color: var(--soft-ink); }

/* Guide */
.guide-orb { width: min(360px, 78vw); aspect-ratio: 1; margin: 0 auto; border-radius: 50%; display: grid; place-items: center; position: relative;
  background: radial-gradient(circle, rgba(143,211,168,.16), transparent 68%); }
.guide-orb::before { content: ""; position: absolute; inset: -16px; border-radius: 50%; border: 1px dashed rgba(233,196,106,.45); animation: spin 50s linear infinite; }
.guide-orb img { width: 82%; height: auto; filter: drop-shadow(0 18px 40px rgba(0,0,0,.5)); }

/* Stats */
.stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 36px; }
.stats div { border: 1px solid transparent; border-radius: var(--r); padding: 26px 12px; display: grid; gap: 6px; background: linear-gradient(var(--cream), var(--cream)) padding-box, linear-gradient(140deg, var(--leaf), rgba(233,196,106,.9), var(--leaf)) border-box; box-shadow: 0 18px 34px -26px rgba(19,32,26,.5); }
.stats b { font-family: var(--serif); font-size: clamp(22px, 4vw, 40px); color: var(--leaf); line-height: 1.05; overflow-wrap: anywhere; }
.stats span { font-size: 16px; color: var(--soft-ink); }
@media (max-width: 520px) { .stats { grid-template-columns: 1fr; } }

/* Price card */
.price-card { position: relative; z-index: 2; background: rgba(255,255,255,.06); border: 1px solid rgba(233,196,106,.35); border-radius: 30px; padding: 46px 30px 34px; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); box-shadow: 0 40px 80px -40px rgba(0,0,0,.7); }
.price-card h2 { font-size: clamp(34px, 5vw, 52px); margin-bottom: 6px; }
.price { font-family: var(--serif); font-size: clamp(48px, 8vw, 76px); font-weight: 700; color: var(--gold) !important; margin: 0 0 22px; line-height: 1; }
.checks { list-style: none; padding: 0; margin: 0 0 30px; display: grid; gap: 10px; }
@media (min-width: 640px) { .checks { grid-template-columns: 1fr 1fr; } }
.checks li { position: relative; padding-left: 34px; color: #F3F1E7; }
.light .checks li, .cream .checks li { color: var(--ink); }
.checks li::before { content: "✓"; position: absolute; left: 0; top: 1px; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: var(--leaf); color: #fff; font-size: 14px; font-weight: 700; }
.promise { margin-top: 30px; padding-top: 26px; border-top: 1px solid rgba(255,255,255,.14); }
.promise h3 { color: var(--gold) !important; font-style: italic; }
.honest { font-size: 18px; }
.honest strong { color: #fff; }
.seal { position: absolute; top: -48px; right: 18px; width: 108px; height: 108px; display: grid; place-items: center; border-radius: 50%; background: var(--gold); color: var(--ink); box-shadow: 0 14px 30px -10px rgba(0,0,0,.6); }
.seal svg { position: absolute; inset: 0; width: 100%; height: 100%; animation: spin 24s linear infinite; }
.seal text { font: 700 10px var(--sans); fill: var(--ink); }
.seal > span { font-size: 26px; }

/* FAQ */
.faq { display: grid; gap: 12px; margin-top: 10px; }
.faq details { border-radius: 18px; background: var(--cream); border: 1px solid var(--line); overflow: hidden; }
.faq summary { list-style: none; cursor: pointer; padding: 22px 60px 22px 24px; font-family: var(--serif); font-weight: 600; font-size: 22px; line-height: 1.3; position: relative; min-height: 44px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 22px; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--leaf); color: #fff; font: 600 22px/1 var(--sans); transition: transform .3s; }
.faq details[open] summary::after { transform: translateY(-50%) rotate(45deg); background: var(--gold); color: var(--ink); }
.faq details p { padding: 0 24px 22px; margin: 0; color: var(--soft-ink); }

/* Final */
.final { position: relative; overflow: hidden; padding: clamp(330px, 34vw, 480px) 0 130px; color: #fff;
  background: linear-gradient(180deg, rgba(11,26,17,.55) 0%, rgba(11,26,17,.25) 22%, rgba(11,26,17,.72) 42%, rgba(11,26,17,.94) 100%), url("/img/nee-sky-1640.jpg") center top / cover no-repeat, var(--night); }
@media (max-width: 720px) { .final { background: linear-gradient(180deg, rgba(11,26,17,.4) 0%, rgba(11,26,17,.2) 25%, rgba(11,26,17,.85) 42%, rgba(11,26,17,.96) 100%), url("/img/nee-sky-900.jpg") 68% top / auto 560px no-repeat, var(--night); } }
.final .big, .final h2 { text-shadow: 0 2px 18px rgba(0,0,0,.6); }
.final h2 { color: #fff; font-size: clamp(42px, 7vw, 84px); }
.final .big { color: #DCE6DA; margin-bottom: 36px; }
.ps { margin-top: 40px; color: var(--mist); font-size: 18px; }
.ps strong { color: var(--gold); }

/* Footer */
.foot { background: #07120B; color: #B8C6B9; text-align: center; padding: 44px 20px 120px; font-size: 16px; }
.foot p { margin: 0 0 10px; }
.foot-tag { font-family: var(--serif); font-style: italic; font-size: 22px; color: var(--gold); margin-bottom: 18px !important; }
.foot-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 20px; }
.foot-links a { color: #E2EBE1; text-decoration: underline; text-underline-offset: 3px; padding: 10px 2px; }
@media (min-width: 900px) { .foot { padding-bottom: 50px; } }

/* Dock (phones) */
.dock { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 60; transform: translateY(140%); transition: transform .45s cubic-bezier(.2,.8,.2,1); }
.dock.show { transform: none; }
.dock .btn { box-shadow: 0 16px 40px -10px rgba(0,0,0,.6); }
@media (min-width: 900px) { .dock { display: none; } }

/* Speed on phones: still light instead of moving blobs, no grain overlay */
@media (max-width: 720px), (pointer: coarse) {
  .blob { animation: none; }
  .grain { display: none; }
  .btn-big.btn-gold { animation: none; }
}
.paused, .paused * { animation-play-state: paused !important; }

/* Reveal */
.js .reveal { opacity: 0; transform: translateY(28px); transition: opacity .9s cubic-bezier(.2,.8,.2,1), transform .9s cubic-bezier(.2,.8,.2,1); }
.js .reveal.in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .js .reveal { opacity: 1; transform: none; }
  .strike::after { transform: scaleX(1); }
  .hl { background-size: 100% 100%; }
}

/* The hero text sits over the offer ecosystem, so only its links and buttons catch clicks: every planet stays tappable */
.hero-inner a, .hero-inner button { pointer-events: auto; }
.pl, .rocket, .ufo { min-width: 44px; min-height: 44px; }
.pl:focus-visible, .rocket:focus-visible, .ufo:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; border-radius: 14px; }

/* Flower of Life behind the planets, radiating from the Core Offer. Decoration only: it never catches a click. */
.fol { -webkit-mask-image: radial-gradient(circle closest-side, #000 25%, rgba(0,0,0,.45) 70%, transparent 100%); mask-image: radial-gradient(circle closest-side, #000 25%, rgba(0,0,0,.45) 70%, transparent 100%); position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; animation: folGlow 9s ease-in-out infinite; }
.fol circle { fill: none; stroke: rgba(233,196,106,.55); stroke-width: 1.4; vector-effect: non-scaling-stroke; }
.fol circle:nth-child(3n) { stroke: rgba(143,211,168,.5); }
.fol-spin { transform-origin: 0 0; animation: folSpin 160s linear infinite; }
@keyframes folSpin { to { transform: rotate(360deg); } }
@keyframes folGlow { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .fol { opacity: .8; } }

/* Every planet linked to every other: a thin leaf-green mesh with a slow shimmer. Decoration only. */
.web line.mesh { stroke: rgba(190,225,160,.5); stroke-width: 1.3; stroke-dasharray: 7 7; stroke-linecap: round; animation: flow 6s linear infinite; pointer-events: none; }

/* Galaxy: a deep starfield on a canvas, with faint nebula and milky-way haze behind the hero text */
.galaxy { position: absolute; left: 0; top: -8%; width: 100%; height: 116%; z-index: 0; pointer-events: none; }
.haze { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.haze i { position: absolute; display: block; border-radius: 50%; filter: blur(60px); }
.haze .h1 { left: -10%; top: 38%; width: 120%; height: 34%; transform: rotate(-16deg); background: linear-gradient(90deg, transparent, rgba(80, 190, 160, .14) 30%, rgba(233, 196, 106, .11) 55%, rgba(60, 150, 130, .12) 80%, transparent); border-radius: 40%; }
.haze .h2 { right: -8%; top: -6%; width: 46%; height: 52%; background: radial-gradient(circle, rgba(60, 170, 150, .22), transparent 70%); }
.haze .h3 { left: 6%; bottom: -10%; width: 42%; height: 46%; background: radial-gradient(circle, rgba(233, 196, 106, .12), transparent 70%); }
@media (prefers-reduced-motion: reduce) { .galaxy { top: 0; height: 100%; } }

/* Core Offer: a real button that lights up and opens its panel */
.sun { pointer-events: auto; border: 0; padding: 0; cursor: pointer; font: inherit; -webkit-tap-highlight-color: transparent; min-width: 44px; min-height: 44px; transition: box-shadow .4s, filter .4s; }
.sun:hover { filter: brightness(1.08); }
.sun:focus-visible { outline: 3px solid #fff; outline-offset: 6px; }
.space.lit .sun { box-shadow: 0 0 0 12px rgba(255, 240, 180, .35), 0 0 90px 36px rgba(255, 226, 130, .85), 0 0 220px 80px rgba(255, 210, 100, .4); filter: brightness(1.18); animation: flare 1.8s ease-out; }
@keyframes flare { 0% { transform: scale(1); } 25% { transform: scale(1.1); } 100% { transform: scale(1); } }
.space.lit .fol { opacity: 1; filter: brightness(2.2) saturate(1.2); animation: none; }
.space.lit .web line { stroke: rgba(255, 236, 170, .85); }
.space.lit .web polygon { stroke: rgba(255, 236, 170, .8); }
.fol, .web line, .web polygon { transition: filter .6s, stroke .6s; }
.core-panel[hidden] { display: none; }
.core-panel { position: fixed; inset: 0; z-index: 80; display: grid; place-items: center; padding: 16px; }
.core-back { position: absolute; inset: 0; background: rgba(5, 14, 9, .72); backdrop-filter: blur(4px); }
.core-card { position: relative; width: min(560px, 100%); max-height: calc(100svh - 32px); overflow: auto; padding: 34px 28px 28px; border-radius: 24px; background: #0F2418; color: #E9F0E8; border: 1px solid rgba(233, 196, 106, .5); box-shadow: 0 0 80px rgba(233, 196, 106, .25), 0 30px 80px -20px #000; animation: pop .35s cubic-bezier(.2, 1.4, .4, 1); }
.core-card h2 { font-size: clamp(32px, 6vw, 42px); line-height: 1.05; margin: 0 0 12px; color: #fff; }
.core-card h3 { font-family: var(--sans); font-size: 19px; letter-spacing: .02em; color: var(--gold); margin: 22px 0 10px; }
.core-card p { font-size: 19px; line-height: 1.55; margin: 0 0 12px; color: #E3ECE1; }
.core-card .core-lead { font-size: 21px; color: #fff; }
.core-card .checks { grid-template-columns: 1fr; margin-bottom: 8px; }
.core-card .checks li { color: #F3F1E7; font-size: 19px; }
.core-card .btn { margin-top: 18px; }
.core-x { position: absolute; top: 8px; right: 8px; width: 48px; height: 48px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .1); color: #fff; font-size: 30px; line-height: 1; cursor: pointer; }
.core-x:hover { background: rgba(255, 255, 255, .2); }
.core-x:focus-visible, .core-card .btn:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .space.lit .sun { animation: none; } .core-card { animation: none; } }

/* the info card sits below the planet lanes so it never covers the bottom row */
.pl-card { bottom: -108px; }
@media (max-width: 1180px) { .pl-card { bottom: -96px; } }

.pl-card, .pl-card { top: calc(100% + 10px) !important; bottom: auto !important; }
@media (max-width: 1180px) { .space { margin-bottom: 150px; } }

/* Waitlist (Save My Spot): posts to the NEE waitlist-join function */
.wl-card { padding: 40px 32px; border-radius: 28px; background: radial-gradient(120% 90% at 100% 0%, #1f3a2a 0%, #12261A 60%); border: 1px solid rgba(233, 196, 106, .4); }
.wl-card h2 { margin: 0 0 12px; color: #fff; }
.wl-why { color: #DCE6DA; max-width: 40ch; margin-bottom: 8px; }
.wl-card form { display: grid; gap: 18px; margin-top: 24px; }
.wl-card label { display: block; font-size: 18px; font-weight: 600; margin-bottom: 8px; color: #fff; }
.wl-card input { width: 100%; font: inherit; font-size: 19px; color: #fff; background: #0B1A11; border: 2px solid rgba(143, 211, 168, .45); border-radius: 16px; padding: 16px 18px; min-height: 56px; }
.wl-card input:focus { border-color: var(--gold); outline: none; }
.wl-card button { justify-self: start; border: 0; cursor: pointer; font-family: inherit; min-height: 60px; }
.wl-card button[disabled] { opacity: .7; cursor: wait; }
.wl-small { font-size: 18px; color: #DCE6DA; margin: 0; }
.wl-msg { font-size: 19px; margin: 0; min-height: 1.4em; }
.wl-msg.ok { color: #9FE2B8; font-weight: 600; }
.wl-msg.err { color: #F2A08F; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
@media (max-width: 480px) { .wl-card { padding: 32px 22px; } .wl-card button { width: 100%; justify-self: stretch; } }

.pl b { transition: opacity .35s; }
.pl.nolabel b { opacity: 0; }

/* Waitlist page: the "doors open soon" line, the founding-price note and larger small text */
.soon { margin: -6px 0 22px; font-size: 19px; color: #DCE6DA; }
.soon a { color: var(--gold); font-weight: 600; text-underline-offset: 3px; }
.price-note { font-family: var(--serif); font-style: italic; font-size: clamp(26px, 4vw, 34px); line-height: 1.2; color: var(--gold); margin: 6px 0 22px; }
.btn-small { font-size: 18px; }
.nos li { font-size: 18px; }
.stats span, .foot { font-size: 18px; }
.pl-card span { font-size: 18px; }
.journey .when { font-size: 16px; }
@media (max-width: 899px) { .foot { padding-bottom: 130px; } }
html.tab-hidden *, html.tab-hidden *::before, html.tab-hidden *::after { animation-play-state: paused !important; }
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.sw-btn, .wheel-keys button { font-size: 18px; }
.tile .n, .journey .when { font-size: 18px; }
.pl b { font-size: 15px; }
@media (max-width: 720px) { .pl b { font-size: 14px; padding: 2px 8px; } }
.eyebrow { max-width: none; font-size: clamp(20px, 2.3vw, 28px); }
.eyebrow::before, .eyebrow::after { width: 36px; }
.price-card > .kicker { padding-right: 96px; }

/* if the web font is slow or blocked, the headline must still stay clear of the planet scene */
@media (min-width: 1181px) { .hero-title { font-size: clamp(52px, 7.4vw, 112px); } }

/* Legend: every planet's name, always readable, under the scene */
.pl-under { position: absolute; z-index: 8; left: 50%; top: calc(100% + 10px); translate: -50% 0; width: min(560px, 96vw); display: grid; gap: 12px; justify-items: center; }
.pl-under .pl-card { position: static !important; translate: none; top: auto !important; bottom: auto !important; width: min(420px, 100%); }
.legend { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.lg { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 6px 14px 6px 10px; border-radius: 999px; border: 1px solid rgba(143, 211, 168, .45); background: rgba(11, 26, 17, .82); color: #EEF6EF; font: 600 18px var(--sans); cursor: pointer; -webkit-tap-highlight-color: transparent; }
.lg i { width: 18px; height: 18px; border-radius: 50%; flex: none; }
.lg:hover, .lg:focus-visible { border-color: var(--gold); background: rgba(233, 196, 106, .18); }
@media (max-width: 1180px) { .space { margin-bottom: 330px; } }
@media (max-width: 480px) { .space { margin-bottom: 380px; } .lg { font-size: 17px; padding-right: 12px; } }
/* Hero text is visible from the first paint (only a small lift animates), so it never waits for scripts */
.js .hero .reveal { opacity: 1; transform: none; transition: none; animation: heroRise .8s cubic-bezier(.2,.8,.2,1) both; }
@keyframes heroRise { from { transform: translateY(16px); } }
@media (prefers-reduced-motion: reduce) { .js .hero .reveal { animation: none; } }
/* On wide screens the scene hugs the right edge, so its legend lines up with the scene instead of centering past the window */
@media (min-width: 1181px) { .pl-under { left: 0; right: 0; translate: none; width: auto; } }

/* Ways in: the three offers */
.offers { display: grid; gap: 18px; margin-top: 28px; }
@media (min-width: 900px) { .offers { grid-template-columns: repeat(2, 1fr); max-width: 860px; margin-inline: auto; } }
.offer { display: grid; align-content: start; gap: 10px; padding: 28px 24px; border-radius: 24px; background: #fff; border: 1px solid rgba(19, 32, 26, .14); box-shadow: 0 18px 40px -28px rgba(19, 32, 26, .5); }
.offer h3 { margin: 0; font-size: 28px; line-height: 1.1; }
.offer p { margin: 0; }
.offer .btn { justify-self: start; margin-top: 6px; }
.offer-tag { font: 700 18px var(--sans); letter-spacing: .08em; text-transform: uppercase; color: #2F6446; }
.offer-price { font-family: var(--serif); font-weight: 700; font-size: 44px; line-height: 1; color: var(--ink); }
.offer-price span { font: 600 18px var(--sans); color: #4A5A50; }

.offers-note { margin: 22px 0 0; text-align: center; font-size: 19px; }
.offers-note a { color: #2F6446; font-weight: 600; text-underline-offset: 3px; }

/* Founding 10: the first thing under the hero */
.f10 { padding-top: 56px; padding-bottom: 56px; }
.f10-card { padding: 36px 28px; border-radius: 28px; background: #fff; border: 2px solid #3F7A56; box-shadow: 0 30px 60px -36px rgba(19, 32, 26, .6); }
.f10-card h2 { margin: 0 0 14px; }
.f10-card h3 { font-family: var(--sans); font-size: 19px; letter-spacing: .02em; color: #2F6446; margin: 22px 0 10px; }
.f10-card .big { margin-bottom: 12px; }
.f10-who { font-size: 19px; color: var(--ink); margin: 0 0 6px; }
.f10-card .checks { grid-template-columns: 1fr; margin-bottom: 18px; }
.f10-card .checks li { color: var(--ink); }
.f10-price { font-family: var(--serif); font-weight: 700; font-size: clamp(30px, 6vw, 40px); line-height: 1.1; color: var(--ink); margin: 6px 0 8px; }
.f10-deadline { font-size: 19px; font-weight: 600; color: #7A3E12; margin: 0 0 8px; }
.f10-honest { font-size: 19px; margin: 0 0 20px; }
.f10-small { font-size: 18px; line-height: 1.5; color: #3B4A41; margin: 16px 0 0; }
.f10-small a, .f10-wl a { color: #2F6446; text-underline-offset: 3px; }
.f10-wl { text-align: center; font-size: 19px; margin: 18px 0 0; font-weight: 600; }
.f10-card .btn-full { min-height: 66px; font-size: 21px; }
.f10-full[hidden] { display: none; }
@media (max-width: 480px) { .f10-card { padding: 28px 20px; } }

/* Launch pass: text 18px+ (labels 16px+), every tap target 44px+, no copy changes */
.brand { min-height: 44px; }
.wheel-text strong { font-size: clamp(18px, 3.2vw, 24px); }
.lg { font-size: 18px; }
.pl b { font-size: 16px; }
@media (max-width: 720px) { .pl b { font-size: 16px; padding: 3px 9px; } }
.soon a, .f10-small a { display: inline-block; padding: 10px 3px; line-height: 1.3; }
.link-soft, .f10-wl a { display: inline-flex; align-items: center; min-height: 44px; }
.link-soft { padding-bottom: 0; }
.foot-links a { min-height: 44px; display: inline-flex; align-items: center; }
.soon a, .f10-small a { min-height: 44px; box-sizing: border-box; }
