html {
  scroll-behavior: smooth;
}

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

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ── nav.html ── */
/* ── Callout Bar ── */
    .callout-bar {
      position: sticky;
      top: 0;
      z-index: 200;
      background-color: #d15838;
      padding: 10px 24px;
      text-align: center;
    }

    .callout-bar p {
      color: #ffffff;
      font-size: 13px;
      font-weight: 500;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    @media (max-width: 767px) {
      .callout-bar p {
        font-weight: 400;
      }
    }

    /* ── Navigation ── */
    .nav {
      background-color: #faf7f3;
      padding: 0 40px;
      height: 72px;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    .nav__logo img {
      height: 26px;
      width: auto;
      display: block;
    }

    .nav__cta {
      background-color: #d15838;
      color: #ffffff;
      font-family: 'Inter', sans-serif;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      text-decoration: none;
      padding: 14px 28px;
      border-radius: 999px;
      border: none;
      cursor: pointer;
      white-space: nowrap;
      transition: opacity 0.2s ease;
    }

    .nav__cta:hover {
      opacity: 0.88;
    }

    /* ── Mobile ── */
    @media (max-width: 767px) {
      .nav {
        padding: 0 20px;
        justify-content: center;
      }

      .nav__logo {
        text-align: center;
      }

      .nav__cta {
        display: none;
      }
    }

/* ── hero.html ── */
.hero {
      background-color: #faf7f3;
      padding: 60px 40px;
    }

    .hero__container {
      max-width: 1100px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1fr 520px;
      align-items: center;
      gap: 48px;
    }

    /* ── Left: Text ── */
    .hero__content {
      display: flex;
      flex-direction: column;
      gap: 14px;
    }

    /* Rating — plain inline, no container */
    .hero__rating {
      display: flex;
      align-items: center;
      gap: 5px;
      flex-wrap: wrap;
    }

    .hero__stars {
      color: #4caf50; /* green */
      font-size: 15px;
      letter-spacing: 2px;
    }

    .hero__rating-text {
      font-size: 15px; /* Label size — up from 13px */
      font-weight: 400;
      color: #2a1f1a;
    }

    .hero__rating-highlight {
      font-size: 15px;
      font-weight: 700;
      color: #d15838; /* orange */
    }

    .hero__rating-customers {
      font-size: 15px;
      font-weight: 700;
      color: #2a1f1a;
    }

    .hero__rating-pipe {
      color: #9b8a7e;
      font-size: 15px;
      margin: 0 2px;
    }

    /* Headline — Display scale: 46px / weight 700 */
    .hero__headline {
      font-size: 46px;
      font-weight: 700;
      line-height: 1.08;
      color: #2a1f1a;
      letter-spacing: -0.025em;
    }

    /* Sub — Body Large scale: 18px */
    .hero__sub {
      font-size: 18px;
      font-weight: 400;
      color: #2a1f1a;
      line-height: 1.6;
    }

    .hero__sub strong {
      font-weight: 700;
    }

    /* CTA + badges grouped with extra top gap */
    .hero__cta-group {
      display: flex;
      flex-direction: column;
      gap: 16px;
      margin-top: 28px; /* visual separation from subtitle */
    }

    /* CTA */
    .hero__cta {
      display: inline-block;
      background-color: #d15838;
      color: #ffffff;
      font-family: 'Inter', sans-serif;
      font-size: 15px;
      font-weight: 700;
      letter-spacing: 0.07em;
      text-transform: uppercase;
      text-decoration: none;
      padding: 16px 44px;
      border-radius: 999px;
      width: fit-content;
      transition: opacity 0.2s ease;
    }

    .hero__cta:hover { opacity: 0.88; }

    /* Trust badges — vertical stack — Body Small scale: 15px */
    .hero__badges {
      display: flex;
      flex-direction: column;
      gap: 14px;
    }

    .hero__badge {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 15px; /* up from 13px */
      font-weight: 500;
      color: #2a1f1a;
    }

    .hero__badge-flag {
      width: 20px;
      height: 20px;
      object-fit: contain;
      flex-shrink: 0;
    }

    .hero__badge-check {
      width: 20px;
      height: 20px;
      background-color: #4caf50;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .hero__badge-check svg {
      width: 10px;
      height: 10px;
    }

    /* ── Right: Image — square container ── */
    .hero__image {
      display: flex;
      justify-content: flex-end;
      align-items: center;
    }

    .hero__image-wrap {
      width: 520px;
      height: 520px;
      border-radius: 16px;
      overflow: hidden;
      background-color: #f0e6dd;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .hero__image-wrap img {
      width: 78%;
      height: auto;
      object-fit: contain;
      display: block;
    }

    /* ── Tablet: 600px–900px ── */
    @media (min-width: 600px) and (max-width: 900px) {
      .hero {
        padding: 32px 40px 48px;
      }

      .hero__container {
        grid-template-columns: 1fr;
        gap: 20px;
      }

      .hero__stars,
      .hero__rating-text,
      .hero__rating-highlight,
      .hero__rating-customers,
      .hero__rating-pipe { font-size: 15px; }

      .hero__headline { font-size: 40px; }

      .hero__sub { font-size: 19px; }

      .hero__badge { font-size: 16px; }

      .hero__cta { width: 100%; text-align: center; font-size: 16px; }

      .hero__cta-group { margin-top: 20px; }

      .hero__image { justify-content: center; order: -1; }

      .hero__image-wrap {
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 10;
        border-radius: 16px;
        padding: 24px;
      }

      .hero__image-wrap img {
        width: 52%;
      }
    }

    /* ── Mobile: <600px ── */
    @media (max-width: 600px) {
      .hero {
        padding: 0 20px 32px;
      }

      .hero__container {
        grid-template-columns: 1fr;
        gap: 24px;
      }

      /* Mobile type scale */
      .hero__stars { font-size: 14px; }
      .hero__rating-text,
      .hero__rating-highlight,
      .hero__rating-customers,
      .hero__rating-pipe { font-size: 11px; }

      .hero__headline { font-size: 30px; }

      .hero__sub { font-size: 15px; }

      .hero__badge { font-size: 14px; }

      /* Tighter subtitle → CTA gap on mobile */
      .hero__cta-group { margin-top: 16px; }

      .hero__cta { width: 100%; text-align: center; }

      /* Image: matches content width, rounded all corners */
      .hero__image {
        justify-content: center;
        order: -1;
      }

      .hero__image-wrap {
        width: 100%;
        height: auto;
        aspect-ratio: 4 / 3;
        border-radius: 16px;
        padding: 32px 16px;
      }
    }

/* ── metric-bar.html ── */
.reviews-bar {
      background-color: #f4ede7;
      padding: 48px 40px;
    }

    .reviews-bar__inner {
      max-width: 1100px;
      margin: 0 auto;
    }

    /* ════════════════════════════════
       DESKTOP (>900px) — 4 columns,
       but 4th review card hidden
    ════════════════════════════════ */
    .reviews-bar__grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 14px;
      align-items: stretch;
    }

    /* Hide 4th review card on desktop — explicit min-width to win cascade */
    @media (min-width: 901px) {
      .review-card--desktop-hidden {
        display: none !important;
      }
    }

    /* Stat card — brand orange at ~15% opacity */
    .stat-card {
      background-color: #ffe7d6;
      border-radius: 14px;
      padding: 28px 22px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 12px;
    }

    .stat-card__headline {
      font-size: 22px;
      font-weight: 600;
      color: #2a1f1a;
      line-height: 1.25;
      letter-spacing: -0.01em;
    }

    .stat-card__text {
      font-size: 15px;
      font-weight: 400;
      color: #6b5b4f;
      line-height: 1.6;
    }

    /* Review cards — off-white background */
    .review-card {
      background-color: #ffffff;
      border: 1px solid #e5ddd6;
      border-radius: 14px;
      padding: 22px;
      display: flex;
      flex-direction: column;
      gap: 5px;
    }

    .review-card__stars {
      color: #4caf50;
      font-size: 14px;
      letter-spacing: 1px;
      margin-bottom: 2px;
    }

    .review-card__title {
      font-size: 15px;
      font-weight: 600;   /* down from 700 */
      color: #2a1f1a;
      line-height: 1.3;
    }

    .review-card__location {
      font-size: 13px;
      font-weight: 400;
      color: #9b8a7e;
    }

    .review-card__verified {
      display: flex;
      align-items: center;
      gap: 5px;
      font-size: 13px;
      font-weight: 500;   /* down from 600 */
      color: #4caf50;
      margin: 4px 0 8px;
    }

    .review-card__check {
      width: 16px;
      height: 16px;
      background-color: #4caf50;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .review-card__check svg {
      width: 8px;
      height: 8px;
    }

    .review-card__quote {
      font-size: 14px;
      font-weight: 400;
      color: #2a1f1a;
      line-height: 1.6;
    }

    /* ════════════════════════════════
       TABLET (600–900px)
    ════════════════════════════════ */
    @media (min-width: 600px) and (max-width: 900px) {
      .reviews-bar { padding: 40px 40px; }

      .reviews-bar__grid {
        grid-template-columns: 1fr 1fr 1fr;
        gap: 12px;
      }

      .stat-card {
        grid-column: 1 / -1;
        flex-direction: row;
        align-items: center;
        gap: 24px;
      }

      .stat-card__headline { font-size: 20px; flex: 1; }
      .stat-card__text     { flex: 2; }

      /* 4th card stays hidden on tablet */
      .review-card--desktop-hidden { display: none; }
    }

    /* ════════════════════════════════
       MOBILE (<600px) — slider
    ════════════════════════════════ */
    @media (max-width: 600px) {
      .reviews-bar { padding: 36px 20px; }

      .stat-card { display: none; }

      .reviews-bar__grid {
        display: block;
        overflow: hidden;
        border-radius: 14px;
      }

      .slider-track {
        display: flex;
        transition: transform 0.35s ease;
        will-change: transform;
      }

      /* All cards are slides — including 4th */
      .review-card,
      .review-card--desktop-hidden {
        display: flex;
        min-width: 100%;
        width: 100%;
        flex-shrink: 0;
        border-radius: 14px;
        padding: 24px 22px;
        gap: 7px;
      }

      .review-card__stars    { font-size: 17px; }
      .review-card__title    { font-size: 18px; font-weight: 500; }
      .review-card__location { font-size: 14px; }
      .review-card__verified {
        font-size: 13px;
        font-weight: 500;   /* lighter */
        margin: 4px 0 8px;
      }
      .review-card__check  { width: 16px; height: 16px; }
      .review-card__quote  { font-size: 15px; line-height: 1.65; }

      .slider-dots {
        display: flex;
        justify-content: center;
        gap: 8px;
        margin-top: 20px;
      }

      .dot {
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: #e5ddd6;
        border: none;
        padding: 0;
        cursor: pointer;
        transition: background-color 0.2s ease;
      }

      .dot--active { background-color: #d15838; }
    }

    /* Hide dots + unwrap slider on desktop/tablet */
    @media (min-width: 601px) {
      .slider-dots       { display: none; }
      .slider-track      { display: contents; }
      .stat-card--mobile { display: none; }  /* mobile duplicate hidden */
    }

    /* Mobile stat card below dots */
    @media (max-width: 600px) {
      .stat-card--mobile {
        display: flex;
        flex-direction: column;
        gap: 12px;
        margin-top: 20px;
        padding: 28px 22px;
        border-radius: 14px;
      }
    }

/* ── benefits.html ── */
/* ══════════════════════════════
       SECTION
    ══════════════════════════════ */
    .benefits {
      background-color: #ffffff;
      padding: 60px 40px;
      overflow: hidden;
    }

    .benefits__inner {
      max-width: 1100px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1fr 1fr;
      align-items: stretch;
      gap: 48px;
      min-height: 480px;
    }

    /* ══════════════════════════════
       LEFT — text + icon grid
    ══════════════════════════════ */
    .benefits__content {
      padding: 0;
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 40px;
    }

    .benefits__header {
      text-align: center;
    }

    .benefits__headline {
      font-size: 30px;
      font-weight: 700;
      color: #2a1f1a;
      letter-spacing: -0.02em;
      line-height: 1.2;
      margin-bottom: 10px;
    }

    .benefits__sub {
      font-size: 15px;
      font-weight: 400;
      color: #9b8a7e;
      line-height: 1.6;
      max-width: 340px;
      margin: 0 auto;
    }

    /* 2×2 icon grid */
    .benefits__grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 32px 24px;
    }

    .benefit-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      gap: 10px;
    }

    .benefit-item__icon {
      width: 56px;
      height: 56px;
      object-fit: contain;
      display: block;
    }

    .benefit-item__title {
      font-size: 16px;
      font-weight: 600;
      color: #2a1f1a;
      line-height: 1.3;
    }

    .benefit-item__text {
      font-size: 14px;
      font-weight: 400;
      color: #9b8a7e;
      line-height: 1.55;
    }

    /* ══════════════════════════════
       RIGHT — lifestyle image
    ══════════════════════════════ */
    .benefits__image {
      position: relative;
      overflow: hidden;
      border-radius: 16px;
    }

    .benefits__image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center top;
      display: block;
    }

    /* ══════════════════════════════
       TABLET (600–900px)
    ══════════════════════════════ */
    @media (min-width: 600px) and (max-width: 900px) {
      .benefits__inner {
        grid-template-columns: 1fr;
        min-height: unset;
      }

      /* Image on top, within container, rounded corners */
      .benefits__image {
        height: 320px;
        order: -1;
        margin: 0;
        border-radius: 16px;
      }

      .benefits { padding: 48px 40px; }

      .benefits__content {
        padding: 0;
        gap: 32px;
      }

      .benefits__headline { font-size: 28px; }
    }

    /* ══════════════════════════════
       MOBILE (<600px)
    ══════════════════════════════ */
    @media (max-width: 600px) {
      .benefits {
        padding: 40px 20px;
      }

      .benefits__inner {
        grid-template-columns: 1fr;
        min-height: unset;
      }

      /* Image: square within container, rounded corners */
      .benefits__image {
        width: 100%;
        aspect-ratio: 1 / 1;
        height: auto;
        order: -1;
        margin: 0;
        border-radius: 16px;
      }

      .benefits__image img {
        object-position: center 15%;
      }

      .benefits__content {
        padding: 0;
        gap: 28px;
      }

      .benefits__headline { font-size: 26px; }

      .benefits__sub { font-size: 15px; }

      .benefits__grid {
        gap: 28px 16px;
      }

      .benefit-item__icon {
        width: 52px;
        height: 52px;
      }

      .benefit-item__title { font-size: 16px; }
      .benefit-item__text  { font-size: 14px; }
    }

