/* =============================================================
   The Reset Journal — resetjournals.com
   styles3.css  ·  NATURAL LIGHT THEME
   © 2026 Mike Bell / Unlock Key Potential
   Warm cream / parchment — Cormorant Garamond / Jost / DM Sans
   ============================================================= */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400;1,600&family=Jost:wght@300;400;500;600&family=DM+Sans:wght@300;400;500&display=swap');

/* ── COLOUR TOKENS ─────────────────────────────────────────── */
:root {
  --bg:          #f6f3ef;
  --bg-2:        #f0ebe5;
  --bg-3:        #e9e2da;
  --bg-4:        #E2D6C3;
  --bg-5:        #D8C9B2;
  --bg-6:        rgba(244, 244, 243);
  --bg-7         rgba(140, 127, 119);

  --gold:        #8c7f77;
  --gold-dim:    #7A5F38;
  --gold-faint:  rgba(154,124,82,0.10);
  --gold-border: rgba(154,124,82,0.22);

  /* "cream" reused in dark theme = near-black for light theme */
  --cream:       #1C1712;
  --cream-dim:   #3A3228;
  --text-muted:  #6B5F52;
  --text-dim:    #A09080;

  --border:      rgba(154,124,82,0.16);
  --border-mid:  rgba(154,124,82,0.26);
  --border-str:  rgba(154,124,82,0.40);

  --shadow:      rgba(60,40,20,0.10);
  --font-serif:  'Cormorant Garamond', Georgia, serif;
  --font-head:   'Jost', system-ui, sans-serif;
  --font-body:   'DM Sans', system-ui, sans-serif;
  --ease:        cubic-bezier(0.25,0.46,0.45,0.94);
  --trans:       0.22s var(--ease);
  --radius:      6px;
}

/* ── RESET ─────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }

body {
  background: var(--bg);
  color: var(--text-muted);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.65;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img { max-width:100%; height:auto; display:block; }
a   { color:inherit; text-decoration:none; transition:color var(--trans); }
button { cursor:pointer; font-family:var(--font-body); border:none; background:none; }
ul,ol { list-style:none; }
p { color:var(--text-muted); }

::selection { background:var(--gold); color:#fff; }

/* ── TYPOGRAPHY ─────────────────────────────────────────────── */
h1,h2,h3,h4 {
  font-family: var(--font-head);
  font-weight: 300;
  letter-spacing: 0.01em;
  line-height: 1.1;
  color: var(--cream);
}
h1 { font-size: clamp(2.8rem,6vw,5.5rem); }
h2 { font-size: clamp(2rem,4vw,3.4rem); }
h3 { font-size: clamp(1.3rem,2vw,1.8rem); }

em {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  color: var(--gold);
  font-size: 1.06em;
}
h1 em,h2 em,h3 em { font-size:inherit; }

.section-label {
  font-family: var(--font-body);
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gold);
  display: block;
  margin-bottom: 0.7rem;
}

.section-title {
  font-family: var(--font-head);
  font-size: clamp(2rem,4vw,3.2rem);
  font-weight: 300;
  color: var(--cream);
  margin-bottom: 2rem;
  line-height: 1.15;
}

.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 clamp(1.25rem,4vw,3rem);
}

section { padding: clamp(4rem,8vw,7rem) 0; }

/* ── SCROLL REVEAL ──────────────────────────────────────────── */
.reveal {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 0.6s var(--ease), transform 0.6s var(--ease);
}
.reveal.visible { opacity:1; transform:translateY(0); }
.reveal-delay-1 { transition-delay:0.1s; }
.reveal-delay-2 { transition-delay:0.2s; }
.reveal-delay-3 { transition-delay:0.3s; }
.reveal-delay-4 { transition-delay:0.4s; }

/* ── BUTTONS ────────────────────────────────────────────────── */
.shop-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.85rem 2rem;
  background: #eb9d0c;
  color: var(--bg);
  font-family: var(--font-body);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border-radius: var(--radius);
  transition: background var(--trans), transform var(--trans), box-shadow var(--trans);
  box-shadow: 0 2px 14px rgba(28,23,18,0.18);
  white-space: nowrap;
}
.shop-btn:hover {
  background: #fbd301;
  color: var(--bg);
  transform: translateY(-1px);
  box-shadow: 0 6px 22px rgba(28,23,18,0.22);
}

.btn { display:inline-flex; align-items:center; gap:0.5rem; }

.btn-ghost, .btn-secondary {
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
  border: 1px solid var(--border-mid);
  padding: 0.85rem 1.8rem;
  border-radius: var(--radius);
  transition: all var(--trans);
  display: inline-flex;
  align-items: center;
}
.btn-ghost:hover, .btn-secondary:hover {
  color: var(--cream);
  border-color: var(--border-str);
}
.btn-secondary { margin-left: 0.75rem; }

.price-anchor {
  font-size: 0.75rem;
  color: var(--text-dim);
  margin-top: 0.6rem;
  letter-spacing: 0.03em;
}

/* ── NAV ────────────────────────────────────────────────────── */
nav {
  position: relative;
  top:0; left:0; right:0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0 clamp(1.25rem,4vw,3rem);
  height: 60px;
  background: rgba(250,247,242,0.95);
  backdrop-filter: blur(18px) saturate(1.4);
  -webkit-backdrop-filter: blur(18px) saturate(1.4);
  border-bottom: 1px solid var(--border);
  box-shadow: 0 1px 12px var(--shadow);
}

