/* Longevity Club page — v7 additions (action plan LC-02, LC-03, LC-09, LC-10, LC-13/14, LC-17, LC-22, LC-24).
   Uses the tokens already defined in style-1-85eb0ac4.css; no existing rule is changed. */

/* Breadcrumb / return route */
.lc-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 22px;font-size:13px;color:var(--muted)}
.lc-crumbs a{color:var(--blue);font-weight:600}
.lc-crumbs a:hover{color:var(--blue-dk);text-decoration:underline;text-underline-offset:3px}
.lc-crumbs [aria-current]{color:var(--title);font-weight:600}

/* Hero: one primary action into the app, one route choice, then store buttons */
.lc-hero-primary{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px;max-width:470px}
.lc-hero-primary .hero-action{flex:1 1 200px;min-height:52px;padding:0 20px;font-size:15px;font-weight:700;border-radius:12px}
.lc-hero-primary .hero-action svg{width:17px;height:17px;flex:none}
.lc-hero-primary .hero-action.is-doc{color:var(--title)}
.lc-app-buttons{margin-top:12px!important}
.lc-app-buttons .app-btn{min-height:46px;font-size:14px}
.lc-ext{width:15px;height:15px;flex:none}
.lc-ask{margin:16px 0 0;font-size:14px;color:var(--muted)}
.lc-ask a{display:inline-flex;align-items:center;gap:5px;color:var(--blue);font-weight:650}
.lc-ask a:hover{color:var(--blue-dk)}
.lc-ask svg{width:15px;height:15px}

/* Choose your membership: key facts per route (mirrors each role page) */
#membership-partnerships .mp-facts{display:grid;gap:0;margin:16px 0 0;padding:0}
#membership-partnerships .mp-facts div{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;padding:9px 0;border-top:1px solid var(--border)}
#membership-partnerships .mp-facts dt{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);line-height:1.5}
#membership-partnerships .mp-facts dd{margin:0;font-size:13.5px;line-height:1.5;color:var(--title)}
#membership-partnerships .lc-mp-overview{margin-top:16px;box-shadow:none}

/* The cards: caption under each card explains its role */
.lc-card-fig{margin:0;display:flex;flex-direction:column;align-items:center;gap:22px;min-width:0}
.lc-card-cap{display:grid;gap:6px;width:100%;max-width:380px;font-size:14px;line-height:1.55;color:var(--muted)}
.lc-card-cap strong{font-size:17px;font-weight:700;color:var(--title)}
.lc-cap-kicker{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}
.lc-card-cap .card-cta{padding-top:4px}
.lc-card-cap .card-cta svg{width:15px;height:15px}

/* FAQ answers with links */
.faq-panel-inner a{color:var(--blue);font-weight:600;text-decoration:underline;text-underline-offset:2px}

/* Next step: join in the app, or ask first */
#join{background:#fff}
.lc-join{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:18px;align-items:stretch}
.lc-join-main{background:var(--band);color:#fff;border-radius:20px;padding:36px 36px 34px}
.lc-join-main .eyebrow{color:#BEE3FF}
.lc-join-main .eyebrow::before{background:#BEE3FF}
.lc-join-main h2{color:#fff;margin:0}
.lc-join-main .body-p{color:var(--dk-muted);margin-top:12px}
.lc-join-apps{grid-template-columns:repeat(3,minmax(0,1fr))!important;max-width:620px!important;margin-top:22px!important}
.lc-join-apps .app-btn,.lc-join-apps .app-btn.is-blue,.lc-join-apps .app-btn.is-white{background:#fff;color:var(--title);border-color:#fff;min-height:48px;font-size:14px;box-shadow:none}
.lc-join-apps .app-btn:hover{background:#EDF6FD}
.lc-join-side{display:flex;flex-direction:column;align-items:flex-start;gap:12px;border:1px solid var(--border);border-radius:20px;padding:32px 30px;background:var(--surface)}
.lc-join-side h3{margin:0;font-size:19px;font-weight:700;color:var(--title)}
.lc-join-side p{margin:0;font-size:14px;line-height:1.6;color:var(--muted)}
.lc-join-side .btn{margin-top:6px;min-height:46px;padding:0 20px;font-size:14px}
.lc-join-side .btn svg{width:15px;height:15px}
.lc-side-link{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:650;color:var(--blue)}
.lc-side-link svg{width:15px;height:15px}
.lc-side-link:hover{color:var(--blue-dk)}

@media (max-width:900px){
  .lc-join{grid-template-columns:1fr}
}
@media (max-width:760px){
  .lc-join-apps{grid-template-columns:1fr!important}
  .lc-join-main{padding:28px 22px}
  .lc-join-side{padding:26px 22px}
  .lc-hero-primary{max-width:100%}
  .lc-hero-primary .hero-action{flex-basis:100%}
  #membership-partnerships .mp-facts div{grid-template-columns:84px minmax(0,1fr)}
}

/* Anchored sections clear the sticky header */
#membership-partnerships,#rewards-hub,#join,#faq,#the-cards{scroll-margin-top:92px}
#the-cards .cards-stage{align-items:flex-start}
/* Phones: keep store buttons in two compact columns */
@media (max-width:760px){
  .hero-top .app-buttons.lc-app-buttons{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .lc-app-buttons .app-btn{padding:9px 10px;font-size:13.5px}
}
@media (max-width:340px){
  .hero-top .app-buttons.lc-app-buttons{grid-template-columns:1fr!important}
}

/* Longevity Club logo (header + footer): vector recreation of the deck logo, hourglass mark + Comfortaa Bold wordmark */
.lg-ref-brand.lc-brand{color:#18395F}
.lg-ref-brand.lc-brand .lc-logo{display:block;width:auto!important;flex:0 0 auto;shape-rendering:geometricPrecision}
.lg-ref-nav .lg-ref-brand.lc-brand .lc-logo{height:50px!important}
.lg-ref-footer .lg-ref-brand.lc-brand .lc-logo{height:46px!important}
@media (max-width:600px){.lg-ref-nav .lg-ref-brand.lc-brand .lc-logo{height:44px!important}}
@media (max-width:360px){.lg-ref-nav .lg-ref-brand.lc-brand .lc-logo{height:38px!important}}