/* The original palette, photography and typography remain the foundation. */
/* Hide scrollbar chrome while preserving native scrolling on every device. */
* {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
*::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

/* Store availability is the primary invitation, without inactive link targets. */
.hero {
  min-height: calc(100vh - 32px);
  min-height: calc(100svh - 32px);
}
.hero-content { padding-block: 112px; }
.hero-content::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 8% -12% 20%;
  background: radial-gradient(ellipse at 50% 40%, #05140e38, #05140e1f 43%, transparent 72%);
  pointer-events: none;
}
.hero .eyebrow {
  color: #e7d5ab;
  text-shadow: 0 1px 3px #04110de6, 0 2px 16px #04110dab;
}
.hero-description {
  max-width: 600px;
  color: #edf0e5;
  text-shadow: 0 1px 3px #04110de6, 0 2px 16px #04110dab;
}
.hero-store-label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  margin-bottom: 15px;
  color: var(--gold);
  font: 500 11px/1.4 var(--sans);
  letter-spacing: .21em;
  text-shadow: 0 1px 8px #071d1480;
}
.hero-store-label::before,
.hero-store-label::after {
  content: '';
  width: 42px;
  height: 1px;
  flex-shrink: 0;
}
.hero-store-label::before { background: linear-gradient(90deg, transparent, var(--gold)); }
.hero-store-label::after { background: linear-gradient(90deg, var(--gold), transparent); }
.hero-store-badges {
  display: flex;
  justify-content: center;
  align-items: stretch;
  gap: 14px;
}
.hero-store-badges .store-badge {
  width: 214px;
  min-width: 0;
  max-width: 100%;
  min-height: 72px;
  justify-content: center;
  gap: 14px;
  padding: 13px 20px;
  border: 1px solid #f9f5e666;
  border-radius: 13px;
  background: #ebe7d6;
  color: #21392b;
  box-shadow: 0 6px 25px #0002;
  text-align: left;
}
.hero-store-badges .store-badge svg { width: 29px; height: 32px; }
.hero-store-badges .store-badge strong { font-size: 23px; line-height: 1.2; }
.hero-explore {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 44px;
  margin-top: 18px;
  padding: 8px 4px;
  color: #e1e4d4;
  font-size: 15px;
  line-height: 1.5;
}
.hero-explore span {
  text-decoration: underline;
  text-decoration-color: #e1e4d455;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
}
.hero-explore svg { width: 17px; height: 17px; }
.hero-explore:hover { color: #fff6da; }
.hero-explore:hover span { text-decoration-color: currentColor; }
.hero-explore:focus-visible { outline: 2px solid #f2c14e; outline-offset: 5px; }
.hero-scroll-cue {
  position: absolute;
  z-index: 1;
  bottom: 29px;
  left: 50%;
  width: 2px;
  height: 42px;
  border-radius: 2px;
  background: #d4d9bb55;
  pointer-events: none;
}
.hero-scroll-cue span {
  display: block;
  width: 2px;
  height: 26px;
  border-radius: 2px;
  background: linear-gradient(#f0db9b, #ddcfac99);
  box-shadow: 0 0 8px #d3b27a20;
  transform: translateY(7px);
}
@media (max-width: 600px) {
  .hero { min-height: calc(100vh - 24px); min-height: calc(100svh - 24px); }
  .hero-content { padding-block: 104px; }
  .hero-description { max-width: 345px; }
  .hero-store-badges { gap: 12px; }
  .hero-store-badges .store-badge { min-height: 68px; padding: 12px 16px; }
  .hero-explore { margin-top: 16px; }
  .hero-scroll-cue { bottom: 24px; height: 38px; }
}
@media (max-width: 460px) {
  .hero-store-badges { flex-direction: column; align-items: center; }
  .hero-store-badges .store-badge { width: 222px; }
}
@media (prefers-reduced-motion: no-preference) {
  .hero-scroll-cue span { animation: scroll-cue 2.8s ease-in-out infinite; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-scroll-cue span { animation: none; }
}
@keyframes scroll-cue {
  0%, 100% { transform: translateY(0); opacity: .72; }
  50% { transform: translateY(11px); opacity: 1; }
}
.desktop-links{gap:25px}.real-brand-mark{width:44px;height:44px;object-fit:contain}.brand{gap:4px}.real-closing-door{width:110px;height:110px;object-fit:contain;margin-bottom:4px}
.mobile-nav a[aria-current="location"]{color:#fff6da;text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:1px;text-underline-offset:6px}
/* Equal Recovery panels retain their existing horizontal rules and vertical rhythm. */
.recovery-features{--recovery-card-inset:27px;border-inline:1px solid var(--line)}
.recovery-features>.experience{padding-inline:var(--recovery-card-inset)}
@media(max-width:1150px){.recovery-features{--recovery-card-inset:19px}}
@media(max-width:900px){.recovery-features{--recovery-card-inset:32px}}
@media(max-width:600px){
  .recovery-features{--recovery-card-inset:20px}
  .recovery-features>.experience{padding-left:calc(var(--recovery-card-inset) + 70px)}
  .recovery-features .icon-holder{left:var(--recovery-card-inset)}
}
.meeting-reach{padding:31px 0;background:#152b21;border-block:1px solid #e3e4c712;text-align:center}.meeting-reach p{font-size:16px;line-height:1.8;max-width:860px;margin:auto;color:#c6d1bd;text-wrap:balance}.meeting-reach strong{font-weight:500;color:#f1e9ce}
/* Both bands share their shell and line height, with a display voice for the invitation. */
.meeting-reach.door-invitation p{font-family:var(--serif);font-size:26px;line-height:1.8rem;color:#e7e8d2}
.door-invitation em{color:#c5c9af}
.recovery{overflow:clip}
.founder-photo-portrait{overflow:hidden;min-height:0}
.founder-photo-portrait::before{display:none}
.founder-photo-portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 65%}
.founder-story blockquote{font-style:normal}
.founder-story blockquote em{font-style:italic;color:#78815c}
.family-feature-top>span{display:none}.founder-photo-slot{background:radial-gradient(ellipse at 40% 30%,#82917a38,transparent 65%),#263e31}.founder-story .founder-signoff{font-size:16px;color:#3c5740;margin-top:27px;margin-bottom:0}.founder-story blockquote{color:#526541}.principles li{gap:0}.meeting-principles{margin-top:80px;padding-top:48px;border-top:1px solid var(--line)}.listing-heading .eyebrow{font-size:12px;color:#c4c9aa;margin-bottom:18px}.listing-heading h3{font-size:43px;letter-spacing:-.03em}.listing-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:42px;row-gap:36px;list-style:none;padding:0;margin:37px 0 0}.listing-points li{padding-top:20px;border-top:1px solid #ccd2b729;min-width:0}.listing-points h4{font:400 24px/1.2 var(--serif);margin:0 0 12px;color:#e7e8d2}.listing-points p{font-size:16px;line-height:1.75;color:#becbb3}.trust-note{margin-top:55px}
@media(max-width:1150px){.desktop-links{gap:18px}.listing-points{column-gap:30px}}
@media(max-width:900px){.listing-points{grid-template-columns:1fr 1fr;gap:28px}}
@media(max-width:600px){.real-brand-mark{width:40px;height:40px}.meeting-reach{padding:26px 0}.meeting-reach p{font-size:16px;line-height:1.8;max-width:360px}.founder-photo-slot{min-height:0;aspect-ratio:4/5}.founder-story .founder-signoff{margin-top:25px;font-size:16px}.meeting-principles{margin-top:53px;padding-top:36px}.listing-heading .eyebrow{font-size:12px;letter-spacing:.14em}.listing-heading h3{font-size:36px;line-height:1.15}.listing-points{grid-template-columns:1fr;gap:24px;margin-top:27px}.listing-points li{padding-top:20px}.listing-points h4{font-size:26px}.listing-points p{font-size:16px;line-height:1.75}.real-closing-door{width:96px;height:96px}}

/* Footer (owner redesign 2026-10-01): the crisis line about 15px under the closing photo; one row, the brand on the left
   and the social icons with Privacy · Terms on the right (stacked and centered on phones); then one line of fine print.
   Small text contrast on #12241b: links #c0cdb4 9.8:1, fine print #a3b19c 7.2:1. */
.footer-clean { padding: 15px 0 24px; }
.footer-clean .footer-crisis {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  padding: 13px 16px;
  border: 1px solid #c5cdae29;
  border-radius: 10px;
  background: #1b342633;
}
.footer-clean .footer-crisis > svg { width: 20px; height: 20px; margin-top: 4px; color: #bdc7ad; }
.footer-clean .crisis-line { font-size: inherit; line-height: 1.7; color: #e4e8d6; }
.footer-clean .crisis-line a {
  display: inline;
  margin: 0;
  padding: 0;
  min-width: 0;
  min-height: 0;
  color: #f0d495;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.footer-clean .crisis-line a:hover { color: #fff1ce; }
.footer-clean .footer-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px 32px;
  margin-top: 26px;
}
.footer-clean .brand { width: fit-content; font-size: 32px; color: #eeebdd; }
.footer-clean .brand-mark { width: 44px; height: 44px; }
/* The brand sign-off under the logo (owner 2026-10-02): small and muted, lined up with the name (the 44px door + 4px
   gap); #a3b19c on #12241b is 7.2:1. On phones it is centered under the logo with the rest of the row. */
.footer-clean .footer-brand { display: flex; flex-direction: column; align-items: flex-start; }
.footer-clean .footer-tagline { margin: 0; padding-left: 48px; font-size: 13px; line-height: 1.4; letter-spacing: .02em; color: #a3b19c; }
.footer-clean .footer-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 12px 28px; }
.footer-clean .social-icons { gap: 10px; }
.footer-clean .social-icons button { width: 44px; height: 44px; opacity: 1; color: #cad5be; background: #1b3426; }
.footer-clean .footer-links { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #c0cdb4; }
.footer-clean .footer-links a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 4px; color: #c0cdb4; }
.footer-clean .footer-links a:hover { color: #f2e7c4; }
/* The fine print sits right under the row (no hairline), so the footer reads as one (owner polish 2026-10-01). */
.footer-clean .footer-fineprint { margin-top: 6px; font-size: 12px; line-height: 1.6; color: #a3b19c; }
.footer-clean :focus-visible { outline-color: #f2c14e; }
@media (max-width: 600px) {
  /* Phones: the crisis line centered and stacked, its two sentences on their own lines (owner polish 2026-10-01). */
  .footer-clean .footer-crisis { flex-direction: column; align-items: center; gap: 6px; padding: 14px 18px; text-align: center; }
  .footer-clean .footer-crisis > svg { margin-top: 0; }
  .footer-clean .crisis-line { max-width: 30ch; margin: 0 auto; line-height: 1.6; text-align: center; text-wrap: balance; }
  .footer-clean .crisis-part { display: block; }
  .footer-clean .crisis-part + .crisis-part { margin-top: 6px; }
  .footer-clean .footer-row { flex-direction: column; justify-content: center; gap: 14px; margin-top: 24px; text-align: center; }
  .footer-clean .footer-brand { align-items: center; }
  .footer-clean .footer-tagline { padding-left: 0; }
  /* The closing text's last break is for wide screens; on a phone the long middle line would leave a stray fragment. */
  .closing-content .wide-break { display: none; }
  .footer-clean .footer-actions { flex-direction: column; justify-content: center; gap: 8px; }
  .footer-clean .footer-fineprint { margin-top: 4px; text-align: center; text-wrap: balance; }
}

/* Contrast (repo review 2026-09-30): the About eyebrow was #67755d on #f5f2e9, 4.38:1; 3% darker reaches 4.63:1 (AA). */
.founder-story > .eyebrow { color: #64715a; }

/* Closing section without the door mark and the "The app" label (owner request 2026-10-01). The section gives up their
   height (153px on desktop, 139px at 900px and below), so the headline sits where the mark was and the photo keeps the
   same breathing room above and below the text. */
.closing { min-height: 540px; }
@media (max-width: 900px) { .closing { min-height: 530px; } }

/* Closing + footer polish (owner feedback 2026-10-01, mainly phones).
   - The text block is centered in the VISIBLE photo: the section's bottom padding equals the dark band where the photo
     fades into the footer green, so flex centering happens above it and the sky is not left empty.
   - Phones: the photo box is taller than the section and anchored at the top, which crops the dark rocky foreground; the
     fade is shorter; and the footer is pulled up so the crisis line sits just under the mountains, starting in the
     dark end of the fade (the footer's own top edge is transparent there). */
.closing { padding-bottom: var(--closing-fade, 0px); --closing-fade: 100px; }
/* clip, not hidden: the phone photo box is taller than the section, and a hidden overflow can still be scrolled by
   script (scrollIntoView, find in page), which would slide the text out of place. clip cannot scroll. */
.closing { overflow: hidden; overflow: clip; }
@media (min-width: 901px) { .closing-content { padding-block: 40px; } }
@media (max-width: 600px) {
  .closing { min-height: 470px; --closing-fade: 26px; }
  .closing-content { padding-top: 76px; }
  .closing-photo { height: 128%; object-position: 55% top; }
  .closing-shade { background: linear-gradient(180deg, #1c372771 0%, #25422b55 35%, #13281b70 80%, #12241b 100%); }
  .footer-clean { position: relative; z-index: 1; margin-top: -24px; background: linear-gradient(180deg, #12241b00 0, #12241b 24px); }
}

/* The About signature in capitals (owner 2026-10-02). CSS only, so the text stays "Cory G., founder" for screen
   readers. The same 16px and colour (#61705a on #f5f2e9, 4.7:1), spaced like the small eyebrow labels (the Family
   section's are .13em at every width). */
.founder-story .founder-signoff { text-transform: uppercase; letter-spacing: .13em; }
/* "CORY G · FOUNDER" (owner 2026-10-02): the name as above; a middle dot, decorative (aria-hidden; the spaces either side
   sit outside it, so screen readers hear "Cory G founder"); "FOUNDER" at 75% of the name (12px) in the same spaced
   capitals (.13em of its own size, as the 12px eyebrow labels) and colour, 4.7:1, sharing the name's baseline. */
.founder-story .founder-signoff .signoff-role { font-size: .75em; letter-spacing: .13em; vertical-align: baseline; }