.nav-logo-img { height:34px; width:auto; }

.nav-links {
  display: flex;
  align-items: center;
  gap: 1.75rem;
}

.nav-links a {
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
  transition: color var(--trans);
}
.nav-links a:hover { color: var(--cream); }

.nav-toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  padding: 8px;
}
.nav-toggle-bar {
  display: block;
  width: 22px;
  height: 1.5px;
  background: var(--cream-dim);
  border-radius: 2px;
  transition: all var(--trans);
}

.nav-overlay {
  position: fixed;
  inset: 0;
  background: rgba(28,23,18,0.35);
  z-index: 150;
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--trans);
}
.nav-overlay.active { opacity:1; pointer-events:auto; }

@media (max-width: 860px) {
  .nav-toggle { display:flex; }
  .nav-links {
    position: fixed;
    top:0; right:0;
    width: min(300px,88vw);
    height: 100dvh;
    background: var(--bg);
    border-left: 1px solid var(--border-mid);
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 80px 2rem 2rem;
    gap: 0;
    z-index: 180;
    transform: translateX(100%);
    transition: transform 0.32s var(--ease);
    overflow-y: auto;
    box-shadow: -4px 0 24px var(--shadow);
  }
  .nav-links.open { transform:translateX(0); }
  .nav-links li { width:100%; border-bottom:1px solid var(--border); }
  .nav-links a { display:block; padding:1rem 0; font-size:0.9rem; }
  .nav-links .shop-btn { margin-top:1.5rem; width:100%; justify-content:center; }
}

/* ── HERO ───────────────────────────────────────────────────── */
#hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  min-height: 100svh;
  padding-top: 1px;
  padding-bottom: 5px;
  overflow: hidden;
  background: var(--bg);
}

.hero-left {
  padding: clamp(3rem,6vw,6rem) clamp(1.5rem,4vw,4rem) clamp(3rem,6vw,5rem) clamp(1.25rem,5vw,5rem);
  position: relative;
  z-index: 1;
}

.hero-eyebrow {
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 1.25rem;
}

.hero-h1 {
  font-family: var(--font-head);
  font-size: clamp(2.8rem,4.5vw,4.8rem);
  font-weight: 300;
  color: var(--cream);
  line-height: 1.08;
  margin-bottom: 1.25rem;
}

.hero-sub {
  font-size: clamp(0.95rem,1.2vw,1.1rem);
  color: var(--text-muted);
  max-width: 50ch;
  margin-bottom: 2rem;
  line-height: 1.7;
}

.hero-actions-dual { margin-bottom:1.75rem; }
.hero-actions-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
}
.hero-actions-row .price-anchor { width:100%; margin-top:0.25rem; }

.hero-rating {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1.5rem;
}
.stars { color:#C8922A; font-size:0.9rem; letter-spacing:0.05em; }
.rating-text { font-size:0.78rem; color:var(--text-muted); }
.rating-text strong { color:var(--cream-dim); }

.hero-mini-stats {
  display: flex;
  gap: clamp(1rem,2.5vw,2.5rem);
  padding-top: 1rem;
  border-top: 1px solid var(--border);
}
.hero-mini-stat { display:flex; flex-direction:column; }
.hms-num {
  font-family: var(--font-head);
  font-size: clamp(1.8rem,3vw,2.8rem);
  font-weight: 300;
  color: var(--cream);
  line-height: 1;
}
.hms-label {
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-dim);
  margin-top: 0.15rem;
}

.hero-right {
  position: relative;
  height: 100svh;
  overflow: hidden;
}
.hero-slider { position:absolute; inset:0; }
.hero-slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 0.9s var(--ease);
}
.hero-slide.active { opacity:1; }
.hero-right::after {
  content:'';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to right, var(--bg) 0%, transparent 22%),
    linear-gradient(to top, rgba(250,247,242,0.4) 0%, transparent 30%);
  pointer-events: none;
  z-index: 1;
}

.hero-slider-dots {
  position: absolute;
  bottom: 1.5rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 0.5rem;
  z-index: 2;
}
.hero-slider-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: rgba(28,23,18,0.2);
  border: none;
  cursor: pointer;
  transition: background var(--trans), transform var(--trans);
}
.hero-slider-dot.active { background:var(--gold); transform:scale(1.3); }

@media (max-width:760px) {
  #hero { grid-template-columns:1fr; min-height:auto; }
  .hero-right { height:55vw; min-height:260px; order:-1; }
  .hero-right::after { background:linear-gradient(to top, var(--bg) 0%, transparent 40%); }
  .hero-left { padding:2rem 1.25rem 3rem; }
}

/* ── MARQUEE ────────────────────────────────────────────────── */
.marquee-bar {
  overflow: hidden;
  background: var(--bg-2);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 0.8rem 0;
}
.marquee-inner {
  display: flex;
  gap: 2.5rem;
  white-space: nowrap;
  animation: marquee 38s linear infinite;
  width: max-content;
}
.marquee-inner span {
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--text-dim);
}
.marquee-inner span.gold { color:var(--gold); }
@keyframes marquee {
  from { transform:translateX(0); }
  to   { transform:translateX(-50%); }
}

