:root {
  --forest: #123d2f;
  --forest-deep: #082a20;
  --leaf: #177a4f;
  --lime: #d9f45f;
  --cream: #fff2d9;
  --paper: #fffaf0;
  --peach: #ff8a58;
  --amber: #ffbc2e;
  --ink: #16372e;
  --muted: #5f716a;
  --line: #c8d2c7;
  --pink: #fa6c91;
  --sky: #86dbe2;
  --shadow-sm: 5px 5px 0 rgba(8,42,32,.13);
  --shadow-lg: 9px 10px 0 rgba(8,42,32,.14);
  --radius-sm: 14px;
  --radius-md: 26px;
  --radius-lg: 38px;
  --font-display: "Baloo 2", "DM Sans", sans-serif;
}

body { font-size: 17px; }
h1, h2 { letter-spacing: -.045em; line-height: .98; }
h1 { font-weight: 800; }
h2 { font-weight: 800; }
h3 { font-family: var(--font-display); font-weight: 800; }
.section { padding-block: clamp(64px, 8vw, 110px); }
.section--cream { background: var(--cream); }
.eyebrow { color: var(--forest); font-size: .78rem; letter-spacing: .1em; }
.eyebrow::before { width: 18px; height: 7px; background: var(--amber); border: 2px solid var(--forest); border-radius: 99px; }
.eyebrow--light { color: var(--lime); }
.eyebrow--light::before { border-color: var(--lime); background: var(--peach); }

.announcement { color: var(--forest-deep); background: var(--amber); border-bottom: 2px solid var(--forest-deep); font-weight: 700; }
.site-header { background: rgba(255,250,240,.96); border-bottom: 2px solid var(--forest); }
.brand__text strong { font-family: var(--font-display); font-size: 1.7rem; font-weight: 800; }
.brand__mark { background: var(--peach); border: 2px solid var(--forest); box-shadow: 3px 3px 0 var(--forest); }
.brand__mark span { background: var(--forest); }
.primary-nav > a:not(.button) { color: var(--forest); font-weight: 700; }