/* ── before-after.html ── */
/* ══════════════════════════════
       SECTION
    ══════════════════════════════ */
    .before-after {
      background-color: #faf7f3;
      padding: 60px 40px;
    }

    .before-after__inner {
      max-width: 1100px;
      margin: 0 auto;
    }

    /* ══════════════════════════════
       HEADLINE
    ══════════════════════════════ */
    .before-after__headline {
      font-size: 38px;
      font-weight: 700;
      color: #2a1f1a;
      letter-spacing: -0.025em;
      line-height: 1.15;
      text-align: center;
      margin-bottom: 40px;
    }

    /* ══════════════════════════════
       GRID — 3 columns desktop
    ══════════════════════════════ */
    .before-after__grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
      align-items: start;
    }

    /* ══════════════════════════════
       CARD
    ══════════════════════════════ */
    .ba-card {
      background-color: #ffffff;
      border: 1px solid #e5ddd6;
      border-radius: 14px;
      overflow: hidden;
      display: flex;
      flex-direction: column;
    }

    /* ── Image pair ── */
    .ba-card__images {
      display: grid;
      grid-template-columns: 1fr 1fr;
    }

    .ba-card__photo {
      position: relative;
      overflow: hidden;
      aspect-ratio: 3 / 4;
    }

    .ba-card__photo img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center top;
      display: block;
    }

    /* BEFORE / AFTER pill labels */
    .ba-card__label {
      position: absolute;
      bottom: 10px;
      left: 50%;
      transform: translateX(-50%);
      background-color: #4caf50;
      color: #ffffff;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      padding: 4px 10px;
      border-radius: 999px;
      white-space: nowrap;
    }

    /* ── Text body ── */
    .ba-card__body {
      padding: 18px 18px 22px;
      display: flex;
      flex-direction: column;
      gap: 5px;
    }

    .ba-card__person {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 14px;
      font-weight: 600;
      color: #2a1f1a;
      line-height: 1.3;
    }

    .ba-card__flag {
      width: 18px;
      height: 18px;
      object-fit: contain;
      flex-shrink: 0;
    }

    .ba-card__stars {
      color: #4caf50;
      font-size: 14px;
      letter-spacing: 1px;
    }

    .ba-card__title {
      font-size: 15px;
      font-weight: 600;
      color: #2a1f1a;
      line-height: 1.3;
    }

    .ba-card__location {
      font-size: 13px;
      font-weight: 400;
      color: #9b8a7e;
    }

    .ba-card__verified {
      display: flex;
      align-items: center;
      gap: 5px;
      font-size: 13px;
      font-weight: 500;
      color: #4caf50;
      margin: 3px 0 6px;
    }

    .ba-card__check {
      width: 16px;
      height: 16px;
      background-color: #4caf50;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .ba-card__check svg {
      width: 8px;
      height: 8px;
    }

    .ba-card__quote {
      font-size: 14px;
      font-weight: 400;
      color: #2a1f1a;
      line-height: 1.6;
    }

    /* ══════════════════════════════
       TABLET (600–900px)
    ══════════════════════════════ */
    @media (min-width: 600px) and (max-width: 900px) {
      .before-after {
        padding: 48px 40px;
      }

      .before-after__headline {
        font-size: 34px;
        margin-bottom: 32px;
      }

      .before-after__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 14px;
      }

      .ba-card__person { font-size: 13px; }
      .ba-card__title  { font-size: 14px; }
      .ba-card__quote  { font-size: 13px; }
    }

    /* ══════════════════════════════
       MOBILE (<600px) — slider
    ══════════════════════════════ */
    @media (max-width: 600px) {
      .before-after {
        padding: 40px 20px;
      }

      .before-after__headline {
        font-size: 28px;
        margin-bottom: 28px;
      }

      /* Slider viewport */
      .before-after__grid {
        display: block;
        overflow: hidden;
        border-radius: 14px;
      }

      .slider-track {
        display: flex;
        transition: transform 0.35s ease;
        will-change: transform;
      }

      .ba-card {
        min-width: 100%;
        width: 100%;
        flex-shrink: 0;
        border-radius: 14px;
      }

      .ba-card__title  { font-size: 15px; font-weight: 500; }
      .ba-card__quote  { font-size: 15px; line-height: 1.65; }
      .ba-card__person { font-size: 13px; font-weight: 400; }
      .ba-card__stars  { font-size: 17px; }
      .ba-card__body   { padding: 20px 20px 24px; gap: 6px; }
    }

    /* ══════════════════════════════
       DOTS — mobile only
    ══════════════════════════════ */
    .slider-dots {
      display: none;
    }

    @media (max-width: 600px) {
      .slider-dots {
        display: flex;
        justify-content: center;
        gap: 8px;
        margin-top: 20px;
      }
    }

    .dot {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background-color: #e5ddd6;
      border: none;
      padding: 0;
      cursor: pointer;
      transition: background-color 0.2s ease;
    }

    .dot--active { background-color: #d15838; }

    /* Unwrap slider track into grid on desktop/tablet */
    @media (min-width: 601px) {
      .slider-track { display: contents; }
    }

/* ── timeline.html ── */
/* ══════════════════════════════
       SECTION
    ══════════════════════════════ */
    .timeline {
      background-color: #ffffff;
      padding: 60px 40px;
    }

    .timeline__inner {
      max-width: 1100px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 48px;
      align-items: center;
    }

    /* ══════════════════════════════
       LEFT — text + steps
    ══════════════════════════════ */
    .timeline__content {
      display: flex;
      flex-direction: column;
      gap: 32px;
    }

    .timeline__headline {
      font-size: 38px;
      font-weight: 700;
      color: #2a1f1a;
      letter-spacing: -0.025em;
      line-height: 1.15;
      margin-bottom: 10px;
    }

    .timeline__sub {
      font-size: 16px;
      font-weight: 400;
      color: #9b8a7e;
      line-height: 1.6;
    }

    /* ── Steps ── */
    .timeline__steps {
      display: flex;
      flex-direction: column;
    }

    .timeline__step {
      display: flex;
      gap: 20px;
    }

    /* Dot + line column */
    .timeline__step-aside {
      display: flex;
      flex-direction: column;
      align-items: center;
      flex-shrink: 0;
      width: 14px;
    }

    .timeline__step-dot {
      width: 14px;
      height: 14px;
      background-color: #d15838;
      border-radius: 50%;
      flex-shrink: 0;
      margin-top: 4px; /* align with first line of title */
    }

    .timeline__step-line {
      width: 2px;
      flex: 1;
      background-color: #e5ddd6;
      margin: 6px 0;
    }

    .timeline__step:last-child .timeline__step-line {
      display: none;
    }

    /* Step body */
    .timeline__step-body {
      padding-bottom: 28px;
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .timeline__step:last-child .timeline__step-body {
      padding-bottom: 0;
    }

    .timeline__step-title {
      font-size: 17px;
      font-weight: 700;
      color: #2a1f1a;
      line-height: 1.3;
    }

    .timeline__step-text {
      font-size: 15px;
      font-weight: 400;
      color: #9b8a7e;
      line-height: 1.6;
    }

    /* ══════════════════════════════
       RIGHT — product image
    ══════════════════════════════ */
    .timeline__image {
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .timeline__image img {
      width: 100%;
      max-width: 480px;
      border-radius: 16px;
      display: block;
    }

    /* ══════════════════════════════
       TABLET (600–900px)
    ══════════════════════════════ */
    @media (min-width: 600px) and (max-width: 900px) {
      .timeline {
        padding: 48px 40px;
      }

      .timeline__inner {
        grid-template-columns: 1fr;
        gap: 36px;
      }

      .timeline__headline { font-size: 34px; }

      .timeline__image img {
        max-width: 100%;
      }
    }

    /* ══════════════════════════════
       MOBILE (<600px)
    ══════════════════════════════ */
    @media (max-width: 600px) {
      .timeline {
        padding: 40px 20px;
      }

      .timeline__inner {
        grid-template-columns: 1fr;
        gap: 32px;
      }

      .timeline__headline { font-size: 28px; }

      .timeline__sub { font-size: 15px; }

      .timeline__step-title { font-size: 16px; }

      .timeline__step-text  { font-size: 15px; }

      .timeline__image img {
        max-width: 100%;
        border-radius: 16px;
      }
    }

/* ── stats.html ── */
/* ══════════════════════════════
       SECTION
    ══════════════════════════════ */
    .stats {
      background-color: #ffffff;
      padding: 60px 40px;
    }

    .stats__inner {
      max-width: 1100px;
      margin: 0 auto;
    }

    /* ══════════════════════════════
       CARD — single peach container
    ══════════════════════════════ */
    .stats__card {
      background-color: #ffe7d6;
      border-radius: 20px;
      padding: 56px 48px;
      text-align: center;
    }

    /* ══════════════════════════════
       HEADER
    ══════════════════════════════ */
    .stats__header {
      margin-bottom: 48px;
    }

    .stats__headline {
      font-size: 38px;
      font-weight: 700;
      color: #2a1f1a;
      letter-spacing: -0.025em;
      line-height: 1.15;
      margin-bottom: 14px;
    }

    .stats__sub {
      font-size: 16px;
      font-weight: 400;
      color: #9b8a7e;
      line-height: 1.6;
    }

    .stats__sub strong {
      font-weight: 700;
      color: #2a1f1a;
    }

    /* ══════════════════════════════
       STATS GRID — 3 columns
    ══════════════════════════════ */
    .stats__grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 32px;
    }

    .stat-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 10px;
    }

    .stat-item__number {
      font-size: 52px;
      font-weight: 400;
      color: #d15838;
      letter-spacing: -0.02em;
      line-height: 1;
    }

    .stat-item__label {
      font-size: 16px;
      font-weight: 600;
      color: #2a1f1a;
      line-height: 1.3;
    }

    .stat-item__text {
      font-size: 15px;
      font-weight: 400;
      color: #9b8a7e;
      line-height: 1.6;
      max-width: 260px;
    }

    /* ══════════════════════════════
       TABLET (600–900px)
    ══════════════════════════════ */
    @media (min-width: 600px) and (max-width: 900px) {
      .stats {
        padding: 48px 40px;
      }

      .stats__card {
        padding: 48px 36px;
      }

      .stats__headline { font-size: 34px; }

      .stats__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
      }

      .stat-item__number { font-size: 42px; font-weight: 400; }
      .stat-item__label  { font-size: 14px; font-weight: 600; }
      .stat-item__text   { font-size: 13px; }
    }

    /* ══════════════════════════════
       MOBILE (<600px)
    ══════════════════════════════ */
    @media (max-width: 600px) {
      .stats {
        padding: 40px 20px;
      }

      .stats__card {
        padding: 40px 28px;
        border-radius: 16px;
      }

      .stats__headline { font-size: 28px; }

      .stats__sub { font-size: 15px; }

      .stats__header { margin-bottom: 36px; }

      .stats__grid {
        grid-template-columns: 1fr;
        gap: 36px;
      }

      .stat-item__number { font-size: 38px; font-weight: 400; }
      .stat-item__label  { font-size: 16px; font-weight: 600; }
      .stat-item__text   { font-size: 15px; max-width: 100%; }
    }