/* ── TRUST BAR ──────────────────────────────────────────────── */
.amazon-trust-bar {
  background: var(--bg-3);
  border-bottom: 1px solid var(--border);
  padding: 0.85rem 0;
  overflow-x: auto;
  scrollbar-width: none;
}
.amazon-trust-bar::-webkit-scrollbar { display:none; }
.trust-bar-inner {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  padding: 0 clamp(1.25rem,4vw,3rem);
  width: max-content;
  min-width: 100%;
  justify-content: center;
}
.trust-pill {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.78rem;
  color: var(--text-muted);
  white-space: nowrap;
  flex-shrink: 0;
}
.trust-pill strong { color:var(--cream-dim); font-weight:500; }
.trust-icon { font-size:0.9rem; }
.amz-logo { font-size:0.95rem; font-weight:700; letter-spacing:-0.02em; }
.amz-a { color:#E47911; }
.amz-rest { color:var(--cream-dim); }

/* ── TIMELINE ───────────────────────────────────────────────── */
#timeline { background:var(--bg-2); }
.timeline-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 1px;
  background: var(--border);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}
.timeline-item {
  background: var(--bg);
  padding: clamp(2rem,4vw,3rem);
  transition: background var(--trans);
}
.timeline-item:hover { background:var(--bg-2); }
.timeline-day {
  font-family: var(--font-head);
  font-size: clamp(4rem,7vw,7rem);
  font-weight: 300;
  color: var(--gold);
  line-height: 1;
  display: block;
}
.timeline-label {
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--text-dim);
  display: block;
  margin-bottom: 1rem;
}
.timeline-headline {
  font-family: var(--font-head);
  font-size: 1.3rem;
  font-weight: 400;
  color: var(--cream);
  margin-bottom: 0.6rem;
}
.timeline-desc { font-size:0.88rem; color:var(--text-muted); line-height:1.7; }
@media (max-width:640px) { .timeline-grid { grid-template-columns:1fr; } }

/* ── FORMULA ────────────────────────────────────────────────── */
#formula { background:var(--bg); }
.formula-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem,5vw,5rem);
  align-items: center;
}
.formula-display {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(0.75rem,2vw,2rem);
  flex-wrap: wrap;
  padding: clamp(2rem,4vw,3.5rem);
  background: var(--bg-2);
  border: 1px solid var(--border-mid);
  border-radius: var(--radius);
}
.formula-el { text-align:center; }
.formula-letter {
  display: block;
  font-family: var(--font-head);
  font-size: clamp(4rem,8vw,8rem);
  font-weight: 300;
  color: var(--cream);
  line-height: 1;
}
.formula-letter.gold { color:var(--gold); }
.formula-word {
  font-size: 0.65rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-dim);
}
.formula-op {
  font-family: var(--font-head);
  font-size: clamp(2rem,4vw,4rem);
  font-weight: 300;
  color: var(--gold-dim);
  line-height: 1;
}
.formula-text p { color:var(--text-muted); font-size:0.92rem; line-height:1.75; margin-bottom:1rem; }
.pullquote {
  border-left: 2px solid var(--gold);
  padding: 1rem 1.25rem;
  margin: 1.5rem 0;
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 1.1rem;
  color: var(--cream-dim);
  line-height: 1.6;
  background: var(--gold-faint);
  border-radius: 0 var(--radius) var(--radius) 0;
}
@media (max-width:720px) { .formula-layout { grid-template-columns:1fr; } }

/* ── PARETO ─────────────────────────────────────────────────── */
#pareto { background:var(--bg-2); }
.pareto-layout {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: clamp(2rem,5vw,5rem);
  align-items: center;
}
.pareto-visual {
  display: flex;
  gap: 2rem;
  align-items: flex-end;
  padding: clamp(2rem,4vw,3rem);
  background: var(--bg);
  border: 1px solid var(--border-mid);
  border-radius: var(--radius);
}
.pareto-bar-wrap { display:flex; flex-direction:column; align-items:center; gap:0.5rem; }
.bar-pct {
  font-family: var(--font-head);
  font-size: clamp(1.5rem,3vw,2.5rem);
  font-weight: 300;
  color: var(--cream);
}
.pareto-bar { width:clamp(60px,8vw,90px); border-radius:3px 3px 0 0; background:var(--gold); }
.bar-results { height:clamp(100px,18vw,200px); }
.bar-actions { height:clamp(25px,4.5vw,50px); opacity:0.55; }
.bar-label { font-size:0.68rem; font-weight:500; letter-spacing:0.12em; text-transform:uppercase; color:var(--text-dim); }
.pareto-text h3 { font-family:var(--font-head); font-size:clamp(1.2rem,2vw,1.6rem); font-weight:400; color:var(--cream); margin-bottom:1rem; }
.pareto-text p { font-size:0.9rem; color:var(--text-muted); line-height:1.75; margin-bottom:0.75rem; }
.pareto-highlight { font-family:var(--font-serif); font-style:italic; font-size:1.1rem; color:var(--cream-dim); line-height:1.6; }
.pareto-quote { font-size:0.85rem; color:var(--gold-dim); font-style:italic; padding-top:0.5rem; }
@media (max-width:720px) { .pareto-layout { grid-template-columns:1fr; } }

