:root{
  --navy:#172a3d;
  --navy2:#243d58;
  --blue:#3d77b6;
  --green:#2f9a68;
  --red:#b94b43;
  --cream:#f6f1e7;
  --cream2:#fbf7ef;
  --card:#fffdf8;
  --line:#e1d8c8;
  --muted:#627286;
  --shadow:0 30px 90px rgba(23,42,61,.18);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--cream);color:var(--navy)}
body{font-family: Georgia, "Times New Roman", serif}
a{color:inherit}
.page{
  width:1440px;
  margin:0 auto;
  background:
    radial-gradient(circle at 78% 6%, rgba(47,154,104,.16), transparent 27%),
    radial-gradient(circle at 19% 22%, rgba(61,119,182,.12), transparent 25%),
    linear-gradient(180deg,#f8f3ea 0%,#f4ecdf 100%);
  overflow:hidden;
}
.hero{
  min-height:960px;
  padding:50px 76px 86px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero-center{
  width:min(980px, 100%);
  text-align:center;
  margin:0 auto;
  transform:translateY(-18px);
}
.hero-logo{
  display:block;
  width:700px;
  max-width:82vw;
  margin:0 auto 34px;
  border-radius:54px;
  box-shadow:0 26px 80px rgba(23,42,61,.13);
}
.hero-category{
  font-family:Arial,sans-serif;
  text-transform:uppercase;
  letter-spacing:.20em;
  font-size:23px;
  font-weight:900;
  color:var(--green);
  margin:0 0 38px;
}
h1{
  font-size:64px;
  line-height:1.02;
  letter-spacing:-.045em;
  margin:0 0 12px;
}
.subhead{
  font-size:42px;
  line-height:1.08;
  margin:0 0 24px;
  color:#29415b;
}
.lead{
  font-size:23px;
  line-height:1.48;
  color:#33465d;
  max-width:790px;
  margin:0 auto;
}
.side-nav{
  position:absolute;
  right:70px;
  top:128px;
  width:245px;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:18px;
  z-index:10;
  font-family:Arial,sans-serif;
}
.side-link{
  display:block;
  text-decoration:none;
  text-align:center;
  border-radius:999px;
  font-size:16px;
  font-weight:800;
  padding:17px 20px;
  background:rgba(255,253,248,.66);
  border:1px solid rgba(225,216,200,.98);
  box-shadow:0 12px 30px rgba(23,42,61,.07);
}
.side-how{
  margin-right:70px;
  color:var(--navy);
  background:rgba(255,253,248,.45);
}
.side-manifesto{
  margin-right:34px;
  color:var(--green);
  border-color:rgba(47,154,104,.34);
  background:rgba(47,154,104,.09);
}
.side-waitlist{
  color:white;
  background:var(--navy);
  border-color:var(--navy);
}
.eyebrow{font-family:Arial,sans-serif;text-transform:uppercase;letter-spacing:.18em;font-size:13px;font-weight:800;color:var(--green);margin:0 0 18px}
.burden{padding:90px 76px 100px;border-top:1px solid rgba(225,216,200,.82);background:var(--cream2)}
.section-copy{max-width:1050px}
h2{font-size:54px;line-height:1.05;letter-spacing:-.038em;margin:0;color:var(--navy)}
.section-copy p:last-child{font-size:24px;line-height:1.45;color:#41566c;max-width:860px;margin:28px 0 0}
.ripeness{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:52px}
.ripeness article{background:var(--card);border:1px solid var(--line);border-radius:30px;padding:32px;min-height:230px;position:relative;overflow:hidden}
.ripeness article:before{content:"";position:absolute;left:0;top:0;height:8px;width:100%}
.ripe:before{background:var(--red)}
.ripening:before{background:var(--green)}
.dormant:before{background:var(--blue)}
.ripeness span{font-family:Arial,sans-serif;text-transform:uppercase;letter-spacing:.14em;font-size:13px;font-weight:900;color:var(--green)}
.ripeness h3{font-size:32px;margin:44px 0 12px;line-height:1.06}
.ripeness p{font-size:19px;line-height:1.42;color:#4d5e70;margin:0}
.today-demo{padding:96px 76px 112px;background:#f1e7da;border-top:1px solid var(--line)}
.demo-heading{text-align:center;max-width:850px;margin:0 auto 54px}
.demo-heading h2{font-size:68px}
.demo-heading p:last-child{font-size:24px;line-height:1.44;color:#43576d;margin:18px 0 0}
.demo-stage{height:1050px;position:relative}
.today-phone{
  position:absolute;
  left:50%;
  top:0;
  transform:translateX(-50%);
  width:500px;
  border-radius:48px;
  padding:13px;
  background:#102034;
  box-shadow:0 34px 90px rgba(23,42,61,.22);
  z-index:2;
}
.today-phone img{display:block;width:100%;border-radius:36px}
.callout{
  position:absolute;
  width:340px;
  background:rgba(255,253,248,.88);
  border:1px solid rgba(225,216,200,.95);
  border-radius:26px;
  padding:24px 25px;
  box-shadow:0 18px 44px rgba(23,42,61,.10);
  z-index:3;
}
.callout h3{font-size:31px;line-height:1.04;letter-spacing:-.03em;margin:0 0 10px}
.callout p{font-family:Arial,sans-serif;font-size:15px;line-height:1.46;color:#4c5d70;margin:0}
.callout-weather{left:58px;top:120px}
.callout-actions{right:44px;top:382px}
.callout-future{left:76px;bottom:116px}
.arrow{position:absolute;display:block;height:2px;background:rgba(23,42,61,.48);transform-origin:left center}
.arrow:after{
  content:"";
  position:absolute;right:-2px;top:-5px;width:0;height:0;
  border-left:10px solid rgba(23,42,61,.58);
  border-top:6px solid transparent;
  border-bottom:6px solid transparent;
}
.arrow-weather{width:245px;left:305px;top:82px;transform:rotate(-6deg)}
.arrow-actions{width:220px;right:320px;top:82px;transform:rotate(177deg)}
.arrow-future{width:260px;left:300px;top:76px;transform:rotate(-16deg)}
.manifesto{display:grid;grid-template-columns:.84fr 1.16fr;gap:84px;padding:94px 76px;background:var(--navy);color:#fffdf8}
.manifesto h2{color:#fffdf8}
.manifesto .eyebrow{color:#7bcaa0}
.manifesto-copy p{font-size:25px;line-height:1.48;margin:0 0 28px;color:#f5eadc}
.archive-note{display:grid;grid-template-columns:1fr 1fr;gap:72px;padding:86px 76px;background:#f5eee3;border-bottom:1px solid var(--line)}
.archive-note p:last-child{font-size:24px;line-height:1.48;color:#3f5268;margin:40px 0 0}
.final-cta{text-align:center;padding:96px 76px 112px;background:var(--cream2)}
.final-cta h2{font-size:76px}
.final-cta p{font-size:24px;color:#465a70;margin:18px 0 34px}
.signup{display:flex;gap:12px;justify-content:center;max-width:690px;margin:0 auto}
input{flex:1;border:1px solid #d5c9b9;border-radius:18px;padding:20px 20px;font-size:18px;background:white;color:var(--navy)}
button{border:0;border-radius:18px;padding:20px 28px;font-size:18px;font-weight:800;color:white;background:var(--navy);cursor:pointer}
.microcopy{font-family:Arial,sans-serif;color:var(--muted)!important;font-size:13px!important;margin-top:14px!important}
@media(max-width:900px){
  .page{width:100%}
  .hero,.burden,.today-demo,.manifesto,.archive-note,.final-cta{padding-left:24px;padding-right:24px}
  .hero{display:block;min-height:auto;padding-top:30px}
  .side-nav{position:static;width:auto;margin:0 0 32px;gap:10px}
  .side-how,.side-manifesto{margin-right:0}
  .hero-center{transform:none}
  .hero-logo{width:100%;border-radius:34px}
  .hero-category{font-size:15px}
  h1{font-size:44px}
  h2,.demo-heading h2,.final-cta h2{font-size:42px}
  .subhead{font-size:30px}
  .lead{font-size:20px}
  .signup{display:block}
  button,input{width:100%;margin-bottom:12px}
  .ripeness{grid-template-columns:1fr}
  .manifesto,.archive-note{display:block}
  .demo-stage{height:auto}
  .today-phone{position:relative;left:auto;top:auto;transform:none;width:100%;max-width:440px;margin:0 auto}
  .callout{position:relative;width:auto;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;margin:22px 0}
  .arrow{display:none}
}

/* 02.2 locked revisions */
.side-nav{right:54px;top:248px;width:235px;height:480px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;gap:0}
.side-link{width:235px;margin-right:0!important}
.side-how{background:rgba(255,253,248,.45);color:var(--navy)}
.side-manifesto{background:rgba(47,154,104,.09);color:var(--green)}
.side-waitlist{background:var(--navy);color:white}
.hero-logo{width:650px;max-width:72vw;margin-bottom:34px;border-radius:48px}
.visibility-labels{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:48px;margin-bottom:12px}
.visibility-item{text-align:center;font-family:Arial,sans-serif;font-size:18px;font-weight:900;letter-spacing:.10em;color:var(--navy)}
.visibility-item span{display:block;margin-bottom:10px}
.visibility-item i{display:block;position:relative;height:16px;margin:0 14px;border-top:2px solid rgba(23,42,61,.45)}
.visibility-item i:before,.visibility-item i:after{content:"";position:absolute;top:-2px;width:2px;height:16px;background:rgba(23,42,61,.45)}
.visibility-item i:before{left:0}.visibility-item i:after{right:0}.ripeness{margin-top:0}
.callout-weather{left:8px;top:120px}.callout-actions{right:0;top:382px}.callout-future{left:8px;bottom:116px}
.arrow-weather{width:278px;left:330px;top:82px;transform:rotate(-5deg);background:var(--green)}.arrow-weather:after{border-left-color:var(--green)}
.arrow-actions{width:286px;right:328px;top:82px;transform:rotate(177deg)}.arrow-future{width:285px;left:330px;top:76px;transform:rotate(-15deg)}
.manifesto-copy .manifesto-emphasis{font-weight:700;font-size:29px;line-height:1.4;color:#fffdf8}
.future-line{max-width:1240px;margin:0 auto 54px!important;font-size:40px!important;line-height:1.18!important;letter-spacing:-.025em;font-weight:700;color:var(--navy)!important;white-space:nowrap}
@media(max-width:900px){.side-nav{position:static;width:auto;height:auto;margin:0 0 32px;gap:10px}.side-link{width:100%}.visibility-labels{grid-template-columns:1fr}.visibility-item i{display:none}.future-line{white-space:normal;font-size:30px!important}}


/* ===== Final candidate locked repairs ===== */

/* Section 1: button cascade aligns exactly to visible logo asset. */
.side-nav{
  top:102px !important;
  height:590px !important;
  justify-content:space-between !important;
}

/* Section 3: middle leader line repairs.
   It now starts from the left side of the right callout and points into Today's Actions. */
.arrow-actions{
  right:305px !important;
  top:82px !important;
  width:295px !important;
  transform:rotate(180deg) !important;
}

/* Section 5: approved two-line future-you statement and enlarged microcopy. */
.future-line{
  white-space:normal !important;
  max-width:1280px !important;
  margin-bottom:46px !important;
}
.future-line span{
  display:block;
}
.microcopy{
  font-size:16px !important;
  line-height:1.35 !important;
  margin-top:16px !important;
}


/* ===== Hero navigation revision: left / top / right around logo ===== */
.side-nav{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  display:block !important;
  pointer-events:none;
  z-index:20;
}
.side-link{
  position:absolute !important;
  width:235px !important;
  margin:0 !important;
  pointer-events:auto;
}
.side-how{
  left:132px !important;
  top:338px !important;
  transform:none !important;
}
.side-manifesto{
  right:132px !important;
  top:338px !important;
  transform:none !important;
}
.side-waitlist{
  left:50% !important;
  top:48px !important;
  transform:translateX(-50%) !important;
  width:306px !important;
  padding:22px 28px !important;
  font-size:21px !important;
  box-shadow:0 18px 44px rgba(23,42,61,.16) !important;
}

/* Ensure hero content keeps the logo visually dominant below the top CTA. */
.hero-center{
  transform:translateY(18px) !important;
}

@media(max-width:900px){
  .side-nav{
    position:static !important;
    width:auto !important;
    height:auto !important;
    display:flex !important;
    flex-direction:column !important;
    gap:10px !important;
    pointer-events:auto;
    margin-bottom:28px;
  }
  .side-link{
    position:static !important;
    width:100% !important;
    transform:none !important;
  }
}


/* ===== Logo clean / top CTA separation repair ===== */

/* Move Join the Party above the logo with air, not touching the mark. */
.side-waitlist{
  top:18px !important;
}

/* Remove the visual white card effect around the hero logo.
   The recovered logo image floats directly on the atmospheric page background. */
.hero-logo{
  box-shadow:none !important;
  background:transparent !important;
  border-radius:0 !important;
}

/* Slightly reduce logo footprint so the actual mark breathes without a white slab. */
.hero-logo{
  width:620px !important;
  max-width:68vw !important;
}

/* Restore hero vertical balance after removing the card effect. */
.hero-center{
  transform:translateY(34px) !important;
}


/* ===== Final visual-confirmation repairs ===== */

/* Hero: remove old absolute three-button layout entirely. */
.side-nav{display:none !important;}

/* Hero: future-you line repeated above logo, centered. */
.hero-future-line{
  font-size:38px;
  line-height:1.18;
  letter-spacing:-.02em;
  font-weight:700;
  color:var(--navy);
  text-align:center;
  margin:0 auto 26px;
  max-width:1180px;
}
.hero-future-line span{display:block}

/* Hero logo: transparent asset, no rectangular white box, centered. */
.hero-logo{
  display:block !important;
  width:560px !important;
  max-width:58vw !important;
  height:auto !important;
  margin:0 auto 24px !important;
  background:transparent !important;
  box-shadow:none !important;
  border-radius:0 !important;
}

/* Hero: Join button below logo and above category. */
.hero-join-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  background:var(--navy);
  color:white;
  border-radius:999px;
  padding:22px 42px;
  min-width:306px;
  font-family:Arial,sans-serif;
  font-size:21px;
  font-weight:900;
  box-shadow:0 18px 44px rgba(23,42,61,.16);
  margin:0 auto 30px;
}

/* Hero side buttons: How left of logo; Why right of logo; both centered vertically on logo. */
.hero-side-buttons{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:20;
  font-family:Arial,sans-serif;
}
.hero-side-buttons .side-link{
  position:absolute !important;
  top:345px !important;
  width:235px !important;
  margin:0 !important;
  pointer-events:auto;
}
.hero-side-buttons .side-how{
  left:132px !important;
}
.hero-side-buttons .side-manifesto{
  right:132px !important;
}

/* Rebalance hero after removing the large white logo rectangle. */
.hero-center{
  transform:translateY(-4px) !important;
}

/* Section 3: repair middle arrow so it originates from left side of right callout and points into Today's Actions. */
.arrow-actions{
  width:330px !important;
  right:318px !important;
  top:72px !important;
  transform:rotate(188deg) !important;
  background:rgba(23,42,61,.54) !important;
}
.arrow-actions:after{
  border-left-color:rgba(23,42,61,.62) !important;
}

/* Mobile fallback */
@media(max-width:900px){
  .hero-future-line{font-size:27px}
  .hero-logo{width:100% !important;max-width:100% !important}
  .hero-join-button{width:100%;min-width:0}
  .hero-side-buttons{position:static;display:flex;flex-direction:column;gap:10px;margin-bottom:24px;pointer-events:auto}
  .hero-side-buttons .side-link{position:static !important;width:100% !important}
}


/* ===== Final repair: remove all Today Screen arrows ===== */
.arrow,
.arrow:after,
.arrow-weather,
.arrow-actions,
.arrow-future {
  display: none !important;
}


/* ===== Final repair: true transparent hero logo ===== */
.hero-logo {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}


/* ===== Final landing page repairs ===== */
.hero-logo {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

.arrow,
.arrow:after,
.arrow-weather,
.arrow-actions,
.arrow-future {
  display: none !important;
}


/* Final verified repair: remove all Today Screen arrows */
.arrow,
.arrow:before,
.arrow:after,
.arrow-weather,
.arrow-actions,
.arrow-future {
  display: none !important;
}

/* Final verified repair: hero logo is standalone transparent artwork */
.hero-logo {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}


/* Final spacing lock: give the final CTA heading room before the email form. */
.final-cta h2 {
  margin-bottom: 40px !important;
}


/* Final hero headline adjustment: 45px with wider, non-breaking two-line composition. */
.hero-future-line {
  font-size: 45px !important;
  max-width: 1420px !important;
  width: 96vw !important;
  margin-left: 50% !important;
  transform: translateX(-50%) !important;
}
.hero-future-line span {
  display: block !important;
  white-space: nowrap !important;
}


/* Live-ready Easter egg: no visible hint; only the words shudder after discovery. */
#see-future-egg { cursor: default; user-select: none; }
.future-egg-text { display: inline-block; }
.future-egg-text.future-shudder { animation: future-shudder 7s linear both; }
@keyframes future-shudder {
  0% { transform: translate(0,0) rotate(0deg); }
  5% { transform: translate(-1px,1px) rotate(-0.3deg); }
  10% { transform: translate(2px,-1px) rotate(0.25deg); }
  15% { transform: translate(-2px,0) rotate(-0.2deg); }
  22% { transform: translate(1px,2px) rotate(0.2deg); }
  30% { transform: translate(-2px,-1px) rotate(-0.25deg); }
  40% { transform: translate(2px,1px) rotate(0.25deg); }
  50% { transform: translate(-3px,2px) rotate(-0.35deg); }
  58% { transform: translate(3px,-2px) rotate(0.4deg); }
  66% { transform: translate(-4px,2px) rotate(-0.45deg); }
  74% { transform: translate(4px,-2px) rotate(0.45deg); }
  82% { transform: translate(-3px,3px) rotate(-0.35deg); }
  90% { transform: translate(2px,-1px) rotate(0.2deg); }
  100% { transform: translate(0,0) rotate(0deg); }
}
.arrow, .arrow:before, .arrow:after, .arrow-weather, .arrow-actions, .arrow-future { display:none !important; }


/* Replacement audio Easter egg: keep the word shimmy running for at least 7 seconds. */
.future-egg-text.future-shudder {
  animation-duration: 7s !important;
}


/* ===== Mobile launch repair: desktop remains unchanged above this breakpoint ===== */
.mobile-visibility-label,
.mobile-demo-stage {
  display: none;
}

@media (max-width: 900px) {
  body {
    overflow-x: hidden;
  }

  .hero {
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  .hero-future-line {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    transform: none !important;
    font-size: clamp(31px, 9.1vw, 42px) !important;
    line-height: 1.08 !important;
    padding: 0 4px !important;
    box-sizing: border-box !important;
    overflow-wrap: normal !important;
    text-wrap: balance;
  }

  .hero-future-line span {
    white-space: normal !important;
    display: block !important;
  }

  .hero-side-buttons {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    width: 100% !important;
    margin: 0 auto 34px !important;
  }

  .hero-side-buttons .side-link {
    position: static !important;
    width: 100% !important;
    max-width: none !important;
  }

  .hero-logo {
    width: min(92vw, 540px) !important;
    max-width: 100% !important;
  }

  .hero-join-button {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 620px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .hero-category {
    line-height: 1.35 !important;
    letter-spacing: .17em !important;
    padding: 0 4px !important;
  }

  .hero-center h1 {
    font-size: clamp(52px, 15vw, 76px) !important;
    line-height: .95 !important;
  }

  .burden {
    padding-left: 26px !important;
    padding-right: 26px !important;
  }

  .visibility-labels {
    display: none !important;
  }

  .ripeness {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }

  .mobile-visibility-label {
    display: block !important;
    text-align: center;
    font-family: Arial, sans-serif;
    font-size: 19px;
    font-weight: 900;
    letter-spacing: .18em;
    color: var(--navy);
    margin: 0 0 26px;
  }

  .ripeness article {
    min-height: auto !important;
    padding-top: 44px !important;
  }

  .today-demo {
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  .demo-stage {
    display: none !important;
  }

  .mobile-demo-stage {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    width: 100% !important;
    max-width: 720px !important;
    margin: 54px auto 0 !important;
  }

  .mobile-demo-stage .callout {
    position: static !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }

  .mobile-phone-crop {
    width: 100%;
    border-radius: 34px;
    overflow: hidden;
    box-shadow: 0 24px 70px rgba(23,42,61,.14);
    background: white;
  }

  .mobile-phone-crop img {
    display: block;
    width: 100%;
    height: auto;
  }

  .manifesto {
    padding: 78px 26px 86px !important;
    gap: 30px !important;
  }

  .manifesto h2 {
    font-size: clamp(48px, 14vw, 66px) !important;
    line-height: 1.02 !important;
  }

  .manifesto-copy,
  .manifesto-copy p {
    font-size: clamp(29px, 8vw, 42px) !important;
    line-height: 1.32 !important;
  }

  .manifesto-emphasis {
    font-size: clamp(35px, 9vw, 48px) !important;
    line-height: 1.16 !important;
  }
}


/* Final mobile polish: breathing room before first visibility card and full Today Screen payoff. */
@media (max-width: 900px) {
  .burden .section-copy {
    margin-bottom: 42px !important;
  }

  .mobile-all-in-one {
    margin: 18px 0 2px !important;
    text-align: center;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(44px, 13vw, 68px);
    line-height: 1.02;
    color: var(--navy);
  }

  .mobile-phone-full {
    width: min(92vw, 620px);
    margin: 10px auto 0;
    border-radius: 34px;
    overflow: hidden;
    box-shadow: 0 26px 78px rgba(23,42,61,.16);
    background: white;
  }

  .mobile-phone-full img {
    display: block;
    width: 100%;
    height: auto;
  }
}


/* July 9 Today Screen master asset replacement. */
.mobile-phone-full img,
.phone-wrap img,
.demo-phone,
.today-phone img {
  object-fit: contain;
}


/* Final repair: the July 9 master PNG already includes the phone frame.
   Do not draw a second website phone shell around it. */
.demo-phone,
.phone-shell,
.phone-frame,
.phone-wrap,
.mobile-phone-full,
.mobile-phone-crop {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.demo-phone::before,
.demo-phone::after,
.phone-shell::before,
.phone-shell::after,
.phone-frame::before,
.phone-frame::after,
.phone-wrap::before,
.phone-wrap::after,
.mobile-phone-full::before,
.mobile-phone-full::after,
.mobile-phone-crop::before,
.mobile-phone-crop::after {
  display: none !important;
  content: none !important;
}

.demo-phone img,
.phone-shell img,
.phone-frame img,
.phone-wrap img,
.mobile-phone-full img,
.mobile-phone-crop img {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  display: block;
}

/* Keep the standalone PNG crisp and properly sized. */
.demo-phone,
.phone-wrap {
  overflow: visible !important;
}


/* Clean July 9 screen master: the asset is screen content only.
   The website provides one phone presentation frame; no duplicate raster phone body. */
.demo-phone,
.phone-wrap,
.mobile-phone-full {
  background: #071725 !important;
  border: 10px solid #0f2638 !important;
  border-radius: 46px !important;
  box-shadow: 0 30px 80px rgba(23,42,61,.22) !important;
  overflow: hidden !important;
}

.demo-phone img,
.phone-wrap img,
.mobile-phone-full img {
  border-radius: 34px !important;
  width: 100% !important;
  height: auto !important;
  display: block !important;
  object-fit: contain !important;
}

.mobile-phone-crop {
  background: transparent !important;
  border: 0 !important;
  box-shadow: 0 24px 70px rgba(23,42,61,.14) !important;
  overflow: hidden !important;
}

.mobile-phone-crop img {
  border-radius: 26px !important;
}


/* Final mobile refinement pass — desktop preserved. */
@media (max-width: 900px) {
  /* 1–2. Cleaner, shorter top navigation pills. */
  .hero-nav a,
  .hero-link,
  .side-pill,
  .orbit-pill,
  .nav-pill {
    min-height: 58px !important;
    padding-top: 14px !important;
    padding-bottom: 14px !important;
  }

  .hero-nav,
  .hero-links,
  .orbit-links {
    gap: 18px !important;
  }

  /* 3. Shorter Ripe / Ripening / Dormant mobile cards. */
  .visibility-card,
  .burden-card,
  .state-card,
  .attention-card {
    padding-top: 38px !important;
    padding-bottom: 38px !important;
    min-height: 0 !important;
  }

  .visibility-card h3,
  .burden-card h3,
  .state-card h3,
  .attention-card h3 {
    margin-top: 34px !important;
    margin-bottom: 22px !important;
  }

  /* 4. Tighter Today Screen sequence and slightly smaller final full-phone reveal. */
  .today-demo,
  .today-screen,
  .mobile-demo-stage {
    gap: 44px !important;
  }

  .mobile-phone-crop {
    margin-top: 18px !important;
    margin-bottom: 30px !important;
  }

  .mobile-all-in-one {
    margin-top: 14px !important;
    margin-bottom: 18px !important;
    font-size: clamp(42px, 12vw, 62px) !important;
  }

  .mobile-phone-full {
    width: min(86vw, 560px) !important;
    margin-top: 4px !important;
  }

  /* 5. Navy manifesto section: keep drama, reduce mobile bloat. */
  .manifesto {
    padding-top: 68px !important;
    padding-bottom: 76px !important;
  }

  .manifesto .eyebrow {
    margin-bottom: 22px !important;
  }

  .manifesto h2 {
    font-size: clamp(48px, 12.5vw, 74px) !important;
    line-height: 0.98 !important;
    margin-bottom: 32px !important;
  }

  .manifesto-copy {
    gap: 22px !important;
  }

  .manifesto-copy p {
    font-size: clamp(28px, 7.2vw, 44px) !important;
    line-height: 1.22 !important;
    margin-bottom: 22px !important;
  }

  .manifesto-emphasis {
    font-size: clamp(34px, 8.5vw, 52px) !important;
    line-height: 1.12 !important;
  }

  /* Preserve reasonable breathing room into waitlist without dragging the page. */
  .final-cta {
    padding-top: 72px !important;
  }
}


/* Final mobile compression pass — reduce dead space only on mobile. */
@media (max-width: 900px) {
  section {
    padding-top: 54px !important;
    padding-bottom: 54px !important;
  }

  .hero {
    padding-top: 36px !important;
    padding-bottom: 50px !important;
  }

  .intro,
  .burdens,
  .promise,
  .memory,
  .today-demo,
  .today-screen {
    padding-top: 56px !important;
    padding-bottom: 56px !important;
  }

  .intro p,
  .promise p,
  .memory p {
    margin-bottom: 0 !important;
  }

  .section-spacer,
  .spacer,
  .mobile-spacer {
    height: 24px !important;
    min-height: 24px !important;
  }

  .visibility-grid,
  .burden-grid,
  .state-grid,
  .cards {
    gap: 34px !important;
    margin-top: 36px !important;
    margin-bottom: 30px !important;
  }

  .visibility-card,
  .burden-card,
  .state-card,
  .attention-card {
    padding: 32px 34px !important;
    margin-top: 0 !important;
    margin-bottom: 26px !important;
  }

  .visibility-card h3,
  .burden-card h3,
  .state-card h3,
  .attention-card h3 {
    margin-top: 20px !important;
    margin-bottom: 16px !important;
  }

  .today-demo,
  .mobile-demo-stage,
  .today-screen {
    gap: 28px !important;
  }

  .mobile-explain-card,
  .explain-card,
  .demo-callout {
    margin-top: 0 !important;
    margin-bottom: 22px !important;
    padding: 30px 34px !important;
  }

  .mobile-phone-crop {
    margin-top: 0 !important;
    margin-bottom: 26px !important;
  }

  .mobile-phone-crop img {
    display: block !important;
  }

  .mobile-all-in-one {
    margin-top: 4px !important;
    margin-bottom: 14px !important;
  }

  .mobile-phone-full {
    width: min(84vw, 540px) !important;
    margin-top: 0 !important;
    margin-bottom: 34px !important;
  }

  .manifesto {
    padding-top: 58px !important;
    padding-bottom: 62px !important;
  }

  .manifesto h2 {
    font-size: clamp(42px, 11.2vw, 66px) !important;
    line-height: 0.98 !important;
    margin-bottom: 24px !important;
  }

  .manifesto-copy {
    gap: 16px !important;
  }

  .manifesto-copy p {
    font-size: clamp(23px, 6.4vw, 38px) !important;
    line-height: 1.18 !important;
    margin-bottom: 16px !important;
  }

  .manifesto-emphasis {
    font-size: clamp(28px, 7.3vw, 44px) !important;
    line-height: 1.08 !important;
  }

  .final-cta {
    padding-top: 58px !important;
    padding-bottom: 80px !important;
  }

  .final-cta .future-line {
    margin-bottom: 36px !important;
  }
}


/* Final mobile balance pass — restore breathing room at transitions only. */
@media (max-width: 900px) {
  /* Give the first proof section a little air after the hero/brand block. */
  .intro,
  .promise {
    padding-top: 72px !important;
  }

  /* Prevent the visibility model from crashing into the Today Screen section. */
  .visibility-grid,
  .burden-grid,
  .state-grid,
  .cards {
    margin-bottom: 44px !important;
  }

  .today-demo,
  .today-screen,
  .mobile-demo-stage {
    padding-top: 74px !important;
    gap: 38px !important;
  }

  /* Restore intentional separation between demo cards and image slices. */
  .mobile-explain-card,
  .explain-card,
  .demo-callout {
    margin-bottom: 30px !important;
  }

  .mobile-phone-crop {
    margin-top: 8px !important;
    margin-bottom: 42px !important;
  }

  /* The Three Day Outlook slice needs more room before "All in one place." */
  .mobile-phone-crop + .mobile-all-in-one,
  .mobile-all-in-one {
    margin-top: 34px !important;
    margin-bottom: 28px !important;
  }

  .mobile-phone-full {
    margin-top: 14px !important;
    margin-bottom: 58px !important;
  }

  /* Keep the navy section from starting too abruptly after the phone. */
  .manifesto {
    padding-top: 76px !important;
  }

  /* Keep waitlist rhythm intact. */
  .final-cta {
    padding-top: 70px !important;
  }
}


/* Section 3 mobile-only pacing correction.
   Do not affect Sections 1, 2, 4, waitlist, desktop, or functionality. */
@media (max-width: 900px) {
  .today-demo,
  .today-screen,
  .mobile-demo-stage {
    padding-top: 38px !important;
    padding-bottom: 58px !important;
    gap: 30px !important;
  }

  .today-demo .eyebrow,
  .today-screen .eyebrow,
  .mobile-demo-stage .eyebrow {
    margin-bottom: 14px !important;
  }

  .today-demo h2,
  .today-screen h2,
  .mobile-demo-stage h2 {
    margin-bottom: 18px !important;
  }

  .today-demo .section-intro,
  .today-screen .section-intro,
  .mobile-demo-stage .section-intro,
  .today-demo .lede,
  .today-screen .lede {
    margin-bottom: 30px !important;
  }

  .mobile-explain-card,
  .explain-card,
  .demo-callout {
    margin-top: 0 !important;
    margin-bottom: 22px !important;
  }

  .mobile-phone-crop {
    width: min(86vw, 560px) !important;
    max-height: 360px !important;
    margin-top: 0 !important;
    margin-bottom: 36px !important;
    overflow: hidden !important;
  }

  .mobile-phone-crop img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
  }

  .mobile-phone-crop + .mobile-explain-card,
  .mobile-phone-crop + .explain-card,
  .mobile-phone-crop + .demo-callout {
    margin-top: 16px !important;
  }

  .mobile-phone-crop + .mobile-all-in-one,
  .mobile-all-in-one {
    margin-top: 46px !important;
    margin-bottom: 30px !important;
  }

  .mobile-phone-full {
    width: min(82vw, 520px) !important;
    margin-top: 8px !important;
    margin-bottom: 54px !important;
  }
}


/* Final Section 3 desktop + mobile correction. */
.today-demo h2,
.today-screen h2,
.mobile-demo-stage h2 {
  white-space: nowrap;
  max-width: none;
}

@media (min-width: 901px) {
  .today-demo h2,
  .today-screen h2,
  .mobile-demo-stage h2 {
    font-size: clamp(48px, 5.1vw, 76px) !important;
    line-height: 1.02 !important;
  }
}

@media (max-width: 900px) {
  /* Keep the mobile headline attractive, but reduce wasted vertical space. */
  .today-demo,
  .today-screen,
  .mobile-demo-stage {
    padding-top: 28px !important;
    padding-bottom: 44px !important;
    gap: 22px !important;
  }

  .today-demo h2,
  .today-screen h2,
  .mobile-demo-stage h2 {
    white-space: normal;
    font-size: clamp(48px, 13vw, 72px) !important;
    line-height: 0.96 !important;
    margin-bottom: 12px !important;
  }

  .today-demo .section-intro,
  .today-screen .section-intro,
  .mobile-demo-stage .section-intro,
  .today-demo .lede,
  .today-screen .lede {
    margin-top: 0 !important;
    margin-bottom: 18px !important;
  }

  .mobile-explain-card,
  .explain-card,
  .demo-callout {
    margin-top: 0 !important;
    margin-bottom: 14px !important;
    padding-top: 26px !important;
    padding-bottom: 26px !important;
  }

  .mobile-phone-crop {
    width: min(84vw, 540px) !important;
    max-height: 330px !important;
    margin-top: 0 !important;
    margin-bottom: 26px !important;
    overflow: hidden !important;
  }

  .mobile-phone-crop + .mobile-explain-card,
  .mobile-phone-crop + .explain-card,
  .mobile-phone-crop + .demo-callout {
    margin-top: 0 !important;
  }

  .mobile-phone-crop + .mobile-all-in-one,
  .mobile-all-in-one {
    margin-top: 28px !important;
    margin-bottom: 20px !important;
    font-size: clamp(42px, 12vw, 62px) !important;
    line-height: 0.96 !important;
  }

  .mobile-phone-full {
    width: min(80vw, 500px) !important;
    margin-top: 0 !important;
    margin-bottom: 44px !important;
  }
}

/* Waitlist form states */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.signup-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.signup-status{min-height:1.4em;margin:.8rem 0 0;font-size:.95rem;font-weight:700}
.signup-status.is-success{color:var(--navy)}
.signup-status.is-success .success-play{color:#2f9a68}
.signup-status.is-success .success-pause{color:#ed0f0e}
.signup-status.is-error{color:#ffd2c7}
.signup button:disabled{cursor:wait;opacity:.72}