/* ===== RESET ===== */
    *, *::before, *::after {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    html {
      scroll-behavior: smooth;
    }

    /* ===== BASE ===== */
    body {
      background-color: #F7F3EA;
      color: #2B2B28;
      font-family: Georgia, 'Times New Roman', serif;
      line-height: 1.7;
      font-size: 16px;
    }

    h1, h2, h3 {
      font-family: Georgia, 'Times New Roman', serif;
      color: #2B2B28;
      line-height: 1.3;
    }

    .ui-font {
      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
    }

    /* ===== LAYOUT ===== */
    .container {
      max-width: 1100px;
      margin: 0 auto;
      padding: 0 2rem;
    }

    /* ===== HERO ===== */
    .hero {
      background-color: #2B2B28;
    }

    .hero-banner-wrap {
      width: 100%;
      position: relative;
    }

    .hero-banner-img {
      width: 100%;
      max-height: 370px;
      object-fit: cover;
      display: block;
    }

    .banner-placeholder {
      width: 100%;
      height: 300px;
      background-color: #DCE5D8;
      border: 2px dashed #a8bfa4;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 0.75rem;
    }

    .placeholder-eyebrow {
      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
      font-size: 0.72rem;
      text-transform: uppercase;
      letter-spacing: 0.12em;
      color: #6a7d65;
    }

    .placeholder-icon-bar {
      width: 48px;
      height: 3px;
      background-color: #a8bfa4;
      border-radius: 2px;
    }

    .placeholder-label {
      font-family: Georgia, 'Times New Roman', serif;
      font-size: 1rem;
      color: #4a5f46;
    }

    .hero-banner-title {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 90%;
      text-align: center;
      font-family: Georgia, 'Times New Roman', serif;
      font-size: clamp(2rem, 5.5vw, 3.8rem);
      font-weight: bold;
      color: #FFF4DC;
      line-height: 1.2;
      text-shadow: 0 2px 4px rgba(45, 28, 18, 0.85), 0 0 10px rgba(45, 28, 18, 0.45);
      pointer-events: none;
    }

    .hero-text-band {
      background: linear-gradient(to bottom, #FBF1DF, #F7F3EA);
      padding: 2.5rem 0 1.5rem;
      text-align: center;
    }

    .hero-heading {
      font-size: clamp(1.9rem, 3.5vw, 2.7rem);
      color: #173F2A;
      margin-bottom: 0.55rem;
    }

    /* ===== SECTION SHARED ===== */
    .page-section {
      padding: 3rem 0;
    }

    .section-alt {
      background-color: #FFFDF8;
    }

    .section-heading {
      font-size: clamp(1.4rem, 2.5vw, 1.9rem);
      color: #173F2A;
      text-align: center;
      margin-bottom: 0.6rem;
    }

    .section-rule {
      width: 44px;
      height: 2px;
      background-color: #173F2A;
      opacity: 0.35;
      margin: 0 auto 3.5rem;
    }

    /* ===== BOOKS ===== */
    .book-entry {
      display: grid;
      grid-template-columns: 260px 1fr;
      gap: 3.5rem;
      align-items: start;
      padding-bottom: 4rem;
      margin-bottom: 4rem;
      border-bottom: 1px solid #DDD7CC;
    }

    .book-entry:last-child {
      border-bottom: none;
      padding-bottom: 0;
      margin-bottom: 0;
    }

    /* Book 2: reversed layout */
    .book-entry--reversed {
      grid-template-columns: 1fr 260px;
    }

    .book-entry--reversed .book-cover-col {
      order: 2;
    }

    .book-entry--reversed .book-info-col {
      order: 1;
    }

    /* Cover column */
    .book-cover-col {
      display: flex;
      justify-content: center;
    }

    .book-cover-img {
      width: 100%;
      max-width: 230px;
      display: block;
      box-shadow: 0 6px 24px rgba(0, 0, 0, 0.14);
    }

    .book-cover-placeholder {
      width: 200px;
      height: 290px;
      background-color: #EBF0E8;
      border: 2px dashed #a8bfa4;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 0.6rem;
    }

    .book-cover-placeholder .placeholder-eyebrow {
      font-size: 0.68rem;
    }

    .book-cover-placeholder .placeholder-label {
      font-size: 0.85rem;
      text-align: center;
      padding: 0 0.5rem;
    }

    /* Book info */
    .book-title {
      font-size: 1.35rem;
      color: #2B2B28;
      line-height: 1.35;
      margin-bottom: 0.3rem;
    }

    .book-author {
      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
      font-size: 0.82rem;
      color: #7a7a6a;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      margin-bottom: 1.6rem;
    }

    /* Book synopsis & quote */
    .book-synopsis {
      font-size: 1rem;
      line-height: 1.75;
      color: #2B2B28;
      margin-bottom: 0.9rem;
    }

    .book-quote {
      font-weight: bold;
      font-size: 1.05rem;
      line-height: 1.6;
      color: #173F2A;
      margin-bottom: 1.8rem;
    }

    /* Price block */
    .book-price-block {
      display: flex;
      flex-direction: column;
      gap: 5px;
      margin-bottom: 1rem;
    }

    .book-price-row {
      display: flex;
      align-items: baseline;
      gap: 0.5rem;
      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
    }

    .price-format {
      font-size: 0.78rem;
      text-transform: uppercase;
      letter-spacing: 0.07em;
      color: #7a7a6a;
      min-width: 72px;
    }

    .price-value {
      font-size: 1rem;
      font-weight: 600;
      color: #2B2B28;
    }

    .amazon-btn {
      display: inline-block;
      background-color: #2F6B45;
      color: #F7F3EA;
      padding: 0.8rem 1.8rem;
      border-radius: 3px;
      text-decoration: none;
      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
      font-size: 1.05rem;
      font-weight: 600;
      letter-spacing: 0.03em;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
    }

    .amazon-btn:hover {
      background-color: #245437;
    }

    /* ===== ABOUT ===== */
    .about-inner {
      max-width: 900px;
      margin: 0 auto;
    }

    .author-name {
      font-size: 1.25rem;
      margin-bottom: 1.2rem;
      color: #2B2B28;
    }

    .author-bio {
      font-size: 1rem;
      line-height: 1.75;
      color: #2B2B28;
      margin-bottom: 0.9rem;
    }

    /* ===== FOOTER ===== */
    footer {
      background-color: #173F2A;
      color: #98b49f;
    }

    .footer-copy {
      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
      font-size: 0.8rem;
      text-align: center;
      padding: 1.2rem 2rem;
    }

    /* ===== RESPONSIVE ===== */
    @media (max-width: 720px) {

      .banner-placeholder {
        height: 185px;
      }

      .hero-banner-title {
        top: 70%;
      }

      .hero-text-band {
        padding: 1.8rem 0 2.2rem;
      }

      .page-section {
        padding: 3rem 0;
      }

      /* Books: single column on mobile */
      .book-entry,
      .book-entry--reversed {
        grid-template-columns: 1fr;
        gap: 2rem;
      }

      /* Always: cover first on mobile */
      .book-entry--reversed .book-cover-col {
        order: 1;
      }

      .book-entry--reversed .book-info-col {
        order: 2;
      }

      .book-cover-col {
        justify-content: center;
      }

      .book-entry {
        padding-bottom: 3rem;
        margin-bottom: 3rem;
      }

      .book-synopsis {
        margin-bottom: 1rem;
      }

      .author-bio {
        margin-bottom: 1rem;
      }

    }

    /* ===== PRINT ===== */
    @media print {

      body {
        background: #fff;
        color: #000;
        font-size: 11pt;
      }

      .hero-text-band {
        padding: 1.5rem 0 2rem;
      }

      .amazon-btn {
        display: none;
      }

      .page-section {
        padding: 2rem 0;
        break-inside: avoid;
      }

      .book-entry {
        break-inside: avoid;
        page-break-inside: avoid;
      }

      .about-inner {
        break-inside: avoid;
        page-break-inside: avoid;
      }

      .banner-placeholder {
        height: 220px;
      }

      footer {
        background: #fff;
        color: #000;
        border-top: 1px solid #ccc;
      }

      .section-alt {
        background-color: #fff;
      }
    }