/* ── FRAMEWORK ──────────────────────────────────────────────── */
#framework { background:var(--bg-3); }
.framework-grid {
  display: grid;
  grid-template-columns: repeat(5,1fr);
  gap: 1px;
  background: var(--border);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}
.framework-item {
  background: var(--bg);
  padding: clamp(1.5rem,3vw,2.5rem) clamp(1rem,2vw,1.75rem);
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  transition: background var(--trans);
}
.framework-item:hover { background:var(--bg-2); }
.framework-letter { font-family:var(--font-head); font-size:clamp(2.5rem,4vw,4rem); font-weight:300; color:var(--gold); line-height:1; }
.framework-name { font-family:var(--font-head); font-size:0.85rem; font-weight:500; letter-spacing:0.08em; text-transform:uppercase; color:var(--cream-dim); margin-bottom:0.35rem; }
.framework-desc { font-size:0.82rem; color:var(--text-muted); line-height:1.65; }
@media (max-width:900px) { .framework-grid { grid-template-columns:repeat(3,1fr); } }
@media (max-width:560px) { .framework-grid { grid-template-columns:1fr 1fr; } }

/* ── FOUNDER ────────────────────────────────────────────────── */
#founder { background:var(--bg-2); }
.founder-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: clamp(2rem,5vw,5rem);
  align-items: start;
}
.founder-card {
  background: var(--bg);
  border: 1px solid var(--border-mid);
  border-radius: var(--radius);
  padding: 2rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  position: sticky;
  top: 80px;
  box-shadow: 0 4px 20px var(--shadow);
}
.founder-initials { width:100%; aspect-ratio:1; border-radius:var(--radius); overflow:hidden; margin-bottom:0.5rem; background:var(--bg-3); }
.founder-initials img { width:100%; height:100%; object-fit:cover; object-position:top center; filter:sepia(8%) contrast(1.04); }
.founder-name { font-family:var(--font-head); font-size:1.3rem; font-weight:400; color:var(--cream); }
.founder-title { font-size:0.68rem; font-weight:500; letter-spacing:0.14em; text-transform:uppercase; color:var(--gold); }
.founder-divider { width:100%; height:1px; background:var(--border); margin:0.5rem 0; }
.founder-note { font-family:var(--font-serif); font-style:italic; font-size:0.95rem; color:var(--text-muted); line-height:1.65; }
.founder-link {
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  color: var(--gold-dim);
  border-bottom: 1px solid rgba(154,124,82,0.3);
  padding-bottom: 1px;
  display: inline-block;
  transition: color var(--trans), border-color var(--trans);
}
.founder-link:hover { color:var(--gold); border-color:var(--gold); }
.founder-content { padding-top:0.5rem; }
.founder-content p { font-size:0.92rem; color:var(--text-muted); line-height:1.75; margin-bottom:1rem; }
.philosophy-pullquote {
  border-left: 2px solid var(--gold);
  padding: 1rem 1.5rem;
  margin: 1.75rem 0;
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--cream-dim);
  line-height: 1.6;
  background: var(--gold-faint);
  border-radius: 0 var(--radius) var(--radius) 0;
}
.principles-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: var(--border);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  margin-top: 1.5rem;
}
.principle { background:var(--bg); padding:1.5rem; display:flex; flex-direction:column; gap:0.3rem; transition:background var(--trans); }
.principle:hover { background:var(--bg-2); }
.principle-num { font-size:0.62rem; font-weight:500; letter-spacing:0.16em; text-transform:uppercase; color:var(--text-dim); }
.principle-title { font-family:var(--font-head); font-size:0.95rem; font-weight:500; color:var(--cream-dim); margin-top:0.1rem; }
.principle-desc { font-size:0.82rem; color:var(--text-muted); line-height:1.65; }
@media (max-width:800px) { .founder-layout { grid-template-columns:1fr; } .founder-card { position:static; } }
@media (max-width:480px) { .principles-grid { grid-template-columns:1fr; } }

/* ── REVIEWS ────────────────────────────────────────────────── */
#reviews { background:var(--bg-3); }
.reviews-header { margin-bottom:2.5rem; }
.reviews-body {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: clamp(2rem,5vw,5rem);
  align-items: start;
}
.rating-breakdown {
  background: var(--bg);
  border: 1px solid var(--border-mid);
  border-radius: var(--radius);
  padding: 2rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  position: sticky;
  top: 80px;
  box-shadow: 0 4px 16px var(--shadow);
}
.breakdown-score { display:flex; align-items:baseline; gap:0.25rem; }
.breakdown-num { font-family:var(--font-head); font-size:3rem; font-weight:300; color:var(--cream); line-height:1; }
.breakdown-max { font-size:1rem; color:var(--text-dim); }
.breakdown-stars { color:#C8922A; font-size:1rem; letter-spacing:0.06em; }
.breakdown-verified { font-size:0.65rem; font-weight:500; letter-spacing:0.14em; text-transform:uppercase; color:var(--text-dim); }
.breakdown-divider { width:100%; height:1px; background:var(--border); margin:0.5rem 0; }
.star-row { display:flex; align-items:center; gap:0.5rem; margin-bottom:0.3rem; }
.star-row-label { font-size:0.72rem; color:var(--text-dim); width:28px; text-align:right; flex-shrink:0; }
.star-row-bar-track { flex:1; height:5px; background:var(--bg-4); border-radius:100px; overflow:hidden; }
.star-row-bar-fill { height:100%; background:var(--gold); border-radius:100px; }
.star-row-pct { font-size:0.68rem; color:var(--text-dim); width:32px; }
.breakdown-note { font-size:0.75rem; color:var(--text-dim); line-height:1.55; }
.breakdown-note strong { color:var(--text-muted); }
.breakdown-amz-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  color: var(--gold-dim);
  transition: color var(--trans);
  margin-top: 0.25rem;
}
.breakdown-amz-link:hover { color:var(--gold); }
.reviews-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill,minmax(260px,1fr));
  gap: 1px;
  background: var(--border);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}
