  :root {
      --ink: #2b211c;
      --espresso: #3a2924;
      --plum: #55384d;
      --berry: #8d536a;
      --rose: #d59aa4;
      --copper: #b46d3f;
      --gold: #d7a95f;
      --sage: #8e9c7d;
      --linen: #fbf3e7;
      --paper: #fffaf1;
      --mist: #eadfce;
      --shadow: 0 24px 70px rgba(49, 32, 25, .18);
      --soft-shadow: 0 12px 35px rgba(49, 32, 25, .12);
      --radius: 28px;
      --max: 1180px;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      font-family: Georgia, 'Times New Roman', serif;
      color: var(--ink);
      background:
        radial-gradient(circle at top left, rgba(213,154,164,.35), transparent 30rem),
        radial-gradient(circle at top right, rgba(215,169,95,.28), transparent 26rem),
        linear-gradient(180deg, #fff7ea 0%, #f5eadc 46%, #efe0cf 100%);
      line-height: 1.7;
    }

    body::before {
      content: "";
      position: fixed;
      inset: 0;
      pointer-events: none;
      opacity: .22;
      background-image:
        linear-gradient(rgba(58,41,36,.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(58,41,36,.045) 1px, transparent 1px);
      background-size: 42px 42px;
      mask-image: linear-gradient(to bottom, rgba(0,0,0,.8), transparent 80%);
    }
  .audio-preview {
  max-width: 720px;
  margin: 3rem auto;
  padding: 2rem;
  border-radius: 24px;
  background: #fff8ef;
  box-shadow: 0 12px 40px rgba(58, 35, 22, 0.12);
  text-align: center;
}

.audio-card {
  margin-top: 1.25rem;
}

.audio-button {
  border: none;
  border-radius: 999px;
  padding: 0.9rem 1.5rem;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  background: #7b3f2f;
  color: #fff8ef;
  box-shadow: 0 8px 24px rgba(80, 42, 30, 0.2);
}

.audio-button:hover {
  background: #5f2f23;
}
    a { color: inherit; }
    img { max-width: 100%; display: block; }
    p { margin: 0 0 1rem; }

    .site-nav {
      position: sticky;
      top: 0;
      z-index: 50;
      backdrop-filter: blur(16px);
      background: rgba(251,243,231,.84);
      border-bottom: 1px solid rgba(58,41,36,.12);
    }

    .nav-inner {
      max-width: var(--max);
      margin: 0 auto;
      padding: .85rem 1.25rem;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
    }

    .brand {
      text-decoration: none;
      font-weight: 800;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--espresso);
      font-size: .86rem;
      display: inline-flex;
      align-items: center;
      gap: .55rem;
      white-space: nowrap;
    }

    .brand-mark {
      width: 34px;
      height: 34px;
      border-radius: 50%;
      display: inline-grid;
      place-items: center;
      background: linear-gradient(135deg, var(--plum), var(--copper));
      color: var(--linen);
      box-shadow: 0 7px 18px rgba(85,56,77,.22);
      font-size: 1rem;
    }

    .nav-links {
      display: flex;
      align-items: center;
      gap: clamp(.6rem, 2vw, 1.4rem);
      font-size: .88rem;
      letter-spacing: .04em;
      text-transform: uppercase;
    }

    .nav-links a {
      text-decoration: none;
      color: rgba(43,33,28,.78);
      border-bottom: 1px solid transparent;
      padding-bottom: .15rem;
    }

    .nav-links a:hover { color: var(--plum); border-bottom-color: var(--gold); }

    .hero {
      min-height: 88vh;
      display: grid;
      place-items: center;
      padding: 5rem 1.25rem 4rem;
      position: relative;
      overflow: hidden;
    }
.honeypot {
 position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; 
}

    .hero::after {
      content: "";
      position: absolute;
      width: min(62vw, 760px);
      height: min(62vw, 760px);
      border-radius: 50%;
      right: -22vw;
      top: 5rem;
      background: radial-gradient(circle, rgba(141,83,106,.18), rgba(180,109,63,.1) 42%, transparent 68%);
      filter: blur(2px);
    }

    .hero-grid {
      width: min(100%, var(--max));
      display: grid;
      grid-template-columns: minmax(0, 1.05fr) minmax(310px, .72fr);
      gap: clamp(2rem, 5vw, 5rem);
      align-items: center;
      position: relative;
      z-index: 1;
    }

    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: .7rem;
      padding: .42rem .8rem;
      border: 1px solid rgba(85,56,77,.18);
      border-radius: 999px;
      background: rgba(255,250,241,.74);
      color: var(--plum);
      text-transform: uppercase;
      letter-spacing: .16em;
      font-size: .76rem;
      font-weight: 700;
      margin-bottom: 1.25rem;
    }

    .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 5px rgba(215,169,95,.18); }

    h1, h2, h3 {
      line-height: 1.05;
      margin: 0;
      color: var(--espresso);
      letter-spacing: -.035em;
    }

    h1 {
      font-size: clamp(3.3rem, 8vw, 7.35rem);
      max-width: 11ch;
    }

    .title-accent {
      display: block;
      color: var(--berry);
      font-style: italic;
      font-weight: 500;
      letter-spacing: -.055em;
    }

    .subtitle {
      font-size: clamp(1.13rem, 2vw, 1.38rem);
      max-width: 54rem;
      color: rgba(43,33,28,.82);
      margin: 1.35rem 0 1.7rem;
    }

    .hero-actions, .cta-row {
      display: flex;
      flex-wrap: wrap;
      gap: .85rem;
      align-items: center;
    }

    .button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 48px;
      padding: .85rem 1.2rem;
      border-radius: 999px;
      text-decoration: none;
      font-weight: 800;
      letter-spacing: .045em;
      text-transform: uppercase;
      font-size: .82rem;
      border: 1px solid transparent;
      transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
    }

    .button:hover { transform: translateY(-2px); box-shadow: var(--soft-shadow); }
    .button.primary { background: linear-gradient(135deg, var(--plum), var(--copper)); color: var(--paper); }
    .button.secondary { background: rgba(255,250,241,.78); color: var(--espresso); border-color: rgba(58,41,36,.16); }

    .hero-note {
      margin-top: 1.15rem;
      color: rgba(43,33,28,.68);
      font-size: .95rem;
    }

    .book-cover {
      position: relative;
      min-height: 610px;
      border-radius: 22px;
      padding: 1.2rem;
      background: linear-gradient(135deg, rgba(255,250,241,.72), rgba(234,223,206,.5));
      box-shadow: var(--shadow);
      transform: rotate(1.2deg);
    }

    .book-cover::before {
      content: "";
      position: absolute;
      inset: 18px 12px 12px 22px;
      border-radius: 18px;
      background: rgba(43,33,28,.12);
      filter: blur(16px);
      transform: translateY(18px) rotate(-2deg);
      z-index: -1;
    }

    .cover-art {
      height: 100%;
      min-height: 570px;
      border-radius: 18px;
      overflow: hidden;
      color: var(--paper);
      position: relative;
      border: 1px solid rgba(255,250,241,.38);
      background:
        radial-gradient(circle at 50% 20%, rgba(247,213,145,.42), transparent 22%),
        radial-gradient(circle at 20% 82%, rgba(213,154,164,.35), transparent 24%),
        linear-gradient(160deg, #2e1e22 0%, #55384d 38%, #8d536a 70%, #b46d3f 100%);
      padding: 2.2rem 1.7rem;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      text-align: center;
    }

    .cover-art::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        linear-gradient(90deg, rgba(255,255,255,.08) 0 1px, transparent 1px 38px),
        linear-gradient(rgba(255,255,255,.06) 0 1px, transparent 1px 36px);
      opacity: .18;
    }

    .cover-art::after {
      content: "";
      position: absolute;
      left: 50%;
      top: 47%;
      width: 210px;
      height: 210px;
      transform: translate(-50%, -50%);
      border-radius: 50%;
      background:
        radial-gradient(circle at 50% 56%, rgba(255,250,241,.9) 0 12px, transparent 13px),
        radial-gradient(circle at 50% 50%, transparent 0 60px, rgba(255,250,241,.24) 61px 64px, transparent 65px),
        conic-gradient(from 18deg, rgba(255,250,241,.1), rgba(255,250,241,.38), rgba(255,250,241,.08), rgba(255,250,241,.28), rgba(255,250,241,.1));
      opacity: .9;
      box-shadow: inset 0 0 42px rgba(255,250,241,.08), 0 0 70px rgba(215,169,95,.22);
    }

    .cover-kicker, .cover-author {
      position: relative;
      z-index: 1;
      text-transform: uppercase;
      letter-spacing: .22em;
      font-size: .78rem;
      font-weight: 800;
      color: rgba(255,250,241,.82);
    }

    .cover-title {
      position: relative;
      z-index: 1;
      margin-top: 4.4rem;
      font-size: clamp(2.4rem, 4.5vw, 4.15rem);
      line-height: .96;
      letter-spacing: -.05em;
      text-shadow: 0 10px 28px rgba(43,33,28,.42);
    }

    .cover-title span { display: block; font-style: italic; color: #f5d69b; }
    .cover-tag { position: relative; z-index: 1; max-width: 18rem; margin: 1rem auto 0; color: rgba(255,250,241,.86); font-size: .98rem; }

    section { padding: clamp(4rem, 8vw, 7rem) 1.25rem; position: relative; }
    .container { width: min(100%, var(--max)); margin: 0 auto; }
    .section-head { max-width: 790px; margin-bottom: 2rem; }
    .section-kicker {
      color: var(--berry);
      text-transform: uppercase;
      letter-spacing: .18em;
      font-weight: 800;
      font-size: .76rem;
      margin-bottom: .7rem;
    }
    h2 { font-size: clamp(2.1rem, 4.8vw, 4.25rem); }
    .section-copy { color: rgba(43,33,28,.76); font-size: 1.08rem; max-width: 70ch; margin-top: 1rem; }

    .about-grid {
      display: grid;
      grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
      gap: clamp(2rem, 5vw, 4rem);
      align-items: start;
    }

    .blurb-card, .warm-card, .chapter-card, .signup-card {
      background: rgba(255,250,241,.78);
      border: 1px solid rgba(58,41,36,.12);
      border-radius: var(--radius);
      box-shadow: var(--soft-shadow);
    }

    .blurb-card { padding: clamp(1.4rem, 3vw, 2.2rem); }
    .lead { font-size: 1.28rem; color: var(--espresso); line-height: 1.65; }
    .pull-quote {
      margin: 1.5rem 0 0;
      padding: 1.15rem 1.2rem;
      border-left: 4px solid var(--gold);
      background: rgba(215,169,95,.12);
      border-radius: 0 18px 18px 0;
      color: var(--plum);
      font-style: italic;
      font-size: 1.08rem;
    }

    .promise-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 1rem;
      margin-top: 2rem;
    }

    .promise {
      padding: 1.2rem;
      border-radius: 22px;
      background: rgba(255,250,241,.72);
      border: 1px solid rgba(58,41,36,.1);
      min-height: 170px;
    }
    .promise .icon {
      width: 44px;
      height: 44px;
      border-radius: 16px;
      display: grid;
      place-items: center;
      background: linear-gradient(135deg, rgba(141,83,106,.16), rgba(215,169,95,.2));
      color: var(--plum);
      font-weight: 900;
      margin-bottom: .8rem;
    }
    .promise h3 { font-size: 1.15rem; letter-spacing: -.02em; margin-bottom: .45rem; }
    .promise p { font-size: .96rem; color: rgba(43,33,28,.72); margin: 0; }

    .brindlewash {
      background:
        linear-gradient(180deg, rgba(58,41,36,.04), rgba(58,41,36,.02)),
        rgba(255,250,241,.38);
    }

    .feature-strip {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      gap: 1rem;
      margin-top: 2rem;
    }

    .feature {
      padding: 1.35rem;
      border-radius: 24px;
      background: linear-gradient(180deg, rgba(255,250,241,.82), rgba(251,243,231,.64));
      border: 1px solid rgba(58,41,36,.11);
      box-shadow: 0 8px 22px rgba(49,32,25,.08);
    }
    .feature strong { display: block; color: var(--plum); margin-bottom: .35rem; }
    .feature p { margin: 0; color: rgba(43,33,28,.72); font-size: .98rem; }

    .cast-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 1.2rem;
      margin-top: 2.2rem;
    }

    .cast-card {
      overflow: hidden;
      border-radius: var(--radius);
      background: var(--paper);
      border: 1px solid rgba(58,41,36,.12);
      box-shadow: var(--soft-shadow);
    }
    .cast-card img { width: 100%; aspect-ratio: 4 / 4.4; object-fit: cover; }
    .cast-body { padding: 1.3rem; }
    .role {
      display: inline-flex;
      margin: .5rem 0 .75rem;
      color: var(--berry);
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .12em;
      font-size: .72rem;
    }
    .cast-body h3 { font-size: 1.55rem; }
    .cast-body p { color: rgba(43,33,28,.73); margin-bottom: 0; }

    .supporting {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: .85rem;
      margin-top: 1rem;
    }
    .mini-card {
      padding: 1rem;
      border-radius: 20px;
      background: rgba(255,250,241,.62);
      border: 1px solid rgba(58,41,36,.1);
    }
    .mini-card strong { display: block; color: var(--espresso); }
    .mini-card span { display: block; color: rgba(43,33,28,.68); font-size: .92rem; margin-top: .22rem; }

    .chapter { background: linear-gradient(180deg, rgba(85,56,77,.07), rgba(180,109,63,.07)); }
    .chapter-card { padding: clamp(1.4rem, 4vw, 2.8rem); }
    .chapter-meta {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: .6rem;
      margin-bottom: 1.2rem;
    }
    .pill {
      display: inline-flex;
      padding: .35rem .7rem;
      border-radius: 999px;
      background: rgba(85,56,77,.09);
      color: var(--plum);
      border: 1px solid rgba(85,56,77,.13);
      font-size: .77rem;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .12em;
    }
    .chapter-card h3 { font-size: clamp(1.9rem, 3.7vw, 3.2rem); margin-bottom: 1rem; }
    .chapter-content {
      max-width: 74ch;
      font-size: 1.08rem;
    }
    .chapter-content p:first-child {
      font-size: 1.34rem;
      color: var(--plum);
      font-style: italic;
      margin-bottom: 1.2rem;
    }

    .author-grid {
      display: grid;
      grid-template-columns: 260px minmax(0, 1fr);
      gap: clamp(1.5rem, 4vw, 3rem);
      align-items: center;
      padding: clamp(1.25rem, 3vw, 2rem);
    }
    .author-photo {
      border-radius: 30px;
      overflow: hidden;
      box-shadow: var(--soft-shadow);
      border: 8px solid rgba(255,250,241,.92);
      transform: rotate(-1.2deg);
    }
    .author-photo img { aspect-ratio: 1; object-fit: cover; }
    .author-copy h2 { margin-bottom: 1rem; }
    .author-copy p { font-size: 1.07rem; color: rgba(43,33,28,.76); }

    .signup-card {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(280px, .75fr);
      gap: 2rem;
      padding: clamp(1.4rem, 4vw, 2.4rem);
      background:
        radial-gradient(circle at 10% 10%, rgba(215,169,95,.18), transparent 28%),
        linear-gradient(135deg, rgba(85,56,77,.98), rgba(58,41,36,.98));
      color: var(--paper);
    }
    .signup-card h2 { color: var(--paper); }
    .signup-card p { color: rgba(255,250,241,.78); }
    .signup-card form { display: grid; gap: .8rem; align-self: center; }
    .field {
      width: 100%;
      border: 1px solid rgba(255,250,241,.26);
      background: rgba(255,250,241,.1);
      color: var(--paper);
      border-radius: 999px;
      padding: 1rem 1.05rem;
      font: inherit;
    }
    .field::placeholder { color: rgba(255,250,241,.58); }
    .signup-card .button { width: 100%; background: var(--gold); color: var(--espresso); }
    .tiny { font-size: .84rem; color: rgba(255,250,241,.58) !important; margin: .15rem 0 0; }

    footer {
      padding: 2.4rem 1.25rem;
      text-align: center;
      color: rgba(43,33,28,.68);
      border-top: 1px solid rgba(58,41,36,.12);
      background: rgba(255,250,241,.48);
    }
    footer a { color: var(--plum); font-weight: 800; text-decoration: none; }

    @media (max-width: 980px) {
      .hero-grid, .about-grid, .signup-card { grid-template-columns: 1fr; }
      .book-cover { max-width: 470px; width: 100%; margin: 0 auto; }
      .promise-grid, .supporting { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .feature-strip, .cast-grid { grid-template-columns: 1fr; }
      .cast-card { display: grid; grid-template-columns: 220px minmax(0,1fr); }
      .cast-card img { height: 100%; aspect-ratio: auto; }
    }

    @media (max-width: 720px) {
      .nav-inner { align-items: flex-start; flex-direction: column; }
      .nav-links { width: 100%; overflow-x: auto; padding-bottom: .2rem; }
      .hero { min-height: auto; padding-top: 3rem; }
      .book-cover { min-height: 520px; transform: none; }
      .cover-art { min-height: 488px; }
      .promise-grid, .supporting, .author-grid { grid-template-columns: 1fr; }
      .cast-card { display: block; }
      .cast-card img { aspect-ratio: 4 / 4.2; }
      section { padding-left: 1rem; padding-right: 1rem; }
      .chapter-content { font-size: 1rem; }
    }
      
      /* PRAISE */
  .praise-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:2rem}
  .praise{
    background:white;padding:2rem;border-radius:12px;
    border-top:4px solid var(--gold);
    box-shadow:0 4px 18px rgba(0,0,0,.07);
  }
  .stars{color:var(--gold);font-size:1.1rem;margin-bottom:.6rem}
  .praise p{font-style:italic;margin-bottom:1rem}
  .praise .who{color:var(--plum);font-weight:600;font-size:.9rem;letter-spacing:.05em}
 