.button { min-height: 54px; border: 2px solid var(--forest-deep); border-radius: 14px; box-shadow: 4px 4px 0 var(--forest-deep); font-weight: 800; }
.button:hover { transform: translate(-1px,-2px); box-shadow: 6px 6px 0 var(--forest-deep); }
.button:active { transform: translate(3px,3px); box-shadow: 1px 1px 0 var(--forest-deep); }
.button--primary { color: var(--forest-deep); background: var(--lime); }
.button--primary:hover { background: #e6ff79; }
.button--secondary { background: var(--paper); border-color: var(--forest-deep); }
.button--cream { background: var(--paper); }
.button--whatsapp { background: #32ba68; }
.button--amazon, .button--flipkart { border-color: var(--forest-deep); }
.text-link { text-decoration: underline; text-decoration-color: var(--amber); text-decoration-thickness: 4px; text-underline-offset: 5px; }

.hero { padding-block: clamp(48px, 7vw, 88px); background: var(--cream); border-bottom: 2px solid var(--forest); }
.hero::before { top: 8%; right: -8%; width: 420px; height: 420px; border: 0; background: repeating-radial-gradient(circle, var(--pink) 0 6px, transparent 7px 28px); border-radius: 50%; box-shadow: none; opacity: .12; }
.hero__grid { gap: clamp(34px, 5vw, 72px); }
.hero h1 { max-width: 740px; margin-bottom: 22px; font-size: clamp(3.3rem, 7.7vw, 6.6rem); color: var(--forest-deep); }
.hero h1 em { display: inline; color: var(--forest); font-style: normal; background: var(--lime); border: 3px solid var(--forest); border-radius: 18px 8px 16px 10px; box-shadow: 5px 5px 0 var(--forest); padding: 0 .13em; white-space: nowrap; }
.hero h1 em::after { display: none; }
.hero__copy > p { color: #38574d; font-size: clamp(1.05rem, 2vw, 1.3rem); line-height: 1.55; }
.hero__proof { color: var(--forest); font-weight: 700; }
.hero__proof i { width: 27px; height: 27px; color: var(--forest); background: var(--amber); border: 2px solid var(--forest); }
.hero-art__shape { inset: 5% 2% 2% 6%; background: var(--peach); border: 3px solid var(--forest); box-shadow: 10px 12px 0 var(--pink); }
.hero-art__note { background: var(--sky); border: 2px solid var(--forest); border-radius: 16px; box-shadow: 5px 5px 0 var(--forest); }
.hero-art__note strong { font-family: var(--font-display); font-weight: 800; }
.hero-art__badge { color: var(--forest); background: var(--lime); border: 3px solid var(--forest); box-shadow: 5px 5px 0 var(--forest); font-size: .72rem; }

.trust-strip { background: var(--forest); border-bottom: 2px solid var(--forest-deep); }
.trust-item { border-right: 2px dashed rgba(255,255,255,.2); }
.trust-item svg { stroke: var(--amber); stroke-width: 2; }
.trust-item strong { font-family: var(--font-display); font-size: 1.05rem; font-weight: 800; }
.trust-item small { color: #d4e3dc; }

.section-heading h2 { color: var(--forest-deep); }
.product-grid { gap: 26px; }
.product-card { border: 2px solid var(--forest); border-radius: 24px; box-shadow: 5px 6px 0 rgba(18,61,47,.18); }
.product-card:hover { transform: translateY(-6px) rotate(-.4deg); box-shadow: 8px 10px 0 rgba(18,61,47,.18); }
.product-card__visual { background: #ffd54d; border-bottom: 2px solid var(--forest); }
.product-card:nth-child(3n+2) .product-card__visual { background: var(--sky); }
.product-card:nth-child(3n+3) .product-card__visual { background: #ffad8b; }
.product-card__visual::before { width: 80%; height: 80%; border: 3px dashed rgba(18,61,47,.22); }
.product-card__badge { color: var(--forest); background: var(--paper); border: 2px solid var(--forest); border-radius: 9px; box-shadow: 3px 3px 0 var(--forest); }
.product-card h3 { font-family: var(--font-display); font-size: 1.65rem; font-weight: 800; }
.product-card__meta { color: var(--forest); }

.story-visual__main { border: 3px solid var(--forest); border-radius: 34% 20px 34% 20px; box-shadow: 9px 10px 0 var(--amber); }
.story-visual__detail { background: var(--paper); border: 3px solid var(--forest); box-shadow: 7px 7px 0 var(--pink); }
.story-point i { color: var(--forest); background: var(--amber); border: 2px solid var(--forest); border-radius: 12px; box-shadow: 3px 3px 0 var(--forest); font-family: var(--font-display); }
.story-point strong { color: var(--forest); font-size: 1.05rem; }

.flavour-banner { background: var(--forest); border: 3px solid var(--forest-deep); border-radius: 30px; box-shadow: 9px 10px 0 var(--amber); }
.flavour-banner p { color: #e2ece6; }
.flavour-chip { border: 3px solid var(--forest-deep); box-shadow: 5px 5px 0 var(--forest-deep); font-family: var(--font-display); font-size: 1.1rem; }
.flavour-chip:nth-child(1) { background: var(--sky); }
.flavour-chip:nth-child(2) { background: var(--peach); }
.flavour-chip:nth-child(3) { background: var(--lime); }

.instagram-section { overflow: hidden; background: #ffd84d; border-block: 2px solid var(--forest); }
.instagram-carousel { position: relative; }
.instagram-carousel__viewport { overflow: hidden; padding: 8px 8px 18px; margin: 0 -8px; }
.instagram-carousel__track { display: flex; align-items: stretch; gap: 24px; transition: transform .55s cubic-bezier(.2,.7,.2,1); will-change: transform; }
.instagram-card { flex: 0 0 calc((100% - 48px)/3); min-width: 0; overflow: hidden; background: var(--paper); border: 3px solid var(--forest); border-radius: 24px; box-shadow: 7px 8px 0 var(--forest); }
.instagram-card__video { position: relative; aspect-ratio: 4/5; overflow: hidden; background: #f1eadc; border-bottom: 3px solid var(--forest); }
.instagram-card__video iframe { width: 100%; height: 100%; border: 0; }
.instagram-card__footer { display: grid; gap: 6px; padding: 17px 18px 19px; }
.instagram-card__footer strong { overflow: hidden; color: var(--forest); font-family: var(--font-display); font-size: 1.15rem; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.instagram-card__footer a { color: var(--leaf); font-size: .78rem; font-weight: 800; }
.instagram-carousel__controls { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 28px; }
.instagram-carousel__controls > button { width: 52px; height: 52px; color: var(--forest); background: var(--paper); border: 2px solid var(--forest); border-radius: 13px; box-shadow: 3px 3px 0 var(--forest); font-size: 1.25rem; font-weight: 800; cursor: pointer; }
.instagram-carousel__controls > button:hover { background: var(--lime); }
.instagram-carousel__dots { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; }
.instagram-carousel__dots button { width: 14px; height: 14px; padding: 0; background: transparent; border: 2px solid var(--forest); border-radius: 50%; cursor: pointer; }
.instagram-carousel__dots button[aria-current="true"] { background: var(--forest); transform: scale(1.16); }

.testimonial blockquote { color: var(--forest); font-family: var(--font-display); font-weight: 800; }
.testimonial__quote { color: var(--pink); }
.page-hero { background: var(--cream); border-bottom: 2px solid var(--forest); }
.page-hero h1 { color: var(--forest-deep); }
.filter-button { color: var(--forest); background: var(--paper); border: 2px solid var(--forest); border-radius: 12px; box-shadow: 2px 2px 0 var(--forest); }
.filter-button[aria-pressed="true"] { color: var(--forest); background: var(--lime); }
.product-detail__visual { background: var(--amber); border: 3px solid var(--forest); border-radius: 30px; box-shadow: 8px 9px 0 var(--pink); }
.product-detail__fact, .marketplace-purchase, .product-share { border: 2px solid var(--forest); }
.product-detail__fact { background: var(--cream); border-radius: 13px; }
.contact-info, .contact-form, .value-card, .map-embed { border: 2px solid var(--forest); box-shadow: 6px 7px 0 rgba(18,61,47,.16); }
.site-footer { background: var(--forest-deep); }
.footer-card { border: 2px solid var(--lime); }
.whatsapp-trigger { border: 2px solid var(--forest-deep); box-shadow: 4px 4px 0 var(--forest-deep); }

@media (max-width: 960px) {
  .primary-nav { border: 2px solid var(--forest); box-shadow: 6px 7px 0 rgba(18,61,47,.18); }
  .instagram-card { flex-basis: calc((100% - 24px)/2); }
}

@media (max-width: 680px) {
  body { font-size: 16px; }
  .hero h1 { font-size: clamp(3rem, 16vw, 4.4rem); }
  .hero-art__shape { box-shadow: 6px 7px 0 var(--pink); }
  .trust-item strong { font-size: .93rem; }
  .instagram-card { flex-basis: 100%; }
  .instagram-carousel__track { gap: 18px; }
  .instagram-card__video { aspect-ratio: 4/5.2; }
  .instagram-carousel__controls { margin-top: 22px; }
}

@media (prefers-reduced-motion: reduce) {
  .instagram-carousel__track { transition: none; }
}

/* Professional food-brand refinement */
:root {
  --forest: #075f55;
  --forest-deep: #033c37;
  --leaf: #0b806f;
  --lime: #f4bd2f;
  --cream: #fff2cf;
  --paper: #fffdf7;
  --peach: #f27652;
  --amber: #f5ad24;
  --ink: #123d38;
  --muted: #5e716d;
  --line: #d4dfda;
  --shadow-sm: 0 12px 30px rgba(3,60,55,.1);
  --shadow-lg: 0 24px 64px rgba(3,60,55,.15);
  --font-display: "Fraunces", Georgia, serif;
}

body { font-size: 16px; }
h1, h2 { letter-spacing: -.035em; line-height: 1.06; }
.announcement { color: var(--forest-deep); background: var(--amber); border-bottom: 0; font-weight: 700; }
.site-header { background: rgba(255,253,247,.97); border-bottom: 1px solid rgba(7,95,85,.14); }
.brand__mark { background: var(--forest); border: 0; box-shadow: none; }
.brand__mark span { background: var(--lime); }
.brand__text strong { font-family: var(--font-display); font-size: 1.5rem; }
.eyebrow { color: var(--leaf); font-size: .75rem; letter-spacing: .14em; }
.eyebrow::before { width: 24px; height: 2px; background: currentColor; border: 0; border-radius: 0; }
.eyebrow--light { color: var(--lime); }
.eyebrow--light::before { background: currentColor; }
.button { min-height: 52px; padding-inline: 24px; border: 1px solid transparent; border-radius: 999px; box-shadow: none; }
.button:hover { transform: translateY(-2px); box-shadow: 0 10px 25px rgba(3,60,55,.16); }
.button:active { transform: none; box-shadow: none; }
.button--primary { color: #fff; background: var(--forest); }
.button--primary:hover { background: var(--forest-deep); }
.button--secondary { background: transparent; border-color: rgba(7,95,85,.28); }
.button--cream { background: var(--paper); border-color: transparent; }
.nav-cta { color: var(--forest-deep); background: var(--amber); }
.nav-cta:hover { color: var(--forest-deep); background: #ffc83f; }
.text-link { text-decoration: none; }

.hero { padding-block: clamp(60px, 8vw, 108px); background: var(--cream); border-bottom: 0; }
.hero::before { display: none; }
.hero__grid { grid-template-columns: minmax(0,.92fr) minmax(420px,1.08fr); gap: clamp(48px,7vw,96px); }
.hero h1 { max-width: 650px; margin-bottom: 24px; color: var(--forest); font-size: clamp(3.25rem,6vw,5.35rem); line-height: 1.02; }
.hero h1 em { color: #d95638; background: transparent; border: 0; border-radius: 0; box-shadow: none; padding: 0; font-style: italic; white-space: normal; }
.hero__copy > p { max-width: 560px; color: var(--muted); font-size: clamp(1.05rem,1.6vw,1.2rem); }
.hero__proof i { width: 24px; height: 24px; color: var(--forest); background: #e5edca; border: 0; }
.hero-art { position: relative; min-height: 600px; display: block; }
.hero-art__image { width: 100%; height: 600px; object-fit: cover; object-position: 50% 64%; border-radius: 180px 24px 180px 24px; filter: none; transform: none; box-shadow: var(--shadow-lg); }
.hero-art__caption { position: absolute; right: 22px; bottom: 22px; width: min(300px,calc(100% - 44px)); padding: 18px 20px; color: #fff; background: rgba(3,60,55,.93); border-radius: 14px; backdrop-filter: blur(10px); }
.hero-art__caption strong, .hero-art__caption span { display: block; }
.hero-art__caption strong { margin-bottom: 3px; font-family: var(--font-display); font-size: 1.05rem; }
.hero-art__caption span { color: #dce9e4; font-size: .78rem; }

.trust-strip { border-bottom: 0; }
.trust-item { border-right: 1px solid rgba(255,255,255,.13); }
.trust-item strong { font-family: var(--font-body); font-size: .93rem; }
.trust-item svg { stroke: var(--lime); stroke-width: 1.5; }
.product-card { border: 1px solid var(--line); border-radius: 22px; box-shadow: none; }
.product-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.product-card__visual { border-bottom: 0; background: #ffe3a0; }
.product-card:nth-child(3n+2) .product-card__visual { background: #d6f0e8; }
.product-card:nth-child(3n+3) .product-card__visual { background: #ffd9ce; }
.product-card__visual::before { border: 1px solid rgba(7,95,85,.14); }
.product-card__badge { color: var(--forest); background: var(--lime); border: 0; border-radius: 999px; box-shadow: none; }
.product-card h3 { font-size: 1.48rem; }

.story-visual { min-height: 560px; }
.story-visual__main { inset: 0; border: 0; border-radius: 26px; box-shadow: var(--shadow-lg); }
.story-visual__main img { object-fit: cover; object-position: center; }
.about-intro__image { min-height: 600px; background: #ece7dc; border-radius: 26px; box-shadow: var(--shadow-lg); }
.about-intro__image img { min-height: 600px; object-position: center; }
.story-point i { color: var(--forest); background: var(--lime); border: 0; border-radius: 50%; box-shadow: none; font-family: var(--font-body); }
.flavour-banner { border: 0; border-radius: 30px; box-shadow: none; }
.flavour-chip { border: 6px solid rgba(255,255,255,.14); box-shadow: none; font-family: var(--font-display); }
.flavour-chip:nth-child(1) { background: var(--cream); }
.flavour-chip:nth-child(2) { background: var(--peach); }
.flavour-chip:nth-child(3) { background: var(--lime); }
.filter-button { border: 1px solid var(--line); border-radius: 999px; box-shadow: none; }
.filter-button[aria-pressed="true"] { color: #fff; background: var(--forest); }
.product-detail__visual { border: 0; border-radius: 32px; box-shadow: none; background: #eee7d8; }
.product-detail__fact, .marketplace-purchase, .product-share { border: 1px solid var(--line); }
.contact-info, .contact-form, .value-card, .map-embed { border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.instagram-card { border: 1px solid rgba(7,95,85,.2); box-shadow: var(--shadow-sm); }
.instagram-card__video { border-bottom: 1px solid var(--line); }
.instagram-carousel__controls > button { border: 1px solid var(--forest); border-radius: 50%; box-shadow: none; }
.instagram-section { background: #fff0bd; border-block: 0; }
.whatsapp-trigger { border: 0; box-shadow: 0 12px 28px rgba(13,74,42,.28); }
.photo-credit { color: #b8d3cb!important; text-decoration: underline; text-underline-offset: 2px; }
.site-footer { background: var(--forest-deep); }
.page-hero { background: #fff1c9; }
.filter-button[aria-pressed="true"] { color: #fff; background: var(--forest); border-color: var(--forest); }
::selection { color: var(--forest-deep); background: #ffd86c; }

/* Document-led homepage */
.document-hero { overflow: hidden; }
.document-hero .hero__copy { position: relative; z-index: 2; }
.document-hero .hero__actions { margin-top: 30px; }
.rotating-flavour { display: inline-flex; align-items: center; gap: 10px; margin-top: 20px; padding: 9px 14px; color: var(--forest); background: #fff; border: 1px solid rgba(7,95,85,.15); border-radius: 999px; box-shadow: var(--shadow-sm); }
.rotating-flavour span { color: var(--muted); font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.rotating-flavour strong { min-width: 150px; font-size: .92rem; }
.product-showcase { position: relative; min-height: 590px; isolation: isolate; }
.product-showcase::before { content: ''; position: absolute; inset: 5% 4% 8%; z-index: -2; background: linear-gradient(145deg,#f7c833,#f27652); border-radius: 44% 56% 50% 50% / 38% 42% 58% 62%; transform: rotate(-4deg); }
.product-showcase::after { content: ''; position: absolute; width: 62%; aspect-ratio: 1; right: -12%; top: -4%; z-index: -3; border: 1px solid rgba(7,95,85,.13); border-radius: 50%; box-shadow: 0 0 0 32px rgba(7,95,85,.035),0 0 0 64px rgba(7,95,85,.025); }
.product-showcase__slide { position: absolute; inset: 0 0 46px; display: grid; place-items: center; color: var(--forest-deep); text-decoration: none; opacity: 0; visibility: hidden; transform: translateY(20px) scale(.96); transition: opacity .2s ease-out,transform .2s ease-out,visibility .2s; }
.product-showcase__slide.is-active { opacity: 1; visibility: visible; transform: none; }
.product-showcase__slide > span { position: absolute; left: 8%; top: 13%; z-index: 2; padding: 8px 13px; color: #fff; background: var(--forest); border-radius: 999px; font-size: .75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.product-showcase__slide img { width: auto; height: min(500px,72vh); max-width: 72%; object-fit: contain; filter: drop-shadow(0 24px 22px rgba(3,60,55,.23)); }
.product-showcase__slide > strong { position: absolute; right: 6%; bottom: 13%; max-width: 220px; padding: 12px 17px; background: #fff; border-radius: 14px; box-shadow: var(--shadow-sm); font-family: var(--font-display); font-size: 1.05rem; }
.product-showcase__dots { position: absolute; left: 50%; bottom: 4px; display: flex; gap: 8px; transform: translateX(-50%); }
.product-showcase__dots button { width: 10px; height: 10px; padding: 0; background: rgba(7,95,85,.25); border: 0; border-radius: 50%; cursor: pointer; }
.product-showcase__dots button[aria-current="true"] { width: 28px; background: var(--forest); border-radius: 10px; }

.guilt-free-grid { display: grid; grid-template-columns: minmax(0,.9fr) minmax(380px,1.1fr); align-items: center; gap: clamp(48px,8vw,110px); }
.guilt-free-grid h2 { max-width: 560px; }
.guilt-free-grid p { color: var(--muted); }
.guilt-free-grid .button { margin-top: 12px; }
.guilt-free-grid img { width: 100%; height: 540px; object-fit: cover; object-position: 50% 58%; border-radius: 28px; box-shadow: var(--shadow-lg); }

.build-pack-section { background: #fff; }
.pack-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }
.pack-card { overflow: hidden; border: 1px solid var(--line); border-radius: 24px; background: var(--paper); }
.pack-card__visual { position: relative; display: grid; place-items: center; height: 330px; overflow: hidden; background: linear-gradient(145deg,#fff0bd,#ffd36b); }
.pack-card:nth-child(2) .pack-card__visual { background: linear-gradient(145deg,#d8f0e9,#81ceb9); }
.pack-card:nth-child(3) .pack-card__visual { background: linear-gradient(145deg,#ffe1d7,#f5a085); }
.pack-card__visual img { position: absolute; width: 148px; height: 238px; object-fit: contain; transform: translateX(calc((var(--pack-index) - 1) * 48px)) rotate(calc((var(--pack-index) - 1) * 8deg)); filter: drop-shadow(0 16px 12px rgba(3,60,55,.18)); }
.pack-card:nth-child(1) .pack-card__visual img { transform: translateX(calc((var(--pack-index) - .5) * 58px)) rotate(calc((var(--pack-index) - .5) * 9deg)); }
.pack-card__body { padding: 24px; }
.pack-card__body > span { color: var(--leaf); font-size: .75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.pack-card h3 { margin: 7px 0 15px; font-size: 1.45rem; }
.pack-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; min-height: 34px; margin-bottom: 18px; }
.pack-price strong { color: var(--forest); font-size: 1.45rem; }
.pack-price del { color: var(--muted); font-size: .86rem; }
.pack-price small { padding: 4px 7px; color: #8f2e1a; background: #ffe0d7; border-radius: 6px; font-weight: 800; }
.pack-price-soon { min-height: 34px; margin-bottom: 18px; color: var(--muted); font-weight: 700; }
.pack-card .button { width: 100%; }

.magic-section { color: #fff; background: var(--forest); }
.magic-section .section-heading h2 { color: #fff; }
.magic-grid { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 14px; }
.magic-grid article { min-height: 170px; padding: 22px 15px; border: 1px solid rgba(255,255,255,.17); border-radius: 18px; text-align: center; }
.magic-grid i { display: grid; width: 54px; height: 54px; margin: 0 auto 18px; place-items: center; color: var(--forest-deep); background: var(--lime); border-radius: 50%; font-style: normal; font-weight: 900; }
.magic-grid strong { display: block; font-size: .92rem; }
.retail-soon { padding-block: 58px; color: #fff; background: var(--forest-deep); border-top: 1px solid rgba(255,255,255,.12); }
.retail-soon__inner { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.retail-soon h2 { margin: 8px 0 0; color: #fff; font-size: clamp(1.8rem,3vw,2.7rem); }
.retail-logos { display: flex; gap: 12px; }
.retail-logos > span { min-width: 140px; padding: 15px 18px; color: var(--forest-deep); background: #fff; border-radius: 12px; font-size: 1.1rem; font-weight: 900; text-align: center; }
.retail-logos small { display: block; margin-top: 3px; color: var(--muted); font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.footer-company { margin-top: 10px!important; color: #d4e4df!important; font-size: .84rem!important; }

/* Document-led About page */
.about-doc-hero { padding-block: clamp(56px,8vw,92px); }
.about-doc-hero h1 { max-width: 850px; }
.about-doc-hero p { max-width: 700px; }
.about-doc-intro { align-items: center; }
.smart-swap__grid { display: grid; grid-template-columns: minmax(0,.9fr) minmax(380px,1.1fr); align-items: center; gap: clamp(48px,8vw,100px); }
.smart-swap__grid p { color: var(--muted); }
.smart-swap__grid img { width: 100%; height: 500px; object-fit: cover; object-position: 50% 62%; border-radius: 28px; box-shadow: var(--shadow-lg); }
.generation-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }
.generation-grid article { padding: 30px; border: 1px solid var(--line); border-radius: 22px; background: #fff; }
.generation-grid article > span { color: var(--peach); font-family: var(--font-display); font-size: 2.2rem; }
.generation-grid h3 { margin: 16px 0 4px; font-size: 1.6rem; }
.generation-grid strong { color: var(--leaf); }
.generation-grid p { margin-bottom: 0; color: var(--muted); }
.time-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.time-grid article { display: flex; gap: 17px; align-items: flex-start; padding: 24px; background: #fff; border: 1px solid var(--line); border-radius: 18px; }
.time-grid i { display: grid; flex: 0 0 52px; height: 52px; place-items: center; color: var(--forest-deep); background: var(--lime); border-radius: 50%; font-style: normal; font-weight: 900; }
.time-grid h3 { margin: 2px 0 5px; }
.time-grid p { margin: 0; color: var(--muted); font-size: .9rem; }
.purpose-section { padding-top: 0; }
.purpose-grid { display: grid; grid-template-columns: 1fr 1fr; }
.purpose-grid article { padding: clamp(34px,5vw,64px); background: var(--forest); border-radius: 28px 0 0 28px; color: #d9e9e4; }
.purpose-grid article + article { color: var(--muted); background: var(--lime); border-radius: 0 28px 28px 0; }
.purpose-grid h2 { margin-top: 14px; color: #fff; }
.purpose-grid article + article h2 { color: var(--forest-deep); }
.purpose-grid p { margin-bottom: 0; }

.catalogue-hero {
  padding-block: 44px;
  text-align: left;
  border-bottom: 1px solid var(--line);
}
.catalogue-hero .eyebrow { margin-bottom: 10px; }
.catalogue-hero__content { display: flex; align-items: end; justify-content: space-between; gap: 36px; }
.catalogue-hero h1 { max-width: none; margin: 0; font-size: clamp(2.55rem,4.5vw,4rem); }
.catalogue-hero p { max-width: 460px; margin: 0 0 7px; font-size: 1rem; text-align: right; }
.catalogue-section { padding-block: 46px 100px; }
.catalogue-section .filter-bar { justify-content: flex-start; margin-bottom: 32px; }

@media (max-width: 960px) {
  .primary-nav { border: 1px solid var(--line); box-shadow: var(--shadow-lg); }
  .hero__grid { grid-template-columns: 1fr; }
  .hero-art { width: min(100%,680px); min-height: 520px; }
  .hero-art__image { height: 520px; border-radius: 90px 20px 90px 20px; }
  .product-showcase { width: min(100%,680px); min-height: 540px; margin-inline: auto; }
  .guilt-free-grid, .smart-swap__grid { grid-template-columns: 1fr 1fr; gap: 34px; }
  .pack-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .pack-card:last-child { grid-column: 1 / -1; width: calc(50% - 11px); margin-inline: auto; }
  .magic-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .retail-soon__inner { align-items: flex-start; flex-direction: column; }
  .generation-grid, .time-grid { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
  .hero { padding-top: 48px; }
  .hero h1 { font-size: clamp(2.75rem,13vw,3.65rem); line-height: 1.04; }
  .hero-art { min-height: 430px; }
  .hero-art__image { height: 430px; border-radius: 62px 16px 62px 16px; object-position: 50% 70%; }
  .hero-art__caption { right: 14px; bottom: 14px; width: calc(100% - 28px); }
  .story-visual { min-height: 390px; }
  .about-intro__image, .about-intro__image img { min-height: 430px; max-height: 520px; }
  .footer-bottom p:last-child { max-width: 320px; }
  .catalogue-hero { padding-block: 24px 22px; }
  .catalogue-hero .eyebrow { margin-bottom: 7px; }
  .catalogue-hero__content { display: block; }
  .catalogue-hero h1 { font-size: 2.45rem; }
  .catalogue-hero p { margin: 5px 0 0; font-size: .9rem; line-height: 1.45; text-align: left; }
  .catalogue-section { padding-block: 22px 70px; }
  .catalogue-section .filter-bar {
    width: calc(100% + 14px);
    max-width: none;
    justify-content: flex-start;
    flex-wrap: nowrap;
    gap: 8px;
    margin: 0 -14px 22px 0;
    padding: 2px 14px 8px 0;
    overflow-x: auto;
    scrollbar-width: none;
    scroll-snap-type: x proximity;
  }
  .catalogue-section .filter-bar::-webkit-scrollbar { display: none; }
  .catalogue-section .filter-button { flex: 0 0 auto; min-height: 42px; padding: 8px 15px; scroll-snap-align: start; }
  .document-hero { padding-block: 38px 32px; }
  .document-hero .hero__grid { gap: 24px; }
  .document-hero h1 { margin-bottom: 15px; font-size: clamp(2.5rem,12vw,3.2rem); }
  .document-hero .hero__copy > p { font-size: .98rem; }
  .document-hero .hero__actions { margin-top: 22px; }
  .document-hero .hero__actions .button { flex: 1 1 100%; }
  .rotating-flavour { width: 100%; justify-content: space-between; }
  .rotating-flavour strong { min-width: 0; text-align: right; }
  .product-showcase { min-height: 390px; }
  .product-showcase__slide { bottom: 36px; }
  .product-showcase__slide img { height: 330px; max-width: 75%; }
  .product-showcase__slide > span { left: 5%; top: 9%; }
  .product-showcase__slide > strong { right: 4%; bottom: 9%; max-width: 170px; padding: 9px 12px; font-size: .85rem; }
  .guilt-free-grid, .smart-swap__grid { grid-template-columns: 1fr; gap: 28px; }
  .guilt-free-grid img, .smart-swap__grid img { height: 360px; }
  .pack-grid { grid-template-columns: 1fr; }
  .pack-card:last-child { grid-column: auto; width: 100%; }
  .pack-card__visual { height: 285px; }
  .magic-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .magic-grid article { min-height: 145px; padding: 18px 10px; }
  .retail-logos { width: 100%; flex-direction: column; }
  .retail-logos > span { width: 100%; }
  .about-doc-hero { padding-block: 42px; }
  .about-doc-hero h1 { font-size: 2.55rem; }
  .generation-grid article { padding: 24px; }
  .purpose-grid { grid-template-columns: 1fr; }
  .purpose-grid article, .purpose-grid article + article { border-radius: 22px; }
  .purpose-grid article + article { margin-top: 12px; }
}

/* PDF-matched homepage */
:root {
  --font-hand: "Bradley Hand ITC", "Bradley Hand", "Kalam", "Segoe Print", cursive;
}

.document-home,
.document-home button,
.document-home .button {
  font-family: var(--font-hand);
}

.document-home h1,
.document-home h2,
.document-home h3,
.document-home .product-showcase__slide > strong,
.document-home .pack-card__body > span {
  font-family: var(--font-hand);
  font-weight: 600;
  letter-spacing: 0;
}

.document-home p {
  color: #292b27;
  font-size: 1.18rem;
  line-height: 1.62;
}

.document-home .section {
  padding-block: clamp(76px, 8vw, 112px);
}

.document-home .section-heading {
  margin-bottom: 48px;
}

.document-home .section-heading h2 {
  margin-bottom: 15px;
  color: #151b18;
  font-size: clamp(2.35rem, 4.8vw, 4.4rem);
  line-height: 1.12;
}

.document-home .section-heading p {
  font-size: clamp(1.15rem, 2vw, 1.45rem);
}

.document-home .button {
  min-height: 54px;
  padding-inline: 25px;
  font-size: 1.06rem;
  font-weight: 600;
}

.document-home .document-hero {
  padding-block: clamp(66px, 8vw, 112px);
  background:
    radial-gradient(circle at 88% 13%, rgba(244,189,47,.24), transparent 27%),
    linear-gradient(180deg, #fffefa 0%, #fff7e4 100%);
}

.document-home .document-hero .hero__grid {
  grid-template-columns: minmax(0, 1.04fr) minmax(410px, .96fr);
  grid-template-areas: "copy slider";
  align-items: start;
  gap: clamp(54px, 7vw, 104px);
}

.document-home .document-hero .hero__copy { grid-area: copy; }
.document-home .document-hero .product-showcase { grid-area: slider; }

.document-home .document-hero h1 {
  max-width: 720px;
  margin-bottom: 28px;
  color: #111814;
  font-size: clamp(3.35rem, 6.3vw, 6.25rem);
  font-weight: 600;
  line-height: 1.08;
}

.document-home .document-hero h1 em {
  color: #075f55;
  font-style: normal;
}

.document-home .document-hero .hero__copy > p {
  max-width: 660px;
  margin-bottom: 24px;
  color: #282d29;
  font-size: clamp(1.25rem, 2vw, 1.58rem);
  line-height: 1.55;
}

.document-home .rotating-flavour {
  margin-top: 4px;
  padding: 11px 17px;
  color: #122f29;
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(7,95,85,.22);
  border-radius: 13px;
  box-shadow: none;
}

.document-home .rotating-flavour span {
  color: #50625c;
  font-family: var(--font-body);
  font-size: .68rem;
}

.document-home .rotating-flavour strong {
  font-size: 1.1rem;
  font-weight: 600;
}

.hero-flavour-list {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  padding: 0;
  margin: 20px 0 0;
  list-style: none;
}

.hero-flavour-list li {
  padding: 7px 12px;
  color: #163c34;
  background: #fff;
  border: 1px solid rgba(7,95,85,.17);
  border-radius: 10px;
  font-size: 1.02rem;
  line-height: 1.3;
}

.document-home .document-hero .hero__actions {
  margin: 30px 0 0;
}

.document-home .product-showcase {
  min-height: 610px;
}

.document-home .product-showcase::before {
  inset: 4% 2% 8%;
  background: linear-gradient(145deg, #ffdc77, #f29a6c);
  border-radius: 48% 52% 46% 54% / 42% 43% 57% 58%;
  box-shadow: 0 28px 75px rgba(91,60,27,.14);
}

.document-home .product-showcase__slide > span {
  font-family: var(--font-body);
}

.document-home .product-showcase__slide > strong {
  padding: 12px 18px;
  border: 1px solid rgba(7,95,85,.12);
  font-size: 1.2rem;
  box-shadow: 0 12px 28px rgba(3,60,55,.12);
}

.document-home .guilt-free-section {
  background: #fff;
}

.document-home .guilt-free-grid {
  grid-template-columns: minmax(0, 1fr) minmax(400px, .9fr);
  gap: clamp(55px, 8vw, 110px);
}

.document-home .guilt-free-grid h2 {
  margin-bottom: 28px;
  color: #111814;
  font-size: clamp(2.4rem, 4.8vw, 4.5rem);
  line-height: 1.12;
  text-transform: uppercase;
}

.document-home .guilt-free-grid p {
  max-width: 680px;
  margin-bottom: 19px;
  color: #2a302c;
  font-size: clamp(1.15rem, 1.7vw, 1.38rem);
}

.document-home .guilt-free-grid img {
  height: 580px;
  /* border-radius: 50% 50% 24px 24px; */
  box-shadow: 0 22px 55px rgba(54,38,22,.17);
}

.document-home .build-pack-section {
  background: #fff7e4;
}

.document-home .pack-grid {
  gap: 25px;
}

.document-home .pack-card {
  background: #fffefa;
  border-color: rgba(7,95,85,.2);
  border-radius: 18px;
  box-shadow: 0 13px 34px rgba(49,55,41,.07);
}

.document-home .pack-card__body > span {
  color: #075f55;
  font-size: 1.14rem;
  letter-spacing: 0;
  text-transform: none;
}

.document-home .pack-card h3 {
  margin-top: 4px;
  font-size: 1.65rem;
}

.document-home .pack-price,
.document-home .pack-price-soon,
.document-home .pack-price strong,
.document-home .pack-price del,
.document-home .pack-price small {
  font-family: var(--font-body);
}

.document-home .magic-section {
  color: #121815;
  background: #fff;
}

.document-home .magic-section .section-heading h2 {
  color: #121815;
  text-transform: uppercase;
}

.magic-orbit {
  position: relative;
  min-height: 620px;
  max-width: 1050px;
  margin-inline: auto;
}

.magic-orbit__bowl {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 310px;
  height: 310px;
  padding: 2px;
  overflow: hidden;
  background: #f4bd2f;
  border: 2px solid #075f55;
  border-radius: 50%;
  box-shadow: 0 20px 44px rgba(3,60,55,.15);
  transform: translate(-50%, -50%);
}

.magic-orbit__bowl img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.magic-benefit {
  position: absolute;
  display: grid;
  width: 260px;
  min-height: 102px;
  padding: 20px 24px;
  place-items: center;
  color: #102f28;
  background: #fffdf7;
  border: 2px solid #173f35;
  border-radius: 14px;
  box-shadow: 7px 8px 0 rgba(244,189,47,.6);
  text-align: center;
}

.magic-benefit strong {
  font-size: clamp(1.35rem, 2.2vw, 1.8rem);
  font-weight: 600;
  line-height: 1.2;
}

.magic-benefit--protein { top: 15%; left: 0; }
.magic-benefit--fibre { bottom: 15%; left: 4%; }
.magic-benefit--cholesterol { top: 13%; right: 0; }
.magic-benefit--gluten { right: 4%; bottom: 16%; }
.magic-benefit--palm { bottom: 0; left: 50%; transform: translateX(-50%); }

.document-home .retail-soon {
  padding-block: 70px;
  color: #132e28;
  background: #f4bd2f;
  border-top: 0;
}

.document-home .retail-soon h2 {
  margin: 0;
  color: #132e28;
  font-size: clamp(2.15rem, 4vw, 3.6rem);
  font-weight: 600;
}

.document-home .retail-logos > span {
  font-family: var(--font-body);
  border: 1px solid rgba(7,95,85,.12);
  box-shadow: 0 8px 22px rgba(66,49,14,.09);
}

.home-company-note {
  padding-block: 44px;
  color: #fff;
  background: #075f55;
}

.home-company-note__inner {
  display: flex;
  align-items: baseline;
  justify-content: center;
  flex-wrap: wrap;
  gap: 5px 12px;
  text-align: center;
}

.home-company-note strong,
.home-company-note p {
  margin: 0;
  color: #fff;
  font-size: clamp(1.12rem, 2vw, 1.4rem);
}

.home-company-note p:last-child {
  flex-basis: 100%;
  color: #d7e7e2;
  font-size: 1rem;
}

@media (max-width: 960px) {
  .document-home .document-hero .hero__grid {
    grid-template-columns: 1fr;
    grid-template-areas: "slider" "copy";
  }

  .document-home .document-hero .hero__copy {
    max-width: 760px;
  }

  .document-home .guilt-free-grid {
    grid-template-columns: 1fr 1fr;
    gap: 38px;
  }

  .magic-orbit {
    min-height: 560px;
  }

  .magic-orbit__bowl {
    width: 260px;
    height: 260px;
  }

  .magic-benefit {
    width: 220px;
    min-height: 90px;
    padding: 16px 18px;
  }
}

@media (max-width: 680px) {
  .document-home p {
    font-size: 1.08rem;
  }

  .document-home .document-hero {
    padding-block: 50px 38px;
  }

  .document-home .document-hero h1 {
    font-size: clamp(3rem, 15vw, 4.25rem);
  }

  .document-home .document-hero .hero__copy > p {
    font-size: 1.18rem;
  }

  .hero-flavour-list li {
    flex: 1 1 calc(50% - 9px);
    text-align: center;
  }

  .document-home .product-showcase {
    min-height: 410px;
  }

  .document-home .guilt-free-grid {
    grid-template-columns: 1fr;
  }

  .document-home .guilt-free-grid img {
    height: 390px;
    border-radius: 90px 20px 90px 20px;
  }

  .document-home .section-heading h2,
  .document-home .guilt-free-grid h2 {
    font-size: clamp(2.25rem, 11vw, 3.25rem);
  }

  .magic-orbit {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    min-height: 0;
    gap: 14px;
  }

  .magic-orbit__bowl,
  .magic-benefit {
    position: static;
    width: auto;
    transform: none;
  }

  .magic-orbit__bowl {
    order: -1;
    grid-column: 1 / -1;
    width: 220px;
    height: 220px;
    margin: 0 auto 10px;
  }

  .magic-benefit {
    min-height: 108px;
    padding: 15px 10px;
    box-shadow: 4px 5px 0 rgba(244,189,47,.6);
  }

  .magic-benefit--palm {
    grid-column: 1 / -1;
    width: calc(50% - 7px);
    margin-inline: auto;
  }

  .document-home .retail-soon {
    padding-block: 52px;
  }
}

/* PDF-matched About page */
.document-about,
.document-about button,
.document-about .button {
  font-family: var(--font-hand);
}

.document-about {
  color: #141916;
  background: #fffefa;
}

.document-about h1,
.document-about h2,
.document-about h3,
.document-about strong {
  font-family: var(--font-hand);
  font-weight: 600;
  letter-spacing: 0;
}

.document-about h2 {
  color: #111512;
  font-size: clamp(2.3rem, 4.6vw, 4.25rem);
  line-height: 1.12;
  text-transform: uppercase;
}

.document-about h3 {
  color: #132d27;
}

.document-about p {
  color: #292d29;
  font-size: clamp(1.18rem, 1.75vw, 1.42rem);
  line-height: 1.6;
}

.document-about .section {
  padding-block: clamp(76px, 8vw, 112px);
}

.document-about .section-heading {
  max-width: 960px;
  margin: 0 0 46px;
  text-align: left;
}

.document-about .section-heading h2 {
  margin-bottom: 20px;
}

.document-about .section-heading p {
  max-width: 860px;
  margin-bottom: 13px;
  font-size: clamp(1.16rem, 1.8vw, 1.4rem);
}

.about-document-intro {
  padding-block: clamp(80px, 10vw, 142px);
  background:
    linear-gradient(90deg, rgba(244,189,47,.13) 1px, transparent 1px),
    linear-gradient(rgba(244,189,47,.13) 1px, transparent 1px),
    #fffefa;
  background-size: 44px 44px;
  border-bottom: 1px solid rgba(7,95,85,.13);
}

.about-document-intro__inner {
  max-width: 920px;
  margin-left: max(0px, calc((100% - 1180px) / 2));
}

.about-document-intro h1 {
  margin-bottom: 35px;
  color: #111512;
  font-size: clamp(3.4rem, 7vw, 6rem);
  line-height: 1.06;
}

.about-document-intro p {
  max-width: 900px;
  margin-bottom: 18px;
  font-size: clamp(1.3rem, 2.25vw, 1.72rem);
  line-height: 1.58;
}

.document-about .about-swap {
  background: #fff6df;
}

.about-swap__visual {
  position: relative;
  width: min(100%, 980px);
  height: 500px;
  margin-bottom: 48px;
  overflow: hidden;
  background: #e8d4b8;
  border: 2px solid #173f35;
  border-radius: 18px;
  box-shadow: 9px 10px 0 rgba(244,189,47,.75);
}

.about-swap__visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 60%;
}

.about-swap__question {
  position: absolute;
  bottom: 28px;
  left: 28px;
  width: min(580px, calc(100% - 56px));
  padding: 17px 22px;
  margin: 0;
  color: #143a31!important;
  background: rgba(255,254,250,.95);
  border: 2px solid #173f35;
  border-radius: 16px 16px 16px 3px;
  box-shadow: 5px 6px 0 rgba(23,63,53,.18);
  font-size: clamp(1.35rem, 2.3vw, 1.9rem)!important;
  font-weight: 600;
  line-height: 1.3!important;
}

.about-swap__copy {
  max-width: 900px;
}

.about-swap__copy p {
  margin-bottom: 16px;
}

.document-about .about-generation {
  background: #fffefa;
}

.document-about .generation-grid {
  gap: 26px;
}

.document-about .generation-grid article {
  min-height: 260px;
  padding: 32px;
  border: 2px solid #173f35;
  border-radius: 17px;
  box-shadow: 7px 8px 0 rgba(23,63,53,.13);
}

.document-about .generation-grid article:nth-child(1) {
  background: #fff0b9;
  transform: rotate(-1deg);
}

.document-about .generation-grid article:nth-child(2) {
  background: #d9efe8;
  transform: translateY(12px) rotate(.8deg);
}

.document-about .generation-grid article:nth-child(3) {
  background: #ffe0d5;
  transform: rotate(-.6deg);
}

.document-about .generation-grid article > span {
  color: #075f55;
  font-size: 2.55rem;
}

.document-about .generation-grid h3 {
  margin: 23px 0 7px;
  font-size: 2rem;
}

.document-about .generation-grid strong {
  color: #174c40;
  font-size: 1.32rem;
  line-height: 1.35;
}

.document-about .about-times {
  background: #fff6df;
}

.document-about .time-grid {
  gap: 20px;
}

.document-about .time-grid article {
  min-height: 170px;
  gap: 20px;
  padding: 28px;
  background: #fffefa;
  border: 2px solid #173f35;
  border-radius: 15px;
  box-shadow: 6px 7px 0 rgba(244,189,47,.7);
}

.document-about .time-grid i {
  flex-basis: 62px;
  height: 62px;
  color: #fff;
  background: #075f55;
  font-family: var(--font-body);
  font-size: .86rem;
}

.document-about .time-grid h3 {
  margin: 2px 0 8px;
  font-size: 1.62rem;
}

.document-about .time-grid p {
  color: #303632;
  font-size: 1.08rem;
  line-height: 1.45;
}

.document-about .about-why {
  background: #fffefa;
}

.document-about .about-why .values-grid {
  grid-template-columns: 1fr;
  max-width: 920px;
  gap: 16px;
}

.document-about .about-why .value-card {
  display: grid;
  grid-template-columns: 62px 1fr;
  align-items: center;
  gap: 23px;
  padding: 24px 28px;
  background: transparent;
  border: 0;
  border-bottom: 2px solid rgba(23,63,53,.24);
  border-radius: 0;
  box-shadow: none;
}

.document-about .about-why .value-card span {
  width: 58px;
  height: 58px;
  margin: 0;
  color: #173f35;
  background: #f4bd2f;
  font-family: var(--font-hand);
  font-size: 1.45rem;
}

.document-about .about-why .value-card h3 {
  margin: 0 0 4px;
  font-size: 1.72rem;
}

.document-about .about-why .value-card p {
  margin: 0;
  font-size: 1.2rem;
}

.document-about .about-purpose {
  padding-top: 20px;
  background: #fffefa;
}

.document-about .about-purpose .purpose-grid {
  grid-template-columns: 1fr;
  max-width: 980px;
  gap: 0;
}

.document-about .about-purpose .purpose-grid article,
.document-about .about-purpose .purpose-grid article + article {
  padding: clamp(42px, 6vw, 72px) 0 clamp(42px, 6vw, 72px) clamp(30px, 4vw, 54px);
  color: #202622;
  background: transparent;
  border-left: 7px solid #f4bd2f;
  border-radius: 0;
}

.document-about .about-purpose .purpose-grid article + article {
  margin-top: 0;
  border-top: 1px solid rgba(23,63,53,.18);
  border-left-color: #075f55;
}

.document-about .about-purpose .purpose-grid h2,
.document-about .about-purpose .purpose-grid article + article h2 {
  margin: 0 0 22px;
  color: #111512;
  font-size: clamp(2.4rem, 4.6vw, 4.2rem);
  text-transform: uppercase;
}

.document-about .about-purpose .purpose-grid p {
  max-width: 840px;
  margin: 0;
  color: #292d29;
  font-size: clamp(1.25rem, 2vw, 1.55rem);
}

@media (max-width: 960px) {
  .about-document-intro__inner {
    margin-inline: auto;
  }

  .document-about .generation-grid,
  .document-about .time-grid {
    grid-template-columns: 1fr;
  }

  .document-about .generation-grid article,
  .document-about .generation-grid article:nth-child(2) {
    min-height: 0;
    transform: none;
  }

  .document-about .time-grid article {
    min-height: 0;
  }
}

@media (max-width: 680px) {
  .about-document-intro {
    padding-block: 62px 72px;
    background-size: 32px 32px;
  }

  .about-document-intro h1 {
    margin-bottom: 26px;
    font-size: 3.45rem;
  }

  .about-document-intro p,
  .document-about p {
    font-size: 1.14rem;
  }

  .document-about h2 {
    font-size: clamp(2.2rem, 11vw, 3.15rem);
  }

  .about-swap__visual {
    height: 430px;
    margin-bottom: 40px;
    box-shadow: 5px 6px 0 rgba(244,189,47,.75);
  }

  .about-swap__question {
    bottom: 18px;
    left: 18px;
    width: calc(100% - 36px);
    padding: 14px 16px;
    font-size: 1.3rem!important;
  }

  .document-about .generation-grid article {
    padding: 27px;
  }

  .document-about .about-why .value-card {
    grid-template-columns: 52px 1fr;
    gap: 15px;
    padding: 20px 0;
  }

  .document-about .about-why .value-card span {
    width: 48px;
    height: 48px;
    font-size: 1.18rem;
  }

  .document-about .about-purpose .purpose-grid article,
  .document-about .about-purpose .purpose-grid article + article {
    padding: 40px 0 40px 24px;
  }
}

/* White, black and warm-orange site palette */
:root {
  --forest: #111111;
  --forest-deep: #000000;
  --leaf: #df651f;
  --lime: #f2b735;
  --cream: #ffffff;
  --paper: #ffffff;
  --peach: #ef8750;
  --amber: #f2b735;
  --ink: #111111;
  --muted: #5b5b5b;
  --line: #dedede;
  --shadow-sm: 0 12px 30px rgba(0,0,0,.09);
  --shadow-lg: 0 24px 64px rgba(0,0,0,.14);
}

html,
body,
.document-home,
.document-about {
  color: #111111;
  background: #ffffff;
}

body p,
.document-home p,
.document-about p {
  color: #505050;
  text-wrap: pretty;
}

h1,
h2,
h3,
.section-heading h2,
.page-hero h1,
.product-detail__copy h1,
.story-copy h2,
.document-home .section-heading h2,
.document-about h2,
.document-about h3 {
  color: #111111;
}

.announcement {
  color: #ffffff;
  background: #111111;
  border-bottom-color: #111111;
}

.announcement p,
.announcement a {
  color: #ffffff;
}

.site-header {
  color: #111111;
  background: rgba(255,255,255,.98);
  border-bottom: 1px solid #d9d9d9;
}

.brand__mark {
  background: #111111;
}

.brand__mark span {
  background: #ffffff;
}

.brand__text strong,
.brand__text small,
.primary-nav > a:not(.button),
.primary-nav > a.is-active {
  color: #111111;
}

.primary-nav > a:not(.button)::after,
.menu-toggle > span:not(.sr-only) {
  background: #111111;
}

.menu-toggle {
  background: #f3f3f3;
}

.primary-nav {
  background: #ffffff;
  border-color: #dedede;
}

.nav-cta,
.button--primary {
  color: #ffffff;
  background: #111111;
  border-color: #111111;
}

.nav-cta:hover,
.button--primary:hover {
  color: #ffffff;
  background: #df651f;
  border-color: #df651f;
}

.button--secondary,
.button--cream {
  color: #111111;
  background: #ffffff;
  border-color: #111111;
}

.button--secondary:hover,
.button--cream:hover {
  color: #111111;
  background: #fff2e9;
}

.eyebrow,
.product-card__meta,
.pack-card__body > span,
.text-link,
.instagram-card__footer a {
  color: #df651f;
}

.eyebrow::before {
  background: #df651f;
}

.hero,
.page-hero,
.section--cream,
.document-home .document-hero,
.document-home .guilt-free-section,
.document-home .build-pack-section,
.document-home .magic-section,
.document-about .about-swap,
.document-about .about-generation,
.document-about .about-times,
.document-about .about-why,
.document-about .about-purpose,
.about-document-intro {
  background: #ffffff;
}

.document-home .document-hero h1,
.document-home .guilt-free-grid h2,
.document-home .magic-section .section-heading h2,
.document-about h1,
.document-about h2,
.document-about .about-purpose .purpose-grid h2,
.document-about .about-purpose .purpose-grid article + article h2 {
  color: #111111;
}

.document-home .document-hero h1 em {
  color: #df651f;
}

.document-home .product-showcase::before {
  background: #f2b735;
  box-shadow: 0 28px 75px rgba(0,0,0,.12);
}

.document-home .product-showcase::after {
  border-color: rgba(0,0,0,.12);
  box-shadow: 0 0 0 32px rgba(0,0,0,.025), 0 0 0 64px rgba(0,0,0,.018);
}

.product-showcase__slide,
.document-home .rotating-flavour,
.hero-flavour-list li {
  color: #111111;
}

.product-showcase__slide > span,
.product-showcase__dots button[aria-current="true"] {
  background: #111111;
}

.product-showcase__dots button {
  background: rgba(0,0,0,.22);
}

.document-home .rotating-flavour,
.hero-flavour-list li,
.document-home .pack-card,
.product-card,
.value-card,
.contact-form,
.map-embed {
  background: #ffffff;
  border-color: #dedede;
}

.pack-card__visual,
.pack-card:nth-child(2) .pack-card__visual,
.pack-card:nth-child(3) .pack-card__visual {
  background: #fff1e7;
}

.pack-card:nth-child(2) .pack-card__visual { background: #fff7df; }
.pack-card:nth-child(3) .pack-card__visual { background: #ffe9dc; }

.document-home .pack-card__body > span,
.document-home .pack-price strong {
  color: #df651f;
}

.magic-orbit__bowl {
  background: #f2b735;
  border-color: #111111;
}

.magic-benefit {
  color: #111111;
  background: #ffffff;
  border-color: #111111;
}

.document-home .retail-soon {
  color: #111111;
  background: #f2b735;
}

.document-home .retail-soon h2 {
  color: #111111;
}

.home-company-note,
.trust-strip,
.section--forest,
.flavour-banner,
.contact-info,
.site-footer {
  color: #ffffff;
  background: #111111;
}

.home-company-note strong,
.home-company-note p,
.flavour-banner h2,
.contact-info h2,
.site-footer h2,
.site-footer h3 {
  color: #ffffff;
}

.document-about .generation-grid article,
.document-about .time-grid article,
.about-swap__visual {
  border-color: #111111;
}

.document-about .generation-grid article:nth-child(1) { background: #fff3cf; }
.document-about .generation-grid article:nth-child(2) { background: #fff0e6; }
.document-about .generation-grid article:nth-child(3) { background: #ffe5dc; }

.document-about .generation-grid article > span,
.document-about .generation-grid strong {
  color: #df651f;
}

.document-about .time-grid i {
  color: #ffffff;
  background: #111111;
}

.about-swap__question {
  color: #111111!important;
  background: rgba(255,255,255,.96);
  border-color: #111111;
}

.document-about .about-why .value-card span {
  color: #111111;
  background: #f2b735;
}

.document-about .about-purpose .purpose-grid article {
  border-left-color: #f2b735;
}

.document-about .about-purpose .purpose-grid article + article {
  border-left-color: #111111;
}

.filter-button {
  color: #111111;
  background: #ffffff;
  border-color: #111111;
}

.filter-button[aria-pressed="true"] {
  color: #ffffff;
  background: #111111;
  border-color: #111111;
}

.field label,
.product-detail__fact strong,
.marketplace-purchase > strong,
.product-share > strong {
  color: #111111;
}

.field input:focus,
.field textarea:focus,
.field select:focus {
  border-color: #df651f;
  box-shadow: 0 0 0 3px rgba(223,101,31,.14);
}

.product-card__badge,
.value-card span,
.story-point i,
.contact-list i {
  color: #111111;
  background: #f2b735;
}

.footer-card {
  color: #ffffff;
  background: #1b1b1b;
  border-color: #f2b735;
}

.brand--footer .brand__mark {
  background: #ffffff;
}

.brand--footer .brand__mark span {
  background: #111111;
}

.brand--footer .brand__text strong,
.brand--footer .brand__text small {
  color: #ffffff;
}

.footer-brand p,
.footer-grid a,
.footer-grid span,
.footer-bottom p,
.footer-company {
  color: #bdbdbd!important;
}

.footer-grid a:hover,
.photo-credit {
  color: #f2b735!important;
}

.social-links a {
  color: #111111;
  background: #ffffff;
}

.whatsapp-trigger,
.whatsapp-panel__header,
.whatsapp-panel__form button,
.button--whatsapp,
.product-share__link--whatsapp {
  color: #ffffff;
  background: #111111;
}

.whatsapp-avatar {
  color: #111111;
  background: #f2b735;
}

.whatsapp-panel__body {
  background-color: #f4f4f4;
  background-image: none;
}

.chat-bubble {
  color: #333333;
}

.chat-bubble span {
  color: #df651f;
  border-color: #df651f;
}

::selection {
  color: #111111;
  background: #f2b735;
}

/* Reference-style navigation: left menu with an independently centered logo. */
:root {
  --font-body: "Teachers", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Teachers", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-hand: "Teachers", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.hero p {
  text-align: justify;
}

.document-home .guilt-free-section {
  background: #f9ff23;
  padding-top: clamp(36px, 4vw, 56px);
}

.document-home .guilt-free-grid h2 {
  font-size: clamp(1.5rem, 3vw, 2.75rem);
  text-transform: none;
  white-space: nowrap;
}

.document-home .guilt-free-grid img {
  height: auto;
  object-fit: contain;
  object-position: center;
}

.document-home .magic-section {
  background: #d67ac6;
  padding-top: clamp(28px, 3vw, 44px);
}

.document-about .about-document-intro {
  background: #f9ff23;
}

.document-about .about-swap__visual {
  box-shadow: 10px 12px 0 #f9ff23;
}

.document-about .section-heading,
.document-about .section-heading p {
  width: 100%;
  max-width: none;
}

.document-about .about-generation {
  background: #86dbe2;
}

.document-about .generation-art {
  width: min(100%, 852px);
  aspect-ratio: 852 / 1280;
  margin-inline: auto;
  /* background-color: #ffffff; */
  background-image: url("../images/snack-for-every-generation.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.document-about .times-art {
  width: min(100%, 853px);
  aspect-ratio: 853 / 1280;
  margin-inline: auto;
  background-color: #fffaf0;
  background-image: url("../images/best-time-makhana.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.document-about .about-why {
  background: #d67ac6;
}

/* Compact section entrances across the public pages. */
.section,
.document-home .section,
.document-about .section {
  padding-top: clamp(36px, 4vw, 56px);
}

.document-home .document-hero {
  padding-top: clamp(40px, 5vw, 72px);
}

.document-about .about-document-intro {
  padding-top: clamp(44px, 5vw, 72px);
  padding-bottom: clamp(48px, 6vw, 80px);
}

.document-home .magic-section {
  padding-top: clamp(28px, 3vw, 44px);
}

.document-home .magic-section .section-heading {
  margin-bottom: 0;
}

@media (min-width: 681px) {
  .document-home .magic-orbit {
    margin-top: -70px;
  }
}

.magic-orbit__bowl {
  top: 40%;
  width: 270px;
  height: 360px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 20px;
}

.magic-orbit__bowl img {
  object-fit: contain;
  border-radius: 18px;
}

.magic-benefit {
  min-height: 64px;
  padding: 8px 12px;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.magic-benefit::after {
  position: absolute;
  z-index: 2;
  display: block;
  width: 90px;
  height: 54px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 54'%3E%3Cdefs%3E%3Cmarker id='tip' viewBox='0 0 10 10' refX='8.5' refY='5' markerWidth='6' markerHeight='6' orient='auto'%3E%3Cpath d='M0 0 L10 5 L0 10 Z' fill='%23111111'/%3E%3C/marker%3E%3C/defs%3E%3Cpath d='M4 42 C25 7 61 7 85 28' fill='none' stroke='%23111111' stroke-width='2.4' stroke-linecap='round' marker-end='url(%23tip)'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
}

.magic-benefit--protein::after,
.magic-benefit--fibre::after {
  top: 50%;
  right: -104px;
  transform: translateY(-50%) scaleX(-1);
}

.magic-benefit--cholesterol::after,
.magic-benefit--gluten::after {
  top: 50%;
  left: -104px;
  transform: translateY(-50%);
}

.magic-benefit--palm::after {
  top: -76px;
  left: 50%;
  transform: translateX(-50%) rotate(90deg);
}

.header-socials {
  display: none;
}

@media (max-width: 960px) {
  .magic-orbit__bowl {
    width: 240px;
    height: 320px;
  }
}

@media (max-width: 680px) {
  .document-about .about-swap__visual {
    box-shadow: 6px 7px 0 #f9ff23;
  }

  .document-home .magic-section .section-heading {
    margin-bottom: 20px;
  }

  .magic-orbit__bowl {
    width: min(100%, 280px);
    height: auto;
    aspect-ratio: 3 / 4;
  }

  .magic-benefit {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    text-align: left;
  }

  .magic-benefit::after,
  .magic-benefit--protein::after,
  .magic-benefit--fibre::after,
  .magic-benefit--cholesterol::after,
  .magic-benefit--gluten::after,
  .magic-benefit--palm::after {
    position: static;
    flex: 0 0 58px;
    width: 58px;
    height: 36px;
    content: "";
    transform: none;
  }
}

@media (min-width: 961px) {
  .document-about .section-heading h2 {
    font-size: clamp(2.25rem, 3.3vw, 3rem);
    white-space: nowrap;
  }

  .document-home .document-hero h1 {
    max-width: none;
    font-size: clamp(1.45rem, 2.25vw, 2rem);
    white-space: nowrap;
  }

  .site-header__inner {
    position: relative;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    min-height: 120px;
  }

  .brand {
    grid-column: 2;
    grid-row: 1;
    justify-self: center;
  }

  .brand__logo {
    max-width: 200px;
    height: 92px;
    object-position: center;
  }

  .primary-nav {
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
    gap: clamp(20px, 2vw, 38px);
  }

  .primary-nav > a:not(.button) {
    color: #111111;
    font-size: .92rem;
    font-weight: 600;
    white-space: nowrap;
  }

  .header-socials {
    display: flex;
    grid-column: 3;
    grid-row: 1;
    align-items: center;
    justify-self: end;
    gap: 9px;
  }

  .header-socials a {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    color: #ffffff;
    background: #df651f;
    border-radius: 8px;
  }

  .header-socials a:hover {
    background: #111111;
  }

  .header-socials a:focus-visible {
    outline: 3px solid #111111;
    outline-offset: 3px;
  }

  .header-socials svg {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
  }

  .header-socials .header-socials__fill {
    fill: currentColor;
    stroke: none;
  }
}