/* ═════════════════════════════════════════════════════════════════
   LAST LIFE EVER — shared brand styles
   Paste ONCE into GHL site-level custom CSS (Sites → Settings → Custom CSS),
   or keep the <link> tag when previewing locally.
   Every selector is scoped under .lle- prefixes to avoid GHL collisions.
   Fonts (add to site-level head tracking code):
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,300;9..144,400;9..144,500;9..144,600&family=Hanken+Grotesk:wght@400;500;600;700&display=swap" rel="stylesheet">
   ═════════════════════════════════════════════════════════════════ */

:root{
  /* Core */
  --lle-navy:#01426A;        /* Nantucket Navy: primary anchor */
  --lle-navy-2:#013455;      /* deeper panels */
  --lle-navy-3:#012840;      /* footer / darkest */
  --lle-ivory:#F5F2EB;       /* Ivory Linen: canvas */
  /* Action — Soft Coral Blush, FINAL (decided 2026-07-05): 5.0:1 on navy, AA */
  --lle-coral:#EF9F86;
  --lle-coral-hover:#F4AE97;
  /* Accents */
  --lle-seaside:#A8C5D1;     /* Jeff's voice */
  --lle-slate:#3E6073;
  --lle-seagrass:#9BAE92;
  /* Neutrals */
  --lle-sand:#E8DCC3;        /* warm panel bg */
  --lle-taupe:#B6A28E;       /* borders, captions, muted only */
  /* Derived */
  --lle-ink-dim:rgba(1,52,85,0.78);
  --lle-ink-faint:rgba(1,52,85,0.52);
  --lle-ivory-dim:rgba(245,242,235,0.72);
  --lle-ivory-faint:rgba(245,242,235,0.44);
  --lle-rule-dark:rgba(245,242,235,0.18);
  --lle-rule-light:rgba(1,66,106,0.16);
  --lle-measure:38rem;
}

