/* ============================================================
   CG.com design system — "Fieldnotes × Signal" hybrid
   Picked 2026-07-20 (7b design-directions thread).
   Warm-minimal base (palette, cards, air) + bold typographic
   voltage (Archivo 900 display, mono eyebrows, hard CTA contrast).
   Spec: /DESIGN.md
   ============================================================ */

:root{
  --bg:#faf6f0;        /* warm paper */
  --card:#fffdf9;      /* card surface */
  --text:#2b2a26;      /* body ink */
  --ink:#1e1d1a;       /* near-black — CTAs, bands */
  --soft:#6f6a5f;      /* muted text */
  --sage:#5f7360;      /* secondary accent */
  --sagedark:#3b4a3c;
  --clay:#c26d4b;      /* primary accent */
  --claydark:#a95a3c;
  --line:#e6ddd0;      /* hairlines, borders */
  --r:16px;
  --shadow:0 2px 14px rgba(60,50,30,.07);
  --shadow-lift:0 12px 36px rgba(60,50,30,.18);
}

*{margin:0;padding:0;box-sizing:border-box;}
body{background:var(--bg);color:var(--text);font-family:'Work Sans',system-ui,sans-serif;font-size:1.05rem;line-height:1.7;}

/* ---- layout ---- */
.wrap{max-width:66rem;margin:0 auto;padding:0 1.6rem;}
.wrap-narrow{max-width:46rem;margin:0 auto;padding:0 1.6rem;}
.wrap-mid{max-width:60rem;margin:0 auto;padding:0 1.6rem;}
section{padding:2.6rem 0;}

/* ---- type ---- */
.eyebrow{font-family:'IBM Plex Mono',monospace;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--clay);}
h2.sec{font-family:Archivo,sans-serif;font-weight:800;font-size:clamp(1.6rem,3vw,2.1rem);letter-spacing:-.02em;margin:.5rem 0 1.6rem;}
.lead{max-width:44rem;}
a.textlink{color:var(--clay);font-weight:600;text-decoration:none;}

