:root{--green:#073d25;--green2:#0d5534;--gold:#bd7f12;--cream:#f8f4e9;--paper:#fffdf8;--ink:#173025;--line:#d8c49b}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:Georgia,'Times New Roman',serif}a{color:inherit;text-decoration:none}.topbar{background:var(--green);color:#fff;text-align:center;font-size:.7rem;letter-spacing:.2em;padding:8px}.topbar span{color:#d6a84e;margin:0 8px}.site-header{background:#fffdf8;position:sticky;top:0;z-index:20;box-shadow:0 2px 18px #00000012}.nav-wrap{max-width:1400px;margin:auto;min-height:100px;display:flex;align-items:center;padding:8px 28px;gap:28px}.brand{width:230px;flex:none}.brand img{width:100%;display:block}.nav{display:flex;gap:34px;align-items:center;margin-left:auto;font-size:.94rem;text-transform:uppercase;letter-spacing:.08em}.nav a{padding:14px 0;border-bottom:2px solid transparent}.nav a:hover{border-color:var(--gold)}.nav-social{font-size:1.4rem;color:var(--green)}.menu-toggle{display:none;background:none;border:0;font-size:1.6rem;color:var(--green)}.hero{min-height:550px;display:grid;grid-template-columns:1fr 1fr;background:linear-gradient(110deg,#f6f1e4 0%,#fff 50%,#d7c89e 100%);overflow:hidden}.hero-copy{padding:90px clamp(30px,7vw,110px);display:flex;flex-direction:column;justify-content:center}.eyebrow{color:var(--gold);font-weight:bold;letter-spacing:.24em;font-size:.78rem;margin:0 0 15px}.hero h1{font-size:clamp(3rem,5vw,5.5rem);line-height:.98;color:var(--green);margin:0 0 24px}.hero h1 em,.story h2 em{font-style:normal;color:#7c5819}.lead{font-size:1.2rem;line-height:1.65;max-width:580px}.btn,.order-btn{display:inline-flex;align-items:center;justify-content:center;background:var(--green);color:#fff;border:1px solid var(--green);padding:15px 24px;font-size:.78rem;font-weight:bold;letter-spacing:.12em;transition:.2s}.btn{width:max-content;margin-top:15px}.btn span{margin-left:16px}.btn:hover,.order-btn:hover{background:var(--gold);border-color:var(--gold)}.hero-art{position:relative;min-height:550px;background:linear-gradient(180deg,#e4c995 0%,#c67b39 50%,#244d31 100%);display:flex;align-items:center;justify-content:center;overflow:hidden}.hero-art:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 25%,#fff7 0 10%,transparent 42%),linear-gradient(165deg,transparent 45%,#183e2a 46% 57%,#a77535 58% 64%,#254f31 65%)}.sun{position:absolute;width:170px;height:170px;border-radius:50%;background:#f6d98c;top:65px;right:16%;filter:blur(2px)}.hero-art img{position:relative;width:min(80%,570px);max-height:420px;object-fit:contain;filter:drop-shadow(0 22px 22px #0005)}.hero-art p{position:absolute;right:35px;top:28px;color:#fff;font-size:2rem;font-style:italic;transform:rotate(-5deg);text-shadow:0 2px 4px #0008}.values{display:grid;grid-template-columns:repeat(5,1fr);background:var(--green);color:#fff;padding:24px 5%;gap:0}.values div{text-align:center;border-right:1px solid #c9a35b;display:flex;flex-direction:column;gap:7px;align-items:center}.values div:last-child{border:0}.values strong{font-size:2rem;color:#e0bb68;font-weight:normal}.values span{font-size:.7rem;letter-spacing:.14em;line-height:1.45}.section{padding:70px 3%}.section-heading{text-align:center;display:flex;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap}.section-heading h2{font-size:2.3rem;color:var(--green);letter-spacing:.08em;text-transform:uppercase;margin:0}.section-heading span{width:55px;height:2px;background:var(--gold)}.section-heading p{flex-basis:100%;margin:0 0 28px;color:#6c6658}.product-group{margin-top:35px}.product-group>h3{margin:0;background:var(--green);color:#fff;text-align:center;padding:12px;border-radius:5px 5px 0 0;letter-spacing:.16em;text-transform:uppercase;font-size:1.1rem}.product-group:nth-of-type(2)>h3{background:#70401f}.split-groups{display:grid;grid-template-columns:1fr 1.65fr;gap:24px}.split-groups>div>h3{background:var(--green)}.split-groups>div:last-child>h3{background:#a47613}.grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;padding:12px;background:#f4efe3;border:1px solid #e1d7c2}.desserts{grid-template-columns:repeat(3,1fr)}.two{grid-template-columns:repeat(2,1fr)}.four{grid-template-columns:repeat(4,1fr)}.product{background:#fff;border:1px solid #e0d7c7;padding:10px;text-align:center;display:flex;flex-direction:column}.product img{width:100%;height:240px;object-fit:contain;background:#fff}.product h4{font-size:1rem;min-height:2.5em;margin:8px 2px 12px;color:var(--ink)}.product-price{margin:-6px 2px 12px;color:var(--gold);font-weight:700;font-size:.92rem;min-height:1.2em}.order-btn{margin-top:auto;padding:10px 12px;font-size:.7rem}.story{display:grid;grid-template-columns:1fr 1fr;background:var(--green);color:#fff;min-height:440px}.story-art{background:#d7c49b;display:flex;align-items:center;justify-content:center;padding:35px;overflow:hidden}.story-art img{width:90%;max-width:650px;filter:drop-shadow(0 18px 25px #0005)}.story-copy{padding:70px 8%;display:flex;flex-direction:column;justify-content:center}.story-copy h2{font-size:3rem;line-height:1.05;margin:0 0 20px}.story-copy>p:not(.eyebrow):not(.script){max-width:560px;font-size:1.1rem;line-height:1.7;color:#f3eee1}.script{font-size:2rem;font-style:italic;color:#d7b866;margin-top:20px}.order-section{padding:70px 5%;background:#f4ead6}.order-card{max-width:1000px;margin:10px auto 0;background:#fffdf8;border:1px solid var(--line);padding:35px;display:grid;grid-template-columns:1fr 1px 1fr;gap:35px;text-align:center;box-shadow:0 10px 30px #0000000d}.order-icon{font-size:2.2rem;color:var(--gold)}.order-card h3{color:var(--green);font-size:1.4rem}.order-card p{color:#665f53}.order-card a{font-size:1.2rem;color:var(--green);font-weight:bold;border-bottom:1px solid var(--gold)}.divider{background:var(--line)}.selected{text-align:center;font-style:italic;color:var(--green);min-height:1.5em}footer{background:var(--green);color:#fff}.footer-main{max-width:1400px;margin:auto;padding:50px 5%;display:grid;grid-template-columns:1.3fr 1fr 1.5fr 1.2fr;gap:40px;align-items:start}.footer-main>img{width:220px;filter:drop-shadow(0 5px 6px #0004)}.footer-main h4{color:#d8b463;letter-spacing:.15em;margin-top:0}.footer-main div{display:flex;flex-direction:column;gap:10px}.footer-main a:hover{color:#e1bd6b}.footer-main span{color:#ddd7c9}.footer-tag{text-align:right!important;align-items:flex-end}.footer-tag p{font-size:2rem;font-style:italic;margin:0}.footer-tag em{color:#d9b661}.footer-tag small{letter-spacing:.15em;color:#d9b661}.copyright{border-top:1px solid #ffffff35;max-width:1400px;margin:auto;padding:18px 5%;font-size:.8rem;color:#d9d3c5;display:flex;justify-content:space-between}.copyright span{color:#e0bb68}
@media(max-width:1050px){.nav{gap:18px;font-size:.8rem}.brand{width:190px}.grid{grid-template-columns:repeat(3,1fr)}.split-groups{grid-template-columns:1fr}.four{grid-template-columns:repeat(4,1fr)}.footer-main{grid-template-columns:1fr 1fr}.footer-tag{text-align:left!important;align-items:flex-start}.hero-copy{padding:60px 5%}}
@media(max-width:720px){.topbar{font-size:.55rem}.nav-wrap{min-height:75px;padding:5px 15px}.brand{width:165px}.menu-toggle{display:block;margin-left:auto}.nav{display:none;position:absolute;left:0;right:0;top:75px;background:#fffdf8;padding:18px 25px;flex-direction:column;align-items:flex-start;box-shadow:0 10px 20px #0002}.nav.open{display:flex}.nav-social{display:none}.hero{grid-template-columns:1fr}.hero-copy{padding:55px 25px}.hero h1{font-size:3rem}.hero-art{min-height:330px}.hero-art img{width:75%;max-height:270px}.hero-art p{font-size:1.4rem;right:15px}.values{grid-template-columns:repeat(2,1fr);gap:15px}.values div{border:0}.values div:last-child{grid-column:1/-1}.section{padding:50px 15px}.section-heading h2{font-size:1.7rem}.grid,.desserts,.two,.four{grid-template-columns:repeat(2,1fr)}.product img{height:220px}.story{grid-template-columns:1fr}.story-art{min-height:300px}.story-copy{padding:50px 25px}.story-copy h2{font-size:2.5rem}.order-card{grid-template-columns:1fr;gap:20px}.divider{height:1px;width:100%}.footer-main{grid-template-columns:1fr;padding:40px 25px}.footer-tag{text-align:left!important}.copyright{flex-direction:column;gap:8px;padding:18px 25px}}
@media(max-width:430px){.grid,.desserts,.two,.four{grid-template-columns:1fr}.product img{height:300px}.values span{font-size:.6rem}}


/* Additional products */
.additional-products { margin-top: 2rem; }
.grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.text-product { display:flex; flex-direction:column; justify-content:space-between; min-height: 320px; }
.product-placeholder { height: 190px; display:grid; place-items:center; font-size: 5rem; background: linear-gradient(135deg, #f5f0e2, #fffdf8); border: 1px solid rgba(166,122,34,.35); color:#0b3f2a; }
.text-product h4 { min-height: 3rem; display:flex; align-items:center; justify-content:center; text-align:center; }
.topbar { white-space: normal; text-align:center; padding: .65rem 1rem; line-height:1.35; }
@media (max-width: 800px) { .grid.three { grid-template-columns: 1fr; } .text-product { min-height: 280px; } .product-placeholder { height: 150px; } }

/* Final heading colour adjustment */
.split-groups > div:first-child > h3, .split-groups > div:last-child > h3 { color: #fff; }

/* Online ordering */
.online-order{display:grid;grid-template-columns:1fr 1fr;gap:28px;max-width:1100px;margin:0 auto}
.order-summary-panel,.order-form{background:#fff;border:1px solid rgba(38,65,44,.14);border-radius:14px;padding:28px;box-shadow:0 10px 28px rgba(30,45,32,.06)}
.order-summary-panel h3,.order-form h3{margin-top:0;color:#26412c}
.muted,.form-note{color:#68736b;font-size:.92rem}
.cart-items{margin:20px 0;border-top:1px solid #e4e8e4}
.empty-cart{padding:20px 0;color:#78827a}
.cart-row{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid #e4e8e4}
.cart-name{font-weight:600;color:#29392d}.qty-control{display:flex;align-items:center;gap:8px}.qty-control button{width:30px;height:30px;border:1px solid #cdd5ce;background:#f7f8f7;border-radius:50%;cursor:pointer}.qty-control input{width:48px;text-align:center;border:1px solid #cdd5ce;border-radius:6px;padding:7px}
.remove-item{border:0;background:transparent;color:#7b5d2a;cursor:pointer;font-size:.82rem}
.cart-actions{display:flex;gap:10px;flex-wrap:wrap}.btn.secondary,.whatsapp-order{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border:1px solid #36563e;background:#fff;color:#36563e;padding:11px 16px;border-radius:5px;cursor:pointer;font-weight:600}.whatsapp-order:disabled{cursor:not-allowed}.whatsapp-order{background:#36563e;color:#fff}
.order-form{display:grid;gap:13px}.order-form label{display:grid;gap:6px;font-size:.88rem;font-weight:600;color:#405047}.order-form input,.order-form select,.order-form textarea{font:inherit;padding:11px 12px;border:1px solid #ccd5ce;border-radius:6px;background:#fff;color:#253329}.order-form textarea{resize:vertical}.submit-order{width:100%;border:0;cursor:pointer}.honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;opacity:0!important}.order-message{display:none;padding:13px;border-radius:7px;font-size:.92rem}.order-message.show{display:block}.order-message.success{background:#edf5ee;color:#315b3a}.order-message.error{background:#f9eded;color:#8b3d3d}
.order-btn.added{opacity:.65}.order-btn.added::after{content:' ✓'}
@media(max-width:800px){.online-order{grid-template-columns:1fr}.cart-row{grid-template-columns:1fr auto}.remove-item{grid-column:1/-1;text-align:left}}

/* Product picker - stable flex layout */
.quick-add{
  display:flex !important;
  flex-direction:row !important;
  align-items:flex-end !important;
  gap:20px !important;
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
  margin:18px 0 24px !important;
  padding:24px !important;
  background:#f7f3e9 !important;
  border:1px solid #e4dac5 !important;
  border-radius:10px !important;
  overflow:visible !important;
}
.quick-add .quick-add-field{
  display:flex !important;
  flex-direction:column !important;
  flex:0 0 auto !important;
  gap:8px !important;
  min-width:0 !important;
  width:auto !important;
  box-sizing:border-box !important;
  margin:0 !important;
  position:relative !important;
}
.quick-add .product-field{flex:1 1 auto !important;}
.quick-add .quantity-field{flex:0 0 150px !important; width:150px !important;}
.quick-add .quick-add-field label{
  display:block !important;
  position:static !important;
  width:auto !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
  font-family:Georgia,'Times New Roman',serif !important;
  font-size:1.15rem !important;
  line-height:1.2 !important;
  font-weight:700 !important;
  color:#405047 !important;
  white-space:nowrap !important;
}
.quick-add .quick-add-field select,
.quick-add .quick-add-field input{
  display:block !important;
  position:static !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  height:56px !important;
  min-height:56px !important;
  box-sizing:border-box !important;
  margin:0 !important;
  padding:10px 14px !important;
  font-family:Georgia,'Times New Roman',serif !important;
  font-size:1.05rem !important;
  line-height:1.2 !important;
  border:1px solid #ccd5ce !important;
  border-radius:8px !important;
  background:#fff !important;
  color:#253329 !important;
}
.quick-add .product-field select{overflow:hidden !important;text-overflow:ellipsis !important;white-space:nowrap !important;}
.quick-add .add-product-btn{
  flex:0 0 300px !important;
  width:300px !important;
  min-width:300px !important;
  max-width:300px !important;
  height:56px !important;
  min-height:56px !important;
  margin:0 !important;
  white-space:nowrap !important;
  box-sizing:border-box !important;
}
@media (max-width:899px){
  .quick-add{display:grid !important;grid-template-columns:minmax(0,1fr) 150px !important;gap:16px !important;}
  .quick-add .product-field{width:auto !important;}
  .quick-add .quantity-field{width:150px !important;}
  .quick-add .add-product-btn{grid-column:1 / -1 !important;width:100% !important;min-width:0 !important;max-width:none !important;}
}
@media (max-width:520px){
  .quick-add{display:grid !important;grid-template-columns:1fr !important;gap:14px !important;padding:18px !important;}
  .quick-add .quantity-field{width:100% !important;flex-basis:auto !important;}
  .quick-add .add-product-btn{grid-column:auto !important;width:100% !important;}
}

/* WhatsApp handoff is locked until Customer Details are successfully submitted. */
.whatsapp-order.whatsapp-disabled{opacity:.48;cursor:not-allowed;pointer-events:auto;filter:grayscale(.2)}
.whatsapp-order.whatsapp-ready{opacity:1;cursor:pointer;pointer-events:auto}

/* V10 — compact desktop navigation header. Mobile/tablet behaviour remains unchanged. */
@media(min-width:1051px){
  .nav-wrap{min-height:86px;padding:6px 28px;gap:24px;}
  .brand{width:165px;}
  .nav{gap:30px;font-size:.90rem;}
  .nav a{padding:10px 0;}
  .nav-social{font-size:1.25rem;}
}

/* V13 — product pricing and order totals. */
.cart-row{grid-template-columns:minmax(0,1fr) auto auto auto}
.cart-price{font-weight:700;color:var(--gold);white-space:nowrap}
.cart-total{font-weight:700;color:var(--green);white-space:nowrap}
.cart-pricing-note{margin:8px 0 0;color:#68736b;font-size:.84rem}
.order-total{display:flex;justify-content:space-between;gap:20px;padding:14px 0;border-top:2px solid var(--line);margin-top:4px;font-size:1.05rem;font-weight:700;color:var(--green)}
.order-total.por{font-size:.95rem}
@media(max-width:800px){.cart-row{grid-template-columns:minmax(0,1fr) auto auto}.cart-price{grid-column:1/-1;grid-row:2}.cart-total{grid-column:1/-1;grid-row:3}.qty-control{grid-column:2;grid-row:1}.remove-item{grid-column:1;grid-row:1}.order-total{margin-top:8px}}


/* V15 — Kombucha and Water Kefir displayed as full-width product rows. */
.beverage-group { width:100%; }
.beverage-group > h3 { background:var(--green); color:#fff; }
.beverage-group .grid.two { grid-template-columns:repeat(2, minmax(0,1fr)); }
.beverage-group .grid.four { grid-template-columns:repeat(4, minmax(0,1fr)); }
.beverage-group .product img { height:240px; }
@media(max-width:1050px){
  .beverage-group .grid.two { grid-template-columns:repeat(2, minmax(0,1fr)); }
  .beverage-group .grid.four { grid-template-columns:repeat(4, minmax(0,1fr)); }
}
@media(max-width:720px){
  .beverage-group .grid.two, .beverage-group .grid.four { grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media(max-width:430px){
  .beverage-group .grid.two, .beverage-group .grid.four { grid-template-columns:1fr; }
}

/* V16 — centre the Ginger Beer product beneath its heading. */
.ginger-beer-group .grid.one-product{
  display:flex;
  justify-content:center;
  align-items:stretch;
}
.ginger-beer-group .grid.one-product .product{
  width:min(52%, 760px);
}
.ginger-beer-group .grid.one-product .product img{height:240px;}
@media(max-width:720px){
  .ginger-beer-group .grid.one-product .product{width:100%;}
}

/* V19 — Interactive product catalogue. Product cards open a detailed product view. */
.product[data-product-detail]{cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;}
.product[data-product-detail]:hover{transform:translateY(-3px);box-shadow:0 10px 24px #00000012;border-color:#cbb47f;}
.product[data-product-detail] .order-btn,.product[data-product-detail] a{position:relative;z-index:2;}
.product-modal{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:24px;}
.product-modal.open{display:flex;}
.product-modal-backdrop{position:absolute;inset:0;background:rgba(7,61,37,.72);backdrop-filter:blur(4px);}
.product-modal-panel{position:relative;z-index:1;width:min(1120px,100%);max-height:min(900px,94vh);overflow:auto;background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:0 24px 70px #0008;}
.product-modal-close{position:absolute;right:16px;top:12px;width:42px;height:42px;border:1px solid #d8c49b;border-radius:50%;background:#fffdf8;color:var(--green);font-size:30px;line-height:1;cursor:pointer;z-index:3;}
.product-modal-grid{display:grid;grid-template-columns:minmax(320px,.9fr) minmax(0,1.1fr);}
.product-modal-media{padding:34px;background:linear-gradient(145deg,#f4eee0,#fffdf8);border-right:1px solid #e3d7bd;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:620px;}
.product-modal-media img{width:100%;max-width:520px;height:560px;object-fit:contain;background:#fff;border:1px solid #e1d7c2;box-shadow:0 12px 30px #00000010;}
.product-modal-gallery-label{margin-top:12px;color:#766b58;text-transform:uppercase;letter-spacing:.12em;font-size:.68rem;}
.product-modal-content{padding:44px 46px 38px;}
.product-modal-eyebrow{margin:0 0 8px;color:var(--gold);font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;}
.product-modal-content h2{margin:0 48px 8px 0;color:var(--green);font-size:clamp(2rem,3.5vw,3.1rem);line-height:1.05;}
.product-modal-price{margin:0 0 20px;color:var(--gold);font-size:1.05rem;font-weight:700;}
.product-modal-description{font-size:1.08rem;line-height:1.7;color:#4c514c;margin:0 0 24px;}
.product-detail-sections{display:grid;grid-template-columns:1fr 1fr;gap:0 26px;}
.product-detail-sections section{border-top:1px solid #ded2b8;padding:17px 0;}
.product-detail-sections h3{margin:0 0 7px;color:var(--green);font-size:.9rem;letter-spacing:.1em;text-transform:uppercase;}
.product-detail-sections p{margin:0;color:#5c625c;line-height:1.55;font-size:.92rem;}
.product-modal-actions{margin-top:12px;display:flex;justify-content:flex-start;}
.product-modal-actions .btn{margin-top:0;}
body.product-modal-open{overflow:hidden;}
@media(max-width:800px){
  .product-modal{padding:10px;}
  .product-modal-panel{max-height:96vh;border-radius:12px;}
  .product-modal-grid{grid-template-columns:1fr;}
  .product-modal-media{min-height:0;padding:24px 24px 18px;border-right:0;border-bottom:1px solid #e3d7bd;}
  .product-modal-media img{height:360px;max-width:430px;}
  .product-modal-content{padding:30px 24px 28px;}
  .product-detail-sections{grid-template-columns:1fr;}
}
@media(max-width:430px){.product-modal-media img{height:300px}.product-modal-content h2{font-size:1.9rem}.product-modal-content{padding:25px 18px}.product-modal-close{right:10px;top:10px;width:38px;height:38px;font-size:27px}}
