/* =========================================================
   Debt Free Dept. — STAGING ONLY: brand kit v2 overrides + new components
   Load AFTER css/style.css (an unchanged copy of the live stylesheet).
   Source of v2 tokens: /workspace/dfd/week1/brand-kit/brand-kit.md and build/kit.py
   Differences from live (v1): Nunito Black sentence-case headlines (not Anton caps),
   new Sage #B7CBB0, Cream as the main light background (live uses Paper #F7F2E7),
   no gold-colored text on light backgrounds (live uses gold-ink #7A5C14 kickers);
   emphasis is a gold highlight band (.ul). Wordmark "Debt Free Dept" + sprout in header.
   ========================================================= */

/* Relative font URLs so pages also render from file:// (live CSS uses /fonts/...) */
@font-face{font-family:"Inter";src:url("../fonts/inter-latin-var.woff2") format("woff2");font-weight:400 800;font-style:normal;font-display:swap}
@font-face{font-family:"Nunito";src:url("../fonts/nunito-900-latin.woff2") format("woff2");font-weight:900;font-style:normal;font-display:swap}
@font-face{font-family:"Nunito";src:url("../fonts/nunito-800-latin.woff2") format("woff2");font-weight:800;font-style:normal;font-display:swap}

:root{
  --forest:#1B3A26; --sage:#B7CBB0; --gold:#C9A13B; --cream:#F3E9D2;
  --green:var(--forest);
  --paper:var(--cream);           /* v2: cream is the main light background */
  --gold-ink:var(--forest);       /* v2: never gold text on light; kickers go forest */
  --font-display:"Nunito","Arial Rounded MT Bold","Segoe UI",system-ui,sans-serif;
  --card:#FBF6EA;                 /* slightly lighter than cream for cards (decorative surface) */
  --line:rgba(27,58,38,.16);
}
body{font-weight:500;background:var(--cream)}
h1,h2,h3{font-family:var(--font-display);font-weight:900;text-transform:none;letter-spacing:-.01em;line-height:1.08}
h1{font-size:clamp(2.4rem,9vw,4.25rem)}
h2{font-size:clamp(1.8rem,5.5vw,2.6rem)}
h3{font-size:1.3rem;letter-spacing:-.005em}
.kicker{color:var(--forest)}
.on-dark .kicker{color:var(--gold)}
.ul{background:linear-gradient(transparent 62%,rgba(201,161,59,.55) 62%,rgba(201,161,59,.55) 88%,transparent 88%);padding:0 .06em}
.on-dark .ul{background:none;color:var(--gold)}

/* Header: v2 cream wordmark on forest (same structure as live header) */
.brand-wordmark img{width:auto;height:34px}
@media (min-width:48rem){.brand-wordmark img{height:40px}}
.site-footer .footer-brand img.wm{width:auto;height:30px}

/* Draft banner */
.staging-banner{background:var(--gold);color:var(--forest);font-weight:700;font-size:.85rem;text-align:center;padding:.4rem 1rem}

/* Placeholder marker: anything awaiting real inputs (Mon Nov 2) */
.ph{background:rgba(201,161,59,.22);outline:2px dashed rgba(27,58,38,.45);outline-offset:2px;border-radius:4px;padding:0 .2em}
.on-dark .ph{background:rgba(243,233,210,.14);outline-color:rgba(243,233,210,.6)}

/* ---------- Affiliate note (FTC: must sit ABOVE the first affiliate link) ---------- */
.affiliate-note{background:var(--sage);color:var(--forest);border-radius:12px;padding:.9rem 1.1rem;font-size:.95rem;margin:0 0 2.25rem;max-width:46rem}
.affiliate-note a{color:var(--forest);font-weight:700}

/* ---------- Books page ---------- */
.book-section{margin-bottom:3rem}
.book-section:last-child{margin-bottom:0}
.book-section .section-head{margin-bottom:1.25rem}
.book-grid{list-style:none;margin:0;padding:0;display:grid;gap:1.25rem}
@media (min-width:40rem){.book-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:64rem){.book-grid{grid-template-columns:repeat(3,1fr)}}
.book-card{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.25rem;gap:.9rem}
.book-cover{aspect-ratio:2/3;width:58%;max-width:11rem;margin-inline:auto;border-radius:6px;overflow:hidden;background:var(--sage);box-shadow:6px 6px 0 var(--forest)}
.book-cover img{width:100%;height:100%;object-fit:cover}
.book-cover--empty{display:grid;place-items:center;text-align:center;font-weight:700;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--forest);border:2px dashed rgba(27,58,38,.5)}
.book-title{margin:0;font-size:1.35rem}
.book-author{margin:-.5rem 0 0;color:var(--muted);font-weight:600}
.book-why{margin:0;color:var(--ink);flex:1}
.book-why strong{color:var(--forest)}
.book-card .btn{margin-top:.25rem}
.book-asin{font-size:.75rem;color:var(--muted);margin:0}