/* ---- nav ---- */
nav.site{display:flex;justify-content:space-between;align-items:center;padding:1.8rem 0;}
.wordmark{font-family:Archivo,sans-serif;font-weight:800;font-size:1.15rem;letter-spacing:-.01em;}
.wordmark a{color:var(--text);text-decoration:none;}
nav.site ul{display:flex;gap:1.8rem;list-style:none;font-size:.92rem;align-items:center;font-weight:500;}
nav.site a{color:var(--text);text-decoration:none;}
nav.site a:hover{color:var(--clay);}
.pill{background:var(--ink);color:#fff !important;padding:.6rem 1.35rem;border-radius:999px;font-weight:600;text-decoration:none;}
.pill:hover{background:var(--clay);}

/* ---- buttons ---- */
.btn{display:inline-block;text-decoration:none;font-weight:700;padding:1rem 2.2rem;border-radius:999px;font-size:1rem;}
.btn-clay{background:var(--clay);color:#fff;}
.btn-clay:hover{background:var(--claydark);}
.btn-ink{background:var(--ink);color:#fff;}
.btn-ink:hover{background:var(--clay);}
.btn-sage{background:var(--sage);color:#fff;}
.btn-sage:hover{background:#4d5f4e;}
.btn-cream{background:#f6efe3;color:#334034;}
.btn-cream:hover{background:#fff;}
.under{display:block;font-family:'IBM Plex Mono',monospace;font-size:.75rem;color:var(--soft);margin-top:.8rem;text-transform:uppercase;letter-spacing:.06em;}

/* ---- heroes ---- */
header.hero-split{padding:4rem 0 3.5rem;display:grid;grid-template-columns:1.15fr .85fr;gap:3.5rem;align-items:center;}
@media(max-width:760px){header.hero-split{grid-template-columns:1fr;gap:2.2rem;}}
header.hero-split h1{font-family:Archivo,sans-serif;font-weight:900;font-size:clamp(2.9rem,6.5vw,4.8rem);line-height:1.0;letter-spacing:-.035em;margin:1.1rem 0 1.4rem;}
header.hero-split h1 em{font-style:normal;color:var(--sage);}
header.hero-split p.lede{font-size:1.2rem;color:var(--soft);max-width:36rem;}
.heroimg img{width:100%;max-width:440px;display:block;border-radius:24px;box-shadow:var(--shadow-lift);margin:0 auto;}

header.hero-lp{padding:4rem 0 3rem;}
header.hero-lp h1{font-family:Archivo,sans-serif;font-weight:900;font-size:clamp(2.6rem,6.5vw,4.4rem);line-height:1.0;letter-spacing:-.035em;margin:1.1rem 0 1.3rem;}
header.hero-lp h1 .accent{color:var(--clay);}
header.hero-lp p.lede{font-size:1.15rem;color:var(--soft);max-width:34rem;margin-bottom:1.9rem;}

header.hero-book{padding:3.6rem 0 3.4rem;display:grid;grid-template-columns:300px 1fr;gap:3.5rem;align-items:center;}
@media(max-width:720px){header.hero-book{grid-template-columns:1fr;gap:2.2rem;justify-items:start;}}
header.hero-book h1{font-family:Archivo,sans-serif;font-weight:900;font-size:clamp(2.6rem,6vw,4.2rem);line-height:1.0;letter-spacing:-.035em;margin:.9rem 0 .6rem;}
header.hero-book .subtitle{font-family:Spectral,Georgia,serif;font-style:italic;font-size:1.35rem;color:var(--sage);margin-bottom:1.1rem;}
header.hero-book p.lede{font-size:1.13rem;color:var(--soft);max-width:32rem;margin-bottom:1.7rem;}

/* ---- cards & grids ---- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.4rem;}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:1.8rem;}
.card .dot{width:12px;height:12px;border-radius:50%;background:var(--clay);margin-bottom:1rem;}
.card.c2 .dot{background:var(--sage);}
.card.c3 .dot{background:#a58a52;}
.card h3{font-family:Archivo,sans-serif;font-weight:800;font-size:1.35rem;letter-spacing:-.015em;margin-bottom:.2rem;}
.card .sub{font-family:Spectral,Georgia,serif;font-style:italic;color:var(--soft);margin-bottom:.8rem;}
.card p{font-size:.95rem;color:#4b463d;}
.card .pub{font-family:'IBM Plex Mono',monospace;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--soft);margin-top:1rem;}

.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.2rem;}
.fcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:1.5rem;}
.fcard h4{font-family:Archivo,sans-serif;font-weight:800;font-size:1.05rem;letter-spacing:-.01em;margin-bottom:.35rem;}
.fcard p{font-size:.92rem;color:#4b463d;}

.softcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:2rem;}
.softcard h3{font-family:Archivo,sans-serif;font-weight:800;font-size:1.2rem;letter-spacing:-.01em;margin-bottom:.7rem;}
.softcard p{font-size:.97rem;color:#4b463d;}
.softcard a{color:var(--clay);font-weight:600;text-decoration:none;}
.softcard img.avatar{width:92px;height:92px;border-radius:50%;object-fit:cover;margin-bottom:1.1rem;border:3px solid var(--line);display:block;}
.twocol{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;}
@media(max-width:640px){.twocol{grid-template-columns:1fr;}}

/* ---- quotes ---- */
.praise{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.4rem;}
.quote{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1.7rem;box-shadow:var(--shadow);margin-bottom:0;}
.quote + .quote{margin-top:1.2rem;}
.quote p{font-family:Spectral,Georgia,serif;font-size:1.05rem;line-height:1.55;}
.quote cite{display:block;font-style:normal;font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--sage);margin-top:1rem;}
.quote.big{grid-column:1/-1;text-align:center;padding:2.2rem;}
.quote.big p{font-family:Archivo,sans-serif;font-weight:800;font-style:normal;font-size:clamp(1.25rem,2.6vw,1.7rem);letter-spacing:-.015em;line-height:1.3;}

.cited{display:flex;flex-wrap:wrap;gap:.6rem 2rem;justify-content:center;align-items:center;padding:1.6rem 0;color:var(--soft);font-family:'IBM Plex Mono',monospace;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}

/* ---- dark bands ---- */
.band{background:var(--ink);border-radius:24px;color:#f2ede4;padding:3.8rem 2.6rem;display:grid;grid-template-columns:1.4fr 1fr;gap:2rem;align-items:center;box-shadow:var(--shadow);}
@media(max-width:700px){.band{grid-template-columns:1fr;}}
.band .eyebrow{color:var(--clay);}
.band h2{font-family:Archivo,sans-serif;font-weight:900;font-size:clamp(1.8rem,4vw,2.8rem);letter-spacing:-.028em;line-height:1.02;margin:.7rem 0 .9rem;}
.band p{color:#c9c2b4;max-width:30rem;}
.band .cta{text-align:center;}
.pricehint{font-family:'IBM Plex Mono',monospace;font-size:.75rem;color:#8f897d;margin-top:.9rem;text-transform:uppercase;letter-spacing:.06em;}

/* ---- LP components ---- */
.saidit{display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
@media(max-width:600px){.saidit{grid-template-columns:1fr;}}
.saidit .q{background:var(--card);border:1px solid var(--line);border-left:6px solid var(--clay);border-radius:var(--r);box-shadow:var(--shadow);padding:1.4rem;font-family:Spectral,Georgia,serif;font-style:italic;font-size:1.08rem;line-height:1.5;}
.afterline{margin-top:1.6rem;color:#4b463d;}

.shift{display:grid;gap:.9rem;}
.shift .row{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1.1rem 1.4rem;display:grid;grid-template-columns:1fr auto 1fr;gap:1rem;align-items:center;box-shadow:var(--shadow);}
.shift .from{color:var(--soft);font-family:Spectral,Georgia,serif;font-style:italic;text-align:right;}
.shift .arrow{color:var(--clay);font-weight:900;font-size:1.15rem;}
.shift .to{font-family:Archivo,sans-serif;font-weight:800;letter-spacing:-.01em;color:var(--sagedark);}
@media(max-width:560px){.shift .row{grid-template-columns:1fr;gap:.2rem;}.shift .from{text-align:left;}}

.dothis,.outcomes{display:grid;gap:1rem;counter-reset:item;}
.dothis .item,.outcomes .item{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1.3rem 1.5rem;box-shadow:var(--shadow);display:grid;grid-template-columns:2.6rem 1fr;gap:.6rem;align-items:start;}
.dothis .item::before,.outcomes .item::before{counter-increment:item;content:counter(item,decimal-leading-zero);font-family:'IBM Plex Mono',monospace;color:var(--clay);font-size:.85rem;padding-top:.25rem;}
.dothis .item strong{display:block;font-family:Archivo,sans-serif;font-weight:800;letter-spacing:-.01em;margin-bottom:.2rem;}
.dothis .item p,.outcomes .item p{font-size:.95rem;color:#4b463d;}
.outcomes .item p{font-size:.98rem;}

.whogrid{display:grid;grid-template-columns:220px 1fr;gap:2.2rem;align-items:start;}
@media(max-width:600px){.whogrid{grid-template-columns:1fr;}.whogrid img{max-width:260px;}}
.whogrid img{width:100%;border-radius:20px;box-shadow:var(--shadow);display:block;}

/* ---- price card ---- */
.price{background:var(--ink);border-radius:24px;color:#f2ede4;padding:3.2rem 2.4rem;text-align:center;box-shadow:var(--shadow);}
.price .eyebrow{color:var(--clay);}
.price h2{font-family:Archivo,sans-serif;font-weight:900;font-size:2rem;letter-spacing:-.02em;margin:.7rem 0 .2rem;}
.price .amount{font-family:Archivo,sans-serif;font-weight:900;font-size:clamp(3rem,7vw,4.2rem);letter-spacing:-.03em;line-height:1;}
.price .amount small{font-family:'IBM Plex Mono',monospace;font-size:.95rem;font-weight:500;color:#8f897d;letter-spacing:0;}
.price .after{font-family:'IBM Plex Mono',monospace;font-size:.78rem;color:var(--clay);text-transform:uppercase;letter-spacing:.06em;margin:.6rem 0 1.7rem;}
.price ul{list-style:none;max-width:25rem;margin:0 auto 1.9rem;text-align:left;color:#c9c2b4;font-size:.98rem;}
.price ul li{padding:.5rem 0 .5rem 1.6rem;position:relative;border-bottom:1px solid #35332e;}
.price ul li::before{content:"\2713";position:absolute;left:0;color:var(--clay);font-weight:700;}
.price .note{display:block;font-family:'IBM Plex Mono',monospace;font-size:.7rem;color:#8f897d;margin-top:1.1rem;text-transform:uppercase;letter-spacing:.04em;}
.price .note a{color:#c9c2b4;}
.ledby{display:flex;align-items:center;gap:.75rem;justify-content:center;margin:0 0 1.7rem;}
.ledby img{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid #4a463e;}
.ledby span{font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:#c9c2b4;}

/* ---- FAQ / PS ---- */
.faq .qa{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1.3rem 1.5rem;margin-bottom:1rem;box-shadow:var(--shadow);}
.faq .qa h4{font-family:Archivo,sans-serif;font-weight:800;font-size:1.02rem;letter-spacing:-.01em;margin-bottom:.4rem;}
.faq .qa p{font-size:.95rem;color:#4b463d;}
.ps,.primer{border-left:6px solid var(--clay);background:var(--card);border-radius:0 var(--r) var(--r) 0;padding:1.6rem 1.8rem;box-shadow:var(--shadow);}
.primer{border-left-color:var(--sage);padding:1.8rem 2rem;}
.ps strong{font-family:'IBM Plex Mono',monospace;color:var(--clay);letter-spacing:.1em;font-size:.78rem;text-transform:uppercase;}
.primer h3{font-family:Archivo,sans-serif;font-weight:800;font-size:1.2rem;margin-bottom:.5rem;}
.primer p{font-size:.98rem;color:#4b463d;}
.primer a{color:var(--clay);font-weight:600;text-decoration:none;}

/* ---- book page ---- */
.cover{aspect-ratio:2/3;width:100%;max-width:300px;border-radius:10px;box-shadow:0 16px 40px rgba(60,50,30,.25);display:flex;flex-direction:column;justify-content:space-between;padding:2rem 1.6rem;color:#fdf7ef;position:relative;overflow:hidden;}
.cover.cover-clay{background:linear-gradient(160deg,#c26d4b,#a95a3c);}
.cover.cover-sage{background:linear-gradient(160deg,#5f7360,#3b4a3c);color:#f2ede4;}
.cover::after{content:"";position:absolute;left:10px;top:0;bottom:0;width:2px;background:rgba(0,0,0,.12);}
.cover .ct{font-family:Archivo,sans-serif;font-weight:900;font-size:2.1rem;line-height:1.0;letter-spacing:-.02em;text-transform:uppercase;}
.cover .cs{font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;opacity:.85;margin-top:.8rem;}
.cover .ca{font-family:Archivo,sans-serif;font-weight:800;font-size:.95rem;letter-spacing:.06em;text-transform:uppercase;}
.buyrow{display:flex;flex-wrap:wrap;gap:.7rem;}
.buy{display:inline-block;text-decoration:none;font-weight:600;font-size:.92rem;padding:.7rem 1.4rem;border-radius:999px;background:var(--ink);color:#fff;}
.buy:hover{background:var(--clay);}
.buy.alt{background:transparent;color:var(--ink);border:2px solid var(--ink);}
.buy.alt:hover{border-color:var(--clay);color:var(--clay);}
.authorstrip{display:flex;gap:1.4rem;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:1.8rem;}
.authorstrip img{width:76px;height:76px;border-radius:50%;object-fit:cover;border:3px solid var(--line);flex-shrink:0;}
.authorstrip p{font-size:.95rem;color:#4b463d;}
.authorstrip strong{font-family:Archivo,sans-serif;}

/* ---- misc ---- */
.substack{text-align:center;padding:3.5rem 1.5rem;}
.substack h3{font-family:Archivo,sans-serif;font-weight:800;font-size:1.6rem;letter-spacing:-.02em;margin-bottom:.6rem;}
.substack p{color:var(--soft);max-width:32rem;margin:0 auto 1.6rem;}
footer{border-top:1px solid var(--line);margin-top:2rem;padding:2.2rem 0 3rem;text-align:center;font-size:.85rem;color:var(--soft);}
footer a{color:var(--soft);}