.review-card { background:var(--bg); padding:clamp(1.25rem,2.5vw,2rem); display:flex; flex-direction:column; gap:0.4rem; transition:background var(--trans); }
.review-card:hover { background:var(--bg-2); }
.review-stars { color:#C8922A; font-size:0.85rem; letter-spacing:0.04em; }
.review-edition { font-size:0.62rem; font-weight:500; letter-spacing:0.14em; text-transform:uppercase; color:var(--gold); }
.review-text { font-family:var(--font-serif); font-style:italic; font-size:1rem; color:var(--cream-dim); line-height:1.65; flex:1; }
.review-author { font-size:0.78rem; font-weight:500; color:var(--text-muted); }
.verified-badge { display:inline-flex; align-items:center; gap:0.3rem; font-size:0.68rem; color:var(--text-dim); }
@media (max-width:760px) { .reviews-body { grid-template-columns:1fr; } .rating-breakdown { position:static; } }

/* ── REEL ───────────────────────────────────────────────────── */
#reel { background:var(--bg-2); }
.editions-intro { font-size:0.9rem; color:var(--text-muted); max-width:54ch; line-height:1.7; margin-bottom:1.5rem; }

/* ── EDITIONS CAROUSEL ──────────────────────────────────────── */
#editions { background:var(--bg); }
.reset-book-visual { display:flex; flex-direction:column; align-items:center; gap:1.25rem; padding:2rem 0; }
.stage {
  position: relative;
  width: 100%;
  max-width: 700px;
  height: clamp(260px,40vw,380px);
  perspective: 1000px;
}
.book {
  position: absolute;
  top: 50%; left: 50%;
  width: clamp(130px,18vw,190px);
  transform-origin: center;
  transition: transform 0.5s var(--ease), opacity 0.4s var(--ease);
  cursor: pointer;
  border-radius: 3px;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(60,40,20,0.18);
}
.book img { width:100%; height:auto; display:block; pointer-events:none; }
.book[data-pos="0"]  { transform:translate(-50%,-50%) translateZ(100px) scale(1); z-index:5; opacity:1; }
.book[data-pos="1"]  { transform:translate(10%,-50%) translateZ(0) rotateY(-24deg) scale(0.82); z-index:3; opacity:0.75; }
.book[data-pos="-1"] { transform:translate(-110%,-50%) translateZ(0) rotateY(24deg) scale(0.82); z-index:3; opacity:0.75; }
.book[data-pos="2"]  { transform:translate(55%,-50%) translateZ(-80px) rotateY(-36deg) scale(0.64); z-index:1; opacity:0.38; }
.book[data-pos="-2"] { transform:translate(-155%,-50%) translateZ(-80px) rotateY(36deg) scale(0.64); z-index:1; opacity:0.38; }
.book[data-pos="hidden"] { transform:translate(-50%,-50%) scale(0); z-index:0; opacity:0; pointer-events:none; }
.edition-name { font-family:var(--font-head); font-size:1.1rem; font-weight:300; color:var(--cream); letter-spacing:0.08em; text-align:center; }
.shop-wrap { text-align:center; }
.controls { display:flex; align-items:center; gap:1.25rem; }
.ctrl {
  width:40px; height:40px;
  border-radius: 50%;
  border: 1px solid var(--border-mid);
  background: var(--bg-2);
  color: var(--cream-dim);
  font-size: 1rem;
  display: flex; align-items:center; justify-content:center;
  transition: all var(--trans);
}
.ctrl:hover { border-color:var(--gold); color:var(--gold); }
.dots { display:flex; gap:0.5rem; }
.dot { width:7px; height:7px; border-radius:50%; border:1px solid var(--border-str); background:transparent; cursor:pointer; transition:all var(--trans); }
.dot.active { background:var(--gold); border-color:var(--gold); }

/* ── FAQ ────────────────────────────────────────────────────── */
#faq { background:var(--bg-2); }
.faq-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: clamp(2rem,5vw,5rem);
  align-items: start;
}
.faq-intro h2 { font-family:var(--font-head); font-size:clamp(2rem,4vw,3.5rem); font-weight:300; color:var(--cream); line-height:1.1; margin-bottom:1rem; }
.faq-intro p { font-size:0.88rem; color:var(--text-muted); line-height:1.7; }
.faq-list { padding-top:0.25rem; }
.faq-item { border-bottom:1px solid var(--border); }
.faq-q {
  width:100%;
  display:flex; justify-content:space-between; align-items:center; gap:1rem;
  padding:1.2rem 0;
  font-family:var(--font-body); font-size:0.9rem; font-weight:400; color:var(--cream-dim);
  text-align:left; transition:color var(--trans); cursor:pointer;
}
.faq-q:hover { color:var(--cream); }
.faq-icon { font-size:1.2rem; color:var(--gold-dim); flex-shrink:0; line-height:1; transition:transform var(--trans), color var(--trans); }
.faq-item.open .faq-icon { transform:rotate(45deg); color:var(--gold); }
.faq-item.open .faq-q { color:var(--cream); }
.faq-a { display:none; padding:0 0 1.2rem; font-size:0.88rem; color:var(--text-muted); line-height:1.75; max-width:62ch; }
.faq-item.open .faq-a { display:block; }
@media (max-width:700px) { .faq-layout { grid-template-columns:1fr; } }

