:root {
      color-scheme: light dark;
      --paper: #f7faf4;
      --paper-2: #ffffff;
      --ink: #183326;
      --muted: #53685b;
      --line: #d5ded2;
      --forest: #356f46;
      --forest-deep: #174d31;
      --sage: #e1ebda;
      --gold: #c78b31;
      --terracotta: #a65338;
      --maroon: #74362f;
      --plum: #70448a;
      --green: #63a348;
      --white: #ffffff;
      --on-green: #fffdf7;
      --shadow: 0 24px 70px rgba(34, 77, 47, .13);
      --sans: "DM Sans", sans-serif;
      --serif: "Playfair Display", Georgia, serif;
      --mal: "Manjari", sans-serif;
      --mal-display: "Noto Serif Malayalam", serif;
    }
    @media (prefers-color-scheme: dark) {
      :root {
        --paper: #0f2018;
        --paper-2: #172b21;
        --ink: #f4f6ef;
        --muted: #bdcabc;
        --line: #355343;
        --forest: #83b67c;
        --forest-deep: #2f754b;
        --sage: #213d2b;
        --gold: #dfaa51;
        --terracotta: #d98a64;
        --maroon: #69332f;
        --white: #ffffff;
        --on-green: #fffdf7;
        --shadow: 0 24px 70px rgba(0, 0, 0, .3);
      }
    }
    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      background: var(--paper);
      color: var(--ink);
      font-family: var(--sans);
      line-height: 1.55;
      overflow-x: hidden;
    }
    button, a { -webkit-tap-highlight-color: transparent; }
    button { font: inherit; }
    img { max-width: 100%; display: block; }
    .sr-only {
      position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
      overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
    }
    .utility {
      min-height: 52px;
      border-bottom: 1px solid var(--line);
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 16px;
      max-width: 1240px;
      padding: 0 28px;
      margin: 0 auto;
    }
    .origin {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: var(--muted);
      font-size: 13px;
      font-weight: 600;
    }
    .origin::before {
      content: "";
      width: 7px; height: 7px;
      border-radius: 50%;
      background: var(--green);
      box-shadow: 0 0 0 4px color-mix(in srgb, var(--green) 16%, transparent);
    }
    .utility-actions { display: flex; align-items: center; gap: 9px; }
    .lang-switch {
      display: inline-flex;
      padding: 3px;
      border: 1px solid var(--line);
      border-radius: 999px;
      background: var(--paper-2);
    }
    .lang-btn {
      border: 0;
      color: var(--muted);
      background: transparent;
      padding: 7px 10px;
      border-radius: 999px;
      cursor: pointer;
      font-size: 12px;
      font-weight: 700;
    }
    .lang-btn[aria-pressed="true"] { background: var(--forest-deep); color: var(--on-green); }
    .cart-trigger {
      position: relative;
      display: inline-grid;
      place-items: center;
      width: 38px; height: 38px;
      border: 1px solid var(--line);
      border-radius: 50%;
      background: var(--paper-2);
      color: var(--ink);
      cursor: pointer;
    }
    .cart-trigger svg { width: 18px; }
    .cart-count {
      position: absolute; top: -5px; right: -4px;
      min-width: 19px; height: 19px;
      padding: 0 5px;
      border-radius: 10px;
      background: var(--forest);
      color: var(--paper-2);
      border: 2px solid var(--paper);
      display: grid;
      place-items: center;
      font-size: 10px;
      font-weight: 700;
    }
    .hero {
      max-width: 1240px;
      margin: 0 auto;
      padding: clamp(52px, 8vw, 110px) 28px 72px;
      display: grid;
      grid-template-columns: 1.05fr .95fr;
      align-items: center;
      gap: clamp(40px, 7vw, 96px);
    }
    .eyebrow {
      color: var(--forest);
      font-size: 13px;
      font-weight: 700;
      letter-spacing: .08em;
      text-transform: uppercase;
      margin: 0 0 22px;
    }
    .brand-logo { display: block; width: 168px; height: auto; margin: 0 0 28px; }
    .footer-logo { display: block; width: 132px; height: auto; }
    h1 {
      font-family: var(--serif);
      font-size: clamp(50px, 6.8vw, 92px);
      line-height: .96;
      letter-spacing: -.045em;
      max-width: 760px;
      margin: 0;
      text-wrap: balance;
    }
    .hero-copy > p:not(.eyebrow) {
      font-size: clamp(17px, 2vw, 21px);
      color: var(--muted);
      max-width: 600px;
      margin: 28px 0 34px;
    }
    .hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
    .primary-btn, .secondary-btn, .add-btn, .checkout-btn {
      border: 0;
      border-radius: 5px;
      min-height: 50px;
      padding: 0 22px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      font-weight: 700;
      text-decoration: none;
      cursor: pointer;
      transition: transform .18s ease, background .18s ease;
    }
    .primary-btn, .add-btn, .checkout-btn { background: var(--forest-deep); color: var(--on-green); }
    .secondary-btn { color: var(--ink); border: 1px solid var(--line); background: transparent; }
    .primary-btn:hover, .secondary-btn:hover, .add-btn:hover, .checkout-btn:hover { transform: translateY(-2px); }
    .hero-note { font-size: 12px; color: var(--muted); }
    .hero-visual { position: relative; min-height: 520px; }
    .hero-photo {
      position: absolute;
      overflow: hidden;
      box-shadow: var(--shadow);
      background: var(--paper-2);
    }
    .hero-photo img { width: 100%; height: 100%; object-fit: cover; }
    .hero-photo.main { inset: 0 8% 0 16%; border-radius: 46% 46% 14px 14px; }
    .hero-photo.main img { object-position: center 40%; }
    .hero-photo.side {
      width: 35%; height: 48%;
      left: -1%; bottom: -18px;
      border-radius: 8px;
      transform: rotate(-4deg);
      border: 8px solid var(--paper);
    }
    .stamp {
      position: absolute;
      right: 0; top: 10%;
      width: 116px; aspect-ratio: 1;
      border-radius: 50%;
      background: var(--forest-deep);
      color: var(--on-green);
      display: grid;
      place-items: center;
      text-align: center;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: .04em;
      line-height: 1.25;
      transform: rotate(6deg);
      box-shadow: 0 12px 30px rgba(16, 49, 36, .22);
    }
    .proof {
      background: var(--forest-deep);
      color: var(--on-green);
      border-top: 5px solid var(--gold);
    }
    .proof-inner {
      max-width: 1240px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      padding: 24px 28px;
    }
    .proof-item { padding: 8px 24px; border-right: 1px solid color-mix(in srgb, var(--paper-2) 25%, transparent); }
    .proof-item:first-child { padding-left: 0; }
    .proof-item:last-child { border-right: 0; }
    .proof-item strong { display: block; font-family: var(--serif); font-size: 18px; }
    .proof-item span { font-size: 12px; opacity: .76; }
    .products {
      max-width: 1240px;
      padding: 108px 28px 120px;
      margin: 0 auto;
    }
    .section-head {
      display: grid;
      grid-template-columns: 1fr 1fr;
      align-items: end;
      gap: 40px;
      margin-bottom: 48px;
    }
    .section-head h2 {
      font-family: var(--serif);
      font-size: clamp(38px, 5vw, 62px);
      line-height: 1.03;
      letter-spacing: -.035em;
      margin: 0;
    }
    .section-head p { color: var(--muted); margin: 0; max-width: 530px; }
    .product-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
    .product-card {
      background: var(--paper-2);
      border: 1px solid var(--line);
      border-radius: 10px;
      overflow: hidden;
      display: flex;
      flex-direction: column;
    }
    .product-image {
      display: block;
      aspect-ratio: 4/5;
      overflow: hidden;
      background: #efede8;
      position: relative;
    }
    .product-image-link {
      display: block;
      width: 100%;
      padding: 0;
      border: 0;
      background: transparent;
      color: inherit;
      cursor: pointer;
      text-align: inherit;
    }
    .product-image-link:focus-visible,
    .product-title-link:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
    .product-title-link {
      display: inline;
      padding: 0;
      border: 0;
      background: transparent;
      color: inherit;
      cursor: pointer;
      text-align: inherit;
      font: inherit;
    }
    .product-title-link:hover { color: var(--forest-deep); text-decoration: underline; text-underline-offset: 4px; }
    .product-image::after {
      content: "900 g";
      position: absolute;
      right: 14px; bottom: 14px;
      background: rgba(255,253,248,.9);
      color: #25291f;
      border-radius: 999px;
      padding: 6px 10px;
      font-size: 12px;
      font-weight: 700;
      backdrop-filter: blur(8px);
    }
    .product-image img { width: 100%; height: 100%; object-fit: cover; object-position: center 45%; transition: transform .5s ease; }
    .product-card:hover .product-image img { transform: scale(1.025); }
    .product-body { display: flex; flex-direction: column; flex: 1; padding: 24px; }
    .product-kicker { font-size: 12px; font-weight: 700; color: var(--muted); margin: 0 0 6px; }
    .product-title { font-size: 23px; line-height: 1.2; margin: 0; }
    .product-ml { font-family: var(--mal); font-size: 14px; color: var(--muted); margin: 5px 0 18px; }
    .product-copy { font-size: 14px; color: var(--muted); margin: 0 0 26px; }
    .product-bottom { margin-top: auto; display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; }
    .product-actions { display: flex; align-items: center; gap: 8px; }
    .price { display: flex; flex-direction: column; }
    .benefits {
      background: var(--maroon);
      color: var(--on-green);
      padding: 100px 28px;
      border-top: 6px solid var(--gold);
    }
    .benefits-inner { max-width: 1184px; margin: 0 auto; }
    .benefits-head {
      display: grid;
      grid-template-columns: .85fr 1.15fr;
      gap: clamp(34px, 7vw, 90px);
      align-items: end;
      margin-bottom: 42px;
    }
    .benefits-head h2 {
      margin: 0;
      font-family: var(--serif);
      font-size: clamp(38px, 5vw, 60px);
      line-height: 1.03;
    }
    .benefits-head p { margin: 0; color: color-mix(in srgb, var(--on-green) 78%, transparent); max-width: 590px; }
    .benefit-list {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      border-top: 1px solid color-mix(in srgb, var(--on-green) 28%, transparent);
    }
    .benefit-item {
      display: grid;
      grid-template-columns: 42px 1fr;
      gap: 15px;
      padding: 25px 24px 25px 0;
      border-bottom: 1px solid color-mix(in srgb, var(--on-green) 24%, transparent);
    }
    .benefit-item:nth-child(even) { padding-left: 28px; border-left: 1px solid color-mix(in srgb, var(--on-green) 24%, transparent); }
    .benefit-number {
      font-family: var(--serif);
      color: var(--gold);
      font-size: 18px;
      font-weight: 700;
      line-height: 1.4;
    }
    .benefit-item h3 { margin: 0 0 6px; font-size: 17px; }
    .benefit-item p { margin: 0; color: color-mix(in srgb, var(--on-green) 76%, transparent); font-size: 14px; }
    .detail-benefits { margin: 4px 0 34px; }
    .detail-benefits h3 { font-family: var(--serif); font-size: 25px; margin: 0 0 12px; }
    .detail-benefit-list { border-top: 1px solid var(--line); }
    .detail-benefit {
      display: grid;
      grid-template-columns: 28px 1fr;
      gap: 12px;
      padding: 13px 0;
      border-bottom: 1px solid var(--line);
    }
    .detail-benefit span:first-child { color: var(--terracotta); font-weight: 700; }
    .detail-benefit strong { display: block; font-size: 14px; margin-bottom: 2px; }
    .detail-benefit small { display: block; color: var(--muted); font-size: 12px; line-height: 1.5; }
    .price strong { font-family: var(--serif); font-size: 27px; line-height: 1; }
    .price span { font-size: 11px; color: var(--muted); margin-top: 4px; }
    .add-btn { min-height: 44px; padding: 0 15px; white-space: nowrap; }
    .add-btn.is-added { background: var(--sage); color: var(--forest-deep); }
    .story {
      background: var(--sage);
      padding: 104px 28px;
    }
    .story-inner {
      max-width: 1160px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: .8fr 1.2fr;
      gap: clamp(50px, 9vw, 130px);
      align-items: start;
    }
    .story h2 { font-family: var(--serif); font-size: clamp(38px, 5vw, 58px); line-height: 1.05; margin: 0; }
    .story-copy { border-top: 1px solid color-mix(in srgb, var(--ink) 30%, transparent); }
    .story-row {
      display: grid;
      grid-template-columns: 54px 1fr;
      gap: 20px;
      padding: 24px 0;
      border-bottom: 1px solid color-mix(in srgb, var(--ink) 22%, transparent);
    }
    .story-row span { font-family: var(--serif); font-size: 22px; color: var(--forest); }
    .story-row h3 { margin: 0 0 7px; font-size: 18px; }
    .story-row p { margin: 0; color: var(--muted); font-size: 14px; }
    .order-note {
      max-width: 1240px;
      padding: 84px 28px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 30px;
      align-items: center;
    }
    .order-note h2 { font-family: var(--serif); font-size: clamp(32px, 4vw, 48px); margin: 0 0 10px; }
    .order-note p { margin: 0; color: var(--muted); max-width: 680px; }
    footer { border-top: 1px solid var(--line); }
    .footer-inner {
      max-width: 1240px;
      margin: 0 auto;
      padding: 28px;
      display: flex;
      justify-content: space-between;
      gap: 20px;
      align-items: center;
      color: var(--muted);
      font-size: 12px;
    }
    .footer-licence { display: flex; flex-wrap: wrap; gap: 8px 18px; }
    .overlay {
      position: fixed; inset: 0; z-index: 50;
      background: rgba(8, 13, 9, .48);
      opacity: 0; visibility: hidden;
    }
    .overlay.open { opacity: 1; visibility: visible; }
    .cart-drawer {
      position: absolute; right: 0; top: 0; bottom: 0;
      width: min(430px, 100%);
      background: var(--paper-2);
      box-shadow: -20px 0 60px rgba(0,0,0,.2);
      transform: translateX(100%);
      display: flex;
      flex-direction: column;
    }
    .overlay.open .cart-drawer { transform: translateX(0); }
    .cart-head { padding: 24px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--line); }
    .cart-head h2 { margin: 0; font-family: var(--serif); font-size: 30px; }
    .close-btn { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--line); background: transparent; color: var(--ink); cursor: pointer; font-size: 23px; }
    .cart-items { flex: 1; overflow-y: auto; padding: 8px 24px; }
    .empty { text-align: center; color: var(--muted); padding: 80px 20px; }
    .cart-item { display: grid; grid-template-columns: 62px 1fr auto; gap: 13px; align-items: center; padding: 16px 0; border-bottom: 1px solid var(--line); }
    .cart-thumb { width: 62px; height: 72px; object-fit: cover; border-radius: 5px; }
    .cart-item h3 { margin: 0 0 3px; font-size: 14px; }
    .cart-item p { margin: 0; color: var(--muted); font-size: 12px; }
    .qty { display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: 5px; margin-top: 8px; }
    .qty button { width: 30px; height: 28px; border: 0; background: transparent; color: var(--ink); cursor: pointer; }
    .qty span { min-width: 24px; text-align: center; font-size: 12px; }
    .remove-btn { border: 0; background: transparent; color: var(--muted); text-decoration: underline; cursor: pointer; font-size: 11px; padding: 0; }
    .cart-foot { border-top: 1px solid var(--line); padding: 22px 24px calc(22px + env(safe-area-inset-bottom)); }
    .total-row { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; }
    .total-row strong { font-family: var(--serif); font-size: 28px; }
    .delivery-copy { font-size: 12px; color: var(--muted); margin: 0 0 16px; }
    .checkout-btn { width: 100%; min-height: 54px; }
    .detail-overlay {
      position: fixed;
      inset: 0;
      z-index: 60;
      background: var(--paper);
      overflow-y: auto;
      display: none;
    }
    .detail-overlay.open { display: block; }
    .detail-topbar {
      position: sticky;
      top: 0;
      z-index: 2;
      min-height: 64px;
      padding: 10px max(18px, calc((100vw - 1184px) / 2));
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 16px;
      border-bottom: 1px solid var(--line);
      background: color-mix(in srgb, var(--paper) 94%, transparent);
      backdrop-filter: blur(12px);
    }
    .detail-back {
      border: 0;
      background: transparent;
      color: var(--forest-deep);
      font-weight: 700;
      cursor: pointer;
      padding: 10px 0;
    }
    .detail-close {
      width: 42px;
      height: 42px;
      border-radius: 50%;
      border: 1px solid var(--line);
      background: var(--paper-2);
      color: var(--ink);
      font-size: 24px;
      cursor: pointer;
    }
    .detail-main {
      max-width: 1184px;
      margin: 0 auto;
      padding: clamp(34px, 6vw, 82px) 28px 76px;
      display: grid;
      grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
      gap: clamp(36px, 7vw, 92px);
      align-items: start;
    }
    .detail-image-wrap {
      position: sticky;
      top: 96px;
      background: var(--paper-2);
      border: 1px solid var(--line);
      border-radius: 12px;
      overflow: hidden;
      box-shadow: var(--shadow);
    }
    .detail-image { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
    .detail-copy { padding-top: 10px; }
    .detail-copy .eyebrow { margin-bottom: 14px; }
    .detail-title {
      font-family: var(--serif);
      font-size: clamp(40px, 5vw, 66px);
      line-height: 1.02;
      letter-spacing: -.035em;
      margin: 0;
    }
    .detail-local { color: var(--forest); font-weight: 700; margin: 12px 0 22px; }
    .detail-description { color: var(--muted); font-size: 18px; max-width: 620px; margin: 0 0 30px; }
    .detail-facts {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      border-top: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
      margin: 0 0 30px;
    }
    .detail-fact { padding: 18px 18px 18px 0; }
    .detail-fact:nth-child(even) { padding-left: 18px; border-left: 1px solid var(--line); }
    .detail-fact:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
    .detail-fact strong { display: block; font-size: 14px; margin-bottom: 3px; }
    .detail-fact span { color: var(--muted); font-size: 12px; }
    .detail-buy { display: flex; align-items: center; gap: 20px; }
    .detail-price strong { display: block; font-family: var(--serif); font-size: 36px; line-height: 1; }
    .detail-price span { color: var(--muted); font-size: 12px; }
    .detail-add { min-width: 190px; }
    .checkout-overlay {
      position: fixed;
      inset: 0;
      z-index: 65;
      background: var(--paper);
      overflow-y: auto;
      display: none;
    }
    .checkout-overlay.open { display: block; }
    .checkout-main {
      max-width: 1080px;
      margin: 0 auto;
      padding: clamp(32px, 5vw, 68px) 28px 80px;
      display: grid;
      grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
      gap: clamp(32px, 6vw, 72px);
      align-items: start;
    }
    .checkout-main h2 { font-family: var(--serif); font-size: clamp(36px, 5vw, 56px); line-height: 1.05; margin: 0 0 10px; }
    .checkout-intro { color: var(--muted); margin: 0 0 30px; }
    .checkout-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
    .field { display: grid; gap: 7px; }
    .field.full { grid-column: 1 / -1; }
    .field label { font-size: 13px; font-weight: 700; }
    .field input, .field textarea {
      width: 100%;
      border: 1px solid var(--line);
      border-radius: 5px;
      background: var(--paper-2);
      color: var(--ink);
      padding: 13px 14px;
      font: inherit;
    }
    .field textarea { min-height: 96px; resize: vertical; }
    .payment-panel {
      grid-column: 1 / -1;
      margin-top: 10px;
      padding: 20px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--paper-2);
    }
    .payment-panel h3 { margin: 0 0 6px; font-size: 17px; }
    .payment-panel p { margin: 0; color: var(--muted); font-size: 13px; }
    .confirm-order-btn {
      width: 100%;
      min-height: 54px;
      margin-top: 16px;
      border: 0;
      border-radius: 5px;
      background: var(--forest-deep);
      color: var(--on-green);
      font-weight: 700;
      cursor: pointer;
    }
    .confirm-order-btn:hover { background: var(--forest); }
    .pay-option { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border: 1px solid var(--line); border-radius: 8px; margin-top: 10px; cursor: pointer; }
    .pay-option input { margin-top: 2px; width: 18px; height: 18px; accent-color: var(--forest-deep); flex: none; }
    .pay-option[hidden] { display: none !important; }
    .pay-option-body strong { display: block; font-size: 15px; }
    .pay-option-body small { color: var(--muted); font-size: 13px; }
    .pay-option:has(input:checked) { border-color: var(--forest-deep); background: var(--paper); }
    .confirmation-order { margin: 0 0 14px; font-size: 14px; color: var(--muted); }
    .confirmation-order strong { color: var(--ink); letter-spacing: .5px; }
    .checkout-summary {
      position: sticky;
      top: 94px;
      padding: 24px;
      border: 1px solid var(--line);
      border-radius: 10px;
      background: var(--paper-2);
    }
    .checkout-summary h3 { font-family: var(--serif); font-size: 25px; margin: 0 0 18px; }
    .summary-item { display: flex; justify-content: space-between; gap: 18px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 13px; }
    .summary-total { display: flex; justify-content: space-between; align-items: baseline; padding-top: 18px; }
    .summary-total strong { font-family: var(--serif); font-size: 28px; }
    .after-payment { margin: 18px 0 0; padding-top: 18px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
    .confirmation-overlay {
      position: fixed;
      inset: 0;
      z-index: 75;
      display: none;
      overflow-y: auto;
      background: var(--paper);
    }
    .confirmation-overlay.open { display: grid; place-items: center; }
    .confirmation-card {
      width: min(680px, calc(100% - 36px));
      margin: 36px auto;
      padding: clamp(30px, 6vw, 58px);
      border: 1px solid var(--line);
      border-radius: 12px;
      background: var(--paper-2);
      box-shadow: var(--shadow);
    }
    .confirmation-mark {
      width: 54px;
      height: 54px;
      margin-bottom: 24px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      background: var(--sage);
      color: var(--forest-deep);
      font-size: 26px;
      font-weight: 700;
    }
    .confirmation-card h2 {
      margin: 0 0 12px;
      font-family: var(--serif);
      font-size: clamp(36px, 6vw, 54px);
      line-height: 1.05;
    }
    .confirmation-lead { margin: 0 0 26px; color: var(--muted); }
    .confirmation-summary {
      margin-bottom: 26px;
      border-top: 1px solid var(--line);
    }
    .confirmation-total {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      padding: 18px 0 0;
      font-weight: 700;
    }
    .confirmation-total strong { font-family: var(--serif); font-size: 30px; }
    .whatsapp-btn {
      width: 100%;
      min-height: 56px;
      border-radius: 5px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      background: #167a3f;
      color: #fff;
      text-decoration: none;
      font-weight: 700;
    }
    .whatsapp-btn:hover { background: #0f6633; }
    .confirmation-note { margin: 12px 0 0; color: var(--muted); font-size: 12px; text-align: center; }
    .confirmation-actions { margin-top: 22px; display: flex; justify-content: center; gap: 18px; }
    .text-btn { border: 0; background: transparent; color: var(--forest-deep); font-weight: 700; cursor: pointer; padding: 8px; }
    body.ml .confirmation-card h2 { font-family: var(--mal-display); letter-spacing: -.02em; }
    .toast {
      position: fixed; left: 50%; bottom: 24px; z-index: 70;
      transform: translate(-50%, 20px);
      background: var(--ink); color: var(--paper-2);
      padding: 11px 16px;
      border-radius: 5px;
      font-size: 13px;
      opacity: 0; pointer-events: none;
      transition: opacity .2s ease, transform .2s ease;
    }
    .toast.show { opacity: 1; transform: translate(-50%, 0); }
    [data-ml] { display: none !important; }
    body.ml [data-en] { display: none !important; }
    body.ml [data-ml] { display: revert !important; }
    body.ml .proof-item strong[data-ml] { display: block !important; }
    body.ml { font-family: var(--mal); }
    body.ml h1, body.ml .section-head h2, body.ml .benefits h2, body.ml .story h2, body.ml .order-note h2, body.ml .cart-head h2, body.ml .detail-title, body.ml .detail-benefits h3 { font-family: var(--mal-display); letter-spacing: -.02em; }
    body.ml h1 { line-height: 1.14; font-size: clamp(42px, 6vw, 76px); }
    body.ml .product-title, body.ml .benefit-item h3, body.ml .story-row h3, body.ml .detail-local { font-family: var(--mal-display); }
    @media (max-width: 840px) {
      .hero { grid-template-columns: 1fr; padding-top: 48px; }
      .hero-visual { min-height: 480px; max-width: 560px; width: 100%; margin: 0 auto; }
      .proof-inner { grid-template-columns: 1fr 1fr; gap: 0; }
      .proof-item { border-bottom: 1px solid color-mix(in srgb, var(--paper-2) 25%, transparent); }
      .proof-item:nth-child(2) { border-right: 0; }
      .proof-item:nth-child(3), .proof-item:nth-child(4) { border-bottom: 0; }
      .product-grid { grid-template-columns: 1fr 1fr; }
      .product-card:last-child { grid-column: 1 / -1; max-width: calc(50% - 11px); }
      .benefits-head { grid-template-columns: 1fr; }
      .story-inner { grid-template-columns: 1fr; }
      .detail-main { grid-template-columns: 1fr; }
      .detail-image-wrap { position: relative; top: auto; max-width: 560px; width: 100%; margin: 0 auto; }
      .checkout-main { grid-template-columns: 1fr; }
      .checkout-summary { position: static; }
    }
    @media (max-width: 620px) {
      .utility { padding: 0 18px; }
      .origin span:last-child { display: none; }
      .hero { padding: 44px 18px 54px; gap: 44px; }
      h1 { font-size: clamp(44px, 15vw, 66px); }
      .hero-copy > p:not(.eyebrow) { font-size: 17px; margin: 22px 0 28px; }
      .hero-actions { align-items: stretch; flex-direction: column; }
      .hero-note { text-align: center; }
      .hero-visual { min-height: 400px; }
      .hero-photo.main { inset: 0 4% 0 10%; }
      .hero-photo.side { width: 36%; height: 45%; left: -2%; }
      .stamp { width: 94px; font-size: 10px; right: -3px; top: 6%; }
      .proof-inner { padding: 18px; }
      .proof-item { padding: 13px 10px; }
      .proof-item strong { font-size: 15px; }
      .proof-item span { font-size: 10px; }
      .section-head { grid-template-columns: 1fr; gap: 18px; }
      .products { padding: 78px 18px 84px; }
      .product-grid { grid-template-columns: 1fr; gap: 18px; }
      .product-card:last-child { grid-column: auto; max-width: none; }
      .product-image { aspect-ratio: 5/5.8; }
      .product-bottom { align-items: stretch; flex-direction: column; }
      .product-actions { display: block; }
      .add-btn { width: 100%; }
      .benefits { padding: 74px 18px; }
      .benefit-list { grid-template-columns: 1fr; }
      .benefit-item, .benefit-item:nth-child(even) { padding: 20px 0; border-left: 0; }
      .detail-main { padding: 24px 18px 56px; gap: 28px; }
      .detail-copy { padding-top: 0; }
      .detail-title { font-size: 39px; }
      .detail-description { font-size: 16px; }
      .detail-buy { align-items: stretch; flex-direction: column; }
      .detail-add { width: 100%; }
      .checkout-main { padding: 24px 18px 56px; }
      .checkout-form { grid-template-columns: 1fr; }
      .field.full, .payment-panel { grid-column: auto; }
      .story { padding: 76px 18px; }
      .story-inner { gap: 38px; }
      .order-note { padding: 68px 18px; grid-template-columns: 1fr; }
      .order-note .primary-btn { width: 100%; }
      .footer-inner { padding: 24px 18px; align-items: flex-start; flex-direction: column; }
    }
    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      *, *::before, *::after { transition-duration: .01ms !important; }
    }
    .nav-link {
      font-size: 14px; font-weight: 600; color: var(--muted); text-decoration: none;
      padding: 8px 12px; border-radius: 999px;
    }
    .nav-link:hover { color: var(--ink); background: color-mix(in srgb, var(--forest) 10%, transparent); }
    .stock-note { font-size: 12px; color: var(--gold); font-weight: 700; margin: 8px 0 0; }
    .add-btn:disabled { opacity: .55; cursor: not-allowed; transform: none; }

    /* Legal & policy pages + footer policy links */
    .footer-links { display: flex; flex-wrap: wrap; gap: 6px 16px; }
    .footer-links a { color: var(--muted); text-decoration: none; }
    .footer-links a:hover { color: var(--forest); text-decoration: underline; }
    .checkout-agree { font-size: 12px; color: var(--muted); margin: 0 0 10px; }
    .checkout-agree a { color: var(--forest); }
    .legal-page { max-width: 820px; margin: 0 auto; padding: 40px 28px 64px; line-height: 1.65; }
    .legal-logo { display: block; width: 140px; height: auto; margin-bottom: 20px; }
    .legal-page h1 { font-family: var(--serif); font-size: clamp(34px, 5vw, 52px); line-height: 1.05; letter-spacing: -.02em; margin: 0 0 8px; }
    .legal-updated { color: var(--muted); font-size: 13px; margin: 0 0 22px; }
    .legal-intro { font-size: 17px; }
    .legal-page h2 { font-size: 19px; margin: 30px 0 8px; color: var(--forest-deep); }
    .legal-page ul { padding-left: 20px; margin: 8px 0; }
    .legal-page li { margin: 6px 0; }
    .legal-page a { color: var(--forest); }
    .legal-contact { background: var(--paper-2); border: 1px solid var(--line); border-radius: 14px; padding: 6px 22px 10px; margin-top: 24px; }
    @media (prefers-color-scheme: dark) { .legal-page h2 { color: var(--forest); } }
    @media (max-width: 700px) { .footer-inner { flex-direction: column; align-items: flex-start; } }