/* ---------- page scope ---------- */
.lle-page{
  margin:0;
  background:var(--lle-ivory);
  color:var(--lle-navy);
  font-family:"Hanken Grotesk",system-ui,sans-serif;
  font-size:clamp(1.02rem,0.62rem + 0.7vw,1.18rem);
  line-height:1.72;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.lle-page *,.lle-page *::before,.lle-page *::after{box-sizing:border-box;}
.lle-page img{max-width:100%;display:block;}
/* :where() keeps these base rules at class-level specificity so component
   classes (.lle-btn, .lle-beat, .lle-h2, ...) can override them */
.lle-page :where(h1,h2,h3){
  font-family:"Fraunces",Georgia,serif;
  font-weight:400;
  line-height:1.06;
  margin:0;
  letter-spacing:-0.01em;
}
.lle-page :where(p){margin:0 0 1.35rem;}
.lle-page :where(p:last-child){margin-bottom:0;}
.lle-page :where(a){color:inherit;}
.lle-page a:focus-visible{outline:2px solid var(--lle-coral);outline-offset:2px;}
.lle-page :where(ul){margin:0;padding:0;}

/* ---------- layout ---------- */
.lle-wrap{max-width:72rem;margin:0 auto;padding:0 1.6rem;}
.lle-narrow{max-width:var(--lle-measure);margin-left:auto;margin-right:auto;}
.lle-section{padding:clamp(3.8rem,8vh,6rem) 0;}
.lle-section--navy{background:var(--lle-navy);color:var(--lle-ivory);}
.lle-section--deep{background:var(--lle-navy-2);color:var(--lle-ivory);}
.lle-section--deepest{background:var(--lle-navy-3);color:var(--lle-ivory);}
.lle-section--sand{background:var(--lle-sand);}
.lle-horizon{
  width:100%;height:1px;border:0;margin:clamp(3rem,6vh,5rem) 0 0;
  background:linear-gradient(90deg,transparent,var(--lle-rule-dark) 20%,var(--lle-rule-dark) 80%,transparent);
}
.lle-horizon--light{background:linear-gradient(90deg,transparent,var(--lle-rule-light) 20%,var(--lle-rule-light) 80%,transparent);}

/* ---------- type helpers ---------- */
.lle-eyebrow{
  display:block;
  font-size:0.72rem;
  letter-spacing:0.28em;
  text-transform:uppercase;
  font-weight:600;
  color:var(--lle-ink-faint);
  margin-bottom:1.6rem;
}
.lle-section--navy .lle-eyebrow,
.lle-section--deep .lle-eyebrow,
.lle-section--deepest .lle-eyebrow{color:var(--lle-ivory-faint);}
/* photo/dark heroes never matched the section rules above, leaving the small
   eyebrow text dark-on-dark; give every dark hero a bright ivory eyebrow */
.lle-home-hero .lle-eyebrow,.lle-dr-hero .lle-eyebrow,.lle-eg-hero .lle-eyebrow,
.lle-join-hero .lle-eyebrow,.lle-gr-hero .lle-eyebrow,.lle-story-hero .lle-eyebrow,
.lle-capture .lle-eyebrow{color:var(--lle-ivory-dim);}
.lle-eyebrow--coral{color:var(--lle-coral) !important;}
.lle-h1{font-size:clamp(2.5rem,1.2rem + 5.4vw,5rem);font-weight:300;}
.lle-h2{font-size:clamp(1.9rem,1.1rem + 2.6vw,3rem);margin-bottom:1.8rem;}
.lle-h3{font-size:clamp(1.25rem,1rem + 0.9vw,1.6rem);margin-bottom:0.8rem;}
.lle-lede{font-size:1.08em;color:var(--lle-ink-dim);}
.lle-section--navy .lle-lede,
.lle-section--deep .lle-lede,
.lle-section--deepest .lle-lede{color:var(--lle-ivory-dim);}
.lle-lift{color:var(--lle-coral);font-style:italic;}
.lle-lift-cool{color:var(--lle-seaside);font-style:italic;}
.lle-beat{
  font-family:"Fraunces",Georgia,serif;
  font-size:clamp(1.35rem,0.9rem + 1.5vw,1.9rem);
  line-height:1.28;letter-spacing:-0.01em;
  margin:2.2rem 0;
}
.lle-beat--coral{color:var(--lle-coral);}
.lle-beat--seaside{color:var(--lle-seaside);}
.lle-muted{color:var(--lle-taupe);}

/* ---------- voice labels (two-narrator system) ---------- */
.lle-voice{display:flex;align-items:center;gap:0.85rem;margin-bottom:1.7rem;}
.lle-voice .lle-dot{width:0.6rem;height:0.6rem;border-radius:50%;flex:none;}
.lle-voice .lle-who{
  font-size:0.72rem;letter-spacing:0.24em;text-transform:uppercase;
  font-weight:600;color:var(--lle-ivory-dim);
}
.lle-dot--coral{background:var(--lle-coral);}
.lle-dot--seaside{background:var(--lle-seaside);}
.lle-dot--taupe{background:var(--lle-taupe);}

/* ---------- buttons ---------- */
.lle-btn{
  display:inline-block;
  background:var(--lle-coral);
  color:var(--lle-navy-3);
  font-family:"Hanken Grotesk",system-ui,sans-serif;
  font-weight:600;font-size:0.95rem;letter-spacing:0.02em;
  text-decoration:none;
  padding:1.05rem 2.6rem;border-radius:2rem;border:0;cursor:pointer;
  transition:transform 0.18s ease,background 0.18s ease;
}
.lle-btn:hover{transform:translateY(-2px);background:var(--lle-coral-hover);}
.lle-btn:focus-visible{outline:3px solid var(--lle-seaside);outline-offset:3px;}
.lle-btn--ghost{
  background:transparent;color:var(--lle-ivory);
  box-shadow:inset 0 0 0 1px var(--lle-rule-dark);
}
.lle-btn--ghost:hover{background:rgba(245,242,235,0.08);}
.lle-btn--ghost-light{
  background:transparent;color:var(--lle-navy);
  box-shadow:inset 0 0 0 1px var(--lle-rule-light);
}
.lle-btn--ghost-light:hover{background:rgba(1,66,106,0.06);}
.lle-btn-row{display:flex;gap:1rem;flex-wrap:wrap;align-items:center;}

/* ---------- nav ---------- */
.lle-nav{
  background:var(--lle-ivory);
  border-bottom:1px solid var(--lle-rule-light);
  position:relative;z-index:20;
}
.lle-nav-inner{
  display:flex;align-items:center;justify-content:space-between;
  gap:1rem;flex-wrap:wrap;
  padding-top:1.1rem;padding-bottom:1.1rem;
}
.lle-logo{
  font-family:"Fraunces",Georgia,serif;
  font-size:1.25rem;font-weight:500;letter-spacing:0.01em;
  color:var(--lle-navy);text-decoration:none;white-space:nowrap;
}
.lle-logo img{height:4.25rem;width:auto;display:inline-block;}
.lle-footer .lle-logo img{height:6rem;}
@media (max-width:640px){.lle-logo img{height:3.4rem;}}
.lle-nav-links{display:flex;align-items:center;gap:1.6rem;flex-wrap:wrap;}
.lle-nav-links a{
  font-size:0.88rem;font-weight:600;letter-spacing:0.04em;
  text-decoration:none;color:var(--lle-ink-dim);
}
.lle-nav-links a:hover{color:var(--lle-navy);}
.lle-nav-links .lle-btn{padding:0.6rem 1.5rem;font-size:0.85rem;}
@media (max-width:640px){
  .lle-nav-links{gap:1rem;}
  .lle-nav-links a{font-size:0.8rem;}
}

/* ---------- photo placeholders (swap for real images; keep the <figure>) ---------- */
.lle-photo{
  position:relative;margin:0;overflow:hidden;border-radius:0.6rem;
  background:
    linear-gradient(180deg,var(--lle-slate) 0%,var(--lle-navy) 55%,var(--lle-navy-2) 55.2%,var(--lle-navy-3) 100%);
  border:1px dashed var(--lle-taupe);
  display:flex;align-items:center;justify-content:center;text-align:center;
}
.lle-photo::after{ /* horizon line in the placeholder art */
  content:"";position:absolute;left:0;right:0;top:55%;height:1px;
  background:rgba(245,242,235,0.35);
}
.lle-photo-label{
  position:relative;z-index:1;
  color:var(--lle-ivory-dim);
  font-family:"Hanken Grotesk",system-ui,sans-serif;
  font-size:0.78rem;letter-spacing:0.08em;line-height:1.5;
  padding:1rem 1.4rem;max-width:34rem;
}
.lle-photo--hero{aspect-ratio:16/7;border-radius:0;}
.lle-photo--wide{aspect-ratio:16/9;}
.lle-photo--card{aspect-ratio:4/3;}
.lle-photo--portrait{aspect-ratio:3/4;}
.lle-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.lle-photo--filled{border:0;}
.lle-photo--filled::after{display:none;}
@media (max-width:640px){.lle-photo--hero{aspect-ratio:4/3;}}

/* ---------- trip cards ---------- */
.lle-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(19rem,1fr));gap:1.6rem;margin-top:2.4rem;}
.lle-card{
  background:var(--lle-ivory);
  border:1px solid var(--lle-rule-light);
  border-radius:0.8rem;overflow:hidden;
  display:flex;flex-direction:column;
}
.lle-card-body{padding:1.8rem;display:flex;flex-direction:column;gap:0.4rem;flex:1;}
.lle-card-eyebrow{
  font-size:0.7rem;letter-spacing:0.22em;text-transform:uppercase;font-weight:700;
  color:var(--lle-slate);margin-bottom:0.6rem;
}
.lle-card-eyebrow strong{color:var(--lle-coral);font-weight:700;}
.lle-card h3{font-size:1.45rem;margin-bottom:0.6rem;}
.lle-card p{font-size:0.95rem;color:var(--lle-ink-dim);}
.lle-card .lle-btn{margin-top:auto;align-self:flex-start;padding:0.75rem 1.8rem;font-size:0.88rem;}
.lle-card-body .lle-card-copy{margin-bottom:1.4rem;}