/* ── WHY AMAZON ─────────────────────────────────────────────── */
#why-amazon { background:var(--bg-3); }
.why-amazon-inner { max-width:1200px; margin:0 auto; padding:clamp(4rem,8vw,7rem) clamp(1.25rem,4vw,3rem); }
.why-amazon-label { font-size:0.68rem; font-weight:500; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); display:block; margin-bottom:2.5rem; }
.why-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 1px;
  background: var(--border);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  margin-bottom: 1px;
}
.why-item { background:var(--bg-2); padding:clamp(1.5rem,3vw,2.5rem); display:flex; flex-direction:column; gap:0.4rem; transition:background var(--trans); }
.why-item:hover { background:var(--bg); }
.why-icon { font-size:1.4rem; }
.why-title { font-family:var(--font-head); font-size:1rem; font-weight:400; color:var(--cream); line-height:1.25; margin-top:0.25rem; }
.why-desc { font-size:0.82rem; color:var(--text-muted); line-height:1.65; flex:1; }
.why-badge { display:inline-flex; align-items:center; gap:0.35rem; font-size:0.68rem; font-weight:500; letter-spacing:0.06em; color:#C8922A; margin-top:0.35rem; }
.pub-details {
  display: grid;
  grid-template-columns: repeat(8,1fr);
  gap: 1px;
  background: var(--border);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  margin-top: 1px;
}
.pub-item { background:var(--bg-2); padding:1.25rem; display:flex; flex-direction:column; gap:0.25rem; }
.pub-label { font-size:0.6rem; font-weight:500; letter-spacing:0.14em; text-transform:uppercase; color:var(--text-dim); }
.pub-value { font-size:0.82rem; color:var(--cream-dim); font-weight:400; line-height:1.3; }
@media (max-width:900px) { .why-grid { grid-template-columns:1fr 1fr; } .pub-details { grid-template-columns:repeat(4,1fr); } }
@media (max-width:520px) { .why-grid { grid-template-columns:1fr; } .pub-details { grid-template-columns:repeat(2,1fr); } }

/* ── IMPACT ─────────────────────────────────────────────────── */
#impact { background:#100f14; padding:clamp(2rem,4vw,4rem) 0; }
.impact-img { width:100%; max-width:800px; margin:0 auto; border-radius:var(--radius); display:block; }

/* ── IMPACT1 ─────────────────────────────────────────────────── */
#impact-1 {  background:var(--bg-6); padding:clamp(2rem,4vw,4rem) 0; }
.impact-img { width:100%; max-width:900px; margin:0 auto; border-radius:var(--radius); display:block; }

/* ── IMPACT2 ─────────────────────────────────────────────────── */
#adhd {  background:color(display-p3 0.5408 0.4985 0.4706); padding:clamp(2rem,4vw,4rem) 0; }
.impact-img { width:100%; max-width:900px; margin:0 auto; border-radius:var(--radius); display:block; }

/* ── CTA ────────────────────────────────────────────────────── */
#cta { background:var(--bg-2); text-align:center; border-top:1px solid var(--border); }
.cta-title { font-family:var(--font-head); font-size:clamp(3rem,6vw,5.5rem); font-weight:300; color:var(--cream); line-height:1.08; margin-bottom:1rem; }
.cta-sub { font-size:clamp(0.95rem,1.3vw,1.1rem); color:var(--text-muted); max-width:48ch; margin:0 auto 2rem; line-height:1.7; }
.cta-detail { font-size:0.75rem; color:var(--text-dim); letter-spacing:0.05em; margin-top:1.25rem; }


/* ── FOOTER SHELL ──────────────────────────── */
#site-footer {
  background: #25201a;
  color: rgba(240,232,216,0.62);
  font-family: var(--font-body, 'DM Sans', system-ui, sans-serif);
  font-size: 0.85rem;
  line-height: 1.65;
  border-top: 1px solid rgba(154,124,82,0.18);
}

