/* ============================================================
   CHRONIC SUCCESS — Premium life-operating-system website
   Design system + components
   ============================================================ */

:root{
  /* Core palette */
  --cream:        #F6F1E8;
  --cream-deep:   #EFE7D8;
  --cream-card:   #FBF8F2;
  --blue:         #1E3A5F;   /* deep blue — primary */
  --blue-soft:    #2C4F7C;
  --slate:        #5B7290;   /* dusty slate blue */
  --slate-light:  #8CA0B8;
  --sand:         #E4D7C1;   /* warm sand */
  --gold:         #C8A86A;   /* very subtle gold */
  --ink:          #1A2A3D;   /* near-black, never harsh */
  --line:         rgba(30,58,95,.12);
  --line-soft:    rgba(30,58,95,.08);

  --shadow-sm: 0 1px 2px rgba(30,58,95,.05), 0 8px 24px -16px rgba(30,58,95,.25);
  --shadow-md: 0 2px 6px rgba(30,58,95,.06), 0 24px 60px -28px rgba(30,58,95,.30);
  --shadow-lg: 0 4px 12px rgba(30,58,95,.08), 0 50px 90px -40px rgba(30,58,95,.40);

  --font-display: 'Plus Jakarta Sans', system-ui, sans-serif;
  --font-serif:   'Fraunces', Georgia, serif;
  --font-body:    'Inter', system-ui, sans-serif;

  --container:      1320px;  /* comfortable default width */
  --container-wide: 1500px;  /* feature sections: hero, framework, grids, founder block */
  --measure:        62ch;    /* readable cap for long-form prose */
  --radius:    22px;
  --radius-sm: 14px;
  --ease:      cubic-bezier(.22,.61,.36,1);

  --pad-section: clamp(5rem, 11vw, 9.5rem);
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  font-family:var(--font-body);
  background:var(--cream);
  color:var(--blue);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:700; line-height:1.08; letter-spacing:-.02em; color:var(--blue); }

.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:clamp(1.25rem,5vw,2.5rem); }