/* ---------- facts bar (trip pages) ---------- */
.lle-facts{
  display:flex;flex-wrap:wrap;gap:0;margin:0;padding:0;list-style:none;
  border:1px solid var(--lle-rule-light);border-radius:0.8rem;overflow:hidden;
  background:var(--lle-ivory);
}
.lle-facts li{
  flex:1 1 12rem;padding:1.3rem 1.5rem;
  border-right:1px solid var(--lle-rule-light);
}
.lle-facts li:last-child{border-right:0;}
.lle-facts .lle-fact-k{
  display:block;font-size:0.68rem;letter-spacing:0.2em;text-transform:uppercase;
  font-weight:700;color:var(--lle-ink-faint);margin-bottom:0.25rem;
}
.lle-facts .lle-fact-v{font-family:"Fraunces",Georgia,serif;font-size:1.15rem;}
@media (max-width:760px){
  .lle-facts li{flex:1 1 100%;border-right:0;border-bottom:1px solid var(--lle-rule-light);}
  .lle-facts li:last-child{border-bottom:0;}
}

/* ---------- pillars ---------- */
.lle-pillars{display:flex;flex-wrap:wrap;gap:0.7rem;margin-top:2.2rem;list-style:none;}
.lle-pillars li{
  border:1px solid var(--lle-rule-light);border-radius:2rem;
  padding:0.5rem 1.1rem;font-size:0.82rem;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--lle-ink-dim);
}
.lle-section--navy .lle-pillars li,
.lle-section--deep .lle-pillars li,
.lle-section--deepest .lle-pillars li{border-color:var(--lle-rule-dark);color:var(--lle-ivory-dim);}
.lle-pillars li.lle-pillar--lead{border-color:rgba(239,159,134,0.6);color:var(--lle-coral);}