/* ── CTA STRIP ─────────────────────────────── */
.footer-cta-strip {
  background: #14110D;
  border-bottom: 1px solid rgba(154,124,82,0.14);
  padding: clamp(2.5rem, 5vw, 4rem) clamp(1.25rem, 4vw, 3rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  flex-wrap: wrap;
  max-width: 1200px;
  margin: 0 auto;
}
.footer-cta-copy {}
.footer-cta-copy .fc-eyebrow {
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(154,124,82,0.75);
  display: block;
  margin-bottom: 0.4rem;
}
.footer-cta-copy h2 {
  font-family: var(--font-head, 'Jost', system-ui, sans-serif);
  font-size: clamp(1.6rem, 3vw, 2.6rem);
  font-weight: 300;
  color: #F0E8D8;
  line-height: 1.15;
  margin: 0;
}
.footer-cta-copy h2 em {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  color: rgba(196,164,108,0.85);
  font-size: inherit;
}
.footer-cta-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.5rem;
  flex-shrink: 0;
}
.footer-amz-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.85rem 1.75rem;
  background: #F0E8D8;
  color: #1C1712;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border-radius: 5px;
  text-decoration: none;
  transition: background 0.2s, transform 0.2s;
  white-space: nowrap;
  box-shadow: 0 2px 14px rgba(0,0,0,0.25);
}
.footer-amz-btn:hover {
  background: #fff;
  transform: translateY(-1px);
}
.footer-cta-meta {
  font-size: 0.72rem;
  color: rgba(240,232,216,0.38);
  text-align: right;
}

/* ── MAIN GRID ─────────────────────────────── */
.footer-grid {
  display: grid;
  grid-template-columns: 1.8fr 1fr 1fr 1fr 1fr;
  gap: clamp(2rem, 4vw, 3.5rem);
  max-width: 1200px;
  margin: 0 auto;
  padding: clamp(3rem, 6vw, 5rem) clamp(1.25rem, 4vw, 3rem) clamp(2rem, 4vw, 3rem);
}

/* ── BRAND COL ─────────────────────────────── */
.footer-brand {}
.footer-wordmark {
  font-family: var(--font-head, 'Jost', system-ui, sans-serif);
  font-size: 1.6rem;
  font-weight: 300;
  color: #F0E8D8;
  display: block;
  margin-bottom: 0.75rem;
  line-height: 1;
  text-decoration: none;
}
.footer-wordmark span { color: rgba(196,164,108,0.85); }
.footer-brand-desc {
  font-size: 0.83rem;
  color: rgba(240,232,216,0.48);
  line-height: 1.65;
  max-width: 240px;
  margin-bottom: 1.25rem;
}
.footer-rating {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.4rem;
}
.footer-rating .stars { color: #C8922A; font-size: 0.85rem; letter-spacing: 0.04em; }
.footer-rating .rating-txt { font-size: 0.75rem; color: rgba(240,232,216,0.45); }
.footer-trust-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.75rem;
}
.trust-tag {
  font-size: 0.65rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(154,124,82,0.7);
  border: 1px solid rgba(154,124,82,0.2);
  border-radius: 100px;
  padding: 0.2rem 0.6rem;
}
.footer-social {
  display: flex;
  gap: 0.5rem;
  margin-top: 1.25rem;
}
.footer-social a {
  width: 32px; height: 32px;
  border-radius: 50%;
  border: 1px solid rgba(154,124,82,0.22);
  display: flex; align-items: center; justify-content: center;
  font-size: 0.75rem;
  color: rgba(240,232,216,0.45);
  text-decoration: none;
  transition: all 0.2s;
}
.footer-social a:hover {
  border-color: rgba(154,124,82,0.55);
  color: rgba(196,164,108,0.85);
}

/* ── LINK COLS ─────────────────────────────── */
.footer-col {}
.footer-col-head {
  font-size: 0.6rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(154,124,82,0.7);
  display: block;
  margin-bottom: 1rem;
}
.footer-col-links {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  list-style: none;
  margin: 0; padding: 0;
}
.footer-col-links li {}
.footer-col-links a {
  font-size: 0.82rem;
  color: rgba(240,232,216,0.5);
  text-decoration: none;
  line-height: 1.5;
  transition: color 0.2s;
  display: inline-block;
  padding: 0.1rem 0;
}
.footer-col-links a:hover { color: rgba(196,164,108,0.85); }
.footer-col-links .ext::after {
  content: ' ↗';
  font-size: 0.7em;
  opacity: 0.6;
}

/* ── EDITIONS GRID (inside col) ─────────────── */
.edition-mini-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.25rem 0.75rem;
  list-style: none;
  margin: 0; padding: 0;
}
.edition-mini-grid a {
  font-size: 0.78rem;
  color: rgba(240,232,216,0.45);
  text-decoration: none;
  transition: color 0.2s;
  white-space: nowrap;
}
.edition-mini-grid a:hover { color: rgba(196,164,108,0.85); }

/* ── DIVIDER ───────────────────────────────── */
.footer-divider {
  height: 1px;
  background: rgba(154,124,82,0.1);
  max-width: 1200px;
  margin: 0 auto;
}