/* ── ingredients.html ── */
/* ══════════════════════════════
       SECTION
    ══════════════════════════════ */
    .ingredients {
      background-color: #faf7f3;
      padding: 60px 40px;
    }

    .ingredients__inner {
      max-width: 1100px;
      margin: 0 auto;
    }

    /* ══════════════════════════════
       HEADER
    ══════════════════════════════ */
    .ingredients__header {
      text-align: center;
      margin-bottom: 48px;
    }

    .ingredients__headline {
      font-size: 38px;
      font-weight: 700;
      color: #2a1f1a;
      letter-spacing: -0.025em;
      line-height: 1.15;
      margin-bottom: 14px;
    }

    .ingredients__sub {
      font-size: 15px;
      font-weight: 400;
      color: #9b8a7e;
      max-width: 640px;
      margin: 0 auto;
      line-height: 1.6;
    }

    /* ══════════════════════════════
       DESKTOP GRID — 4 columns, 2 rows
    ══════════════════════════════ */
    .ingredients__grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 40px 24px;
    }

    /* ══════════════════════════════
       INGREDIENT CARD
    ══════════════════════════════ */
    .ingredient-card {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      gap: 12px;
    }

    .ingredient-card__image {
      height: 120px;
      width: auto;
      max-width: 100%;
      object-fit: contain;
      display: block;
    }

    .ingredient-card__name {
      font-size: 16px;
      font-weight: 600;
      color: #2a1f1a;
      line-height: 1.3;
    }

    .ingredient-card__text {
      font-size: 14px;
      font-weight: 400;
      color: #9b8a7e;
      line-height: 1.55;
    }

    /* ══════════════════════════════
       TABLET (600–900px)
    ══════════════════════════════ */
    @media (min-width: 600px) and (max-width: 900px) {
      .ingredients {
        padding: 48px 40px;
      }

      .ingredients__headline { font-size: 34px; }

      .ingredients__grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 32px 16px;
      }

      .ingredient-card__image { height: 100px; }
      .ingredient-card__name  { font-size: 14px; }
      .ingredient-card__text  { font-size: 13px; }
    }

    /* ══════════════════════════════
       MOBILE (<600px) — 2-slide carousel,
       4 cards per slide in a 2×2 grid
    ══════════════════════════════ */
    @media (max-width: 600px) {
      .ingredients {
        padding: 40px 20px;
      }

      .ingredients__headline { font-size: 28px; }
      .ingredients__header   { margin-bottom: 36px; }

      /* Viewport clips the track */
      .ingredients__grid {
        display: block;
        overflow: hidden;
      }

      /* Track slides horizontally */
      .slider-track {
        display: flex;
        transition: transform 0.35s ease;
        will-change: transform;
      }

      /* Each slide is a 2×2 grid */
      .slider-slide {
        min-width: 100%;
        width: 100%;
        flex-shrink: 0;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px 20px;
      }

      .ingredient-card__image { height: 110px; }
      .ingredient-card__name  { font-size: 15px; }
      .ingredient-card__text  { font-size: 14px; }
    }

    /* Unwrap slides on desktop/tablet */
    @media (min-width: 601px) {
      .slider-track  { display: contents; }
      .slider-slide  { display: contents; }
    }

    /* ══════════════════════════════
       DOTS — mobile only
    ══════════════════════════════ */
    .slider-dots {
      display: none;
    }

    @media (max-width: 600px) {
      .slider-dots {
        display: flex;
        justify-content: center;
        gap: 8px;
        margin-top: 28px;
      }
    }

    .dot {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background-color: #e5ddd6;
      border: none;
      padding: 0;
      cursor: pointer;
      transition: background-color 0.2s ease;
    }

    .dot--active { background-color: #d15838; }

/* ── buy.html ── */
/* ══════════════════════════════
       SECTION
    ══════════════════════════════ */
    .buy {
      background-color: #fff5ee;
      padding: 60px 40px;
    }

    .buy__inner {
      max-width: 1100px;
      margin: 0 auto;
      display: grid;
      /* Row 1: full-width heading. Row 2: image + options */
      grid-template-columns: 1fr 1fr;
      grid-template-rows: auto auto;
      column-gap: 48px;
      row-gap: 48px;
    }

    /* ══════════════════════════════
       ROW 1 — heading spans both columns
    ══════════════════════════════ */
    .buy__header {
      grid-column: 1 / -1;
      text-align: center;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .buy__headline {
      font-size: 32px;
      font-weight: 700;
      color: #2a1f1a;
      letter-spacing: -0.025em;
      line-height: 1.15;
    }

    .buy__tagline {
      font-size: 14px;
      font-weight: 400;
      color: #9b8a7e;
    }

    .buy__rating {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 5px;
      flex-wrap: wrap;
    }

    .buy__stars          { color: #4caf50; font-size: 15px; letter-spacing: 1px; }
    .buy__rating-text    { font-size: 14px; font-weight: 400; color: #2a1f1a; }
    .buy__rating-highlight { font-size: 14px; font-weight: 700; color: #d15838; }
    .buy__rating-pipe    { color: #9b8a7e; font-size: 14px; }

    /* ══════════════════════════════
       ROW 2 LEFT — product image
    ══════════════════════════════ */
    .buy__image {
      display: flex;
      justify-content: center;
      align-items: center;
      align-self: start;
      background: #f0e8df;
      border-radius: 20px;
      padding: 32px 24px;
    }

    .buy__image img {
      width: 100%;
      max-width: 400px;
      display: block;
      border-radius: 16px;
    }

    /* ══════════════════════════════
       ROW 2 RIGHT — options column
    ══════════════════════════════ */
    .buy__options-col {
      display: flex;
      flex-direction: column;
      gap: 14px;
    }

    /* ══════════════════════════════
       OPTION CARDS
    ══════════════════════════════ */
    .buy__options {
      display: flex;
      flex-direction: column;
      gap: 18px;
    }

    .buy__option {
      background: #ffffff;
      border: 1.5px solid #e5ddd6;
      border-radius: 12px;
      padding: 14px 16px;
      cursor: pointer;
      transition: border-color 0.2s, background-color 0.2s;
    }

    .buy__option--active {
      border-color: #d15838;
      background-color: #ffffff;
    }

    .buy__option-row {
      display: flex;
      align-items: flex-start;
      gap: 12px;
    }

    /* Custom radio */
    .buy__radio {
      width: 20px;
      height: 20px;
      border-radius: 50%;
      border: 2px solid #e5ddd6;
      flex-shrink: 0;
      margin-top: 1px;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: border-color 0.2s, background-color 0.2s;
    }

    .buy__option--active .buy__radio {
      border-color: #d15838;
      background-color: #ffffff; /* white interior — ring style */
    }

    .buy__radio::after {
      content: '';
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background: #d15838; /* orange center dot */
      display: none;
    }

    .buy__option--active .buy__radio::after { display: block; }

    .buy__option-info { flex: 1; min-width: 0; }

    .buy__option-title {
      font-size: 16px;
      font-weight: 700;
      color: #2a1f1a;
      line-height: 1.3;
    }

    .buy__option-desc {
      font-size: 13px;
      font-weight: 400;
      color: #9b8a7e;
      margin-top: 2px;
    }

    /* Pricing */
    .buy__option-pricing {
      text-align: right;
      flex-shrink: 0;
    }

    /* One-time: plain price */
    .buy__price-single {
      font-size: 22px;
      font-weight: 700;
      color: #2a1f1a;
      line-height: 1.1;
    }

    .buy__price-note {
      font-size: 12px;
      color: #9b8a7e;
      line-height: 1.4;
    }

    /* Monthly: inline £39 £29 */
    .buy__price-row {
      display: flex;
      align-items: baseline;
      justify-content: flex-end;
      gap: 5px;
    }

    .buy__price-original {
      font-size: 22px;
      font-weight: 400;
      color: #6b5b4f;
      text-decoration: line-through;
    }

    .buy__price-current {
      font-size: 22px;
      font-weight: 700;
      color: #2a1f1a;
      line-height: 1.1;
    }

    .buy__price-save {
      display: inline-block;
      background: #2d8a4e;
      color: #ffffff;
      font-size: 11px;
      font-weight: 700;
      padding: 3px 10px;
      border-radius: 10px;
      margin-top: 6px;
      letter-spacing: 0.3px;
    }

    /* Feature list */
    .buy__features {
      margin-top: 14px;
      display: flex;
      flex-direction: column;
      gap: 5px;
    }

    .buy__feature {
      display: flex;
      align-items: center;
      gap: 7px;
      font-size: 13px;
      font-weight: 400;
      color: #2a1f1a;
    }

    .buy__feature--neg { color: #9b8a7e; }

    .buy__feat-icon {
      width: 16px;
      height: 16px;
      min-width: 16px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .buy__feat-icon svg { width: 14px; height: 14px; }

    /* ══════════════════════════════
       MONTHLY GROUP
       Popular bar + card share one border
    ══════════════════════════════ */
    .buy__monthly-group {
      border: 1.5px solid #e5ddd6;
      border-radius: 12px;
      overflow: hidden;
      transition: border-color 0.2s;
    }

    .buy__monthly-group--active { border-color: #d15838; }

    .buy__popular-bar {
      background: #d15838; /* orange — brand accent */
      color: #ffffff;
      text-align: center;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      padding: 9px 16px;
    }

    /* Monthly card inside group — group handles the border */
    .buy__option--in-group {
      border: none !important;
      border-radius: 0;
      background: #ffffff;
    }

    .buy__option--in-group.buy__option--active {
      background: #ffffff;
    }

    /* ══════════════════════════════
       CTA
    ══════════════════════════════ */
    .buy__cta {
      display: block;
      background: #d15838;
      color: #ffffff;
      font-family: 'Inter', sans-serif;
      font-size: 15px;
      font-weight: 700;
      letter-spacing: 0.07em;
      text-transform: uppercase;
      text-align: center;
      text-decoration: none;
      padding: 17px;
      border-radius: 999px;
      border: none;
      cursor: pointer;
      width: 100%;
      transition: opacity 0.2s ease;
    }

    .buy__cta:hover { opacity: 0.88; }

    .buy__callout {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      font-size: 13px;
      color: #2d8a4e;
      font-weight: 600;
      padding: 10px 16px;
      background: #f0f8f2;
      border-radius: 8px;
    }

    .buy__callout-icon {
      width: 16px;
      height: 16px;
      min-width: 16px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .buy__callout-icon svg { width: 14px; height: 14px; }

    .buy__nudge {
      text-align: center;
      font-size: 13px;
      color: #92640a;
      font-weight: 500;
      padding: 10px 16px;
      background: #fef9ee;
      border-radius: 8px;
      cursor: pointer;
    }

    .buy__nudge:hover { text-decoration: underline; }

    /* ══════════════════════════════
       TRUST GRID
    ══════════════════════════════ */
    .buy__trust {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 20px 0px;
    }

    .buy__trust-item {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      font-size: 13px;
      font-weight: 600;
      color: #2a1f1a;
      line-height: 1.35;
      text-align: center;
      margin: 0 auto;
    }

    .buy__trust-img {
      width: 28px;
      height: 28px;
      object-fit: contain;
      flex-shrink: 0;
    }

    .buy__trust-check {
      width: 24px;
      height: 24px;
      background: #4caf50;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .buy__trust-check svg { width: 12px; height: 12px; }

    /* ══════════════════════════════
       TABLET (600–900px)
    ══════════════════════════════ */
    @media (min-width: 600px) and (max-width: 900px) {
      .buy { padding: 48px 40px; }

      .buy__inner {
        grid-template-columns: 1fr;
        row-gap: 28px;
      }

      /* heading already spans full width, no change needed */

      .buy__image img { max-width: 280px; }

      .buy__headline { font-size: 28px; }
    }

    /* ══════════════════════════════
       MOBILE (<600px)
    ══════════════════════════════ */
    @media (max-width: 600px) {
      .buy { padding: 40px 20px; }

      .buy__inner {
        grid-template-columns: 1fr;
        row-gap: 24px;
      }

      .buy__image img { max-width: 100%; }

      .buy__headline { font-size: 26px; }

      .buy__trust { grid-template-columns: 1fr; }
      .buy__trust-item { justify-content: flex-start; margin: 0; font-size: 15px; }
      .buy__trust-img { width: 22px; height: 22px; }
      .buy__trust-check { width: 20px; height: 20px; }
      .buy__trust-check svg { width: 10px; height: 10px; }

      /* Card sizing */
      .buy__option { padding: 14px 14px; gap: 12px; }
      .buy__option--in-group { padding: 14px 14px; }
      .buy__popular-bar { font-size: 11px; padding: 7px 14px; }

      /* Typography */
      .buy__option-title { font-size: 15px; }
      .buy__option-desc  { font-size: 12px; }
      .buy__price-single,
      .buy__price-current { font-size: 18px; }
      .buy__price-original { font-size: 18px; }
      .buy__feature { font-size: 12px; }

      /* CTA */
      .buy__cta { font-size: 15px; padding: 15px 24px; }
    }

    /* ══════════════════════════════
       SMALL PHONES (≤390px — iPhone SE etc.)
    ══════════════════════════════ */
    @media (max-width: 390px) {
      .buy { padding: 32px 16px; }

      .buy__option { padding: 12px 12px; }
      .buy__option--in-group { padding: 12px 12px; }
      .buy__popular-bar { font-size: 10px; padding: 6px 12px; }

      .buy__headline { font-size: 22px; }
      .buy__rating { flex-wrap: wrap; gap: 4px 6px; }
      .buy__stars { width: 100%; font-size: 15px; letter-spacing: 2px; justify-content: center; }
      .buy__option-title { font-size: 14px; }
      .buy__option-desc  { font-size: 11px; }
      .buy__price-single,
      .buy__price-current { font-size: 16px; }
      .buy__price-original { font-size: 16px; }
      .buy__feature { font-size: 11px; }
      .buy__feat-icon svg { width: 12px; height: 12px; }

      .buy__trust-item { font-size: 13px; }
      .buy__cta { font-size: 14px; padding: 14px 20px; }
    }

/* ── faq.html ── */
.faq {
      background-color: #ffffff;
      padding: 60px 40px;
    }

    .faq__header {
      text-align: center;
      margin-bottom: 48px;
    }

    .faq__headline {
      font-size: 32px;
      font-weight: 700;
      color: #2a1f1a;
      letter-spacing: -0.02em;
      margin-bottom: 12px;
    }

    .faq__sub {
      font-size: 16px;
      font-weight: 400;
      color: #9b8a7e;
      max-width: 560px;
      margin: 0 auto;
      line-height: 1.6;
    }

    .faq__list {
      max-width: 800px;
      margin: 0 auto;
      display: flex;
      flex-direction: column;
      gap: 0;
      border-top: 1px solid #e5ddd6;
    }

    .faq__item {
      border-bottom: 1px solid #e5ddd6;
    }

    .faq__question {
      width: 100%;
      background: none;
      border: none;
      padding: 24px 0;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 16px;
      cursor: pointer;
      text-align: left;
      color: inherit;
      -webkit-tap-highlight-color: transparent;
      font-family: 'Inter', sans-serif;
    }

    .faq__question-text {
      font-size: 16px;
      font-weight: 600;
      color: #2a1f1a;
      line-height: 1.4;
    }

    .faq__icon {
      width: 24px;
      height: 24px;
      border: 2px solid #e5ddd6;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      transition: background-color 0.2s ease, border-color 0.2s ease;
    }

    .faq__icon svg {
      width: 12px;
      height: 12px;
      transition: transform 0.25s ease;
    }

    .faq__item--open .faq__icon {
      background-color: #d15838;
      border-color: #d15838;
    }

    .faq__item--open .faq__icon svg {
      transform: rotate(45deg);
    }

    .faq__answer {
      overflow: hidden;
      max-height: 0;
      transition: max-height 0.3s ease, padding 0.3s ease;
    }

    .faq__item--open .faq__answer {
      max-height: 300px;
    }

    .faq__answer-inner {
      padding-bottom: 24px;
      font-size: 15px;
      font-weight: 400;
      color: #6b5b4f;
      line-height: 1.7;
    }

    @media (min-width: 600px) and (max-width: 900px) {
      .faq { padding: 48px 40px; }
      .faq__headline { font-size: 28px; }
    }

    @media (max-width: 600px) {
      .faq { padding: 40px 20px; }
      .faq__headline { font-size: 26px; }
      .faq__sub { font-size: 15px; }
      .faq__question-text { font-size: 15px; }
    }

    @media (max-width: 390px) {
      .faq__headline { font-size: 22px; }
      .faq__sub { font-size: 14px; }
      .faq__question-text { font-size: 14px; }
    }

/* ── support.html ── */
.support {
      background-color: #ffffff;
      padding: 0 40px;
    }

    .support__inner {
      max-width: 1100px;
      margin: 0 auto;
      background-color: #f4ede7;
      border-radius: 16px;
      padding: 40px 48px;
    }

    .support__headline {
      font-size: 32px;
      font-weight: 700;
      color: #2a1f1a;
      letter-spacing: -0.02em;
      line-height: 1.2;
      margin-bottom: 12px;
    }

    .support__copy {
      font-size: 16px;
      font-weight: 400;
      color: #6b5b4f;
      line-height: 1.6;
    }

    .support__copy a {
      color: #d15838;
      text-decoration: underline;
      font-weight: 500;
    }

    .support__copy a:hover {
      opacity: 0.8;
    }

    /* ══════════════════════════════
       TABLET (600–900px)
    ══════════════════════════════ */
    @media (min-width: 600px) and (max-width: 900px) {
      .support { padding: 0 40px; }
      .support__headline { font-size: 28px; }
    }

    /* ══════════════════════════════
       MOBILE (<600px)
    ══════════════════════════════ */
    @media (max-width: 600px) {
      .support { padding: 0 20px; }
      .support__headline { font-size: 24px; }
      .support__copy { font-size: 15px; }
    }

    @media (max-width: 390px) {
      .support__headline { font-size: 20px; }
      .support__copy { font-size: 14px; }
    }

/* ── reviews.html ── */
.social-proof {
      background-color: #ffffff;
      padding: 60px 40px;
      text-align: center;
    }

    .social-proof__inner {
      max-width: 1100px;
      margin: 0 auto;
      background: #4caf501a;
      border-radius: 20px;
      padding: 48px 40px;
    }

    .social-proof__header {
      margin-bottom: 40px;
    }

    .social-proof__rating {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 16px;
    }

    .social-proof__stars {
      color: #4caf50;
      font-size: 16px;
      letter-spacing: 2px;
    }

    .social-proof__rating-text {
      font-size: 14px;
      font-weight: 500;
      color: #6b5b4f;
    }

    .social-proof__headline {
      font-size: 32px;
      font-weight: 700;
      color: #2a1f1a;
      letter-spacing: -0.02em;
      max-width: 680px;
      margin: 0 auto;
      line-height: 1.2;
    }

    /* ══════════════════════════════
       GRID — 3 cols, 2 rows
    ══════════════════════════════ */
    .social-proof__grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
    }

    .testimonial-card {
      background-color: #ffffff;
      border: 1px solid #e5ddd6;
      border-radius: 16px;
      padding: 28px;
      text-align: left;
      display: flex;
      flex-direction: column;
      gap: 14px;
    }

    .testimonial-card__stars {
      color: #4caf50;
      font-size: 14px;
      letter-spacing: 1px;
    }

    .testimonial-card__quote {
      font-size: 15px;
      font-weight: 400;
      color: #2a1f1a;
      line-height: 1.6;
      flex: 1;
    }

    .testimonial-card__quote::before { content: '"'; }
    .testimonial-card__quote::after  { content: '"'; }

    .testimonial-card__footer {
      display: flex;
      align-items: center;
      gap: 12px;
      padding-top: 14px;
      border-top: 1px solid #e5ddd6;
    }

    .testimonial-card__avatar {
      width: 32px;
      height: 32px;
      border-radius: 50%;
      background-color: #e5ddd6;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 13px;
      font-weight: 600;
      color: #6b5b4f;
      flex-shrink: 0;
    }

    .testimonial-card__name {
      font-size: 12px;
      font-weight: 600;
      color: #2a1f1a;
    }

    .testimonial-card__location {
      font-size: 11px;
      font-weight: 400;
      color: #9b8a7e;
    }

    .testimonial-card__verified {
      margin-left: auto;
      font-size: 10px;
      font-weight: 700;
      color: #2d8a4e;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      background-color: #f0f8f2;
      padding: 3px 8px;
      border-radius: 999px;
      white-space: nowrap;
    }

    /* ══════════════════════════════
       TABLET (600–900px)
    ══════════════════════════════ */
    @media (min-width: 600px) and (max-width: 900px) {
      .social-proof { padding: 48px 40px; }
      .social-proof__inner { padding: 36px 28px; }
      .social-proof__grid { grid-template-columns: repeat(2, 1fr); }
      .social-proof__headline { font-size: 28px; }
    }

    /* ══════════════════════════════
       MOBILE (<600px)
    ══════════════════════════════ */
    @media (max-width: 600px) {
      .social-proof { padding: 40px 20px; }
      .social-proof__inner { padding: 28px 20px; border-radius: 16px; }
      .social-proof__grid { grid-template-columns: 1fr; }
      .social-proof__headline { font-size: 26px; }
    }

    @media (max-width: 390px) {
      .social-proof__headline { font-size: 22px; }
    }

/* ── footer.html ── */
.footer {
      background-color: #f4ede7;
      padding: 60px 40px 40px;
      text-align: center;
    }

    .footer__inner {
      max-width: 1100px;
      margin: 0 auto;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 24px;
    }

    .footer__logo img {
      height: 32px;
      width: auto;
      display: block;
    }

    .footer__question {
      font-size: 18px;
      font-weight: 600;
      color: #2a1f1a;
    }

    .footer__copy {
      font-size: 15px;
      font-weight: 400;
      color: #2a1f1a;
      line-height: 1.6;
      max-width: 640px;
    }

    .footer__copy a {
      color: #2a1f1a;
      text-decoration: underline;
    }

    .footer__copy a:hover {
      color: #d15838;
    }

    .footer__divider {
      width: 100%;
      height: 1px;
      background: rgba(42, 31, 26, 0.12);
      margin-top: 8px;
    }

    .footer__legal {
      font-size: 12px;
      font-weight: 400;
      color: #9b8a7e;
      line-height: 1.5;
    }

    /* ══════════════════════════════
       TABLET (600–900px)
    ══════════════════════════════ */
    @media (min-width: 600px) and (max-width: 900px) {
      .footer { padding: 48px 40px 32px; }
    }

    /* ══════════════════════════════
       MOBILE (<600px)
    ══════════════════════════════ */
    @media (max-width: 600px) {
      .footer { padding: 40px 20px 28px; }
      .footer__question { font-size: 16px; }
      .footer__copy { font-size: 14px; }
    }

/* ── sticky-cta.html ── */
.sticky-cta {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      z-index: 100;
      background-color: #faf7f3;
      border-top: 1px solid #e5ddd6;
      padding: 14px 40px;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .sticky-cta__btn {
      display: inline-block;
      background-color: #d15838;
      color: #ffffff;
      font-family: 'Inter', sans-serif;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      text-decoration: none;
      padding: 14px 48px;
      border-radius: 999px;
      border: none;
      cursor: pointer;
      transition: opacity 0.2s ease;
      white-space: nowrap;
    }

    .sticky-cta__btn:hover { opacity: 0.88; }

    @media (max-width: 600px) {
      .sticky-cta {
        padding: 12px 20px;
      }

      .sticky-cta__btn {
        width: 100%;
        text-align: center;
        padding: 15px 24px;
      }
    }