/* ---------- Shared bits ---------- */
.eyebrow{
  font-family:var(--font-body);
  font-size:.78rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--slate);
}
.section{ padding-block:var(--pad-section); position:relative; }
.section__head{ max-width:720px; margin:0 auto clamp(2.75rem,6vw,4.5rem); text-align:center; }
.section__title{ font-size:clamp(2rem,4.6vw,3.4rem); margin-top:1rem; }
.section__sub{ font-size:clamp(1.05rem,1.7vw,1.3rem); color:var(--slate); margin-top:1.1rem; font-weight:400; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-family:var(--font-body); font-weight:600; font-size:.98rem;
  padding:.95em 1.7em; border-radius:100px; cursor:pointer;
  border:1px solid transparent; white-space:nowrap;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.btn--sm{ padding:.7em 1.25em; font-size:.9rem; }
.btn--lg{ padding:1.05em 2.1em; font-size:1.02rem; }
.btn--primary{ background:var(--blue); color:var(--cream); box-shadow:var(--shadow-sm); }
.btn--primary:hover{ background:var(--blue-soft); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn--ghost{ background:transparent; color:var(--blue); border-color:var(--line); }
.btn--ghost:hover{ background:rgba(30,58,95,.05); border-color:var(--slate); transform:translateY(-2px); }

/* ============================================================
   NAV
   ============================================================ */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  transition:background .4s var(--ease), box-shadow .4s var(--ease), backdrop-filter .4s var(--ease);
}
.nav__inner{ display:flex; align-items:center; justify-content:space-between; gap:1.5rem; height:78px; }
.nav.scrolled{ background:rgba(246,241,232,.82); backdrop-filter:blur(16px) saturate(140%); box-shadow:0 1px 0 var(--line-soft); }

.nav__brand{ display:inline-flex; align-items:center; gap:.6rem; font-family:var(--font-display); font-weight:700; font-size:1.06rem; letter-spacing:-.01em; }
.nav__mark{ color:var(--blue); display:inline-flex; }
/* Brand wordmark — distinct serif, more present, with registered mark */
.nav__wordmark{ color:var(--blue); font-family:var(--font-serif); font-weight:600; font-size:1.22rem; letter-spacing:-.005em; }
.nav__wordmark::after{ content:"\00AE"; font-family:var(--font-body); font-weight:600; font-size:.5em; vertical-align:super; margin-left:.14em; color:var(--gold); }

.nav__links{ display:flex; gap:2rem; }
.nav__links a{ font-size:.94rem; font-weight:500; color:var(--blue); opacity:.78; position:relative; padding-block:.3rem; transition:opacity .25s; }
.nav__links a::after{ content:""; position:absolute; left:0; bottom:0; width:0; height:1.5px; background:var(--gold); transition:width .3s var(--ease); }
.nav__links a:hover{ opacity:1; }
.nav__links a:hover::after{ width:100%; }

.nav__actions{ display:flex; gap:.6rem; align-items:center; }

.nav__toggle{ display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:8px; }
.nav__toggle span{ width:24px; height:2px; background:var(--blue); border-radius:2px; transition:transform .3s var(--ease), opacity .3s; }
.nav__toggle.open span:nth-child(1){ transform:translateY(3.5px) rotate(45deg); }
.nav__toggle.open span:nth-child(2){ transform:translateY(-3.5px) rotate(-45deg); }

.mobile-menu{
  position:fixed; inset:78px 0 auto 0; background:rgba(246,241,232,.97); backdrop-filter:blur(20px);
  display:flex; flex-direction:column; gap:.25rem; padding:1.5rem clamp(1.25rem,5vw,2.5rem) 2rem;
  transform:translateY(-12px); opacity:0; pointer-events:none; visibility:hidden;
  transition:transform .35s var(--ease), opacity .35s var(--ease), visibility .35s; z-index:99;
  box-shadow:var(--shadow-md);
}
.mobile-menu.open{ transform:translateY(0); opacity:1; pointer-events:auto; visibility:visible; }
.mobile-menu a:not(.btn){ font-family:var(--font-display); font-weight:600; font-size:1.15rem; padding:.85rem 0; border-bottom:1px solid var(--line-soft); }
.mobile-menu .btn{ margin-top:.9rem; }

/* ============================================================
   HERO
   ============================================================ */
.hero{ position:relative; min-height:100svh; display:flex; align-items:center; padding-top:120px; padding-bottom:80px; overflow:hidden; }
.hero__ambient{ position:absolute; inset:0; z-index:0; }
.blob{ position:absolute; border-radius:50%; filter:blur(60px); opacity:.55; }
.blob--1{ width:46vw; height:46vw; max-width:620px; max-height:620px; top:-10%; right:-8%; background:radial-gradient(circle at 30% 30%, rgba(92,114,144,.45), transparent 70%); animation:drift 22s var(--ease) infinite alternate; }
.blob--2{ width:40vw; height:40vw; max-width:520px; max-height:520px; bottom:-18%; left:-6%; background:radial-gradient(circle at 60% 40%, rgba(228,215,193,.7), transparent 70%); animation:drift 26s var(--ease) infinite alternate-reverse; }
.blob--3{ width:24vw; height:24vw; max-width:320px; max-height:320px; top:38%; left:42%; background:radial-gradient(circle at 50% 50%, rgba(200,168,106,.28), transparent 70%); animation:drift 30s var(--ease) infinite alternate; }
.grain{ position:absolute; inset:0; opacity:.035; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

@keyframes drift{ from{ transform:translate(0,0) scale(1); } to{ transform:translate(40px,-30px) scale(1.12); } }

.hero__inner{ position:relative; z-index:1; display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(2rem,4vw,4rem); align-items:center; }
.hero__copy{ max-width:600px; }
.hero__title{ font-size:clamp(2.6rem,6vw,4.7rem); margin:1.25rem 0 1.5rem; }
.hero__sub{ font-size:clamp(1.1rem,1.9vw,1.32rem); color:var(--slate); max-width:520px; }
.hero__cta{ display:flex; flex-wrap:wrap; gap:.9rem; margin-top:2.2rem; }
.hero__meta{ display:flex; align-items:center; gap:.7rem; margin-top:2.4rem; font-size:.84rem; color:var(--slate); font-weight:500; letter-spacing:.01em; flex-wrap:wrap; }
.hero__dot{ width:8px; height:8px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 4px rgba(200,168,106,.18); flex:none; }

/* Collage */
.hero__collage{ display:grid; grid-template-columns:repeat(2,1fr); grid-auto-rows:118px; gap:14px; }
.tile{ position:relative; border-radius:var(--radius-sm); overflow:hidden; box-shadow:var(--shadow-md); transition:transform .5s var(--ease); }
.tile--tall{ grid-row:span 2; }
.tile--wide{ grid-column:span 2; }
.tile::after{ content:""; position:absolute; inset:0; background:linear-gradient(160deg, rgba(30,58,95,.05), rgba(30,58,95,.30)); }
.tile__label{ position:absolute; left:14px; bottom:12px; z-index:2; color:var(--cream); font-size:.78rem; font-weight:600; letter-spacing:.02em; opacity:.92; }
.t1{ background:linear-gradient(150deg,#3a567d,#1E3A5F); }
.t2{ background:linear-gradient(150deg,#7c8ca3,#5B7290); }
.t3{ background:linear-gradient(150deg,#d8c8aa,#b89f74); }
.t4{ background:linear-gradient(150deg,#2C4F7C,#1E3A5F 70%); }
.t5{ background:linear-gradient(150deg,#8ca0b8,#5B7290); }
.tile:hover{ transform:translateY(-5px) scale(1.015); }

.hero__scroll{ position:absolute; left:50%; bottom:26px; transform:translateX(-50%); z-index:2; width:24px; height:38px; border:1.5px solid var(--slate-light); border-radius:14px; display:flex; justify-content:center; padding-top:7px; opacity:.7; }
.hero__scroll span{ width:4px; height:8px; border-radius:4px; background:var(--slate); animation:scrolldot 1.7s var(--ease) infinite; }
@keyframes scrolldot{ 0%{ transform:translateY(0); opacity:1; } 70%{ transform:translateY(12px); opacity:0; } 100%{ opacity:0; } }

/* ============================================================
   PROBLEM
   ============================================================ */
.problem{ background:linear-gradient(180deg,var(--cream),var(--cream-deep)); }
.prob-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.1rem; }
.prob-card{
  background:var(--cream-card); border:1px solid var(--line-soft); border-radius:var(--radius);
  padding:1.7rem 1.5rem; box-shadow:var(--shadow-sm);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);
}
.prob-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); border-color:var(--line); }
.prob-card h3{ font-size:1.18rem; margin-bottom:.5rem; }
.prob-card p{ font-size:.95rem; color:var(--slate); }
.prob-card__ico{ display:inline-flex; width:46px; height:46px; border-radius:13px; background:rgba(30,58,95,.06); margin-bottom:1.1rem; position:relative; }
.prob-card__ico::before{ content:""; position:absolute; inset:0; margin:auto; width:22px; height:22px; background:var(--blue); opacity:.85;
  -webkit-mask:center/contain no-repeat; mask:center/contain no-repeat; }
.prob-card__ico[data-i="burnout"]::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2s4 4 4 8a4 4 0 0 1-8 0c0-2 1-3 1-3'/%3E%3Cpath d='M12 22a6 6 0 0 0 6-6c0-1-1-2-1-2'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2s4 4 4 8a4 4 0 0 1-8 0c0-2 1-3 1-3'/%3E%3C/svg%3E"); }
.prob-card__ico[data-i="stuck"]::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12h8'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12h8'/%3E%3C/svg%3E"); }
.prob-card__ico[data-i="anxiety"]::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12h3l2-5 4 14 3-9h6'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12h3l2-5 4 14 3-9h6'/%3E%3C/svg%3E"); }
.prob-card__ico[data-i="money"]::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2v20M17 6H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2v20M17 6H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6'/%3E%3C/svg%3E"); }
.prob-card__ico[data-i="compass"]::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M15 9l-2 5-4 1 2-5z'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M15 9l-2 5-4 1 2-5z'/%3E%3C/svg%3E"); }
.prob-card__ico[data-i="heart"]::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.5-9-9a4.5 4.5 0 0 1 9-2 4.5 4.5 0 0 1 9 2c-2 4.5-9 9-9 9z'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.5-9-9a4.5 4.5 0 0 1 9-2 4.5 4.5 0 0 1 9 2c-2 4.5-9 9-9 9z'/%3E%3C/svg%3E"); }
.prob-card__ico[data-i="wave"]::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12c2-3 4-3 6 0s4 3 6 0 4-3 6 0'/%3E%3Cpath d='M2 17c2-3 4-3 6 0s4 3 6 0 4-3 6 0'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12c2-3 4-3 6 0s4 3 6 0 4-3 6 0'/%3E%3C/svg%3E"); }

.prob-card--soft{ background:var(--blue); border-color:transparent; }
.prob-card--soft h3{ color:var(--cream); }
.prob-card--soft p{ color:rgba(246,241,232,.78); }

/* ============================================================
   HIGH PERFORMERS / PERSISTENCE LETTER
   ============================================================ */
.persist{ background:var(--cream); }
.persist__inner{ max-width:760px; }
.persist__head{ max-width:680px; margin-bottom:clamp(2.5rem,5vw,3.5rem); }
.persist__head .section__title{ font-size:clamp(1.9rem,4.2vw,3rem); margin-top:1rem; }
.persist__sub{ font-size:clamp(1.1rem,1.9vw,1.32rem); color:var(--slate); margin-top:1.1rem; font-weight:400; line-height:1.5; }

.persist__body p{ font-size:clamp(1.08rem,1.7vw,1.22rem); line-height:1.72; color:var(--blue-soft); margin-bottom:1.5rem; }
.persist__beat{ font-family:var(--font-serif); font-style:italic; color:var(--slate)!important; font-size:clamp(1.15rem,2vw,1.4rem)!important; }
.persist__word{ font-family:var(--font-serif); font-style:italic; font-weight:500; color:var(--blue); position:relative; padding-bottom:.04em;
  background:linear-gradient(transparent 82%, rgba(200,168,106,.45) 82%); }

/* Pull-quote — the visual peak */
.persist__quote{ position:relative; text-align:center; max-width:660px; margin:clamp(3rem,7vw,5rem) auto; padding-block:clamp(1.5rem,4vw,2.5rem); }
.persist__mark{ display:block; width:34px; height:3px; border-radius:3px; background:var(--gold); margin:0 auto clamp(1.6rem,3.5vw,2.4rem); opacity:.85; }
.persist__quote blockquote{ font-family:var(--font-serif); font-weight:400; font-size:clamp(1.7rem,4vw,2.7rem); line-height:1.3; letter-spacing:-.01em; color:var(--blue); }

.persist__bridge{ margin-top:clamp(2rem,5vw,3rem); font-size:1.02rem; letter-spacing:.04em; color:var(--slate); font-weight:500; }

/* ============================================================
   FRAMEWORK
   ============================================================ */
.framework{ background:var(--cream); }
.fw-diagram{ position:relative; max-width:1000px; margin:0 auto clamp(2.5rem,5vw,4rem); height:200px; }
.fw-path{ width:100%; height:100%; overflow:visible; }
.fw-path__base{ fill:none; stroke:var(--line); stroke-width:2; stroke-dasharray:2 8; stroke-linecap:round; }
.fw-path__draw{ fill:none; stroke:url(#g); stroke:var(--slate); stroke-width:2.5; stroke-linecap:round; stroke-dasharray:1400; stroke-dashoffset:1400; }
.fw-diagram.in .fw-path__draw{ animation:draw 2.4s var(--ease) forwards; }
@keyframes draw{ to{ stroke-dashoffset:0; } }

.fw-node{ position:absolute; width:16px; height:16px; border-radius:50%; background:var(--cream); border:3px solid var(--blue); transform:translate(-50%,-50%); opacity:0; box-shadow:0 0 0 6px rgba(30,58,95,.06); }
.fw-node--1{ left:7%; top:85%; }
.fw-node--2{ left:50%; top:35%; }
.fw-node--3{ left:93%; top:45%; border-color:var(--gold); box-shadow:0 0 0 6px rgba(200,168,106,.16); }
.fw-diagram.in .fw-node{ animation:pop .5s var(--ease) forwards; }
.fw-diagram.in .fw-node--1{ animation-delay:.5s; }
.fw-diagram.in .fw-node--2{ animation-delay:1.25s; }
.fw-diagram.in .fw-node--3{ animation-delay:2s; }
@keyframes pop{ 0%{ opacity:0; transform:translate(-50%,-50%) scale(.4); } 60%{ transform:translate(-50%,-50%) scale(1.25); } 100%{ opacity:1; transform:translate(-50%,-50%) scale(1); } }

.fw-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; }
.fw-step{ background:var(--cream-card); border:1px solid var(--line-soft); border-radius:var(--radius); padding:2.2rem 1.9rem; box-shadow:var(--shadow-sm); transition:transform .45s var(--ease), box-shadow .45s var(--ease); position:relative; overflow:hidden; }
.fw-step::before{ content:""; position:absolute; inset:0 0 auto 0; height:4px; background:linear-gradient(90deg,var(--slate),var(--blue)); transform:scaleX(0); transform-origin:left; transition:transform .5s var(--ease); }
.fw-step:hover{ transform:translateY(-7px); box-shadow:var(--shadow-md); }
.fw-step:hover::before{ transform:scaleX(1); }
.fw-step__badge{ width:62px; height:62px; border-radius:18px; background:var(--blue); color:var(--cream); display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:800; font-size:1.25rem; letter-spacing:.02em; margin-bottom:1.5rem; box-shadow:var(--shadow-sm); }
.fw-step__badge--2{ background:var(--blue-soft); }
.fw-step__badge--3{ background:linear-gradient(140deg,var(--gold),#b08f4f); }
.fw-step h3{ font-size:1.5rem; margin-bottom:.6rem; }
.fw-step__lead{ font-family:var(--font-serif); font-style:italic; font-size:1.12rem; color:var(--blue-soft); margin-bottom:1rem; }
.fw-step p{ color:var(--slate); font-size:.98rem; }

/* ============================================================
   LIFE AREAS
   ============================================================ */
.life{ background:linear-gradient(180deg,var(--cream-deep),var(--cream)); }
.life-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem; }
.life-card{ background:var(--cream-card); border:1px solid var(--line-soft); border-radius:var(--radius); padding:1.9rem; box-shadow:var(--shadow-sm); transition:transform .45s var(--ease), box-shadow .45s var(--ease), background .45s var(--ease); position:relative; overflow:hidden; }
.life-card::after{ content:""; position:absolute; right:-40px; top:-40px; width:120px; height:120px; border-radius:50%; background:radial-gradient(circle, rgba(92,114,144,.10), transparent 70%); transition:transform .6s var(--ease); }
.life-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); }
.life-card:hover::after{ transform:scale(1.6); }
.life-card__ico{ display:inline-flex; width:52px; height:52px; border-radius:15px; background:rgba(30,58,95,.06); margin-bottom:1.2rem; position:relative; transition:background .4s; }
.life-card:hover .life-card__ico{ background:rgba(30,58,95,.10); }
.life-card__ico::before{ content:""; position:absolute; inset:0; margin:auto; width:26px; height:26px; background:var(--blue);
  -webkit-mask:center/contain no-repeat; mask:center/contain no-repeat; }
.life-card h3{ font-size:1.32rem; margin-bottom:.4rem; }
.life-card p{ color:var(--slate); font-size:.95rem; }

.life-card[data-area="mind"] .life-card__ico::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18a5 5 0 0 1-2-9.5A4 4 0 0 1 14 5a4 4 0 0 1 3 7 4 4 0 0 1-3 6z'/%3E%3Cpath d='M12 5v13'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18a5 5 0 0 1-2-9.5A4 4 0 0 1 14 5a4 4 0 0 1 3 7 4 4 0 0 1-3 6z'/%3E%3Cpath d='M12 5v13'/%3E%3C/svg%3E"); }
.life-card[data-area="body"] .life-card__ico::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 7v10M18 7v10M6 12h12M3 9v6M21 9v6'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 7v10M18 7v10M6 12h12M3 9v6M21 9v6'/%3E%3C/svg%3E"); }
.life-card[data-area="relationships"] .life-card__ico::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='9' r='3'/%3E%3Ccircle cx='16' cy='9' r='3'/%3E%3Cpath d='M3 19a5 5 0 0 1 10 0M11 19a5 5 0 0 1 10 0'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='9' r='3'/%3E%3Ccircle cx='16' cy='9' r='3'/%3E%3Cpath d='M3 19a5 5 0 0 1 10 0M11 19a5 5 0 0 1 10 0'/%3E%3C/svg%3E"); }
.life-card[data-area="family"] .life-card__ico::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='7' cy='8' r='2.5'/%3E%3Ccircle cx='17' cy='8' r='2.5'/%3E%3Ccircle cx='12' cy='14' r='2'/%3E%3Cpath d='M3 19a4 4 0 0 1 8 0M13 19a4 4 0 0 1 8 0M9 22a3 3 0 0 1 6 0'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='7' cy='8' r='2.5'/%3E%3Ccircle cx='17' cy='8' r='2.5'/%3E%3Ccircle cx='12' cy='14' r='2'/%3E%3Cpath d='M3 19a4 4 0 0 1 8 0M13 19a4 4 0 0 1 8 0M9 22a3 3 0 0 1 6 0'/%3E%3C/svg%3E"); }
.life-card[data-area="faith"] .life-card__ico::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v18M7 8h10'/%3E%3Cpath d='M12 21c4-2 6-5 6-9M12 21c-4-2-6-5-6-9'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v18M7 8h10'/%3E%3C/svg%3E"); }
.life-card[data-area="business"] .life-card__ico::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='12' rx='2'/%3E%3Cpath d='M8 8V6a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='12' rx='2'/%3E%3Cpath d='M8 8V6a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3C/svg%3E"); }
.life-card[data-area="finances"] .life-card__ico::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 18l5-5 4 3 8-8'/%3E%3Cpath d='M16 8h4v4'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 18l5-5 4 3 8-8'/%3E%3Cpath d='M16 8h4v4'/%3E%3C/svg%3E"); }
.life-card[data-area="purpose"] .life-card__ico::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Ccircle cx='12' cy='12' r='5'/%3E%3Ccircle cx='12' cy='12' r='1.5'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Ccircle cx='12' cy='12' r='5'/%3E%3Ccircle cx='12' cy='12' r='1.5'/%3E%3C/svg%3E"); }
.life-card[data-area="emotional"] .life-card__ico::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-4.5-9-9a4.5 4.5 0 0 1 9-2 4.5 4.5 0 0 1 9 2c-2 4.5-9 9-9 9z'/%3E%3Cpath d='M7 12h2l1.5-2 2 4 1.5-2h3'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-4.5-9-9a4.5 4.5 0 0 1 9-2 4.5 4.5 0 0 1 9 2c-2 4.5-9 9-9 9z'/%3E%3Cpath d='M7 12h2l1.5-2 2 4 1.5-2h3'/%3E%3C/svg%3E"); }

/* ============================================================
   HOW IT WORKS
   ============================================================ */
.how{ background:var(--blue); color:var(--cream); }
.how .eyebrow{ color:var(--slate-light); }
.how .section__title{ color:var(--cream); }
.how .section__sub{ color:rgba(246,241,232,.72); }
.how-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; margin-bottom:clamp(3rem,6vw,5rem); }
.how-step{ background:rgba(246,241,232,.05); border:1px solid rgba(246,241,232,.12); border-radius:var(--radius); padding:2.2rem 1.9rem; transition:transform .45s var(--ease), background .45s var(--ease); }
.how-step:hover{ transform:translateY(-7px); background:rgba(246,241,232,.09); }
.how-step__num{ font-family:var(--font-serif); font-size:2.6rem; color:var(--gold); display:block; margin-bottom:.6rem; line-height:1; }
.how-step h3{ color:var(--cream); font-size:1.4rem; margin-bottom:.6rem; }
.how-step p{ color:rgba(246,241,232,.72); font-size:.98rem; }

.ecosystem{ text-align:center; }
.ecosystem__label{ font-size:.8rem; letter-spacing:.18em; text-transform:uppercase; color:var(--slate-light); margin-bottom:1.6rem; }
.ecosystem__flow{ list-style:none; display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:.5rem 1.4rem; }
.ecosystem__flow li{ font-family:var(--font-display); font-weight:600; font-size:clamp(1rem,2vw,1.3rem); color:var(--cream); position:relative; padding:.45em 1.1em; border:1px solid rgba(246,241,232,.18); border-radius:100px; transition:border-color .35s, color .35s; }
.ecosystem__flow li:hover{ border-color:var(--gold); }
.ecosystem__flow li:not(:last-child)::after{ content:"→"; position:absolute; right:-1.15rem; top:50%; transform:translateY(-50%); color:var(--gold); font-size:.9rem; opacity:.7; }

/* ============================================================
   APP SHOWCASE
   ============================================================ */
.app{ background:linear-gradient(180deg,var(--cream),var(--cream-deep)); overflow:hidden; }
.app__inner{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,6vw,6rem); align-items:center; }
.app__sub{ margin-bottom:2rem; }
.app__features{ list-style:none; display:grid; gap:.85rem; margin-bottom:2.2rem; }
.app__features li{ display:flex; align-items:center; gap:.8rem; font-size:1.02rem; color:var(--blue); font-weight:500; }
.app__features li span{ flex:none; width:22px; height:22px; border-radius:50%; background:rgba(30,58,95,.08); position:relative; }
.app__features li span::after{ content:""; position:absolute; inset:0; margin:auto; width:9px; height:5px; border-left:2px solid var(--blue); border-bottom:2px solid var(--blue); transform:translateY(-1px) rotate(-45deg); }

/* Phones */
.app__visual{ position:relative; display:flex; justify-content:center; align-items:center; min-height:560px; }
.phone{ width:270px; border-radius:42px; background:#0f2138; padding:11px; box-shadow:var(--shadow-lg); position:absolute; }
.phone__screen{ background:var(--cream); border-radius:32px; padding:22px 18px; height:540px; overflow:hidden; position:relative; }
.phone--back{ transform:rotate(-7deg) translate(-86px,18px) scale(.92); opacity:.96; }
.phone--front{ transform:rotate(4deg) translate(56px,-6px); z-index:2; }
.phone__notch{ width:90px; height:22px; background:#0f2138; border-radius:0 0 16px 16px; position:absolute; top:11px; left:50%; transform:translateX(-50%); z-index:3; }

.ui-head{ margin-bottom:1.1rem; padding-top:.4rem; }
.ui-head small{ color:var(--slate); font-size:.78rem; }
.ui-head strong{ display:block; font-family:var(--font-display); font-size:1.35rem; color:var(--blue); margin-top:.15rem; letter-spacing:-.02em; }
.ui-card{ display:flex; flex-direction:column; background:var(--cream-card); border:1px solid var(--line-soft); border-radius:16px; padding:.85rem 1rem; margin-bottom:.7rem; position:relative; box-shadow:var(--shadow-sm); }
.ui-card--accent{ background:var(--blue); border-color:transparent; }
.ui-card--accent .ui-card__k{ color:var(--slate-light); }
.ui-card--accent p{ color:var(--cream); }
.ui-card__k{ font-size:.66rem; letter-spacing:.12em; text-transform:uppercase; color:var(--slate); margin-bottom:.15rem; }
.ui-card p{ font-size:.92rem; font-weight:600; color:var(--blue); }
.ui-check{ position:absolute; right:.9rem; top:50%; transform:translateY(-50%); width:22px; height:22px; border-radius:50%; border:2px solid var(--line); }
.ui-check--on{ background:var(--gold); border-color:var(--gold); }
.ui-check--on::after{ content:""; position:absolute; inset:0; margin:auto; width:8px; height:4px; border-left:2px solid #fff; border-bottom:2px solid #fff; transform:translateY(-1px) rotate(-45deg); }
.ui-mood{ margin-top:1rem; background:var(--cream-card); border:1px solid var(--line-soft); border-radius:16px; padding:.9rem 1rem; }
.ui-mood small{ color:var(--slate); font-size:.78rem; display:block; margin-bottom:.6rem; }
.ui-mood__dots{ display:flex; gap:.5rem; }
.ui-mood__dots i{ width:26px; height:26px; border-radius:50%; background:rgba(30,58,95,.07); }
.ui-mood__dots i.on{ background:var(--gold); box-shadow:0 0 0 4px rgba(200,168,106,.18); }

/* back phone content */
.ui-ring{ position:relative; width:160px; height:160px; margin:1.2rem auto 1.8rem; }
.ui-ring svg{ width:100%; height:100%; transform:rotate(-90deg); }
.ui-ring__bg{ fill:none; stroke:rgba(30,58,95,.10); stroke-width:9; }
.ui-ring__fg{ fill:none; stroke:var(--blue); stroke-width:9; stroke-linecap:round; stroke-dasharray:314; stroke-dashoffset:69; }
.ui-ring__center{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.ui-ring__center strong{ font-family:var(--font-display); font-size:2rem; color:var(--blue); }
.ui-ring__center small{ color:var(--slate); font-size:.76rem; }
.ui-bars{ display:flex; align-items:flex-end; gap:8px; height:120px; padding:0 .5rem; }
.ui-bars span{ flex:1; height:var(--h); background:linear-gradient(180deg,var(--slate),var(--blue)); border-radius:6px; opacity:.9; }

/* ============================================================
   STORY
   ============================================================ */
.story{ background:var(--cream); }
.story__inner{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(2rem,6vw,5rem); align-items:center; }
.story__portrait{ position:relative; aspect-ratio:4/5; border-radius:var(--radius); background:linear-gradient(155deg,#2C4F7C,#1E3A5F); box-shadow:var(--shadow-lg); overflow:hidden; }
.story__portrait::after{ content:""; position:absolute; inset:0; background:radial-gradient(circle at 30% 20%, rgba(228,215,193,.25), transparent 55%); }
.story__portrait-label{ position:absolute; left:20px; bottom:18px; color:var(--cream); font-size:.8rem; font-weight:600; letter-spacing:.04em; z-index:2; }
.story__copy{ max-width:620px; }
.story__lead{ font-family:var(--font-serif); font-size:clamp(1.3rem,2.4vw,1.7rem); line-height:1.4; color:var(--blue); margin:1.4rem 0 1.5rem; }
.story__copy p{ color:var(--slate); font-size:1.05rem; margin-bottom:1.1rem; }
.story__sign{ font-family:var(--font-serif); font-style:italic; color:var(--blue-soft)!important; font-size:1.15rem; margin-top:1.6rem!important; padding-top:1.4rem; border-top:1px solid var(--line-soft); }

/* ============================================================
   FINAL CTA
   ============================================================ */
.cta{ background:var(--cream-deep); text-align:center; position:relative; overflow:hidden; }
.cta__ambient{ position:absolute; inset:0; }
.blob--c1{ width:40vw; height:40vw; max-width:520px; max-height:520px; top:-20%; left:-5%; background:radial-gradient(circle,rgba(92,114,144,.30),transparent 70%); animation:drift 28s var(--ease) infinite alternate; }
.blob--c2{ width:34vw; height:34vw; max-width:440px; max-height:440px; bottom:-25%; right:-5%; background:radial-gradient(circle,rgba(200,168,106,.22),transparent 70%); animation:drift 32s var(--ease) infinite alternate-reverse; }
.cta__inner{ position:relative; z-index:1; max-width:820px; }
.cta__title{ font-size:clamp(2.1rem,5vw,3.7rem); margin:1rem 0 1.3rem; }
.cta__sub{ font-size:clamp(1.05rem,1.8vw,1.3rem); color:var(--slate); margin-bottom:2.4rem; }
.cta__buttons{ display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer{ background:var(--blue); color:var(--cream); padding-top:clamp(3.5rem,7vw,5.5rem); }
.footer__inner{ display:grid; grid-template-columns:1.4fr 2fr; gap:clamp(2rem,6vw,5rem); padding-bottom:3rem; }
.nav__brand--footer .nav__mark, .nav__brand--footer .nav__wordmark{ color:var(--cream); }
.footer__tag{ color:rgba(246,241,232,.6); margin-top:1rem; max-width:280px; font-size:.96rem; }
.footer__cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.footer__cols h4{ color:var(--cream); font-size:.8rem; letter-spacing:.14em; text-transform:uppercase; margin-bottom:1.1rem; font-weight:600; }
.footer__cols a{ display:block; color:rgba(246,241,232,.66); font-size:.95rem; padding:.32rem 0; transition:color .25s, padding-left .25s; }
.footer__cols a:hover{ color:var(--cream); padding-left:5px; }
.footer__base{ display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; padding-block:1.6rem; border-top:1px solid rgba(246,241,232,.12); font-size:.84rem; color:rgba(246,241,232,.5); }
.footer__fine{ color:rgba(200,168,106,.75); letter-spacing:.02em; }

/* ============================================================
   SHARED — placeholder label (for [PHOTO] etc. slots)
   ============================================================ */
.ph-label{
  font-family:var(--font-body); font-size:.74rem; font-weight:600; letter-spacing:.14em;
  color:rgba(246,241,232,.85); text-transform:uppercase;
  border:1px dashed rgba(246,241,232,.45); border-radius:8px; padding:.35em .7em;
}

/* ============================================================
   FRAMEWORK — concrete worked example
   ============================================================ */
.fw-example{ margin-top:clamp(2.5rem,5vw,3.5rem); background:var(--cream-card); border:1px solid var(--line-soft); border-radius:var(--radius); padding:clamp(1.8rem,4vw,3rem); box-shadow:var(--shadow-sm); }
.fw-example__label{ font-size:.78rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--slate); }
.fw-example__title{ font-family:var(--font-serif); font-weight:500; font-size:clamp(1.4rem,2.6vw,2rem); letter-spacing:-.01em; color:var(--blue); margin:.7rem 0 2rem; }
.fw-example__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; }
.fw-example__col{ position:relative; padding-top:1.2rem; border-top:2px solid var(--line); }
.fw-example__tag{ position:absolute; top:-.9rem; left:0; display:inline-flex; align-items:center; justify-content:center; min-width:34px; height:26px; padding:0 .5em; border-radius:8px; background:var(--blue); color:var(--cream); font-family:var(--font-display); font-weight:800; font-size:.82rem; letter-spacing:.02em; }
.fw-example__tag--2{ background:var(--blue-soft); }
.fw-example__tag--3{ background:linear-gradient(140deg,var(--gold),#b08f4f); }
.fw-example__col h4{ font-size:1.12rem; margin-bottom:.8rem; }
.fw-example__col p{ font-size:.95rem; color:var(--slate); margin-bottom:.7rem; line-height:1.6; }
.fw-example__before strong{ color:var(--slate); font-weight:600; }
.fw-example__after{ color:var(--blue-soft)!important; }
.fw-example__after strong{ color:var(--blue); font-weight:600; }

/* ============================================================
   PROOF / TRANSFORMATION
   ============================================================ */
.proof{ background:linear-gradient(180deg,var(--cream-deep),var(--cream)); }
.proof-feature{ display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(1.5rem,4vw,3rem); align-items:center; background:var(--cream-card); border:1px solid var(--line-soft); border-radius:var(--radius); padding:clamp(1.5rem,3vw,2.2rem); box-shadow:var(--shadow-md); margin-bottom:1.6rem; }
.proof-feature__photo{ aspect-ratio:4/5; border-radius:var(--radius-sm); background:linear-gradient(155deg,#2C4F7C,#1E3A5F); display:flex; align-items:center; justify-content:center; box-shadow:var(--shadow-sm); }
.proof-feature__metric{ font-family:var(--font-display); color:var(--blue); margin-bottom:1rem; font-size:1.1rem; }
.proof-feature__metric strong{ font-size:1.5rem; font-weight:800; letter-spacing:-.02em; }
.proof-feature__metric span{ display:block; font-size:.82rem; font-weight:400; color:var(--slate); letter-spacing:.02em; margin-top:.2rem; }
.proof-feature__quote{ font-family:var(--font-serif); font-weight:400; font-size:clamp(1.25rem,2.4vw,1.7rem); line-height:1.4; color:var(--blue); margin-bottom:1.4rem; }

.proof-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem; }
.proof-card{ background:var(--cream-card); border:1px solid var(--line-soft); border-radius:var(--radius); padding:1.8rem; box-shadow:var(--shadow-sm); transition:transform .45s var(--ease), box-shadow .45s var(--ease); }
.proof-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); }
.proof-card__photo{ width:56px; height:56px; border-radius:50%; background:linear-gradient(150deg,#7c8ca3,#5B7290); display:flex; align-items:center; justify-content:center; margin-bottom:1.2rem; }
.proof-card__photo .ph-label{ font-size:.55rem; padding:.2em .4em; }
/* anonymous-testimonial monogram (swap for a real photo when you have consent) */
.proof-quote-mark{ font-family:var(--font-serif); font-weight:500; color:rgba(246,241,232,.92); line-height:1; }
.proof-card__photo .proof-quote-mark{ font-size:2.6rem; transform:translateY(.18em); }
.proof-feature__photo .proof-quote-mark{ font-size:6rem; transform:translateY(.16em); }
.proof-card blockquote{ font-family:var(--font-serif); font-size:1.12rem; line-height:1.5; color:var(--blue); margin-bottom:1.3rem; }

.proof-attr{ display:flex; flex-direction:column; }
.proof-attr__name{ font-family:var(--font-display); font-weight:700; color:var(--blue); font-size:1rem; }
.proof-attr__role{ font-size:.88rem; color:var(--slate); margin-top:.1rem; }

/* ============================================================
   START HERE
   ============================================================ */
.start{ background:var(--cream); }
.start-door{ display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap;
  background:var(--blue); color:var(--cream); border-radius:var(--radius); padding:clamp(1.8rem,4vw,2.8rem);
  box-shadow:var(--shadow-md); transition:transform .4s var(--ease), box-shadow .4s var(--ease); max-width:900px; margin:0 auto; }
.start-door:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.start-door__step{ font-size:.78rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); }
.start-door__main h3{ color:var(--cream); font-size:clamp(1.5rem,3vw,2.1rem); margin:.6rem 0 .7rem; }
.start-door__main p{ color:rgba(246,241,232,.78); max-width:520px; font-size:1rem; }
.start-door__cta{ display:inline-flex; align-items:center; gap:.5rem; background:var(--cream); color:var(--blue); font-family:var(--font-body); font-weight:600; padding:.95em 1.7em; border-radius:100px; white-space:nowrap; transition:transform .35s var(--ease), background .3s; box-shadow:var(--shadow-sm); }
.start-door:hover .start-door__cta{ transform:translateX(3px); background:#fff; }

.start-then{ text-align:center; color:var(--slate); font-weight:500; margin:clamp(2.5rem,5vw,3.5rem) 0 1.5rem; }

.start-path{ list-style:none; max-width:900px; margin:0 auto; display:grid; gap:.7rem; }
.start-path__item{ display:flex; align-items:center; gap:1.3rem; background:var(--cream-card); border:1px solid var(--line-soft); border-radius:var(--radius-sm); padding:1.3rem 1.6rem; box-shadow:var(--shadow-sm); transition:transform .35s var(--ease), border-color .35s var(--ease); }
.start-path__item:hover{ transform:translateX(4px); border-color:var(--line); }
.start-path__num{ font-family:var(--font-serif); font-size:1.5rem; color:var(--slate-light); flex:none; width:2rem; }
.start-path__copy{ flex:1; min-width:0; }
.start-path__copy h4{ font-size:1.15rem; display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.start-path__copy p{ color:var(--slate); font-size:.94rem; margin-top:.25rem; }
.start-path__go{ flex:none; display:inline-flex; align-items:center; gap:.4rem; font-weight:600; font-size:.92rem; color:var(--blue); white-space:nowrap; transition:gap .3s var(--ease), color .3s; }
.start-path__go:hover{ gap:.7rem; color:var(--blue-soft); }

.tag{ font-family:var(--font-body); font-size:.66rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--slate); background:rgba(30,58,95,.07); border-radius:100px; padding:.28em .7em; }
.tag--free{ color:#5a6f3f; background:rgba(120,150,80,.14); }

/* ============================================================
   ASSESSMENT
   ============================================================ */
.assess{ background:linear-gradient(180deg,var(--cream),var(--cream-deep)); position:relative; overflow:hidden; }
.assess__ambient{ position:absolute; inset:0; z-index:0; }
.blob--a1{ width:38vw; height:38vw; max-width:480px; max-height:480px; top:-15%; right:-8%; background:radial-gradient(circle,rgba(92,114,144,.26),transparent 70%); animation:drift 26s var(--ease) infinite alternate; }
.blob--a2{ width:32vw; height:32vw; max-width:400px; max-height:400px; bottom:-20%; left:-6%; background:radial-gradient(circle,rgba(200,168,106,.18),transparent 70%); animation:drift 30s var(--ease) infinite alternate-reverse; }
.assess__inner{ position:relative; z-index:1; }
.assess__head{ margin-bottom:clamp(2rem,4vw,2.8rem); }
.assess__card{ max-width:720px; margin:0 auto; background:var(--cream-card); border:1px solid var(--line-soft); border-radius:var(--radius); box-shadow:var(--shadow-lg); padding:clamp(1.8rem,4vw,3rem); min-height:380px; display:flex; flex-direction:column; }
.assess__fallback{ color:var(--slate); text-align:center; }
.assess__fallback a{ color:var(--blue); text-decoration:underline; }

/* progress */
.assess-progress{ display:flex; align-items:center; gap:1rem; margin-bottom:2rem; }
.assess-progress__track{ flex:1; height:5px; background:rgba(30,58,95,.08); border-radius:5px; overflow:hidden; }
.assess-progress__bar{ height:100%; width:0; background:linear-gradient(90deg,var(--slate),var(--blue)); border-radius:5px; transition:width .5s var(--ease); }
.assess-progress__label{ font-size:.8rem; font-weight:600; letter-spacing:.06em; color:var(--slate); white-space:nowrap; }

/* step transition */
.assess-step{ opacity:0; transform:translateY(14px); transition:opacity .45s var(--ease), transform .45s var(--ease); flex:1; display:flex; flex-direction:column; }
.assess-step.in{ opacity:1; transform:none; }

/* intro */
.assess-intro{ text-align:center; margin:auto 0; }
.assess-intro__ico{ width:60px; height:60px; border-radius:18px; background:var(--blue); display:flex; align-items:center; justify-content:center; margin:0 auto 1.4rem; box-shadow:var(--shadow-sm); }
.assess-intro__ico::after{ content:""; width:24px; height:24px; background:var(--cream); -webkit-mask:center/contain no-repeat; mask:center/contain no-repeat;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12h-4l-3 9L9 3l-3 9H2'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12h-4l-3 9L9 3l-3 9H2'/%3E%3C/svg%3E"); }
.assess-intro h3{ font-size:clamp(1.5rem,3vw,2rem); margin-bottom:.8rem; }
.assess-intro p{ color:var(--slate); max-width:460px; margin:0 auto 2rem; font-size:1.02rem; }

/* question */
.assess-q__stage{ font-size:.76rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); margin-bottom:.7rem; }
.assess-q__text{ font-family:var(--font-display); font-weight:700; font-size:clamp(1.3rem,2.8vw,1.8rem); letter-spacing:-.02em; line-height:1.2; color:var(--blue); margin-bottom:1.8rem; }
.assess-scale{ display:grid; gap:.6rem; margin-top:auto; }
.assess-opt{ display:flex; align-items:center; gap:.9rem; width:100%; text-align:left; background:var(--cream); border:1px solid var(--line); border-radius:var(--radius-sm); padding:.95rem 1.2rem; cursor:pointer; font-family:var(--font-body); font-size:1rem; color:var(--blue); transition:border-color .25s, background .25s, transform .25s var(--ease); }
.assess-opt:hover{ border-color:var(--slate); transform:translateX(3px); }
.assess-opt__dot{ flex:none; width:20px; height:20px; border-radius:50%; border:2px solid var(--line); transition:border-color .25s, background .25s; }
.assess-opt[aria-pressed="true"]{ border-color:var(--blue); background:rgba(30,58,95,.04); }
.assess-opt[aria-pressed="true"] .assess-opt__dot{ border-color:var(--blue); background:var(--blue); box-shadow:inset 0 0 0 3px var(--cream-card); }

/* nav row */
.assess-nav{ display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:1.8rem; }
.assess-back{ background:none; border:0; color:var(--slate); font-family:var(--font-body); font-weight:600; font-size:.92rem; cursor:pointer; padding:.5em 0; transition:color .25s; }
.assess-back:hover{ color:var(--blue); }
.assess-back[hidden]{ visibility:hidden; }

/* result */
.assess-result{ text-align:center; }
.assess-result__eyebrow{ font-size:.78rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--slate); margin-bottom:.8rem; }
.assess-result h3{ font-size:clamp(1.5rem,3.2vw,2.2rem); margin-bottom:.6rem; }
.assess-result h3 .hi{ color:var(--blue); }
.assess-result h3 .lo{ color:var(--gold); }
.assess-result__lead{ color:var(--slate); max-width:520px; margin:0 auto 2rem; font-size:1.05rem; }
.assess-bars{ display:grid; gap:1rem; text-align:left; max-width:520px; margin:0 auto 2.2rem; }
.assess-bar__top{ display:flex; justify-content:space-between; font-size:.92rem; font-weight:600; color:var(--blue); margin-bottom:.4rem; }
.assess-bar__top span:last-child{ color:var(--slate); }
.assess-bar__track{ height:8px; background:rgba(30,58,95,.08); border-radius:8px; overflow:hidden; }
.assess-bar__fill{ height:100%; width:0; border-radius:8px; background:linear-gradient(90deg,var(--slate),var(--blue)); transition:width .9s var(--ease); }
.assess-bar--weak .assess-bar__fill{ background:linear-gradient(90deg,#d9c48f,var(--gold)); }
.assess-next{ background:var(--cream); border:1px solid var(--line); border-radius:var(--radius-sm); padding:1.4rem 1.6rem; max-width:520px; margin:0 auto 2rem; text-align:left; }
.assess-next h4{ font-size:1.1rem; margin-bottom:.4rem; }
.assess-next p{ color:var(--slate); font-size:.96rem; }

/* email capture */
.assess-email{ max-width:520px; margin:0 auto; text-align:left; }
.assess-email__label{ font-weight:600; color:var(--blue); font-size:.96rem; margin-bottom:.7rem; display:block; text-align:center; }
.assess-email__row{ display:flex; gap:.6rem; }
.assess-email__input{ flex:1; min-width:0; font-family:var(--font-body); font-size:1rem; color:var(--blue); background:var(--cream); border:1px solid var(--line); border-radius:100px; padding:.9em 1.3em; transition:border-color .25s; }
.assess-email__input:focus{ outline:none; border-color:var(--blue); }
.assess-email__input::placeholder{ color:var(--slate-light); }
.assess-email__note{ font-size:.8rem; color:var(--slate-light); text-align:center; margin-top:.9rem; }
.assess-email__ok{ text-align:center; color:var(--blue); font-weight:500; }
.assess-email__ok strong{ font-family:var(--font-display); }

.assess-restart{ display:block; margin:1.6rem auto 0; background:none; border:0; color:var(--slate); font-family:var(--font-body); font-weight:600; font-size:.9rem; cursor:pointer; transition:color .25s; }
.assess-restart:hover{ color:var(--blue); }

@media (prefers-reduced-motion: reduce){
  .assess-step{ opacity:1; transform:none; transition:none; }
  .blob--a1,.blob--a2{ animation:none!important; }
}

/* ============================================================
   FOUNDER IDENTITY
   ============================================================ */
.story__id{ display:flex; align-items:center; gap:1rem; margin-top:2rem; padding-top:1.6rem; border-top:1px solid var(--line-soft); }
.story__id-avatar{ flex:none; width:54px; height:54px; border-radius:50%; background:linear-gradient(150deg,#2C4F7C,#1E3A5F); display:flex; align-items:center; justify-content:center; color:rgba(246,241,232,.85); font-size:.5rem; font-weight:700; letter-spacing:.06em; text-align:center; }
.story__id-text{ display:flex; flex-direction:column; }
.story__id-name{ font-family:var(--font-display); font-weight:700; color:var(--blue); font-size:1.05rem; }
.story__id-cred{ font-size:.9rem; color:var(--slate); margin-top:.15rem; }
.story__portrait .ph-label{ position:absolute; top:18px; left:20px; z-index:2; }

/* ============================================================
   LAYOUT WIDTH — wider feature sections, capped reading measure
   ============================================================ */
/* Feature sections breathe wider (applies across all pages) */
.hero .container,
.framework .container,
.life .container,
.proof .container,
.problem .container,
.founder-teaser .container,
.container--wide{ max-width:var(--container-wide); }

/* Keep long-form prose at a comfortable, readable line length */
.section__head .section__sub{ max-width:var(--measure); margin-inline:auto; }
.story__copy p,
.founder-teaser__copy p{ max-width:var(--measure); }

/* ============================================================
   FOUNDER STORY TEASER (home) + video placeholder
   ============================================================ */
.founder-teaser{ background:var(--cream); }
.founder-teaser__inner{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.founder-teaser__copy{ max-width:560px; }
.founder-teaser__copy .section__title{ margin-bottom:1.4rem; }
.founder-teaser__copy p{ color:var(--slate); font-size:1.06rem; line-height:1.7; margin-bottom:1.1rem; }
.founder-teaser__more{ margin-top:1.5rem; }

.founder-teaser__media{ width:100%; }
/* 16:9 video placeholder — swap the inner markup for a real <video>/embed */
.video-ph{ position:relative; aspect-ratio:16/9; width:100%; border-radius:var(--radius); overflow:hidden;
  background:linear-gradient(150deg,#2C4F7C,#1E3A5F); box-shadow:var(--shadow-lg);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1.1rem; }
.video-ph::after{ content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(circle at 50% 38%, rgba(228,215,193,.18), transparent 60%); }
.video-ph__play{ position:relative; z-index:1; width:76px; height:76px; border-radius:50%; border:0; cursor:pointer;
  background:rgba(246,241,232,.95); color:var(--blue); display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow-md); transition:transform .35s var(--ease), background .3s; }
.video-ph__play svg{ margin-left:3px; }
.video-ph__play:hover{ transform:scale(1.08); background:#fff; }
.video-ph__play::before{ content:""; position:absolute; inset:-12px; border-radius:50%;
  border:1px solid rgba(246,241,232,.45); animation:videoPulse 2.6s var(--ease) infinite; }
@keyframes videoPulse{ 0%{ transform:scale(1); opacity:.6; } 70%{ transform:scale(1.28); opacity:0; } 100%{ opacity:0; } }
.video-ph__label{ position:relative; z-index:1; color:rgba(246,241,232,.9); font-size:.78rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; }

@media (prefers-reduced-motion: reduce){
  .video-ph__play::before{ animation:none!important; }
}

/* ============================================================
   MULTI-PAGE — nav active, page heroes, teaser links, spacing
   ============================================================ */

/* Active nav item (current page) */
.nav__links a[aria-current="page"]{ opacity:1; }
.nav__links a[aria-current="page"]::after{ width:100%; }
.mobile-menu a[aria-current="page"]:not(.btn){ color:var(--blue-soft); }

/* Page hero (subpage headers that clear the fixed nav) */
.page-hero{ position:relative; text-align:center; overflow:hidden; padding:clamp(8rem,16vh,11rem) 0 clamp(2rem,5vw,3.5rem); }
.page-hero__ambient{ position:absolute; inset:0; z-index:0; }
.page-hero__inner{ position:relative; z-index:1; max-width:780px; margin:0 auto; }
.page-hero__title{ font-size:clamp(2.4rem,5.6vw,4rem); margin:1.1rem 0 0; }
.page-hero__sub{ font-size:clamp(1.1rem,1.9vw,1.32rem); color:var(--slate); margin-top:1.2rem; font-weight:400; }
.page-hero__cta{ margin-top:2rem; display:flex; justify-content:center; gap:1rem; flex-wrap:wrap; }

/* First-section spacing helpers */
.section--top{ padding-top:clamp(7.5rem,12vw,11rem); }
.section--after-hero{ padding-top:clamp(1.5rem,4vw,3rem); }

/* "Learn more" teaser links on the short home page */
.section__more{ text-align:center; margin-top:clamp(2rem,4vw,2.8rem); }
.link-more{ display:inline-flex; align-items:center; gap:.5rem; font-family:var(--font-body); font-weight:600; font-size:1.02rem; color:var(--blue); padding-bottom:3px; border-bottom:1.5px solid rgba(200,168,106,.5); transition:gap .3s var(--ease), border-color .3s, color .3s; }
.link-more span{ transition:transform .3s var(--ease); }
.link-more:hover{ color:var(--blue-soft); border-color:var(--gold); }
.link-more:hover span{ transform:translateX(4px); }

/* Framework teaser cards (no trailing paragraph) */
.fw-step--teaser .fw-step__lead{ margin-bottom:0; }

/* Ambient backdrop for the For-Founders letter */
.persist{ position:relative; overflow:hidden; }
.persist__ambient{ position:absolute; inset:0; z-index:0; }
.persist__inner{ position:relative; z-index:1; }

/* ============================================================
   UTILITIES
   ============================================================ */
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* ============================================================
   HERO EVENT CARD (Chronic Success Weekend signup)
   ============================================================ */
.hero__event{ display:flex; justify-content:center; }
.event-card{
  position:relative; width:100%; max-width:560px;
  background:var(--cream-card);
  border:1px solid var(--line-soft);
  border-radius:var(--radius);
  padding:clamp(2rem,3.4vw,3rem);
  box-shadow:var(--shadow-lg);
  animation:floatCard 6.5s var(--ease) infinite;
}
/* soft halo so it "pops" off the page */
.event-card::before{
  content:""; position:absolute; inset:-18px; z-index:-1; border-radius:calc(var(--radius) + 14px);
  background:radial-gradient(58% 56% at 50% 8%, rgba(200,168,106,.30), transparent 72%);
  filter:blur(9px);
}
@keyframes floatCard{ 0%,100%{ transform:translateY(-4px); } 50%{ transform:translateY(-14px); } }

.event-card__badge{ display:inline-block; font-family:var(--font-body); font-size:.74rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); border:1px solid rgba(200,168,106,.45); border-radius:100px; padding:.5em 1em; }
.event-card__title{ font-size:clamp(1.9rem,3.2vw,2.5rem); line-height:1.1; margin:1.3rem 0 .9rem; }
.event-card__lead{ font-size:clamp(1.05rem,1.5vw,1.18rem); font-weight:600; color:var(--blue); line-height:1.45; margin-bottom:.9rem; }
.event-card__hook{ font-family:var(--font-serif); font-style:italic; font-size:clamp(1.08rem,1.5vw,1.22rem); line-height:1.5; color:var(--blue-soft); margin-bottom:1.8rem; }
.event-card__form{ display:flex; flex-direction:column; gap:.8rem; }
.event-card__input{ width:100%; font-family:var(--font-body); font-size:1.02rem; color:var(--blue); background:var(--cream); border:1px solid var(--line); border-radius:100px; padding:1em 1.4em; transition:border-color .25s, box-shadow .25s; }
.event-card__input:focus{ outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(30,58,95,.08); }
.event-card__input::placeholder{ color:var(--slate-light); }
.event-card__btn{ width:100%; }
.event-card__note{ font-size:.84rem; color:var(--slate); margin-top:1.2rem; text-align:center; line-height:1.5; }

/* ============================================================
   WEEKEND — slim nav
   ============================================================ */
.nav--slim .nav__toggle{ display:none; }
.nav--slim .nav__actions{ display:flex; }

/* ============================================================
   WEEKEND — hero
   ============================================================ */
.weekend-hero{ position:relative; overflow:hidden; text-align:center; padding:clamp(8.5rem,18vh,12rem) 0 clamp(3rem,7vw,5rem); }
.weekend-hero__ambient{ position:absolute; inset:0; z-index:0; }
.weekend-hero__inner{ position:relative; z-index:1; max-width:820px; }
.weekend-hero__title{ font-size:clamp(2.6rem,6vw,4.4rem); margin:1.1rem 0 0; }
.weekend-hero__hook{ font-family:var(--font-serif); font-size:clamp(1.4rem,2.8vw,2rem); line-height:1.4; color:var(--blue); margin:1.6rem auto 0; max-width:18ch; }
.weekend-hero__sub{ font-size:clamp(1.08rem,1.8vw,1.28rem); color:var(--slate); margin:1.4rem auto 0; max-width:60ch; line-height:1.6; }
.weekend-hero__cta{ display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; margin-top:2.2rem; }
.weekend-hero__note{ margin-top:1.4rem; font-size:.85rem; letter-spacing:.04em; color:var(--slate); }

/* ============================================================
   WEEKEND — chronic vs acute
   ============================================================ */
/* (E) section warms + lightens as you scroll: cool/acute at top → warm/chronic at base */
.weekend-contrast{ background:linear-gradient(180deg, #E9ECEE 0%, var(--cream) 44%, #F4ECDB 100%); }
.contrast-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.4rem; max-width:980px; margin:0 auto; }
.contrast-card{ border-radius:var(--radius); padding:clamp(1.7rem,3.4vw,2.6rem); transition:transform .45s var(--ease), box-shadow .45s var(--ease); }
.contrast-card--acute{ background:var(--cream-card); border:1px solid var(--line-soft); box-shadow:var(--shadow-sm); }
.contrast-card--chronic{ background:var(--blue); color:var(--cream); box-shadow:var(--shadow-md); }
.contrast-card:hover{ transform:translateY(-5px); }
.contrast-card--chronic:hover{ box-shadow:var(--shadow-lg); }
.contrast-card__kicker{ font-size:.74rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--slate); }
.contrast-card--chronic .contrast-card__kicker{ color:var(--gold); }
.contrast-card h3{ font-family:var(--font-serif); font-weight:500; font-size:clamp(1.5rem,3vw,2.1rem); margin:.6rem 0 .9rem; }
.contrast-card--chronic h3{ color:var(--cream); }
.contrast-card p{ color:var(--slate); line-height:1.65; font-size:1.02rem; }
.contrast-card--chronic p{ color:rgba(246,241,232,.82); }
.contrast-note{ max-width:62ch; margin:clamp(2.5rem,5vw,3.5rem) auto 0; text-align:center; font-family:var(--font-serif); font-size:clamp(1.15rem,2vw,1.4rem); line-height:1.5; color:var(--blue-soft); }

/* ============================================================
   WEEKEND — contrast enhancement (graphic, recognition, pacing)
   ============================================================ */
/* (A) animated contrast graphic — reuses the framework @keyframes draw */
.contrast-graph{ max-width:780px; margin:clamp(2.5rem,5vw,4rem) auto clamp(1rem,2.5vw,2rem); }
.contrast-graph__svg{ width:100%; height:auto; overflow:visible; display:block; }
.contrast-graph__line{ fill:none; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.acute-line{ stroke:var(--slate); stroke-dasharray:1300; stroke-dashoffset:1300; }
.chronic-line{ stroke:url(#chronicGrad); stroke-width:3; stroke-dasharray:1100; stroke-dashoffset:1100; }
/* axes — minimal, static, muted (fade in with the container) */
.contrast-graph__axis{ stroke:var(--slate-light); stroke-width:1.5; opacity:.5; }
.contrast-graph__axis-arrow{ fill:var(--slate-light); opacity:.5; }
.contrast-graph__axis-label{ font-family:var(--font-body); font-size:13px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; fill:var(--slate); opacity:.7; }
.contrast-graph__dot{ opacity:0; }
.contrast-graph__dot--chronic{ fill:var(--gold); }
.contrast-graph__label{ font-family:var(--font-body); font-size:15px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; opacity:0; transition:opacity .8s var(--ease); }
.contrast-graph__label--acute{ fill:var(--slate); }
.contrast-graph__label--chronic{ fill:var(--blue); }
.contrast-graph.in .acute-line{ animation:draw 1.9s var(--ease) forwards; }
.contrast-graph.in .chronic-line{ animation:draw 2.8s var(--ease) .5s forwards; }
.contrast-graph.in .contrast-graph__label--acute{ opacity:.85; transition-delay:1.5s; }
.contrast-graph.in .contrast-graph__label--chronic{ opacity:1; transition-delay:2.9s; }
.contrast-graph.in .contrast-graph__dot--chronic{ opacity:1; transition:opacity .6s var(--ease) 3.1s; }

/* (B) recognition prompt */
.contrast-prompt{ text-align:center; font-family:var(--font-serif); font-style:italic; font-size:clamp(1.3rem,2.6vw,1.9rem); color:var(--blue-soft); margin:clamp(1.5rem,3vw,2.4rem) auto clamp(2rem,4vw,2.8rem); max-width:26ch; }

/* (D) acute = tense + dense (restless micro-motion); chronic = calm + generous */
.contrast-card--acute{ padding:clamp(1.4rem,2.8vw,2rem); transform:none;
  transition:opacity .55s cubic-bezier(.6,0,.3,1), box-shadow .35s var(--ease);
  animation:acuteJitter 2.6s ease-in-out infinite; }
.contrast-card--acute h3{ margin:.5rem 0 .55rem; }
.contrast-card--chronic{ padding:clamp(1.9rem,3.8vw,2.9rem); transform:none;
  transition:opacity 1.2s cubic-bezier(.25,.6,.3,1) .8s, box-shadow .45s var(--ease), transform .5s var(--ease); }
.contrast-card--chronic h3{ margin:.7rem 0 1rem; }
@keyframes acuteJitter{
  0%   { transform:translate(0,0); }
  25%  { transform:translate(.5px,-.4px); }
  50%  { transform:translate(-.4px,.35px); }
  75%  { transform:translate(.35px,.5px); }
  100% { transform:translate(0,0); }
}

.contrast-list{ list-style:none; display:grid; }
.acute-list{ gap:.55rem; margin-top:1rem; }
.chronic-list{ gap:1.05rem; margin-top:1.3rem; }
.contrast-list li{ display:flex; gap:.65rem; line-height:1.5; font-size:1rem; }
.acute-list li{ color:var(--slate); }
.chronic-list li{ color:rgba(246,241,232,.86); }
.acute-list li::before{ content:""; flex:none; width:14px; height:2px; margin-top:.62em; background:var(--slate-light); border-radius:2px; }
.chronic-list li::before{ content:""; flex:none; width:7px; height:7px; margin-top:.5em; border-radius:50%; background:var(--gold); }

/* (C) sequential reveal — acute traits accumulate one-by-one; chronic is the relief */
.acute-item{ opacity:0; transform:translateY(8px); transition:opacity .42s cubic-bezier(.6,0,.3,1), transform .42s cubic-bezier(.6,0,.3,1); }
.contrast-card--acute.in .acute-item{ opacity:1; transform:none; }
.contrast-card--acute.in .acute-item:nth-child(1){ transition-delay:.10s; }
.contrast-card--acute.in .acute-item:nth-child(2){ transition-delay:.28s; }
.contrast-card--acute.in .acute-item:nth-child(3){ transition-delay:.46s; }
.contrast-card--acute.in .acute-item:nth-child(4){ transition-delay:.64s; }
.contrast-card--acute.in .acute-item:nth-child(5){ transition-delay:.82s; }

/* (B) recognition tap-target + selected-column glow */
.recognize-btn{ margin-top:1.5rem; display:inline-flex; align-items:center; gap:.55rem; background:none; cursor:pointer;
  border:1px solid var(--line); border-radius:100px; padding:.5em 1.15em;
  font-family:var(--font-body); font-weight:600; font-size:.82rem; letter-spacing:.05em; color:var(--slate);
  transition:border-color .3s, background .3s, color .3s; }
.recognize-btn::before{ content:""; width:13px; height:13px; border-radius:50%; border:1.5px solid currentColor; transition:background .3s, box-shadow .3s; }
.recognize-btn:hover{ border-color:var(--slate); color:var(--blue); }
.contrast-card--chronic .recognize-btn{ border-color:rgba(246,241,232,.28); color:rgba(246,241,232,.8); }
.contrast-card--chronic .recognize-btn:hover{ border-color:rgba(246,241,232,.6); color:var(--cream); }
.recognize-btn[aria-pressed="true"]{ border-color:var(--gold); color:var(--blue); background:rgba(200,168,106,.16); }
.recognize-btn[aria-pressed="true"]::before{ background:var(--gold); border-color:var(--gold); box-shadow:inset 0 0 0 2px var(--cream-card); }
.contrast-card--chronic .recognize-btn[aria-pressed="true"]{ color:var(--cream); background:rgba(200,168,106,.22); }

.contrast-card.is-recognized{ box-shadow:0 0 0 2px var(--gold), var(--shadow-md); }
.contrast-card--acute.is-recognized{ border-color:var(--gold); animation-play-state:paused; }
.contrast-card--chronic.is-recognized{ box-shadow:0 0 0 2px var(--gold), var(--shadow-lg); }

@media (prefers-reduced-motion: reduce){
  .contrast-card--acute{ animation:none!important; }
  .acute-item{ opacity:1!important; transform:none!important; transition:none!important; }
  .contrast-graph__line{ stroke-dashoffset:0!important; animation:none!important; }
  .contrast-graph__label,.contrast-graph__dot{ opacity:1!important; transition:none!important; }
}

/* ============================================================
   WEEKEND — is this you (gut-check)
   ============================================================ */
.weekend-gut{ background:var(--cream); }
.gut-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.4rem; max-width:980px; margin:0 auto; }
.gut-col{ background:var(--cream-card); border:1px solid var(--line-soft); border-radius:var(--radius); padding:clamp(1.7rem,3.4vw,2.4rem); box-shadow:var(--shadow-sm); }
.gut-col--no{ background:transparent; box-shadow:none; border-style:dashed; }
.gut-col h3{ font-size:1.35rem; margin-bottom:1.4rem; }
.gut-col--no h3{ color:var(--slate); }
.gut-col ul{ list-style:none; display:grid; gap:1.1rem; }
.gut-col li{ display:flex; gap:.85rem; color:var(--blue-soft); line-height:1.55; font-size:1.02rem; }
.gut-col--no li{ color:var(--slate); }
.gut-mark{ flex:none; width:24px; height:24px; border-radius:50%; position:relative; margin-top:1px; }
.gut-mark--yes{ background:rgba(200,168,106,.20); }
.gut-mark--yes::after{ content:""; position:absolute; inset:0; margin:auto; width:9px; height:5px; border-left:2px solid var(--gold); border-bottom:2px solid var(--gold); transform:translateY(-1px) rotate(-45deg); }
.gut-mark--no{ background:rgba(91,114,144,.14); }
.gut-mark--no::after{ content:""; position:absolute; inset:0; margin:auto; width:11px; height:2px; border-radius:2px; background:var(--slate-light); }

/* ============================================================
   WEEKEND — application form
   ============================================================ */
.weekend-apply{ background:linear-gradient(180deg,var(--cream-deep),var(--cream)); }
.appform{ max-width:780px; margin:0 auto; background:var(--cream-card); border:1px solid var(--line-soft); border-radius:var(--radius); padding:clamp(1.6rem,4vw,3rem); box-shadow:var(--shadow-md); }
.appform__contact{ display:grid; grid-template-columns:1fr 1fr; gap:1.1rem 1.3rem; margin-bottom:2rem; }
.field{ margin:0; }
.field--full{ grid-column:1 / -1; }
.appform__questions{ list-style:none; display:grid; gap:1.7rem; }
.field > label{ display:block; font-weight:600; color:var(--blue); margin-bottom:.55rem; font-size:1.02rem; line-height:1.45; }
.field__num{ font-family:var(--font-serif); color:var(--gold); margin-right:.55rem; }
.field .req{ color:var(--slate-light); font-weight:400; font-size:.88em; }
.input,.textarea{ width:100%; font-family:var(--font-body); font-size:1rem; color:var(--blue); background:var(--cream); border:1px solid var(--line); border-radius:var(--radius-sm); padding:.85rem 1rem; transition:border-color .25s, box-shadow .25s; }
.input:focus,.textarea:focus{ outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(30,58,95,.08); }
.textarea{ min-height:118px; resize:vertical; line-height:1.6; }

.appform__care{ background:rgba(200,168,106,.10); border:1px solid rgba(200,168,106,.32); border-radius:var(--radius-sm); padding:1.15rem 1.4rem; margin:2rem 0 1.6rem; }
.appform__care p{ font-size:.96rem; color:var(--blue-soft); line-height:1.6; }
.appform__care strong{ color:var(--blue); }
.appform__care-link{ color:var(--blue); text-decoration:underline; text-underline-offset:2px; }

.appform__submit{ width:100%; }
.appform__fineprint{ text-align:center; color:var(--slate); font-size:.85rem; margin-top:1.1rem; line-height:1.55; }

.appform__success{ max-width:680px; margin:0 auto; text-align:center; background:var(--cream-card); border:1px solid var(--line-soft); border-radius:var(--radius); padding:clamp(2rem,5vw,3.5rem); box-shadow:var(--shadow-md); }
.appform__success h3{ font-size:clamp(1.6rem,3.2vw,2.3rem); margin:.6rem 0 1.1rem; }
.appform__success p{ color:var(--slate); max-width:56ch; margin:0 auto 1rem; line-height:1.65; }
.appform__success-quiet{ font-size:.92rem; color:var(--slate-light)!important; }

/* ============================================================
   WEEKEND — what happens next
   ============================================================ */
.weekend-next{ background:var(--blue); color:var(--cream); }
.weekend-next .eyebrow{ color:var(--slate-light); }
.weekend-next .section__title{ color:var(--cream); }
.next-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; max-width:980px; margin:0 auto; }
.next-step{ background:rgba(246,241,232,.05); border:1px solid rgba(246,241,232,.12); border-radius:var(--radius); padding:2rem 1.8rem; transition:transform .45s var(--ease), background .45s var(--ease); }
.next-step:hover{ transform:translateY(-6px); background:rgba(246,241,232,.09); }
.next-step__num{ font-family:var(--font-serif); font-size:2.4rem; color:var(--gold); display:block; margin-bottom:.7rem; line-height:1; }
.next-step p{ color:rgba(246,241,232,.82); font-size:1.02rem; line-height:1.6; }

@media (prefers-reduced-motion: reduce){
  .event-card{ animation:none!important; }
}

/* ============================================================
   QUICK READS (home articles teaser)
   ============================================================ */
/* compact strip that sits directly under the hero */
.reads{ background:var(--cream); padding-block:clamp(2.5rem,5.5vw,4.25rem); }
.reads .section__head{ margin-bottom:clamp(1.6rem,3.5vw,2.4rem); }
.reads .section__title{ font-size:clamp(1.5rem,2.9vw,2.05rem); }
.reads-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem; }
.read-card{ display:flex; flex-direction:column; background:var(--cream-card); border:1px solid var(--line-soft); border-radius:var(--radius-sm); padding:1.4rem 1.55rem; box-shadow:var(--shadow-sm); transition:transform .45s var(--ease), box-shadow .45s var(--ease), border-color .45s var(--ease); }
.read-card:hover{ transform:translateY(-5px); box-shadow:var(--shadow-md); border-color:var(--line); }
.read-card__meta{ display:flex; align-items:center; gap:.6rem; margin-bottom:.8rem; }
.read-card__tag{ font-size:.66rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--slate); background:rgba(30,58,95,.06); border-radius:100px; padding:.38em .8em; }
.read-card__time{ font-size:.78rem; color:var(--slate-light); font-weight:500; }
.read-card__title{ font-size:1.14rem; line-height:1.22; margin-bottom:.45rem; }
.read-card__excerpt{ color:var(--slate); font-size:.92rem; line-height:1.55; margin-bottom:1.05rem; }
.read-card__link{ margin-top:auto; display:inline-flex; align-items:center; gap:.4rem; font-weight:600; font-size:.88rem; color:var(--blue); transition:gap .3s var(--ease), color .3s; }
.read-card:hover .read-card__link{ gap:.7rem; color:var(--blue-soft); }

/* ============================================================
   FAQ (native details/summary accordion)
   ============================================================ */
.faq{ background:var(--cream); }
.faq__list{ max-width:780px; margin:0 auto; display:grid; gap:.7rem; }
.faq-item{ background:var(--cream-card); border:1px solid var(--line-soft); border-radius:var(--radius-sm); box-shadow:var(--shadow-sm); overflow:hidden; }
.faq-item summary{ list-style:none; cursor:pointer; padding:1.15rem 1.4rem; font-family:var(--font-display); font-weight:600; font-size:1.08rem; color:var(--blue); display:flex; align-items:center; justify-content:space-between; gap:1rem; transition:color .25s; }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary:hover{ color:var(--blue-soft); }
.faq-item summary::after{ content:""; flex:none; width:9px; height:9px; margin-right:.2rem; border-right:2px solid var(--slate); border-bottom:2px solid var(--slate); transform:rotate(45deg); transition:transform .3s var(--ease); }
.faq-item[open] summary::after{ transform:rotate(-135deg); }
.faq-item__body{ padding:0 1.4rem 1.3rem; }
.faq-item__body p{ color:var(--slate); line-height:1.65; font-size:1rem; max-width:64ch; }
.faq-item__body a{ color:var(--blue); text-decoration:underline; text-underline-offset:2px; }

/* ============================================================
   WEEKEND — safety & confidentiality
   ============================================================ */
.weekend-safety{ background:var(--cream); }
.safety-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; max-width:1000px; margin:0 auto; }
.safety-card{ background:var(--cream-card); border:1px solid var(--line-soft); border-radius:var(--radius); padding:2rem 1.8rem; box-shadow:var(--shadow-sm); }
.safety-card__ico{ display:inline-flex; width:50px; height:50px; border-radius:14px; background:rgba(30,58,95,.06); margin-bottom:1.2rem; position:relative; }
.safety-card__ico::before{ content:""; position:absolute; inset:0; margin:auto; width:24px; height:24px; background:var(--blue); -webkit-mask:center/contain no-repeat; mask:center/contain no-repeat; }
.safety-card__ico[data-i="lock"]::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E"); }
.safety-card__ico[data-i="person"]::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3C/svg%3E"); }
.safety-card__ico[data-i="heart"]::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.5-9-9a4.5 4.5 0 0 1 9-2 4.5 4.5 0 0 1 9 2c-2 4.5-9 9-9 9z'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.5-9-9a4.5 4.5 0 0 1 9-2 4.5 4.5 0 0 1 9 2c-2 4.5-9 9-9 9z'/%3E%3C/svg%3E"); }
.safety-card h3{ font-size:1.2rem; margin-bottom:.5rem; }
.safety-card p{ color:var(--slate); font-size:.98rem; line-height:1.6; }
.safety-note{ max-width:760px; margin:clamp(2rem,4vw,2.8rem) auto 0; background:rgba(200,168,106,.10); border:1px solid rgba(200,168,106,.32); border-radius:var(--radius-sm); padding:1.15rem 1.4rem; text-align:center; }
.safety-note p{ color:var(--blue-soft); font-size:.98rem; line-height:1.6; }
.safety-note strong{ color:var(--blue); }
.safety-note__link{ color:var(--blue); text-decoration:underline; text-underline-offset:2px; }

/* ============================================================
   ARTICLE (single quick read)
   ============================================================ */
.article__head{ padding-top:clamp(7rem,12vw,10rem); padding-bottom:clamp(1rem,3vw,2rem); background:var(--cream); }
.article__head-inner{ max-width:760px; }
.article__back{ display:inline-flex; align-items:center; gap:.4rem; font-weight:600; font-size:.9rem; color:var(--slate); margin-bottom:1.4rem; transition:color .25s, gap .25s; }
.article__back:hover{ color:var(--blue); gap:.6rem; }
.article__meta{ display:flex; gap:.7rem; align-items:center; margin-bottom:1rem; }
.article__title{ font-size:clamp(2.1rem,4.6vw,3.2rem); line-height:1.08; }
.article__standfirst{ font-family:var(--font-serif); font-size:clamp(1.2rem,2.2vw,1.55rem); line-height:1.45; color:var(--blue-soft); margin-top:1.2rem; }
.article__body{ max-width:680px; padding-block:clamp(1.5rem,4vw,2.5rem) clamp(2.5rem,5vw,4rem); }
.article__body p{ color:var(--ink); font-size:1.12rem; line-height:1.75; margin-bottom:1.4rem; }
.article__body h2{ font-size:clamp(1.4rem,2.6vw,1.9rem); margin:2.2rem 0 1rem; }
.article__body ul{ margin:0 0 1.4rem 1.1rem; display:grid; gap:.7rem; }
.article__body li{ color:var(--ink); font-size:1.08rem; line-height:1.65; }
.article__body strong{ color:var(--blue); }
.article__body em{ font-style:italic; }
.article__pull{ font-family:var(--font-serif); font-size:clamp(1.4rem,2.6vw,1.9rem); line-height:1.4; color:var(--blue); border-left:3px solid var(--gold); padding-left:1.3rem; margin:2.2rem 0; }
.article__cta{ max-width:760px; padding-bottom:clamp(3rem,6vw,5rem); }
.article__cta-card{ display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; background:var(--blue); color:var(--cream); border-radius:var(--radius); padding:clamp(1.6rem,3vw,2.2rem); box-shadow:var(--shadow-md); }
.article__cta-card h3{ color:var(--cream); font-size:1.3rem; margin-bottom:.4rem; max-width:26ch; }
.article__cta-card p{ color:rgba(246,241,232,.8); font-size:1rem; }
.article__cta-card .btn--primary{ background:var(--cream); color:var(--blue); }
.article__cta-card .btn--primary:hover{ background:#fff; }

/* coming-soon read cards */
.read-card--soon{ opacity:.72; }
.read-card--soon .read-card__link{ color:var(--slate-light); font-style:italic; }
.read-card--soon:hover{ transform:none; box-shadow:var(--shadow-sm); border-color:var(--line-soft); }

/* ============================================================
   FOOTER — contact + newsletter
   ============================================================ */
.footer__connect .footer__email{ display:inline-block; color:rgba(246,241,232,.85); font-size:.95rem; margin-bottom:1rem; text-decoration:underline; text-underline-offset:2px; transition:color .25s; }
.footer__connect .footer__email:hover{ color:var(--cream); }
.footer-news{ display:flex; gap:.5rem; margin-bottom:.7rem; max-width:290px; }
.footer-news__input{ flex:1; min-width:0; font-family:var(--font-body); font-size:.88rem; color:var(--cream); background:rgba(246,241,232,.08); border:1px solid rgba(246,241,232,.18); border-radius:100px; padding:.62em 1em; transition:border-color .25s; }
.footer-news__input::placeholder{ color:rgba(246,241,232,.5); }
.footer-news__input:focus{ outline:none; border-color:var(--gold); }
.footer-news__btn{ flex:none; font-family:var(--font-body); font-weight:600; font-size:.85rem; color:var(--blue); background:var(--cream); border:0; border-radius:100px; padding:.62em 1.1em; cursor:pointer; transition:background .25s, transform .25s; }
.footer-news__btn:hover{ background:#fff; transform:translateY(-1px); }
.footer-news__note{ font-size:.8rem; color:rgba(246,241,232,.55); line-height:1.5; max-width:290px; }
.footer-news__note a{ color:rgba(246,241,232,.8); text-decoration:underline; }
.footer-news__ok{ color:rgba(246,241,232,.92); font-size:.92rem; font-weight:500; max-width:290px; }

/* ============================================================
   IMAGE-FORWARD / EDITORIAL RICHNESS (HONE-inspired, on-brand light)
   Photos layer OVER a brand gradient, so a failed image falls back
   to an on-brand gradient instead of breaking.
   ============================================================ */

/* Bolder, more editorial big titles */
.hero__title,.page-hero__title,.weekend-hero__title,.section__title,.cta__title{ font-weight:800; }

/* Home hero — full-bleed photo, cream veil heavier on the text side */
.hero{
  background:
    linear-gradient(100deg, rgba(246,241,232,.985) 0%, rgba(246,241,232,.92) 38%, rgba(246,241,232,.5) 66%, rgba(246,241,232,.74) 100%),
    var(--hero-img, none) center/cover no-repeat,
    var(--cream);
}
.hero .blob{ opacity:.32; }

/* Subpage page-hero — photo behind a cream veil */
.page-hero{
  background:
    linear-gradient(180deg, rgba(246,241,232,.84) 0%, rgba(246,241,232,.64) 46%, rgba(246,241,232,.96) 100%),
    var(--hero-img, none) center/cover no-repeat,
    var(--cream);
}

/* For-founders letter — very faint photo (strong veil keeps prose crisp) */
.persist.section--top{
  background:
    linear-gradient(180deg, rgba(246,241,232,.92) 0%, rgba(246,241,232,.86) 30%, rgba(246,241,232,.99) 100%),
    var(--hero-img, none) center top/cover no-repeat,
    var(--cream);
}

/* Weekend hero — same treatment */
.weekend-hero{
  background:
    linear-gradient(180deg, rgba(246,241,232,.85) 0%, rgba(246,241,232,.6) 46%, rgba(246,241,232,.96) 100%),
    var(--hero-img, none) center/cover no-repeat,
    var(--cream);
}

/* Final CTA — faint photo under the cream-deep veil */
.cta{
  --cta-img:url('https://images.unsplash.com/photo-1441974231531-c6227db76b6e?auto=format&fit=crop&w=1920&q=70');
  background:
    linear-gradient(180deg, rgba(239,231,216,.90), rgba(239,231,216,.82)),
    var(--cta-img) center/cover no-repeat,
    var(--cream-deep);
}

/* ---- Deep-blue stats band (brand-color drama, not black) ---- */
.stats-band{ background:var(--blue); color:var(--cream); }
.stats-band__grid{ display:grid; grid-template-columns:repeat(4,1fr); }
.stats-band__cell{ padding:clamp(2rem,4vw,3rem) 1.4rem; text-align:center; border-right:1px solid rgba(246,241,232,.14); }
.stats-band__cell:last-child{ border-right:0; }
.stats-band__num{ display:block; font-family:var(--font-display); font-weight:800; font-size:clamp(1.9rem,4vw,2.9rem); letter-spacing:-.02em; color:var(--gold); }
.stats-band__label{ display:block; margin-top:.5rem; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:rgba(246,241,232,.72); }

/* ---- Cinematic full-bleed quote band (photo + blue overlay) ---- */
.quote-band{
  position:relative; text-align:center; padding:clamp(5rem,13vw,9.5rem) 0;
  --band-img:url('https://images.unsplash.com/photo-1439066615861-d1af74d74000?auto=format&fit=crop&w=1920&q=70');
  background:
    linear-gradient(180deg, rgba(30,58,95,.74), rgba(30,58,95,.80)),
    var(--band-img) center/cover no-repeat,
    var(--blue);
}
.quote-band__q{ font-family:var(--font-serif); font-weight:400; font-size:clamp(1.8rem,4vw,3.2rem); line-height:1.25; max-width:22ch; margin:0 auto; color:var(--cream); }
.quote-band__c{ margin-top:1.4rem; letter-spacing:.18em; text-transform:uppercase; font-size:.78rem; font-weight:700; color:var(--gold); }

/* ============================================================
   COMING-SOON labeling
   ============================================================ */
.soon-pill{ display:inline-flex; align-items:center; font-family:var(--font-body); font-size:.66rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:#9a7b34; background:rgba(200,168,106,.16); border:1px solid rgba(200,168,106,.45); border-radius:100px; padding:.42em .85em; }
.section__head .soon-pill{ margin-bottom:1rem; }
.assess__card--soon{ text-align:center; align-items:center; justify-content:center; gap:1.1rem; }
.assess-soon__title{ font-size:clamp(1.5rem,3vw,2rem); }
.assess-soon__text{ color:var(--slate); max-width:46ch; }
.app-soon-note{ margin-top:1rem; color:var(--slate); font-size:.95rem; }

/* ============================================================
   SCROLL REVEAL
   ============================================================ */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.reveal[data-d]{ transition-delay:var(--d); }
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  .blob,.hero__scroll span{ animation:none!important; }
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1024px){
  .nav__links{ display:none; }
  .nav__actions{ display:none; }
  .nav__toggle{ display:flex; }
  .hero__inner{ grid-template-columns:1fr; gap:2.5rem; }
  .hero__collage{ max-width:480px; }
  .prob-grid{ grid-template-columns:repeat(2,1fr); }
  .fw-steps{ grid-template-columns:1fr; max-width:640px; margin-inline:auto; }
  .life-grid{ grid-template-columns:repeat(2,1fr); }
  .how-steps{ grid-template-columns:1fr; max-width:640px; margin-inline:auto; }
  .app__inner{ grid-template-columns:1fr; gap:3rem; }
  .app__visual{ min-height:520px; }
  .story__inner{ grid-template-columns:1fr; }
  .story__portrait{ max-width:380px; }
  .footer__inner{ grid-template-columns:1fr; }
  .fw-example__grid{ grid-template-columns:1fr; gap:2rem; }
  .founder-teaser__inner{ grid-template-columns:1fr; gap:2.5rem; }
  .founder-teaser__copy{ max-width:none; }
  .hero__event{ justify-content:flex-start; }
  .event-card{ max-width:540px; }
  .contrast-grid{ grid-template-columns:1fr; }
  .gut-grid{ grid-template-columns:1fr; }
  .safety-grid{ grid-template-columns:1fr; max-width:520px; margin-inline:auto; }
  .stats-band__grid{ grid-template-columns:1fr 1fr; }
  .stats-band__cell:nth-child(2){ border-right:0; }
  .stats-band__cell:nth-child(-n+2){ border-bottom:1px solid rgba(246,241,232,.14); }
  .next-grid{ grid-template-columns:1fr; max-width:560px; margin-inline:auto; }
  .reads-grid{ grid-template-columns:1fr 1fr; }
  .proof-grid{ grid-template-columns:1fr; max-width:520px; margin-inline:auto; }
  .proof-feature{ grid-template-columns:1fr; }
  .proof-feature__photo{ max-width:300px; aspect-ratio:3/2; }
}

@media (max-width:600px){
  :root{ --radius:18px; }
  .hero{ padding-top:108px; }
  .hero__meta{ font-size:.76rem; }
  .hero__collage{ grid-auto-rows:96px; gap:10px; }
  .prob-grid{ grid-template-columns:1fr; }
  .life-grid{ grid-template-columns:1fr; }
  .reads-grid{ grid-template-columns:1fr; }
  .stats-band__grid{ grid-template-columns:1fr; }
  .stats-band__cell{ border-right:0; border-bottom:1px solid rgba(246,241,232,.14); }
  .stats-band__cell:last-child{ border-bottom:0; }
  .fw-diagram{ height:150px; }
  .ecosystem__flow{ gap:.5rem 1.3rem; }
  .footer__cols{ grid-template-columns:1fr 1fr; }
  .footer__base{ justify-content:center; text-align:center; }
  .btn--lg{ width:100%; }
  .hero__cta,.cta__buttons{ width:100%; }
  .app__visual{ transform:scale(.92); }
  .start-door{ flex-direction:column; align-items:flex-start; }
  .start-door__cta{ width:100%; justify-content:center; }
  .start-path__item{ flex-wrap:wrap; gap:.5rem 1rem; }
  .start-path__go{ width:100%; justify-content:flex-start; padding-left:calc(2rem + 1.3rem); }
  .assess-email__row{ flex-direction:column; }
  .assess-email__input{ text-align:center; }
  .assess__card{ padding:1.5rem 1.3rem; }
  .appform__contact{ grid-template-columns:1fr; }
  .event-card{ animation:none; }
}