/* ── BOTTOM BAR ────────────────────────────── */
.footer-bottom-bar {
  max-width: 1200px;
  margin: 0 auto;
  padding: 1.25rem clamp(1.25rem, 4vw, 3rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.75rem;
}
.footer-copy {
  font-size: 0.72rem;
  color: rgba(240,232,216,0.28);
}
.footer-copy a {
  color: inherit;
  text-decoration: none;
  transition: color 0.2s;
}
.footer-copy a:hover { color: rgba(196,164,108,0.6); }
.footer-legal-links {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  flex-wrap: wrap;
}
.footer-legal-links a {
  font-size: 0.72rem;
  color: rgba(240,232,216,0.28);
  text-decoration: none;
  transition: color 0.2s;
}
.footer-legal-links a:hover { color: rgba(196,164,108,0.6); }
.footer-legal-links .pipe {
  color: rgba(240,232,216,0.12);
  font-size: 0.65rem;
}

/* ── RESPONSIVE ────────────────────────────── */
@media (max-width: 1020px) {
  .footer-grid {
    grid-template-columns: 1fr 1fr 1fr;
  }
  .footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-cta-strip { flex-direction: column; align-items: flex-start; }
  .footer-cta-actions { align-items: flex-start; }
  .footer-cta-meta { text-align: left; }
  .footer-bottom-bar { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 420px) {
  .footer-grid { grid-template-columns: 1fr; }
}


@media (max-width: 920px) {
  .container { padding: 0 20px; }
  .trust-bar-inner { padding: 0 48px; }
  .why-amazon-inner { padding: 0 48px; }
  nav { padding: 0 32px; }
  .footer-bottom { padding: 20px 48px; }
}
@media (max-width: 960px) {
  section { padding: 80px 0; }
  .container { padding: 0 32px; }
  .trust-bar-inner { padding: 0 32px; }
  .why-amazon-inner { padding: 0 32px; }
  nav { padding: 0 24px; }
  .footer-bottom { padding: 20px 32px; }
  .nav-links { gap: 20px; }
  .nav-links li:nth-child(n+4):not(:last-child) { display: none; }
  #hero { grid-template-columns: 1fr; min-height: auto; }
  .hero-left { padding: 80px 32px 56px; }
  .hero-right { min-height: 56vw; }
  .hero-stats-grid { grid-template-columns: repeat(4, 1fr); }
  .hero-stat { padding: 36px 16px; }
  .formula-layout { grid-template-columns: 1fr; gap: 40px; }
  .formula-text { border-left: none; border-top: 1px solid var(--border2); padding: 36px 0 0; }
  .pareto-layout { grid-template-columns: 1fr; gap: 48px; }
  .timeline-grid { grid-template-columns: 1fr; }
  .framework-grid { grid-template-columns: repeat(3, 1fr); }
  .founder-layout { grid-template-columns: 1fr; gap: 48px; }
  .founder-card { position: relative; top: 0; }
  .faq-layout { grid-template-columns: 1fr; gap: 40px; }
  .faq-intro { position: relative; top: 0; }
  .editions-grid { grid-template-columns: repeat(2, 1fr); }
  .reviews-body { grid-template-columns: 1fr; gap: 40px; }
  .rating-breakdown { position: relative; top: 0; }
  .reviews-grid { grid-template-columns: repeat(2, 1fr); }
  .why-grid { grid-template-columns: 1fr 1fr; }
  .principles-grid { grid-template-columns: 1fr; }
  .footer-main { grid-template-columns: 1fr 1fr; }
  .reel-grid { grid-template-columns: 1fr; }
  .pub-details { flex-wrap: wrap; }
  .pub-item { min-width: 25%; }
  .trust-pill { padding: 4px 14px; font-size: 11px; }
  .trust-pill:nth-child(n+5) { display: none; }
}
@media (max-width: 640px) {
  section { padding: 0px 16; }
  .container { padding: 0 10px; }
  .trust-bar-inner { padding: 0 10px; }
  .why-amazon-inner { padding: 0 10px; }
  nav { padding: 0 24px; }
  .footer-bottom { padding: 16px 20px; flex-direction: column; align-items: flex-start; gap: 12px; }
  .hero-left { padding: 70px 20px 48px; }
  .hero-stats-grid { grid-template-columns: repeat(2, 1fr); }
  .hero-stat { padding: 32px 16px; }
  .framework-grid { grid-template-columns: repeat(2, 1fr); }
  .reviews-grid { grid-template-columns: 1fr; }
  .editions-grid { grid-template-columns: 1fr 1fr; }
  .timeline-grid { grid-template-columns: 1fr; }
  .why-grid { grid-template-columns: 1fr; }
  .footer-main { grid-template-columns: 1fr; }
  .formula-display { gap: 8px; }
  .formula-letter { font-size: 56px; }
  .formula-op { font-size: 32px; }
  .trust-pill:nth-child(n+3) { display: none; }
  .pub-details { display: grid; grid-template-columns: 1fr 1fr; }
  .pub-item { border-right: none; border-bottom: 1px solid var(--border); }
  .pub-item:last-child { border-bottom: none; }
  .impact-cta { bottom: 24px; }
  #cta { padding: 80px 0; }
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }
@media (max-width: 920px) {
  .container { padding: 0 48px; }
  .trust-bar-inner { padding: 0 48px; }
  .why-amazon-inner { padding: 0 48px; }
  nav { padding: 0 32px; }
  .footer-bottom { padding: 20px 48px; }
}



/* ── SCROLLBAR ──────────────────────────────────────────────── */
::-webkit-scrollbar { width:5px; height:5px; }
::-webkit-scrollbar-track { background:var(--bg-2); }
::-webkit-scrollbar-thumb { background:var(--bg-5); border-radius:100px; }
::-webkit-scrollbar-thumb:hover { background:var(--gold); }

/* ── FOCUS ──────────────────────────────────────────────────── */
:focus-visible { outline:2px solid var(--gold); outline-offset:3px; border-radius:2px; }

/* ── SR-ONLY ────────────────────────────────────────────────── */
.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; }