/* ---------- Waitlist page ---------- */
.waitlist-hero .wrap{display:grid;gap:2rem}
@media (min-width:48rem){.waitlist-hero .wrap{grid-template-columns:1.1fr .9fr;align-items:center;gap:3.5rem}}
.waitlist-hero .checklist strong{color:var(--cream)}
.waitlist-hero .price{display:inline-block;margin-top:1.25rem;font-weight:700;color:var(--cream)}
.embed-slot{min-height:9rem;border:2px dashed rgba(27,58,38,.45);border-radius:12px;display:grid;place-items:center;text-align:center;padding:1rem;color:var(--muted);font-weight:600;font-size:.9rem;background:rgba(183,203,176,.35)}
.signup .fineprint{color:var(--forest)}
.affiliate-note p{margin:0}
.affiliate-note .affiliate-note-main{font-weight:700}
.affiliate-note .affiliate-note-more{font-size:.88rem;margin-top:.2rem}
.book-cover--type{display:flex;flex-direction:column;justify-content:center;gap:.6rem;padding:1rem .9rem;background:var(--forest);color:var(--cream);text-align:left;border-top:6px solid var(--gold)}
.book-cover--type .bc-title{font-family:var(--font-display);font-weight:900;font-size:1.15rem;line-height:1.1}
.book-cover--type .bc-author{font-size:.75rem;font-weight:600;opacity:.85}
.book-cover{box-shadow:6px 6px 0 var(--sage)}

/* ---------- Sales page (Debt Snowball Tracker) ---------- */
.sales-hero .wrap{display:grid;gap:2rem}
@media (min-width:56rem){.sales-hero .wrap{grid-template-columns:1fr 1fr;align-items:center;gap:3rem}}
.hero-figure{margin:0}
.hero-figure img,.feature-figure img{width:100%;height:auto;border-radius:var(--radius)}
.hero-figure figcaption,.feature-figure figcaption{font-size:.85rem;margin-top:.5rem;opacity:.9}
.buy-box{margin-top:1.5rem;max-width:26rem}
.buy-box--center{margin-inline:auto}
.buy-box .btn{margin-top:.5rem}
.price-line{display:flex;flex-wrap:wrap;align-items:baseline;gap:.35rem .7rem;margin:0}
.price-now{font-family:var(--font-display);font-weight:900;font-size:2.6rem;line-height:1}
.price-label{font-weight:700}
.price-reg{font-weight:600;opacity:.9}
.price-reg s{text-decoration-thickness:2px}
.on-dark .price-now{color:var(--gold)}
.checkout-ph{margin:.4rem 0 0;font-size:.8rem}
.on-dark .fineprint{color:var(--cream);opacity:.85}
.on-dark .fineprint a{color:var(--cream)}
.feature{display:grid;gap:2rem;align-items:center}
@media (min-width:56rem){.feature{grid-template-columns:1.1fr .9fr;gap:3.5rem}.feature--flip{grid-template-columns:.9fr 1.1fr}}
.feature-figure{margin:0;max-width:30rem;justify-self:center}
.inside-list{padding-left:1.2rem}.inside-list li{margin-bottom:.5rem}
.ex-table{border-collapse:collapse;margin:0 0 1rem;min-width:16rem;background:#fff;border-radius:10px;overflow:hidden}
.ex-table th,.ex-table td{padding:.5rem .9rem;border-bottom:1px solid var(--line);text-align:left}
.ex-table td:last-child,.ex-table th:last-child{text-align:right;font-variant-numeric:tabular-nums}
.ex-table thead th{background:var(--forest);color:var(--cream)}
.fit{display:grid;gap:2rem}
@media (min-width:48rem){.fit{grid-template-columns:1fr 1fr}}
.plain-list{padding-left:1.2rem}.plain-list li{margin-bottom:.6rem}
.fit-note{margin-top:2rem}
.ebook-card{background:var(--card);border:1px solid var(--line);border-left:6px solid var(--gold);border-radius:var(--radius);padding:1.75rem 1.5rem;max-width:44rem}
.ebook-sub{font-weight:600}
.ebook-card .btn{width:auto;min-width:16rem;margin-top:1rem}
.legal-block{padding-block:2.5rem}
.legal-mini{margin-top:1.5rem}
sup a{text-decoration:none}
.sales-hero h1{font-size:clamp(2.3rem,7vw,3.6rem)}
.staging-banner{margin:0}
.on-dark .signup .fineprint{color:var(--forest);opacity:1}.on-dark .signup .fineprint a{color:var(--forest)}