/* Shared marketing / public pages — matches homepage premium tone.
   Scope: body.page-marketing (and body.page-home). Does not target race/map shells. */

body.page-marketing,
body.page-home{
  color: var(--ink);
  background: var(--warm);
}

body.page-marketing .site-nav,
body.page-home .site-nav{
  background: rgba(7,29,43,.94);
}
body.page-marketing a{ color: #0F6E66; }
body.page-marketing a:hover{ color: #0A534D; }

/* Nav is dark — never inherit body ink onto brand / menu links */
body.page-marketing .site-brand,
body.page-marketing .site-brand:hover,
body.page-home .site-brand,
body.page-home .site-brand:hover,
body.page-marketing .site-nav .site-brand,
body.page-marketing .site-nav .site-brand:hover,
body.page-home .site-nav .site-brand,
body.page-home .site-nav .site-brand:hover{
  color: #fff;
}
body.page-marketing .site-nav-menu a,
body.page-home .site-nav-menu a{ color: rgba(247,248,245,.86); }
body.page-marketing .site-nav-menu a:hover,
body.page-marketing .site-nav-menu a.active,
body.page-home .site-nav-menu a:hover,
body.page-home .site-nav-menu a.active{ color: #fff; }
body.page-marketing .site-nav-menu a.nav-cta,
body.page-marketing .site-nav-menu a.nav-cta:hover,
body.page-home .site-nav-menu a.nav-cta,
body.page-home .site-nav-menu a.nav-cta:hover{
  color: var(--teal-ink);
}
body.page-marketing .nav-more-btn,
body.page-home .nav-more-btn{
  color: rgba(247,248,245,.86);
}
body.page-marketing .nav-more-btn:hover,
body.page-home .nav-more-btn:hover{
  color: #fff;
}
body.page-marketing .nav-text-link,
body.page-home .nav-text-link{ color: rgba(247,248,245,.72) !important; }
body.page-marketing .nav-text-link:hover,
body.page-home .nav-text-link:hover{ color: #fff !important; }

body.page-marketing .site-footer,
body.page-home .site-footer{
  background: var(--navy);
  color: rgba(247,248,245,.78);
}

/* ===== Hero ===== */
body.page-marketing .hero{
  text-align: left;
  color: #fff;
  padding: clamp(48px, 7vw, 88px) 0;
  border-bottom: 0;
  background:
    radial-gradient(900px 420px at 18% 10%, rgba(39,199,184,.18), transparent 60%),
    radial-gradient(700px 380px at 88% 20%, rgba(255,255,255,.06), transparent 55%),
    linear-gradient(180deg, #071D2B 0%, #0B2838 55%, #071D2B 100%);
}
body.page-marketing .hero > .container{
  max-width: var(--container);
}
body.page-marketing .hero-badge{
  border-color: rgba(39,199,184,.35);
  background: rgba(39,199,184,.12);
  color: var(--teal);
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: .78rem;
}
body.page-marketing .hero-logo{
  margin: 0 0 16px;
  width: 72px;
  filter: none;
}
body.page-marketing .hero h1{
  font-size: clamp(2.1rem, 4.5vw, 3.2rem);
  text-shadow: none;
  letter-spacing: -0.035em;
  max-width: 18ch;
  margin: 0 0 14px;
}
body.page-marketing .hero .subtitle{
  color: rgba(247,248,245,.82);
  font-size: 1.08rem;
  line-height: 1.55;
  max-width: 46ch;
  margin: 0;
}
body.page-marketing .hero-note{
  color: rgba(247,248,245,.58);
  margin-top: 16px;
}
body.page-marketing .hero-cta{
  justify-content: flex-start;
  margin-top: 28px;
  gap: 12px;
}
body.page-marketing .hero-secondary a{
  border-color: rgba(255,255,255,.22);
  color: rgba(247,248,245,.8);
}
/* Ghost CTAs stay light inside dark heroes (even if nested oddly) */
body.page-marketing .hero .btn-ghost,
body.page-marketing .hero .btn-ghost:hover{
  color: #fff;
  border-color: rgba(255,255,255,.28);
  background: transparent;
}
body.page-marketing .hero .btn-ghost:hover{
  border-color: rgba(255,255,255,.55);
  background: rgba(255,255,255,.06);
}

/* ===== Buttons ===== */
body.page-marketing .btn-primary,
body.page-marketing .btn-ghost,
body.page-marketing .lcd-btn,
body.page-marketing button[type="submit"]{
  min-height: 48px;
  border-radius: 14px;
  font-weight: 800;
  box-shadow: none;
}
body.page-marketing .btn-primary,
body.page-marketing .btn-android,
body.page-marketing .btn-testflight,
body.page-marketing .btn-map{
  background: var(--teal);
  color: var(--teal-ink);
  border: 1px solid transparent;
}
body.page-marketing .btn-primary:hover,
body.page-marketing .btn-android:hover,
body.page-marketing .btn-testflight:hover,
body.page-marketing .btn-map:hover{
  filter: brightness(1.03);
  color: var(--teal-ink);
  text-decoration: none;
}
body.page-marketing .btn-ghost{
  background: transparent;
  color: #fff;
  border: 1px solid rgba(255,255,255,.28);
}
body.page-marketing .btn-ghost:hover{
  color: #fff;
  border-color: rgba(255,255,255,.55);
  background: rgba(255,255,255,.06);
  text-decoration: none;
}
body.page-marketing main .btn-ghost{
  color: var(--ink);
  border-color: var(--line);
  background: #fff;
}
body.page-marketing main .btn-ghost:hover{
  color: var(--ink);
  border-color: #c8d4d6;
  background: var(--warm);
}
body.page-marketing button[type="submit"],
body.page-marketing .form button{
  background: var(--teal);
  color: var(--teal-ink);
  border: 0;
}
body.page-marketing button[type="submit"]:hover,
body.page-marketing .form button:hover{
  filter: brightness(1.03);
}

/* ===== Sections / typography ===== */
body.page-marketing .section{
  padding: clamp(48px, 8vw, 96px) 0;
  background: transparent;
  border: 0;
}
body.page-marketing .section.alt{
  background: #fff;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
body.page-marketing h1,
body.page-marketing h2,
body.page-marketing h3{
  color: var(--ink);
  font-family: var(--display);
  letter-spacing: -0.02em;
}
body.page-marketing h2{
  font-size: clamp(1.7rem, 3vw, 2.35rem);
  margin: 0 0 12px;
}
body.page-marketing h3{
  font-size: 1.1rem;
  margin: 0 0 8px;
}
/* Footer labels — never inherit display/h2 scale from marketing typography */
body.page-marketing .site-footer .site-footer-heading,
body.page-home .site-footer .site-footer-heading,
body.page-marketing .site-footer h2.site-footer-heading,
body.page-home .site-footer h2.site-footer-heading,
body.page-marketing .site-footer p.site-footer-heading,
body.page-home .site-footer p.site-footer-heading{
  font-size: .72rem !important;
  line-height: 1.35 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  margin: 0 0 14px !important;
  font-family: inherit !important;
  color: rgba(247,248,245,.55) !important;
}
body.page-marketing p{ color: var(--ink); }
body.page-marketing .muted{ color: var(--ink-muted); }
body.page-marketing li{ color: var(--ink); }
body.page-marketing .steps li{ color: var(--ink); }

/*
 * Dark surfaces — must beat the blanket h1/h2/h3/p/li/a rules above.
 * Covers: marketing heroes, homepage hero/clubs, marinas catalogue hero, shared footer.
 */
body.page-marketing .hero,
body.page-marketing .home-hero,
body.page-marketing .home-clubs,
body.page-marketing .mp-hero,
body.page-marketing .site-footer,
body.page-home .home-hero,
body.page-home .home-clubs,
body.page-home .site-footer{
  color: rgba(247,248,245,.86);
}
body.page-marketing .hero h1,
body.page-marketing .hero h2,
body.page-marketing .hero h3,
body.page-marketing .home-hero h1,
body.page-marketing .home-hero h2,
body.page-marketing .home-hero h3,
body.page-marketing .home-clubs h1,
body.page-marketing .home-clubs h2,
body.page-marketing .home-clubs h3,
body.page-marketing .home-clubs .home-title,
body.page-marketing .mp-hero h1,
body.page-marketing .mp-hero h2,
body.page-marketing .mp-hero h3,
body.page-marketing .site-footer h1,
body.page-marketing .site-footer h2,
body.page-marketing .site-footer h3,
body.page-marketing .site-footer .site-footer-heading,
body.page-home .home-hero h1,
body.page-home .home-clubs h2,
body.page-home .home-clubs h3,
body.page-home .home-clubs .home-title,
body.page-home .site-footer h1,
body.page-home .site-footer h2,
body.page-home .site-footer h3,
body.page-home .site-footer .site-footer-heading{
  color: #fff;
}
body.page-marketing .mp-hero p,
body.page-marketing .mp-hero .mp-eyebrow,
body.page-marketing .mp-hero .mp-hero-lead{
  color: rgba(247,248,245,.82);
}
body.page-marketing .mp-hero .mp-eyebrow{
  color: #7ee7dc;
}
body.page-marketing .site-footer .site-footer-heading,
body.page-home .site-footer .site-footer-heading{
  color: rgba(247,248,245,.55) !important;
}
/* Blanket p { color: ink } must not repaint footer labels / links */
body.page-marketing .site-footer p.site-footer-heading,
body.page-home .site-footer p.site-footer-heading{
  color: rgba(247,248,245,.55) !important;
}
body.page-marketing .hero p,
body.page-marketing .hero .subtitle,
body.page-marketing .hero .muted,
body.page-marketing .hero .hero-note,
body.page-marketing .hero li,
body.page-marketing .home-hero p,
body.page-marketing .home-hero .home-hero-sub,
body.page-marketing .home-hero .home-hero-note,
body.page-marketing .home-hero .muted,
body.page-marketing .home-clubs p,
body.page-marketing .home-clubs .home-lead,
body.page-marketing .home-clubs .muted,
body.page-marketing .home-clubs li,
body.page-marketing .site-footer p,
body.page-marketing .site-footer li,
body.page-marketing .site-footer .muted,
body.page-home .home-hero p,
body.page-home .home-clubs p,
body.page-home .home-clubs li,
body.page-home .site-footer p,
body.page-home .site-footer li{
  color: rgba(247,248,245,.78);
}
body.page-marketing .hero .hero-note,
body.page-marketing .home-hero .home-hero-note,
body.page-marketing .site-footer .site-footer-disclaimer,
body.page-marketing .site-footer .site-footer-copy,
body.page-home .site-footer .site-footer-disclaimer,
body.page-home .site-footer .site-footer-copy{
  color: rgba(247,248,245,.58);
}
body.page-marketing .hero .home-eyebrow,
body.page-marketing .home-hero .home-eyebrow,
body.page-marketing .home-clubs .home-eyebrow,
body.page-home .home-hero .home-eyebrow,
body.page-home .home-clubs .home-eyebrow{
  color: rgba(39,199,184,.95);
}
body.page-marketing .site-footer a,
body.page-marketing .site-footer a:hover,
body.page-home .site-footer a,
body.page-home .site-footer a:hover{
  color: rgba(247,248,245,.82);
}
body.page-marketing .site-footer a:hover,
body.page-home .site-footer a:hover{
  color: #fff;
}
body.page-marketing .site-footer .site-footer-logo,
body.page-marketing .site-footer .site-footer-logo:hover,
body.page-home .site-footer .site-footer-logo,
body.page-home .site-footer .site-footer-logo:hover{
  color: #fff;
}

/* ===== Cards / callouts ===== */
body.page-marketing .card,
body.page-marketing .callout,
body.page-marketing .panel,
body.page-marketing .premium-row,
body.page-marketing .scenario-col{
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 20px;
  box-shadow: 0 8px 24px rgba(20,45,59,.04);
}
body.page-marketing .card{
  padding: 20px;
}
body.page-marketing .card p,
body.page-marketing .callout,
body.page-marketing .premium-row p{
  color: var(--ink-muted);
}
body.page-marketing .premium-tag{
  background: var(--teal);
  color: var(--teal-ink);
  border: 0;
}
body.page-marketing .premium-row{
  background: #fff;
  border-color: var(--line);
}
body.page-marketing .hiw-num{
  background: var(--teal);
  color: var(--teal-ink);
}

/* ===== Forms ===== */
body.page-marketing .form-label{ color: var(--ink); }
body.page-marketing input,
body.page-marketing textarea,
body.page-marketing select{
  background: #fff;
  border: 1px solid var(--line);
  color: var(--ink);
  border-radius: 12px;
  min-height: 48px;
}
body.page-marketing input:focus,
body.page-marketing textarea:focus,
body.page-marketing select:focus{
  outline: 2px solid rgba(39,199,184,.4);
  border-color: var(--teal);
}
body.page-marketing .form-msg.ok{ color: #0F6E66; }
body.page-marketing .form-msg.err{ color: #B42318; }

/* ===== Auth / club cards ===== */
body.page-marketing .admin-wrap{
  max-width: 520px;
  margin: 56px auto;
  padding: 0 20px 64px;
}
body.page-marketing .admin-card{
  padding: 28px;
  border-radius: 22px;
  border: 1px solid var(--line);
  background: #fff;
  box-shadow: 0 12px 32px rgba(20,45,59,.06);
}
body.page-marketing .admin-card h1{
  margin: 0 0 8px;
  font-size: 1.75rem;
}
body.page-marketing .admin-card .muted{ color: var(--ink-muted); }
body.page-marketing .admin-card .lcd-btn{
  width: 100%;
  background: #fff;
  border: 1px solid var(--line);
  color: var(--ink);
}
body.page-marketing .admin-bar h1{ color: var(--ink); }
body.page-marketing table{
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
}
body.page-marketing th,
body.page-marketing td{
  border-bottom-color: var(--line);
  color: var(--ink);
}
body.page-marketing th{ color: var(--ink-muted); font-size: .82rem; text-transform: uppercase; letter-spacing: .04em; }
body.page-marketing .code{ color: #0F6E66; }
body.page-marketing .status.live{ color: #0F6E66; }
body.page-marketing .status.draft{ color: var(--ink-muted); }
body.page-marketing .status.finished{ color: #9A6700; }

/* ===== Regattas list ===== */
body.page-marketing .filters a{
  border: 1px solid var(--line);
  color: var(--ink-muted);
  background: #fff;
  border-radius: 999px;
}
body.page-marketing .filters a.active{
  border-color: rgba(39,199,184,.45);
  background: rgba(39,199,184,.12);
  color: var(--ink);
}
body.page-marketing .reg-card{
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 20px;
  box-shadow: 0 8px 24px rgba(20,45,59,.04);
}
body.page-marketing .reg-card h3{ color: var(--ink); }
body.page-marketing .reg-meta{ color: var(--ink-muted); }
body.page-marketing .reg-meta strong{ color: var(--ink); }
body.page-marketing .badge.live{
  background: rgba(39,199,184,.16);
  color: #0F6E66;
}
body.page-marketing .badge.finished{
  background: rgba(201,162,39,.16);
  color: #9A6700;
}
body.page-marketing .badge.draft{
  background: rgba(91,110,120,.12);
  color: var(--ink-muted);
}
body.page-marketing .reg-actions a{
  background: var(--teal);
  color: var(--teal-ink);
  border: 0;
}
body.page-marketing .reg-actions a:hover{
  filter: brightness(1.03);
  color: var(--teal-ink);
  text-decoration: none;
}
body.page-marketing .reg-actions a.secondary{
  background: #fff;
  color: var(--ink);
  border: 1px solid var(--line);
}
body.page-marketing .empty{
  background: #fff;
  border: 1px dashed var(--line);
  color: var(--ink-muted);
  border-radius: 20px;
}

/* ===== Public regatta page panels ===== */
body.page-marketing .panel{
  background: #fff;
  border-color: var(--line);
  color: var(--ink);
}
body.page-marketing .rules{ color: var(--ink-muted); }
body.page-marketing .boat-chip{
  background: var(--warm);
  border-color: var(--line);
  color: var(--ink);
}
body.page-marketing .boat-chip:hover{
  border-color: rgba(39,199,184,.45);
  background: rgba(39,199,184,.08);
}
body.page-marketing .boat-chip .hint{ color: var(--ink-muted); }
body.page-marketing .boat-modal{ background: rgba(7,29,43,.72); }
body.page-marketing .boat-modal-card{
  background: #fff;
  border-color: var(--line);
  color: var(--ink);
}
body.page-marketing .boat-modal-card h2,
body.page-marketing .boat-modal-card h3{ color: var(--ink); }
body.page-marketing .boat-modal-meta span{
  background: var(--warm);
  border-color: var(--line);
  color: var(--ink);
}
body.page-marketing .crew-list li{
  background: var(--warm);
  border-color: var(--line);
}
body.page-marketing .crew-list .role{ color: #0F6E66; }
body.page-marketing .event-hero .code{ color: var(--teal); }

/* ===== Legal / prose ===== */
body.page-marketing .legal-wrap{
  padding: clamp(40px, 6vw, 72px) 0 80px;
}
body.page-marketing .legal-wrap h1{
  font-size: clamp(2rem, 4vw, 2.8rem);
  margin: 0 0 12px;
}
body.page-marketing .legal-wrap h2{
  margin-top: 32px;
  font-size: 1.25rem;
}
body.page-marketing .legal-wrap p,
body.page-marketing .legal-wrap li{
  color: var(--ink-muted);
  line-height: 1.65;
  max-width: 72ch;
}
body.page-marketing .legal-wrap strong{ color: var(--ink); }

@media (max-width: 720px){
  body.page-marketing .hero{ text-align: left; }
  body.page-marketing .hero h1{ max-width: none; }
  body.page-marketing .hero-cta .btn-primary,
  body.page-marketing .hero-cta .btn-ghost{
    width: auto;
  }
}