/* pillar detail grid (home + story) */
.lle-pillar-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));
  gap:1.4rem;margin-top:2.6rem;list-style:none;
}
.lle-pillar-grid li{padding:1.4rem;border:1px solid var(--lle-rule-light);border-radius:0.8rem;}
.lle-pillar-grid .lle-pillar-name{
  font-family:"Fraunces",Georgia,serif;font-size:1.15rem;display:block;margin-bottom:0.4rem;
}
.lle-pillar-grid p{font-size:0.9rem;color:var(--lle-ink-dim);margin:0;}
.lle-pillar-grid li.lle-pillar--lead{border-color:rgba(239,159,134,0.6);}
.lle-pillar-grid li.lle-pillar--lead .lle-pillar-name{color:var(--lle-coral);}

/* ---------- capture forms (post to lle-form-proxy worker → GHL) ---------- */
.lle-form{max-width:34rem;margin:2.2rem auto 0;text-align:left;}
.lle-form-row{display:flex;gap:0.8rem;flex-wrap:wrap;margin-bottom:0.8rem;}
.lle-form input,.lle-form select,.lle-form textarea{
  flex:1 1 11rem;min-width:0;width:100%;
  font-family:"Hanken Grotesk",system-ui,sans-serif;
  font-size:0.95rem;color:var(--lle-navy);
  background:#fff;
  border:1px solid var(--lle-rule-light);border-radius:2rem;
  padding:0.9rem 1.3rem;
}
.lle-form textarea{border-radius:1rem;min-height:6.5rem;resize:vertical;}
.lle-form input::placeholder,.lle-form textarea::placeholder{color:var(--lle-ink-faint);}
.lle-form input:focus-visible,.lle-form select:focus-visible,.lle-form textarea:focus-visible{
  outline:3px solid var(--lle-coral);outline-offset:1px;
}
.lle-form .lle-btn{flex:0 0 auto;padding:0.9rem 2.2rem;}
.lle-form .lle-btn:disabled{opacity:0.6;transform:none;cursor:wait;}
/* dark-section variant */
.lle-form--dark input,.lle-form--dark select,.lle-form--dark textarea{
  background:rgba(245,242,235,0.1);color:var(--lle-ivory);
  border-color:var(--lle-rule-dark);
}
.lle-form--dark input::placeholder,.lle-form--dark textarea::placeholder{color:var(--lle-ivory-faint);}
.lle-form--dark select option{color:var(--lle-navy);}
/* status message + honeypot */
.lle-form-msg{display:none;font-size:0.92rem;margin:0.4rem 0 0;text-align:center;}
.lle-form-msg--ok{display:block;color:var(--lle-seagrass);}
.lle-form-msg--err{display:block;color:var(--lle-coral);}
.lle-hp{position:absolute !important;left:-5000px !important;opacity:0;pointer-events:none;height:0;width:0;}

/* ---------- video blocks (click to load the player) ---------- */
.lle-video{
  position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:0.8rem;
  background:linear-gradient(135deg,var(--lle-navy) 0%,var(--lle-navy-3) 100%);
  margin:2.4rem auto 0;max-width:44rem;
}
.lle-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.lle-video-play{
  position:absolute;inset:0;width:100%;height:100%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.2rem;
  background:transparent;border:0;cursor:pointer;color:var(--lle-ivory);
}
.lle-video-play .lle-play-circle{
  width:4.5rem;height:4.5rem;border-radius:50%;background:var(--lle-coral);
  display:flex;align-items:center;justify-content:center;flex:none;
  transition:transform 0.18s ease;
}
.lle-video-play:hover .lle-play-circle{transform:scale(1.06);}
.lle-video-play:focus-visible{outline:3px solid var(--lle-coral);outline-offset:-3px;}
.lle-play-circle::after{
  content:"";display:block;margin-left:0.3rem;
  border-style:solid;border-width:0.7rem 0 0.7rem 1.2rem;
  border-color:transparent transparent transparent var(--lle-navy-3);
}
.lle-video-label{
  font-family:"Fraunces",Georgia,serif;font-size:1.15rem;letter-spacing:0.01em;
  color:var(--lle-ivory);padding:0 1rem;text-align:center;
}
@media (prefers-reduced-motion:reduce){
  .lle-video-play .lle-play-circle{transition:none;}
  .lle-video-play:hover .lle-play-circle{transform:none;}
}

/* ---------- capture band ---------- */
.lle-capture{text-align:center;}
.lle-capture .lle-h2{max-width:22ch;margin-left:auto;margin-right:auto;}
.lle-capture .lle-fine{
  margin-top:1.8rem;font-size:0.8rem;letter-spacing:0.04em;color:var(--lle-ivory-faint);
}

/* ---------- footer ---------- */
.lle-footer{background:var(--lle-navy-3);color:var(--lle-ivory);padding:clamp(3rem,6vh,4.5rem) 0 2.5rem;}
.lle-footer-grid{
  display:flex;flex-wrap:wrap;gap:2.5rem;justify-content:space-between;align-items:flex-start;
}
.lle-footer .lle-logo{color:var(--lle-ivory);font-size:1.35rem;}
.lle-footer-tag{margin-top:0.8rem;font-size:0.9rem;color:var(--lle-ivory-dim);max-width:22rem;}
.lle-footer-links{display:flex;gap:2.5rem;flex-wrap:wrap;list-style:none;}
.lle-footer-links a{
  display:block;font-size:0.88rem;color:var(--lle-ivory-dim);
  text-decoration:none;padding:0.25rem 0;
}
.lle-footer-links a:hover{color:var(--lle-ivory);}
.lle-footer-pillars{
  margin-top:2.8rem;padding-top:1.8rem;border-top:1px solid var(--lle-rule-dark);
  display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;
  font-size:0.75rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--lle-ivory-faint);
}

/* ---------- motion ---------- */
.lle-fade{opacity:0;transform:translateY(14px);animation:lle-rise 0.9s cubic-bezier(.2,.7,.2,1) forwards;}
.lle-fade.lle-d1{animation-delay:0.12s;}
.lle-fade.lle-d2{animation-delay:0.24s;}
@keyframes lle-rise{to{opacity:1;transform:none;}}
@media (prefers-reduced-motion:reduce){
  .lle-fade{opacity:1;transform:none;animation:none;}
  .lle-btn{transition:none;}
  .lle-btn:hover{transform:none;}
}
