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

:root{ 

  --cream:#F5EFE0; 

  --ivory:#FAF6ED; 

  --earth:#5C3D1E; 

  --deep:#2E1A0E; 

  --gold:#B8892A; 

  --sage:#6B7B52; 

  --light-sage:#C8D4B0; 

  --terracotta:#C0623A; 

  --teal-gone:#00e5c8; /* never used */ 

} 

html{scroll-behavior:smooth;overflow-x:hidden;} 

body{font-family:'Jost',sans-serif;background:var(--ivory);color:var(--deep);overflow-x:hidden;}

img{max-width:100%;height:auto;display:block;} 

 

/* ── PAGES ── */ 

.page{display:none;min-height:100vh;padding-top:72px;overflow-x:hidden;} 

.page.active{display:block;} 

 

/* ── NAV ── */ 

nav{ 

position:fixed;top:0;left:0;right:0;z-index:1000; 

display:flex;align-items:center;justify-content:space-between; 

padding:0 4rem;height:72px; 

background:rgba(250,246,237,0.93); 

backdrop-filter:blur(16px); 

border-bottom:1px solid rgba(92,61,30,0.12); 

} 

.nav-logo{ 

font-family:'Cormorant Garamond',serif; 

font-size:1.1rem;font-weight:600;letter-spacing:0.1em; 

color:var(--earth);text-decoration:none;text-transform:uppercase; 

white-space:nowrap; 

} 

.nav-links{display:flex;gap:0;list-style:none;align-items:center;} 

.nav-links li a{ 

font-size:0.65rem;font-weight:400;letter-spacing:0.18em; 

text-transform:uppercase;color:var(--deep);text-decoration:none; 

opacity:0.65;padding:0.4rem 0.75rem; 

transition:opacity 0.2s;cursor:pointer; 

} 

.nav-links li a:hover,.nav-links li a.active{opacity:1;color:var(--earth);} 

.nav-links li a.nav-cta{ 

background:var(--earth);color:var(--cream)!important;opacity:1!important; 

padding:0.5rem 1rem;font-weight:500; 

} 

.nav-links li a.nav-cta:hover{background:var(--deep);} 

 

/* ── SCROLLING STRIP ── */ 

.strip{background:var(--earth);padding:0.85rem 0;overflow:hidden;white-space:nowrap;} 

.strip-inner{display:inline-flex;gap:2.5rem;animation:stripScroll 22s linear infinite;} 

.strip span{font-size:0.62rem;letter-spacing:0.28em;text-transform:uppercase;color:var(--cream);opacity:0.85;font-weight:300;} 

.strip .dot{color:var(--gold);font-size:0.9rem;} 

@keyframes stripScroll{from{transform:translateX(0);}to{transform:translateX(-50%);}} 

 

/* ── SECTION LABELS ── */ 

.eyebrow{font-size:0.62rem;letter-spacing:0.3em;text-transform:uppercase;color:var(--gold);font-weight:500;margin-bottom:1rem;display:block;} 

.section-title{font-family:'Cormorant Garamond',serif;font-size:clamp(2rem,3vw,3rem);font-weight:300;line-height:1.2;color:var(--deep);} 

.section-title strong{font-weight:600;color:var(--earth);} 

.section-title em{font-style:italic;color:var(--earth);} 

 

/* ── BUTTONS ── */ 

.btn-primary{ 

display:inline-block;background:var(--earth);color:var(--cream); 

padding:0.9rem 2.2rem;font-family:'Jost',sans-serif; 

font-size:0.68rem;font-weight:500;letter-spacing:0.22em; 

text-transform:uppercase;text-decoration:none;border:none;cursor:pointer; 

transition:background 0.25s,transform 0.2s; 

} 

.btn-primary:hover{background:var(--deep);transform:translateY(-1px);} 

.btn-ghost{ 

display:inline-block;color:var(--earth);font-size:0.68rem;font-weight:400; 

letter-spacing:0.2em;text-transform:uppercase;text-decoration:none; 

border-bottom:1px solid var(--gold);padding-bottom:2px;cursor:pointer; 

transition:color 0.2s; 

} 

.btn-ghost:hover{color:var(--gold);} 

.btn-outline{ 

display:inline-block;border:1px solid var(--earth);color:var(--earth); 

padding:0.85rem 2rem;font-size:0.68rem;font-weight:400;letter-spacing:0.22em; 

text-transform:uppercase;text-decoration:none;cursor:pointer; 

transition:background 0.25s,color 0.25s; 

} 

.btn-outline:hover{background:var(--earth);color:var(--cream);} 

 

/* ── FOOTER ── */ 

footer{ 

background:var(--deep);padding:3rem 4rem 2rem; 

display:grid;grid-template-columns:1fr 1fr 1fr;gap:3rem; 

} 

.footer-brand .nav-logo{color:var(--cream);} 

.footer-brand p{font-size:0.78rem;color:rgba(245,239,224,0.55);line-height:1.7;margin-top:0.8rem;max-width:240px;} 

.footer-col h4{font-size:0.62rem;letter-spacing:0.25em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem;} 

.footer-col ul{list-style:none;} 

.footer-col ul li{margin-bottom:0.5rem;} 

.footer-col ul li a{font-size:0.78rem;color:rgba(245,239,224,0.6);text-decoration:none;cursor:pointer;transition:color 0.2s;} 

.footer-col ul li a:hover{color:var(--cream);} 

.footer-col p{font-size:0.78rem;color:rgba(245,239,224,0.6);line-height:1.7;} 

.footer-bottom{ 

background:var(--deep);padding:1.2rem 4rem; 

border-top:1px solid rgba(245,239,224,0.08); 

display:flex;justify-content:space-between;align-items:center; 

} 

.footer-bottom p{font-size:0.65rem;color:rgba(245,239,224,0.35);letter-spacing:0.1em;} 

.social-links{display:flex;gap:1rem;} 

.social-links a{font-size:0.65rem;letter-spacing:0.15em;text-transform:uppercase;color:rgba(245,239,224,0.45);text-decoration:none;transition:color 0.2s;} 

.social-links a:hover{color:var(--gold);} 

.whatsapp-bar{ 

background:var(--sage);padding:0.7rem 4rem; 

display:flex;justify-content:space-between;align-items:center; 

} 

.whatsapp-bar p{font-size:0.72rem;color:var(--ivory);letter-spacing:0.1em;} 

.whatsapp-btn{ 

background:var(--ivory);color:var(--sage); 

padding:0.4rem 1.2rem;font-size:0.65rem;font-weight:500;letter-spacing:0.15em; 

text-transform:uppercase;text-decoration:none;border:none;cursor:pointer; 

transition:background 0.2s; 

} 

.whatsapp-btn:hover{background:var(--cream);} 

 

/* ═══════════════════════════════ 

PAGE: HOME 

═══════════════════════════════ */ 

.hero{ 

min-height:calc(100vh - 72px); 

display:grid;grid-template-columns:1fr 1fr; 

overflow:hidden; 

} 

.hero-left{ 

display:flex;flex-direction:column;justify-content:center; 

padding:5rem 5rem 5rem 6rem; 

background:var(--cream); 

position:relative; 

} 

.hero-left::before{ 

content:'';position:absolute;inset:0; 

background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%235c3d1e' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/svg%3E"); 

pointer-events:none; 

} 

.hero-headline{ 

font-family:'Cormorant Garamond',serif; 

font-size:clamp(3rem,5vw,5.5rem);font-weight:300;line-height:1.08; 

color:var(--deep); 

animation:fadeUp 0.9s 0.2s both; 

} 

.hero-headline em{font-style:italic;color:var(--earth);} 

.hero-sub{ 

margin-top:1.8rem;font-size:0.92rem;font-weight:300;line-height:1.85; 

color:var(--earth);max-width:400px; 

animation:fadeUp 0.9s 0.45s both; 

} 

.hero-ctas{ 

margin-top:2.8rem;display:flex;gap:1.4rem;align-items:center; 

animation:fadeUp 0.9s 0.65s both; 

} 

.hero-right{ 

position:relative;overflow:hidden; 

background:linear-gradient(160deg,#7A5230 0%,#3E220F 40%,#5C3D1E 70%,#8B6540 100%); 

display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1rem; 

} 

.hero-right img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;} 

.hero-right-placeholder{text-align:center;} 

.hero-right-placeholder .big-icon{font-size:5rem;opacity:0.3;} 

.hero-right-placeholder p{font-size:0.62rem;letter-spacing:0.25em;text-transform:uppercase;color:rgba(245,239,224,0.35);margin-top:0.5rem;} 

.hero-badge{ 

position:absolute;bottom:2.5rem;left:2.5rem; 

background:rgba(245,239,224,0.92);backdrop-filter:blur(8px); 

padding:1rem 1.4rem;border-left:3px solid var(--gold); 

animation:fadeIn 1s 1s both; 

} 

.hero-badge p{font-size:0.62rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--earth);font-weight:500;} 

.hero-badge span{font-family:'Cormorant Garamond',serif;font-size:1.1rem;font-weight:600;color:var(--deep);} 

 

/* Story Section */ 

.story-section{display:grid;grid-template-columns:1fr 1fr;min-height:80vh;} 

.story-visual{ 

position:relative;overflow:hidden; 

background:linear-gradient(160deg,#6B7B52 0%,#4A5838 50%,#8B9E6B 100%); 

display:flex;align-items:center;justify-content:center;flex-direction:column; 

min-height:500px; 

} 

.story-visual img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;} 

.story-visual .big-icon{font-size:4rem;opacity:0.3;} 

.story-visual-label{font-size:0.62rem;letter-spacing:0.22em;text-transform:uppercase;color:rgba(245,239,224,0.4);margin-top:0.5rem;} 

.story-overlay{ 

position:absolute;bottom:0;left:0;right:0;padding:2.5rem; 

background:linear-gradient(to top,rgba(46,26,14,0.8) 0%,transparent 100%); 

} 

.story-caption{font-family:'Cormorant Garamond',serif;font-size:1.4rem;font-style:italic;color:var(--cream);line-height:1.4;margin-top:0.4rem;} 

.story-content{padding:5rem;display:flex;flex-direction:column;justify-content:center;background:var(--ivory);} 

.story-body{margin-top:1rem;font-size:0.9rem;font-weight:300;line-height:1.9;color:rgba(46,26,14,0.72);max-width:440px;} 

.story-pillars{margin-top:2.5rem;display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;} 

.pillar{padding:1.1rem 1.3rem;border:1px solid rgba(92,61,30,0.12);border-left:3px solid var(--gold);} 

.pillar-icon{font-size:1.1rem;margin-bottom:0.35rem;} 

.pillar-title{font-size:0.68rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--earth);font-weight:500;margin-bottom:0.25rem;} 

.pillar-text{font-size:0.78rem;color:rgba(46,26,14,0.6);line-height:1.55;} 

 

/* Ethics Banner */ 

.ethics-banner{ 

background:var(--deep);padding:5rem 6rem; 

display:flex;align-items:center;justify-content:space-between;gap:4rem; 

} 

.ethics-quote{ 

font-family:'Cormorant Garamond',serif; 

font-size:clamp(1.5rem,2.2vw,2.3rem);font-style:italic;font-weight:300; 

color:var(--cream);line-height:1.45;max-width:560px; 

} 

.ethics-quote span{color:var(--gold);} 

.ethics-stats{display:flex;flex-direction:column;gap:1.8rem;min-width:190px;} 

.stat-num{font-family:'Cormorant Garamond',serif;font-size:2.8rem;font-weight:300;color:var(--gold);line-height:1;} 

.stat-label{font-size:0.62rem;letter-spacing:0.2em;text-transform:uppercase;color:rgba(245,239,224,0.5);margin-top:0.2rem;} 

 

/* Featured Products */ 

.products-section{padding:5rem 6rem;} 

.products-header{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:3rem;} 

.products-header .section-title{font-size:clamp(1.6rem,2.5vw,2.2rem);} 

.products-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem;} 

.product-card{background:var(--ivory);overflow:hidden;cursor:pointer;border-radius:12px;box-shadow:0 4px 20px rgba(46,26,14,0.08);transition:transform 0.35s ease,box-shadow 0.35s ease;} 

.product-card:hover{transform:translateY(-6px);box-shadow:0 12px 36px rgba(46,26,14,0.14);} 

.product-img{ 

aspect-ratio:4/5;overflow:hidden;position:relative; 

} 

.product-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.5s ease;} 

.product-card:hover .product-img img{transform:scale(1.05);} 

.p-img-1{background:linear-gradient(135deg,#C8D4B0 0%,#6B7B52 100%);} 

.p-img-2{background:linear-gradient(135deg,#D4B896 0%,#5C3D1E 100%);} 

.p-img-3{background:linear-gradient(135deg,#E8C89A 0%,#B8892A 100%);} 

.product-img .icon{font-size:2.5rem;opacity:0.4;} 

.product-img .img-label{font-size:0.58rem;letter-spacing:0.15em;text-transform:uppercase;color:rgba(255,255,255,0.4);} 

.product-badge{position:absolute;top:1rem;left:1rem;background:var(--gold);color:var(--ivory);font-size:0.58rem;letter-spacing:0.15em;text-transform:uppercase;padding:0.35rem 0.75rem;font-weight:500;border-radius:4px;} 

.product-info{padding:1.6rem 1.8rem 2rem;} 

.product-name{font-family:'Cormorant Garamond',serif;font-size:1.35rem;font-weight:500;color:var(--deep);line-height:1.3;} 

.product-desc{font-size:0.8rem;color:rgba(46,26,14,0.55);line-height:1.7;margin-top:0.6rem;} 

.product-footer{display:flex;align-items:center;justify-content:space-between;margin-top:1.4rem;padding-top:1.2rem;border-top:1px solid rgba(92,61,30,0.08);} 

.product-price{font-family:'Cormorant Garamond',serif;font-size:1.15rem;font-weight:600;color:var(--earth);} 

 

/* Certs Bar */ 

.certs-bar{ 

background:var(--ivory);padding:3rem 6rem; 

border-top:1px solid rgba(92,61,30,0.1);border-bottom:1px solid rgba(92,61,30,0.1); 

display:flex;align-items:center;justify-content:space-between;gap:2rem; 

} 

.cert-label-text{font-size:0.62rem;letter-spacing:0.25em;text-transform:uppercase;color:rgba(46,26,14,0.4);min-width:120px;} 

.cert-items{display:flex;gap:2.5rem;flex-wrap:wrap;} 

.cert-item{display:flex;align-items:center;gap:0.6rem;} 

.cert-item-icon{font-size:1.3rem;} 

.cert-item-text{font-size:0.74rem;font-weight:400;color:var(--earth);} 

 

/* Footer CTA */ 

.footer-cta-section{ 

background:var(--earth);padding:6rem;text-align:center; 

position:relative;overflow:hidden; 

} 

.footer-cta-section::before{ 

content:'ATUNILE';position:absolute;bottom:-1.5rem;left:50%;transform:translateX(-50%); 

font-family:'Cormorant Garamond',serif;font-size:11rem;font-weight:600;letter-spacing:0.2em; 

color:rgba(245,239,224,0.05);white-space:nowrap;pointer-events:none; 

} 

.footer-cta-section .eyebrow{color:var(--gold);} 

.footer-cta-title{font-family:'Cormorant Garamond',serif;font-size:clamp(2rem,4vw,3.5rem);font-weight:300;color:var(--cream);line-height:1.2;} 

.footer-cta-sub{margin:1.2rem auto 0;font-size:0.88rem;font-weight:300;color:rgba(245,239,224,0.65);max-width:420px;line-height:1.75;} 

.btn-light{ 

display:inline-block;background:var(--cream);color:var(--earth); 

padding:1rem 2.8rem;margin-top:2.5rem; 

font-size:0.68rem;font-weight:500;letter-spacing:0.22em; 

text-transform:uppercase;text-decoration:none;cursor:pointer;border:none; 

transition:background 0.25s,transform 0.2s; 

} 

.btn-light:hover{background:var(--gold);color:var(--ivory);transform:translateY(-2px);} 

 

/* ═══════════════════════════════ 

PAGE: ABOUT 

═══════════════════════════════ */ 

.page-header{ 

background:var(--cream);padding:5rem 6rem 4rem; 

border-bottom:1px solid rgba(92,61,30,0.1); 

} 

.page-header-inner{max-width:700px;} 

.page-hero-title{font-family:'Cormorant Garamond',serif;font-size:clamp(2.5rem,4vw,4rem);font-weight:300;line-height:1.1;color:var(--deep);} 

.page-hero-title em{font-style:italic;color:var(--earth);} 

.page-hero-sub{margin-top:1.5rem;font-size:0.92rem;font-weight:300;line-height:1.85;color:rgba(46,26,14,0.7);max-width:560px;} 

 

.about-content{display:grid;grid-template-columns:1fr 1fr;gap:0;} 

.about-visual{ 

background:linear-gradient(160deg,#7A5230 0%,#5C3D1E 60%,#8B6540 100%); 

min-height:500px;display:flex;align-items:center;justify-content:center;flex-direction:column; 

position:relative; 

} 

.about-visual img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;} 

.about-visual .big-icon{font-size:5rem;opacity:0.25;} 

.about-visual p{font-size:0.62rem;letter-spacing:0.25em;text-transform:uppercase;color:rgba(245,239,224,0.3);margin-top:0.5rem;} 

.about-text{padding:5rem;} 

.about-text p{font-size:0.9rem;font-weight:300;line-height:1.9;color:rgba(46,26,14,0.72);margin-bottom:1.5rem;} 

 

.values-section{padding:5rem 6rem;background:var(--ivory);} 

.values-grid{margin-top:3rem;display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;} 

.value-card{padding:2rem 1.5rem;background:var(--cream);border-top:3px solid var(--gold);} 

.value-icon{font-size:1.8rem;margin-bottom:1rem;} 

.value-title{font-family:'Cormorant Garamond',serif;font-size:1.2rem;font-weight:600;color:var(--earth);margin-bottom:0.5rem;} 

.value-text{font-size:0.8rem;color:rgba(46,26,14,0.65);line-height:1.65;} 

 

/* ═══════════════════════════════ 

PAGE: MISSION 

═══════════════════════════════ */ 

.mission-hero{ 

background:var(--deep);padding:6rem; 

display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center; 

} 

.mission-visual{ 

background:linear-gradient(135deg,#6B7B52 0%,#4A5838 100%); 

min-height:420px;border-radius:2px;display:flex;align-items:center;justify-content:center;flex-direction:column; 

} 

.mission-visual .big-icon{font-size:4rem;opacity:0.3;} 

.mission-visual p{font-size:0.62rem;letter-spacing:0.22em;text-transform:uppercase;color:rgba(245,239,224,0.3);margin-top:0.5rem;} 

.mission-text .eyebrow{color:var(--gold);} 

.mission-statement{font-family:'Cormorant Garamond',serif;font-size:clamp(1.6rem,2.5vw,2.5rem);font-weight:300;line-height:1.35;color:var(--cream);} 

.mission-statement em{font-style:italic;color:var(--gold);} 

.mission-body{margin-top:1.5rem;font-size:0.88rem;font-weight:300;line-height:1.85;color:rgba(245,239,224,0.65);} 

 

.commitments-section{padding:5rem 6rem;background:var(--cream);} 

.commitments-grid{margin-top:3rem;display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;} 

.commitment-item{ 

padding:2rem 2rem 2rem;background:var(--ivory); 

border-left:3px solid var(--gold);display:flex;gap:1.2rem; 

} 

.commitment-check{font-size:1.3rem;flex-shrink:0;margin-top:0.1rem;} 

.commitment-title{font-family:'Cormorant Garamond',serif;font-size:1.15rem;font-weight:600;color:var(--earth);margin-bottom:0.5rem;} 

.commitment-text{font-size:0.82rem;color:rgba(46,26,14,0.65);line-height:1.65;} 

 

/* ═══════════════════════════════ 

PAGE: SHOP 

═══════════════════════════════ */ 

.shop-hero{background:var(--cream);padding:4rem 6rem 3rem;} 

.shop-product-main{ 

display:grid;grid-template-columns:1fr 1fr;gap:0; 

border-top:1px solid rgba(92,61,30,0.1); 

} 

.shop-gallery{padding:4rem 4rem 4rem 6rem;} 

.shop-gallery-main{ 

background:linear-gradient(135deg,#C8D4B0 0%,#6B7B52 100%); 

aspect-ratio:1;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:0.5rem; 

margin-bottom:1rem; 

} 

.shop-gallery-main .icon{font-size:5rem;opacity:0.3;} 

.shop-gallery-main p{font-size:0.62rem;letter-spacing:0.2em;text-transform:uppercase;color:rgba(245,239,224,0.4);} 

.shop-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:0.6rem;} 

.shop-thumb{ 

aspect-ratio:1;cursor:pointer; 

display:flex;align-items:center;justify-content:center; 

font-size:1.5rem;opacity:0.6; 

transition:opacity 0.2s; 

} 

.shop-thumb:hover{opacity:1;} 

.st1{background:linear-gradient(135deg,#D4B896,#5C3D1E);} 

.st2{background:linear-gradient(135deg,#C8D4B0,#4A5838);} 

.st3{background:linear-gradient(135deg,#E8C89A,#B8892A);} 

.st4{background:linear-gradient(135deg,#D9C5A8,#7A5230);} 

.shop-details{padding:4rem 6rem 4rem 3rem;display:flex;flex-direction:column;justify-content:center;} 

.shop-product-name{font-family:'Cormorant Garamond',serif;font-size:clamp(1.8rem,2.5vw,2.5rem);font-weight:300;line-height:1.2;color:var(--deep);} 

.shop-product-tagline{font-size:0.8rem;color:var(--gold);letter-spacing:0.1em;margin-top:0.4rem;} 

.shop-variants{margin-top:2rem;} 

.shop-variant-label{font-size:0.65rem;letter-spacing:0.2em;text-transform:uppercase;color:rgba(46,26,14,0.5);margin-bottom:0.6rem;} 

.variant-options{display:flex;gap:0.6rem;} 

.variant-btn{ 

padding:0.5rem 1rem;border:1px solid rgba(92,61,30,0.25); 

font-size:0.72rem;color:var(--earth);cursor:pointer;background:none; 

transition:all 0.2s; 

} 

.variant-btn.active,.variant-btn:hover{border-color:var(--earth);background:var(--earth);color:var(--cream);} 

.shop-price{margin-top:1.5rem;font-family:'Cormorant Garamond',serif;font-size:2rem;color:var(--earth);} 

.shop-price-note{font-size:0.72rem;color:rgba(46,26,14,0.5);margin-top:0.2rem;} 

.shop-payment{margin-top:1rem;padding:0.8rem 1.2rem;background:rgba(92,61,30,0.07);border-left:2px solid var(--gold);} 

.shop-payment p{font-size:0.72rem;color:var(--earth);} 

.shop-desc{margin-top:1.8rem;} 

.shop-desc h4{font-size:0.65rem;letter-spacing:0.2em;text-transform:uppercase;color:rgba(46,26,14,0.5);margin-bottom:0.6rem;} 

.shop-desc p{font-size:0.85rem;font-weight:300;line-height:1.8;color:rgba(46,26,14,0.7);} 

.shop-ingredients{margin-top:1.5rem;} 

.shop-ingredients h4{font-size:0.65rem;letter-spacing:0.2em;text-transform:uppercase;color:rgba(46,26,14,0.5);margin-bottom:0.4rem;} 

.shop-ingredients p{font-size:0.8rem;font-weight:500;color:var(--earth);} 

.shop-cta-wrap{margin-top:2rem;display:flex;gap:1rem;align-items:center;} 

 

/* ═══════════════════════════════ 

PAGE: BLOG 

═══════════════════════════════ */ 

.blog-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2.5rem;padding:4rem 6rem;} 

.blog-card{background:var(--cream);overflow:hidden;cursor:pointer;transition:transform 0.3s;} 

.blog-card:hover{transform:translateY(-3px);} 

.blog-img{ 

aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:0.5rem; 

} 

.blog-img-1{background:linear-gradient(135deg,#C8D4B0,#4A5838);} 

.blog-img-2{background:linear-gradient(135deg,#E8C89A,#7A5230);} 

.blog-img .big-icon{font-size:3rem;opacity:0.35;} 

.blog-img p{font-size:0.58rem;letter-spacing:0.2em;text-transform:uppercase;color:rgba(255,255,255,0.35);} 

.blog-card-body{padding:1.8rem 2rem 2.2rem;} 

.blog-tag{font-size:0.6rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold);font-weight:500;} 

.blog-card-title{font-family:'Cormorant Garamond',serif;font-size:1.6rem;font-weight:400;color:var(--deep);line-height:1.25;margin-top:0.5rem;} 

.blog-excerpt{font-size:0.82rem;font-weight:300;line-height:1.75;color:rgba(46,26,14,0.65);margin-top:0.8rem;} 

.blog-read-more{display:inline-block;margin-top:1.2rem;font-size:0.65rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--earth);border-bottom:1px solid var(--gold);padding-bottom:2px;text-decoration:none;} 

 

/* Blog Post Full */ 

.blog-post-content{max-width:760px;margin:0 auto;padding:4rem 6rem 6rem;} 

.blog-post-content h2{font-family:'Cormorant Garamond',serif;font-size:2.2rem;font-weight:300;color:var(--deep);margin:2rem 0 1rem;} 

.blog-post-content h3{font-family:'Cormorant Garamond',serif;font-size:1.4rem;font-weight:600;color:var(--earth);margin:1.5rem 0 0.5rem;} 

.blog-post-content p{font-size:0.9rem;font-weight:300;line-height:1.9;color:rgba(46,26,14,0.75);margin-bottom:1rem;} 

.blog-post-content strong{font-weight:600;color:var(--earth);} 

.blog-post-content ul{margin:0.5rem 0 1rem 1.5rem;} 

.blog-post-content ul li{font-size:0.88rem;line-height:1.75;color:rgba(46,26,14,0.72);margin-bottom:0.3rem;} 

.blog-post-img{ 

width:100%;aspect-ratio:4/3;background:linear-gradient(135deg,#D4B896,#5C3D1E); 

display:flex;align-items:center;justify-content:center;flex-direction:column;gap:0.5rem; 

margin:2rem 0; 

} 

.back-link{display:inline-flex;align-items:center;gap:0.5rem;font-size:0.65rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--earth);cursor:pointer;margin-bottom:2rem;text-decoration:none;} 

.back-link:hover{color:var(--gold);} 

 

/* ═══════════════════════════════ 

PAGE: CONTACT 

═══════════════════════════════ */ 

.contact-layout{display:grid;grid-template-columns:1fr 1fr;min-height:70vh;} 

.contact-info{background:var(--earth);padding:6rem;display:flex;flex-direction:column;justify-content:center;} 

.contact-info .eyebrow{color:var(--gold);} 

.contact-info .section-title{color:var(--cream);} 

.contact-info .section-title strong{color:var(--gold);} 

.contact-items{margin-top:3rem;display:flex;flex-direction:column;gap:2rem;} 

.contact-item{display:flex;gap:1.2rem;align-items:flex-start;} 

.contact-item-icon{font-size:1.4rem;flex-shrink:0;margin-top:0.1rem;} 

.contact-item-label{font-size:0.62rem;letter-spacing:0.2em;text-transform:uppercase;color:rgba(245,239,224,0.5);margin-bottom:0.3rem;} 

.contact-item-value{font-size:0.92rem;color:var(--cream);font-weight:300;line-height:1.5;} 

.contact-item-value a{color:var(--gold);text-decoration:none;} 

.contact-map{background:var(--cream);padding:6rem;display:flex;flex-direction:column;justify-content:center;} 

.contact-map .section-title{margin-bottom:2rem;} 

.map-placeholder{ 

width:100%;aspect-ratio:4/3;background:linear-gradient(135deg,#C8D4B0,#4A5838); 

display:flex;align-items:center;justify-content:center;flex-direction:column;gap:0.5rem; 

} 

.map-placeholder .icon{font-size:3rem;opacity:0.4;} 

.map-placeholder p{font-size:0.62rem;letter-spacing:0.2em;text-transform:uppercase;color:rgba(245,239,224,0.4);} 

.contact-note{margin-top:1.2rem;font-size:0.78rem;font-weight:300;color:rgba(46,26,14,0.55);line-height:1.7;} 

 

/* ═══════════════════════════════ 

PAGE: CODE OF ETHICS 

═══════════════════════════════ */ 

.ethics-page-hero{ 

background:var(--deep);padding:6rem; 

display:grid;grid-template-columns:1.2fr 1fr;gap:5rem;align-items:center; 

} 

.ethics-meta{font-size:0.82rem;color:var(--cream);line-height:1.7;margin-top:1.5rem;} 

.ethics-meta strong{color:var(--gold);} 

.ethics-visual{ 

background:linear-gradient(135deg,rgba(184,137,42,0.3),rgba(92,61,30,0.5)); 

min-height:350px;display:flex;align-items:center;justify-content:center;flex-direction:column; 

border:1px solid rgba(184,137,42,0.2); 

} 

.ethics-visual .big-icon{font-size:4rem;opacity:0.4;} 

.ethics-visual p{font-size:0.62rem;letter-spacing:0.22em;text-transform:uppercase;color:rgba(245,239,224,0.3);margin-top:0.5rem;} 

 

.ethics-body{padding:5rem 6rem;} 

.ethics-section{margin-bottom:3.5rem;padding-bottom:3.5rem;border-bottom:1px solid rgba(92,61,30,0.12);} 

.ethics-section:last-child{border-bottom:none;} 

.ethics-section-num{font-size:0.62rem;letter-spacing:0.3em;text-transform:uppercase;color:var(--gold);font-weight:500;margin-bottom:0.5rem;} 

.ethics-section-title{font-family:'Cormorant Garamond',serif;font-size:1.7rem;font-weight:400;color:var(--deep);margin-bottom:1.2rem;} 

.ethics-section p{font-size:0.88rem;font-weight:300;line-height:1.85;color:rgba(46,26,14,0.7);margin-bottom:0.8rem;} 

.ethics-bullets{list-style:none;margin-top:0.8rem;} 

.ethics-bullets li{ 

font-size:0.86rem;font-weight:300;line-height:1.7;color:rgba(46,26,14,0.7); 

padding:0.6rem 0 0.6rem 1.5rem;position:relative; 

border-bottom:1px solid rgba(92,61,30,0.07); 

} 

.ethics-bullets li::before{content:'✦';position:absolute;left:0;color:var(--gold);font-size:0.55rem;top:0.85rem;} 

.ethics-bullets li strong{color:var(--earth);font-weight:500;} 

 

/* ═══════════════════════════════ 

PAGE: ATUNILE EXPORTS 

═══════════════════════════════ */ 

.exports-hero{ 

background:var(--deep);padding:6rem; 

display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center; 

} 

.exports-hero .eyebrow{color:var(--gold);} 

.exports-hero .section-title{color:var(--cream);} 

.exports-hero .section-title em{color:var(--gold);} 

.exports-hero-body{margin-top:1.5rem;font-size:0.9rem;font-weight:300;line-height:1.85;color:rgba(245,239,224,0.65);} 

.exports-hero-ctas{margin-top:2rem;display:flex;gap:1.2rem;} 

.exports-visual{ 
background:linear-gradient(135deg,rgba(184,137,42,0.2),rgba(92,61,30,0.4)); 
min-height:380px;display:flex;align-items:center;justify-content:center;flex-direction:column; 
border:1px solid rgba(184,137,42,0.15); 
position:relative;overflow:hidden; 
} 

.exports-visual .big-icon{font-size:4.5rem;opacity:0.3;} 

.exports-visual p{font-size:0.62rem;letter-spacing:0.22em;text-transform:uppercase;color:rgba(245,239,224,0.3);margin-top:0.5rem;} 

 

.exports-body{padding:5rem 6rem;background:var(--ivory);} 

.exports-body > p{font-size:0.92rem;font-weight:300;line-height:1.85;color:rgba(46,26,14,0.72);max-width:700px;margin-bottom:1rem;} 

.exports-highlights{margin-top:3rem;display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;} 

.export-card{padding:2rem;background:var(--cream);border-top:3px solid var(--gold);} 

.export-card-icon{font-size:1.8rem;margin-bottom:0.8rem;} 

.export-card-title{font-family:'Cormorant Garamond',serif;font-size:1.2rem;font-weight:600;color:var(--earth);margin-bottom:0.5rem;} 

.export-card-text{font-size:0.8rem;color:rgba(46,26,14,0.62);line-height:1.6;} 

 

.exports-contact{background:var(--earth);padding:5rem 6rem;text-align:center;} 

.exports-contact .eyebrow{color:var(--gold);} 

.exports-contact .section-title{color:var(--cream);margin-bottom:0.5rem;} 

.exports-contact .section-title strong{color:var(--gold);} 

.exports-contact-sub{font-size:0.88rem;font-weight:300;color:rgba(245,239,224,0.65);max-width:420px;margin:0.8rem auto 0;line-height:1.75;} 

.exports-contact-details{margin-top:2.5rem;display:flex;justify-content:center;gap:3rem;flex-wrap:wrap;} 

.exports-contact-item{text-align:center;} 

.exports-contact-item .icon{font-size:1.5rem;margin-bottom:0.4rem;} 

.exports-contact-item p{font-size:0.78rem;color:rgba(245,239,224,0.55);letter-spacing:0.05em;} 

.exports-contact-item a,.exports-contact-item strong{color:var(--gold);font-weight:400;font-size:0.88rem;} 

 

/* ═══════════════════════════════ 

ANIMATIONS 

═══════════════════════════════ */ 

@keyframes fadeUp{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:translateY(0);}} 

@keyframes fadeIn{from{opacity:0;}to{opacity:1;}} 

 

/* ═══════════════════════════════ 

RESPONSIVE HELPERS 

═══════════════════════════════ */ 

.divider{height:1px;background:rgba(92,61,30,0.1);margin:0 6rem;} 

 

/* HAMBURGER - CSS controlled, no JS dependency */ 

#ham { display: none; } 

#mob-nav { display: none; } 

#mob-nav.open { display: block !important; } 

 

/* FOOTER - layout handled by responsive block at end of file */ 

 

/* footer-cta and certs — handled by responsive block at end of file */ 

 

/* About text */ 

.about-text{background:#2E1A0E!important;} 

.about-text *{color:#FAF6ED!important;} 

.about-text .eyebrow{color:#B8892A!important;} 

.about-text .section-title strong{color:#B8892A!important;} 

 

/* Shop white text */ 

#page-shop .shop-product-name,#page-shop .shop-hero .page-hero-title{color:#FAF6ED!important;} 

#page-shop .shop-product-tagline,#page-shop .shop-price,#page-shop .shop-hero .eyebrow{color:#B8892A!important;} 

#page-shop .shop-desc p,#page-shop .shop-payment p{color:rgba(245,239,224,0.75)!important;} 

#page-shop .variant-btn{border-color:rgba(245,239,224,0.3)!important;color:rgba(245,239,224,0.8)!important;} 

#page-shop .variant-btn.active{background:#B8892A!important;color:#FAF6ED!important;} 

 

/* Ethics */ 

.ethics-body{background:var(--ivory)!important;} 

.ethics-section-title{color:var(--deep)!important;} 

.ethics-section p,.ethics-bullets li{color:rgba(46,26,14,0.75)!important;} 

.ethics-section-num{color:var(--gold)!important;} 

.ethics-page-hero .page-hero-title,.ethics-page-hero .eyebrow,.ethics-page-hero .ethics-meta{color:var(--cream)!important;} 

 

/* Exports */ 

.exports-body{background:var(--ivory)!important;} 

.exports-body p,.export-card-text{color:rgba(46,26,14,0.75)!important;} 

.export-card-title{color:var(--earth)!important;} 

.export-card{background:var(--cream)!important;} 

 

/* Page headers */ 

.page-header{background:var(--cream)!important;} 

.page-header .page-hero-title{color:var(--deep)!important;} 

.page-header .eyebrow{color:var(--gold)!important;} 

.page-header .page-hero-sub{color:rgba(46,26,14,0.7)!important;} 

 

/* Values / mission */ 

.values-section{background:var(--ivory)!important;} 

.value-title{color:var(--earth)!important;} 

.value-text{color:rgba(46,26,14,0.65)!important;} 

.commitments-section{background:var(--cream)!important;} 

.commitment-title{color:var(--earth)!important;} 

.commitment-text{color:rgba(46,26,14,0.7)!important;} 

 

/* Blog */ 

.blog-card-title{color:var(--deep)!important;} 

.blog-excerpt{color:rgba(46,26,14,0.65)!important;} 

.blog-post-content h2,.blog-post-content h3{color:var(--deep)!important;} 

.blog-post-content p{color:rgba(46,26,14,0.75)!important;} 

 

/* Contact */ 

.contact-map{background:var(--cream)!important;} 

.contact-map .section-title{color:var(--deep)!important;} 

 

/* ══ DESKTOP ══ (old block - see comprehensive block at end of file) */ 

 

/* ══ TABLET ══ 768px–1024px */ 

@media(min-width:768px) and (max-width:1024px){ 

#ham{display:none!important;} 

.nav-links{display:flex!important;} 

nav{padding:4rem 1rem;} 
.nav-links li a {
    font-size: 0.48rem;
    padding: 0.3rem 0.4rem;
}
.page{padding-top:72px;} 

/* Hero */ 

.hero{display:grid!important;grid-template-columns:1fr 1fr!important;min-height:auto;} 

.hero-left{padding:3rem 2.5rem;} 

.hero-headline{font-size:clamp(2rem,4vw,3.2rem);} 

.hero-sub{font-size:0.85rem;} 

.hero-ctas{flex-wrap:wrap;gap:1rem;} 

.hero-right{min-height:400px;} 

/* Strip */ 

.strip{padding:0.7rem 0;} 

/* Story */ 

.story-section{grid-template-columns:1fr;} 

.story-visual{min-height:350px;} 

.story-content{padding:3rem 2.5rem;} 

.story-pillars{grid-template-columns:1fr 1fr;gap:1rem;} 

/* Ethics banner */ 

.ethics-banner{padding:3.5rem 2.5rem;gap:2.5rem;} 

/* Products */ 

.products-section{padding:3.5rem 2.5rem;} 

.products-grid{display:flex!important;flex-direction:column!important;gap:1.2rem!important;} 

.product-card{display:flex!important;flex-direction:row!important;align-items:stretch!important;overflow:hidden!important;height:220px!important;border-radius:10px!important;}

.product-img{flex:0 0 35%!important;max-width:35%!important;height:220px!important;aspect-ratio:auto!important;overflow:hidden!important;position:relative!important;}

.product-img img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important;}

.product-info{flex:1 1 auto!important;display:flex!important;flex-direction:column!important;justify-content:center!important;padding:1.5rem 1.8rem!important;border-left:3px solid var(--gold)!important;}

.product-footer{margin-top:auto!important;} 

/* Certs */ 

.certs-bar{padding:2rem 2.5rem;flex-wrap:wrap;} 

.cert-items{gap:1.5rem;} 

/* Footer CTA */ 

.footer-cta-section{padding:4rem 2.5rem;} 

/* About */ 

.page-header{padding:3.5rem 2.5rem 3rem;} 

.about-content{grid-template-columns:1fr;} 

.about-visual{min-height:350px;} 

.about-text{padding:3rem 2.5rem;} 

.values-section{padding:3.5rem 2.5rem;} 

.values-grid{grid-template-columns:repeat(2,1fr);gap:1.2rem;} 

/* Mission */ 

.mission-hero{padding:4rem 2.5rem;grid-template-columns:1fr;gap:2.5rem;} 

.mission-visual{min-height:300px;} 

.commitments-section{padding:3.5rem 2.5rem;} 

.commitments-grid{grid-template-columns:1fr;} 

/* Shop */ 

.shop-hero{padding:3rem 2.5rem 2rem;} 

.shop-product-main{grid-template-columns:1fr 1fr;} 

.shop-gallery{padding:2.5rem;} 

.shop-details{padding:2.5rem;} 

/* Blog */ 

.blog-grid{grid-template-columns:repeat(2,1fr);gap:2rem;padding:3rem 2.5rem;} 

.blog-post-content{padding:3rem 2.5rem;} 

/* Contact */ 

.contact-layout{grid-template-columns:1fr;} 

.contact-info{padding:3.5rem 2.5rem;} 

.contact-map{padding:3.5rem 2.5rem;} 

/* Ethics page */ 

.ethics-page-hero{padding:4rem 2.5rem;grid-template-columns:1fr;gap:2.5rem;} 

.ethics-body{padding:3.5rem 2.5rem;} 

/* Exports */ 

.exports-hero{padding:4rem 2.5rem;grid-template-columns:1fr;gap:2.5rem;} 

.exports-body{padding:3.5rem 2.5rem;} 

.exports-highlights{grid-template-columns:repeat(3,1fr);gap:1.2rem;} 

.exports-contact{padding:3.5rem 2.5rem;} 

/* Footer */ 

footer{padding:2.5rem 2rem!important;grid-template-columns:1fr 1fr!important;gap:2rem;} 

.footer-bottom{padding:1rem 2rem!important;} 

.whatsapp-bar{padding:0.6rem 2rem;} 

} 

 

/* ══ MOBILE ══ max-width 767px */ 

@media(max-width:767px){ 

#ham{display:block!important;margin-left:auto;} 

.nav-links{display:none!important;} 

nav{padding:3rem 1.2rem;height:60px;display:flex;align-items:center;} 

.nav-logo{font-size:0.82rem;} 

.page{padding-top:60px;} 

/* Hero */ 

.hero{grid-template-columns:1fr!important;min-height:auto;} 

.hero-left{padding:2.5rem 1.5rem;order:2;} 

.hero-right{min-height:280px;order:1;position:relative;} 

.hero-headline{font-size:clamp(2rem,8vw,2.8rem);} 

.hero-sub{font-size:0.85rem;max-width:100%;} 

.hero-ctas{flex-direction:column;gap:1rem;align-items:stretch;margin-top:1.8rem;} 

.btn-primary,.btn-outline,.btn-light,.btn-ghost{text-align:center;} 

.hero-badge{bottom:1.5rem;left:1.5rem;padding:0.8rem 1rem;} 

/* Strip */ 

.strip{padding:0.6rem 0;} 

.strip span{font-size:0.55rem;letter-spacing:0.2em;} 

/* Story */ 

.story-section{grid-template-columns:1fr!important;} 

.story-visual{min-height:260px;position:relative;} 

.story-content{padding:2.5rem 1.5rem;} 

.story-body{max-width:100%;font-size:0.85rem;} 

.story-pillars{grid-template-columns:1fr 1fr;gap:0.8rem;} 

.story-link{margin-top:1.5rem!important;} 

/* Ethics banner */ 

.ethics-banner{flex-direction:column;padding:3rem 1.5rem;gap:2rem;} 

.ethics-quote{font-size:clamp(1.2rem,5vw,1.6rem);max-width:100%;} 

.ethics-stats{flex-direction:row;gap:2rem;min-width:auto;} 

/* Products */ 

.products-section{padding:3rem 1.5rem;} 

.products-header{flex-direction:row;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:2rem;} 

.products-grid{grid-template-columns:1fr!important;gap:2rem;} 

.product-card{border-radius:10px;} 

.product-img{aspect-ratio:4/5;} 

/* Certs */ 

.certs-bar{flex-direction:column;padding:2rem 1.5rem;gap:1.2rem;align-items:flex-start;} 

.cert-items{flex-direction:column;gap:0.8rem;} 

/* Footer CTA */ 

.footer-cta-section{padding:3.5rem 1.5rem;} 

.footer-cta-sub{font-size:0.82rem;max-width:100%;} 

.footer-cta-section::before{font-size:4rem;} 

/* About */ 

.page-header{padding:2.5rem 1.5rem 2rem;} 

.page-hero-title{font-size:clamp(1.8rem,7vw,2.5rem);} 

.page-hero-sub{font-size:0.85rem;max-width:100%;} 

.about-content{grid-template-columns:1fr!important;} 

.about-visual{min-height:250px;} 

.about-text{padding:2.5rem 1.5rem!important;} 

.values-section{padding:3rem 1.5rem;} 

.values-grid{grid-template-columns:1fr 1fr;gap:1rem;} 

.value-card{padding:1.5rem 1.2rem;} 

/* Mission */ 

.mission-hero{padding:2.5rem 1.5rem;grid-template-columns:1fr!important;gap:2rem;} 

.mission-visual{min-height:220px;} 

.mission-statement{font-size:clamp(1.3rem,5vw,1.8rem);} 

.commitments-section{padding:3rem 1.5rem;} 

.commitments-grid{grid-template-columns:1fr!important;} 

.commitment-item{padding:1.5rem;} 

/* Shop */ 

.shop-hero{padding:2rem 1.5rem;} 

.shop-product-main{grid-template-columns:1fr!important;} 

.shop-gallery{padding:1.5rem;} 

.shop-gallery-main{aspect-ratio:1;} 

.shop-details{padding:0 1.5rem 2.5rem;} 

.shop-cta-wrap{flex-direction:column;gap:0.8rem;} 

.shop-cta-wrap .btn-primary,.shop-cta-wrap .btn-outline{width:100%;text-align:center;}

.shop-testimonial-grid{grid-template-columns:1fr!important;}

.variant-options{flex-wrap:wrap;} 

/* Blog */ 

.blog-grid{grid-template-columns:1fr!important;padding:2rem 1.5rem;} 

.blog-card-body{padding:1.4rem 1.5rem 1.8rem;} 

.blog-post-content{padding:2rem 1.5rem;} 

/* Contact */ 

.contact-layout{grid-template-columns:1fr!important;min-height:auto;} 

.contact-info{padding:3rem 1.5rem;} 

.contact-map{padding:3rem 1.5rem;} 

.contact-items{gap:1.5rem;} 

/* Ethics page */ 

.ethics-page-hero{padding:3rem 1.5rem;grid-template-columns:1fr!important;gap:2rem;text-align:center;} 

.ethics-page-hero .eyebrow{color:var(--cream)!important;} 

.ethics-page-hero .page-hero-title{font-size:clamp(2.2rem,8vw,3rem)!important;color:var(--cream)!important;} 

.ethics-page-hero .page-hero-title em{color:var(--gold)!important;font-style:italic;} 

.ethics-page-hero .ethics-meta{color:var(--cream)!important;font-size:0.82rem;text-align:center;} 

.ethics-page-hero .ethics-meta strong{color:var(--gold)!important;} 

.ethics-visual{min-height:auto;width:70%;aspect-ratio:3/4;margin:0 auto;} 

.ethics-body{padding:3rem 1.5rem;} 

.ethics-section{margin-bottom:2.5rem;padding-bottom:2.5rem;} 

/* Exports */ 

.exports-hero{padding:3rem 1.5rem;grid-template-columns:1fr!important;gap:2rem;} 

.exports-visual{min-height:200px;} 

.exports-hero-ctas{flex-direction:column;gap:0.8rem;} 

.exports-hero-ctas .btn-primary,.exports-hero-ctas .btn-outline{width:100%;text-align:center;} 

.exports-body{padding:3rem 1.5rem;} 

.exports-highlights{grid-template-columns:1fr!important;gap:1.5rem;} 

.exports-contact{padding:3rem 1.5rem;} 

.exports-contact-details{flex-direction:column;gap:1.5rem;} 

/* Footer */ 

footer{padding:2.5rem 1.5rem!important;grid-template-columns:1fr!important;gap:2rem;} 

.footer-bottom{padding:1rem 1.5rem!important;flex-direction:column;gap:0.5rem;text-align:center;} 

.whatsapp-bar{padding:0.8rem 1.5rem!important;flex-direction:column;gap:0.6rem;text-align:center;} 

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

/* Global text */ 

.section-title{font-size:clamp(1.8rem,7vw,2.2rem);} 

.eyebrow{font-size:0.58rem;} 

.products-header .btn-ghost{white-space:nowrap;font-size:0.6rem;} 

} 

 

/* ══ SMALL MOBILE ══ max-width 420px */ 

@media(max-width:420px){ 

.hero-headline{font-size:1.85rem;} 

.hero-left{padding:2rem 1.2rem;} 

.hero-right{min-height:240px;} 

.story-pillars{grid-template-columns:1fr 1fr;} 

.values-grid{grid-template-columns:1fr 1fr;} 

.ethics-stats{flex-direction:column;gap:1rem;} 

.products-section{padding:2.5rem 1.2rem;} 

.certs-bar{padding:1.5rem 1.2rem;} 

.footer-cta-section{padding:3rem 1.2rem;} 

footer{padding:2rem 1.2rem!important;} 

} 

 

/* ══ DESKTOP DARK BACKGROUND FIXES ══ */ 

 

/* Exports hero - dark background */ 

.exports-hero { 

background: var(--deep) !important; 

} 

.exports-hero .section-title { color: var(--cream) !important; } 

.exports-hero .section-title em { color: var(--gold) !important; } 

.exports-hero .eyebrow { color: var(--gold) !important; } 

.exports-hero .exports-hero-body { color: rgba(245,239,224,0.65) !important; } 

.exports-hero .exports-visual { background: rgba(184,137,42,0.2) !important; border: 1px solid rgba(184,137,42,0.15) !important; } 

.exports-hero .big-icon { opacity: 0.4; } 

 

/* Exports contact section - dark background */ 

.exports-contact { 

background: var(--earth) !important; 

} 

.exports-contact .eyebrow { color: var(--gold) !important; } 

.exports-contact .section-title { color: var(--cream) !important; } 

.exports-contact .section-title strong { color: var(--gold) !important; } 

.exports-contact-sub { color: rgba(245,239,224,0.65) !important; } 

.exports-contact-item p { color: rgba(245,239,224,0.55) !important; } 

.exports-contact-item strong, .exports-contact-item a { color: var(--gold) !important; } 

.exports-contact-item .icon { color: var(--cream); } 

 

/* Ethics hero - dark background */ 

.ethics-page-hero { 

background: var(--deep) !important; 

} 

.ethics-page-hero .page-hero-title { color: var(--cream) !important; } 

.ethics-page-hero .page-hero-title em { color: var(--gold) !important; } 

.ethics-page-hero .eyebrow { color: var(--cream) !important; } 

.ethics-page-hero .ethics-meta { color: var(--cream) !important; } 

.ethics-page-hero .ethics-meta strong { color: var(--gold) !important; } 

.ethics-visual { background: rgba(92,61,30,0.4) !important; border: 1px solid rgba(184,137,42,0.2) !important; } 

 

/* Ethics body - light background, dark text */ 

.ethics-body { background: var(--ivory) !important; } 

.ethics-section-title { color: var(--deep) !important; } 

.ethics-section p { color: rgba(46,26,14,0.75) !important; } 

.ethics-section-num { color: var(--gold) !important; } 

.ethics-bullets li { color: rgba(46,26,14,0.72) !important; } 

.ethics-bullets li strong { color: var(--earth) !important; } 

.ethics-bullets li::before { color: var(--gold) !important; } 

 

/* Contact info - dark background */ 

.contact-info { 

background: var(--earth) !important; 

} 

.contact-info .eyebrow { color: var(--gold) !important; } 

.contact-info .section-title { color: var(--cream) !important; } 

.contact-info .section-title strong { color: var(--gold) !important; } 

.contact-item-label { color: rgba(245,239,224,0.5) !important; } 

.contact-item-value { color: var(--cream) !important; } 

.contact-item-value a { color: var(--gold) !important; } 

 

/* Shop details - dark background */ 

#page-shop .shop-details { background: var(--ivory) !important; } 

#page-shop .shop-hero { background: var(--cream) !important; } 

#page-shop .page-hero-title { color: var(--deep) !important; } 

#page-shop .page-hero-title em { color: var(--earth) !important; } 

 

/* Mission hero dark */ 

.mission-hero { background: var(--deep) !important; } 

.mission-statement { color: var(--cream) !important; } 

.mission-statement em { color: var(--gold) !important; } 

.mission-body { color: rgba(245,239,224,0.65) !important; } 

.mission-text .eyebrow { color: var(--gold) !important; } 

 

/* About visual section */ 

.about-content { background: transparent; } 

 

/* Ethics banner dark */ 

.ethics-banner { background: var(--deep) !important; } 

 

/* Story section */ 

.story-content { background: var(--ivory) !important; } 

.story-title { color: var(--deep) !important; } 

.story-body { color: rgba(46,26,14,0.72) !important; } 

 

/* Home hero left */ 

.hero-left { background: var(--cream) !important; } 

 

/* SHOP PAGE - force dark text on light backgrounds */ 

#page-shop { background: var(--ivory) !important; } 

#page-shop .shop-hero { background: var(--cream) !important; } 

#page-shop .shop-hero .eyebrow { color: var(--gold) !important; } 

#page-shop .shop-product-name { color: var(--deep) !important; } 

#page-shop .shop-product-tagline { color: var(--gold) !important; } 

#page-shop .shop-hero .page-hero-title { color: var(--deep) !important; } 

#page-shop .shop-hero .page-hero-title em { color: var(--earth) !important; } 

#page-shop .shop-variant-label { color: rgba(46,26,14,0.5) !important; } 

#page-shop .shop-price { color: var(--earth) !important; } 

#page-shop .shop-price-note { color: rgba(46,26,14,0.5) !important; } 

#page-shop .shop-payment { background: rgba(92,61,30,0.07) !important; border-left: 2px solid var(--gold) !important; } 

#page-shop .shop-payment p { color: var(--earth) !important; } 

#page-shop .shop-desc h4 { color: rgba(46,26,14,0.5) !important; } 

#page-shop .shop-desc p { color: rgba(46,26,14,0.75) !important; } 

#page-shop .shop-ingredients h4 { color: rgba(46,26,14,0.5) !important; } 

#page-shop .shop-ingredients p { color: var(--earth) !important; } 

#page-shop .variant-btn { border-color: rgba(92,61,30,0.25) !important; color: var(--earth) !important; background: none !important; } 

#page-shop .variant-btn.active { background: var(--earth) !important; color: var(--cream) !important; border-color: var(--earth) !important; } 

#page-shop .btn-primary { background: var(--earth) !important; color: var(--cream) !important; } 

#page-shop .btn-outline { border-color: var(--earth) !important; color: var(--earth) !important; } 

#page-shop .shop-gallery { background: var(--ivory) !important; } 

#page-shop .shop-details { background: var(--ivory) !important; } 

 

/* ══════════════════════════════════════════ 

COMPLETE DESKTOP & MOBILE COLOR FIX 

All dark sections explicitly set 

══════════════════════════════════════════ */ 

 

/* NAV always cream */ 

nav { background: rgba(250,246,237,0.93) !important; } 

 

/* HOME - hero left cream, right has image */ 

.hero-left { background: var(--cream) !important; } 

.hero-headline { color: var(--deep) !important; } 

.hero-headline em { color: var(--earth) !important; } 

.hero-sub { color: var(--earth) !important; } 

 

/* HOME - ethics/quote banner dark */ 

.ethics-banner { background: var(--deep) !important; } 

.ethics-quote { color: var(--cream) !important; } 

.ethics-quote span { color: var(--gold) !important; } 

.stat-num { color: var(--gold) !important; } 

.stat-label { color: rgba(245,239,224,0.5) !important; } 

 

/* HOME - story section */ 

.story-content { background: var(--ivory) !important; } 

.story-section .section-title { color: var(--deep) !important; } 

.story-section .section-title strong { color: var(--earth) !important; } 

.story-body { color: rgba(46,26,14,0.72) !important; } 

.pillar { background: var(--ivory); border-left: 3px solid var(--gold); } 

.pillar-title { color: var(--earth) !important; } 

.pillar-text { color: rgba(46,26,14,0.6) !important; } 

 

/* HOME - footer CTA dark */ 

.footer-cta-section { background: var(--earth) !important; } 

.footer-cta-title { color: var(--cream) !important; } 

.footer-cta-sub { color: rgba(245,239,224,0.65) !important; } 

.footer-cta-section .eyebrow { color: var(--gold) !important; } 

 

/* HOME - products section */ 

.products-section { background: var(--cream) !important; } 

.products-title { color: var(--deep) !important; } 

.product-name { color: var(--deep) !important; } 

.product-desc { color: rgba(46,26,14,0.55) !important; } 

.product-price { color: var(--earth) !important; } 

.product-card { background: var(--ivory) !important; } 

 

/* STRIP scrolling bar */ 

.strip { background: var(--earth) !important; } 

.strip span { color: var(--cream) !important; } 

 

/* CERTS BAR */ 

.certs-bar { background: var(--ivory) !important; } 

.cert-label-text { color: rgba(46,26,14,0.4) !important; } 

.cert-item-text { color: var(--earth) !important; } 

 

/* ABOUT PAGE */ 

.about-content { background: transparent; } 

.about-visual { background: linear-gradient(160deg,#7A5230 0%,#3E220F 40%,#5C3D1E 100%); min-height: 500px; } 

.about-text { background: #2E1A0E !important; } 

.about-text * { color: #FAF6ED !important; } 

.about-text .eyebrow { color: #B8892A !important; } 

.about-text .section-title { color: #FAF6ED !important; } 

.about-text .section-title strong { color: #B8892A !important; } 

.about-text p { color: rgba(245,239,224,0.82) !important; } 

 

/* ABOUT - values section */ 

.values-section { background: var(--ivory) !important; } 

.values-section .section-title { color: var(--deep) !important; } 

.values-section .eyebrow { color: var(--gold) !important; } 

.value-card { background: var(--cream) !important; border-top: 3px solid var(--gold); } 

.value-icon { font-size: 1.8rem; } 

.value-title { color: var(--earth) !important; } 

.value-text { color: rgba(46,26,14,0.65) !important; } 

 

/* SHOP PAGE - dark theme (matches reference) */ 

#page-shop { background: #1c1a1a !important; } 

#page-shop .shop-hero { background: #1c1a1a !important; } 

#page-shop .shop-hero .eyebrow { color: var(--gold) !important; } 

#page-shop .shop-hero .page-hero-title { color: var(--cream) !important; } 

#page-shop .shop-hero .page-hero-title em { color: var(--gold) !important; } 

#page-shop .shop-product-name { color: var(--cream) !important; } 

#page-shop .shop-product-tagline { color: var(--gold) !important; } 

#page-shop .shop-variant-label { color: rgba(245,239,224,0.5) !important; } 

#page-shop .shop-price { color: var(--gold) !important; } 

#page-shop .shop-price-note { color: rgba(245,239,224,0.5) !important; } 

#page-shop .shop-payment { background: rgba(245,239,224,0.07) !important; border-left: 2px solid var(--gold) !important; } 

#page-shop .shop-payment p { color: rgba(245,239,224,0.75) !important; } 

#page-shop .shop-desc h4 { color: rgba(245,239,224,0.5) !important; } 

#page-shop .shop-desc p { color: rgba(245,239,224,0.75) !important; } 

#page-shop .shop-ingredients h4 { color: rgba(245,239,224,0.5) !important; } 

#page-shop .shop-ingredients p { color: rgba(245,239,224,0.75) !important; }

#page-shop .shop-variant-desc { color: rgba(245,239,224,0.55) !important; font-weight: 400 !important; }

#page-shop .shop-variant-title { color: var(--cream) !important; }

#page-shop .shop-variant-subtitle { color: #E4A588 !important; }

#page-shop .shop-variant-tag { color: var(--gold) !important; }

#page-shop .shop-variant-tag-cta { color: var(--gold) !important; }

#page-shop .variant-btn { border: 1px solid rgba(245,239,224,0.3) !important; color: rgba(245,239,224,0.8) !important; background: none !important; } 

#page-shop .variant-btn.active { background: var(--gold) !important; color: var(--cream) !important; border-color: var(--gold) !important; } 

#page-shop .btn-primary { background: var(--gold) !important; color: var(--deep) !important; } 

#page-shop .btn-outline { border-color: rgba(245,239,224,0.3) !important; color: var(--cream) !important; } 

#page-shop .shop-gallery { background: #1c1a1a !important; } 

#page-shop .shop-details { background: #1c1a1a !important; } 

 

/* MISSION PAGE */ 

.mission-hero { background: var(--deep) !important; } 

.mission-text .eyebrow { color: var(--gold) !important; } 

.mission-statement { color: var(--cream) !important; } 

.mission-statement em { color: var(--gold) !important; } 

.mission-body { color: rgba(245,239,224,0.65) !important; } 

.mission-visual { background: linear-gradient(135deg,#6B7B52 0%,#4A5838 100%) !important; } 

 

/* MISSION - commitments */ 

.commitments-section { background: var(--cream) !important; } 

.commitments-section .section-title { color: var(--deep) !important; } 

.commitments-section .eyebrow { color: var(--gold) !important; } 

.commitment-item { background: var(--ivory); border-left: 3px solid var(--gold); } 

.commitment-title { color: var(--earth) !important; } 

.commitment-text { color: rgba(46,26,14,0.65) !important; } 

 

/* BLOG PAGE */ 

.blog-grid { background: var(--cream) !important; } 

.page-header { background: var(--cream) !important; } 

.page-header .page-hero-title { color: var(--deep) !important; } 

.page-header .page-hero-title em { color: var(--earth) !important; } 

.page-header .page-hero-sub { color: rgba(46,26,14,0.7) !important; } 

.page-header .eyebrow { color: var(--gold) !important; } 

.blog-card { background: var(--cream) !important; } 

.blog-tag { color: var(--gold) !important; } 

.blog-card-title { color: var(--deep) !important; } 

.blog-excerpt { color: rgba(46,26,14,0.65) !important; } 

.blog-post-content h2, .blog-post-content h3 { color: var(--deep) !important; } 

.blog-post-content p, .blog-post-content li { color: rgba(46,26,14,0.75) !important; } 

.blog-post-content strong { color: var(--earth) !important; } 

.back-link { color: var(--earth) !important; } 

 

/* CONTACT PAGE */ 

.contact-info { background: var(--earth) !important; } 

.contact-info .eyebrow { color: var(--gold) !important; } 

.contact-info .section-title { color: var(--cream) !important; } 

.contact-info .section-title strong { color: var(--gold) !important; } 

.contact-item-label { color: rgba(245,239,224,0.5) !important; } 

.contact-item-value { color: var(--cream) !important; } 

.contact-item-value a { color: var(--gold) !important; } 

.contact-map { background: var(--cream) !important; } 

.contact-map .section-title { color: var(--deep) !important; } 

.contact-map .section-title strong { color: var(--earth) !important; } 

.contact-map .contact-note { color: rgba(46,26,14,0.6) !important; } 

 

/* CODE OF ETHICS */ 

.ethics-page-hero { background: var(--deep) !important; } 

.ethics-page-hero .page-hero-title { color: var(--cream) !important; } 

.ethics-page-hero .page-hero-title em { color: var(--gold) !important; } 

.ethics-page-hero .eyebrow { color: var(--cream) !important; } 

.ethics-page-hero .ethics-meta { color: var(--cream) !important; } 

.ethics-page-hero .ethics-meta strong { color: var(--gold) !important; } 

.ethics-visual { background: rgba(92,61,30,0.5) !important; border: 1px solid rgba(184,137,42,0.2) !important; } 

.ethics-body { background: var(--ivory) !important; } 

.ethics-section-num { color: var(--gold) !important; } 

.ethics-section-title { color: var(--deep) !important; } 

.ethics-section { border-bottom: 1px solid rgba(92,61,30,0.12); } 

.ethics-section p { color: rgba(46,26,14,0.75) !important; } 

.ethics-bullets li { color: rgba(46,26,14,0.72) !important; } 

.ethics-bullets li strong { color: var(--earth) !important; } 

.ethics-bullets li::before { color: var(--gold) !important; } 

 

/* EXPORTS PAGE */ 

.exports-hero { background: var(--deep) !important; } 

.exports-hero .section-title { color: var(--cream) !important; } 

.exports-hero .section-title em { color: var(--gold) !important; } 

.exports-hero .eyebrow { color: var(--gold) !important; } 

.exports-hero-body { color: rgba(245,239,224,0.65) !important; } 

.exports-visual { background: rgba(184,137,42,0.2) !important; border: 1px solid rgba(184,137,42,0.15) !important; min-height: 380px; display: flex; align-items: center; justify-content: center; flex-direction: column; position: relative; overflow: hidden; } 

.exports-body { background: var(--ivory) !important; } 

.exports-body .section-title { color: var(--deep) !important; } 

.exports-body .eyebrow { color: var(--gold) !important; } 

.exports-body > p { color: rgba(46,26,14,0.72) !important; } 

.export-card { background: var(--cream) !important; border-top: 3px solid var(--gold); } 

.export-card-title { color: var(--earth) !important; } 

.export-card-text { color: rgba(46,26,14,0.62) !important; } 

.exports-contact { background: var(--earth) !important; } 

.exports-contact .eyebrow { color: var(--gold) !important; } 

.exports-contact .section-title { color: var(--cream) !important; } 

.exports-contact .section-title strong { color: var(--gold) !important; } 

.exports-contact-sub { color: rgba(245,239,224,0.65) !important; } 

.exports-contact-item p { color: rgba(245,239,224,0.55) !important; } 

.exports-contact-item strong, .exports-contact-item a { color: var(--gold) !important; } 

 

/* ══ FOOTER ALWAYS DARK ══ */ 

footer{background:#2E1A0E!important;display:grid!important;} 

.footer-brand .nav-logo{color:#FAF6ED!important;} 

.footer-brand p{color:rgba(245,239,224,0.55)!important;} 

.footer-col h4{color:#B8892A!important;} 

.footer-col ul li a{color:rgba(245,239,224,0.6)!important;cursor:pointer;} 

.footer-col p{color:rgba(245,239,224,0.6)!important;} 

.footer-bottom p{color:rgba(245,239,224,0.35)!important;} 

.social-links a{color:rgba(245,239,224,0.45)!important;} 

.whatsapp-bar p{color:var(--ivory)!important;} 

.whatsapp-btn{background:var(--ivory)!important;color:#6B7B52!important;} 

 

/* footer-cta and certs ONLY on home */ 

.footer-cta-section{display:none!important;} 

.certs-bar{display:none!important;} 

#page-home.active .footer-cta-section{display:block!important;} 

#page-home.active .certs-bar{display:flex!important;} 

 

/* ══ FOOTER RESPONSIVE ══ */ 

/* Desktop footer (>=1025px) - see comprehensive block at end of file */ 

/* Tablet (768px–1024px) */ 

@media(min-width:768px) and (max-width:1024px){ 

footer{padding:2.5rem 2rem!important;grid-template-columns:1fr 1fr!important;gap:2rem!important;} 

.footer-bottom{display:flex!important;background:#2E1A0E!important;padding:1rem 2rem!important;justify-content:space-between;border-top:1px solid rgba(245,239,224,0.08);} 

.whatsapp-bar{display:flex!important;background:#6B7B52!important;padding:0.6rem 2rem!important;align-items:center;justify-content:space-between;} 

} 

/* Mobile (<=767px) */ 

@media(max-width:767px){ 

footer{padding:2.5rem 1.5rem!important;grid-template-columns:1fr!important;gap:2rem!important;} 

.footer-bottom{display:flex!important;background:#2E1A0E!important;padding:1rem 1.5rem!important;flex-direction:column;gap:0.5rem;text-align:center;border-top:1px solid rgba(245,239,224,0.08);} 

.whatsapp-bar{display:flex!important;background:#6B7B52!important;padding:0.8rem 1.5rem!important;flex-direction:column;gap:0.6rem;text-align:center;} 

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

} 

/* Small mobile (<=420px) */ 

@media(max-width:420px){ 

footer{padding:2rem 1.2rem!important;} 

.footer-bottom{padding:0.8rem 1.2rem!important;} 

.whatsapp-bar{padding:0.6rem 1.2rem!important;} 

} 


/* ══════════════════════════════════════════════════════════
   COMPREHENSIVE DESKTOP LAYOUT (≥1025px)
   All desktop structure, spacing, grids, and typography
══════════════════════════════════════════════════════════ */

@media(min-width:1025px){

  /* ── NAV ── */
  nav {
    padding: 4rem 1rem !important;
    height: 72px !important;
  }
  #ham { display: none !important; }
  #mob-nav { display: none !important; }
  .nav-links {
    display: flex !important;
    gap: 0.2rem;
    align-items: center;
  }
  .nav-links li a {
    font-size: 0.7rem;
    padding: 0.5rem;
    letter-spacing: 0.1em;
    white-space: nowrap;
  }
  .nav-links li a.nav-cta {
    padding: 0.55rem 1.2rem;
    border-radius: 2px;
    margin-left: 0.4rem;
  }
  .nav-logo { font-size: 1.2rem; }
  .page { padding-top: 72px; }

  /* ── GLOBAL TYPOGRAPHY ── */
  .section-title { font-size: clamp(2rem, 3vw, 3rem); }
  .eyebrow { font-size: 0.65rem; letter-spacing: 0.3em; }
  .btn-primary { font-size: 0.7rem; padding: 0.9rem 2.4rem; }
  .btn-outline { font-size: 0.7rem; padding: 0.85rem 2rem; }
  .btn-ghost { font-size: 0.7rem; }

  /* ═════════════════════════
     HOME PAGE
  ═════════════════════════ */

  /* Hero */
  .hero {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    min-height: calc(100vh - 72px) !important;
  }
  .hero-left {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 5rem 5rem 5rem 6rem !important;
  }
  .hero-right {
    min-height: 500px !important;
    position: relative !important;
    overflow: hidden !important;
  }
  .hero-headline { font-size: clamp(2.8rem, 4.5vw, 5rem) !important; line-height: 1.08 !important; }
  .hero-sub { max-width: 420px !important; font-size: 0.95rem !important; line-height: 1.85 !important; }
  .hero-ctas { margin-top: 2.5rem !important; display: flex !important; gap: 1.4rem !important; align-items: center !important; }
  .hero-badge { bottom: 2.5rem !important; left: 2.5rem !important; }

  /* Strip */
  .strip { padding: 0.85rem 0 !important; }

  /* Story */
  .story-section {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    min-height: 80vh !important;
  }
  .story-visual { min-height: 500px !important; position: relative !important; overflow: hidden !important; }
  .story-content {
    padding: 5rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
  }
  .story-body { max-width: 440px !important; font-size: 0.92rem !important; line-height: 1.9 !important; }
  .story-pillars {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 1.2rem !important;
    margin-top: 2.5rem !important;
  }

  /* Ethics Banner */
  .ethics-banner {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 5rem 8rem !important;
    gap: 5rem !important;
  }
  .ethics-quote { max-width: 580px !important; font-size: clamp(1.5rem, 2.2vw, 2.3rem) !important; }
  .ethics-stats { flex-direction: column !important; gap: 1.8rem !important; min-width: 200px !important; }

  /* Products */
  .products-section {
    padding: 4rem 6rem !important;
  }
  .products-header {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    margin-bottom: 2.5rem !important;
  }
  .products-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 2.5rem !important;
  }
  .product-card {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    background: var(--cream) !important;
    box-shadow: 0 2px 16px rgba(46,26,14,0.08) !important;
    height: 240px !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
  }
  .product-card:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 28px rgba(46,26,14,0.13) !important;
  }
  .product-img {
    flex: 0 0 38% !important;
    max-width: 38% !important;
    height: 240px !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
    position: relative !important;
  }
  .product-img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
  }
  .product-badge {
    position: absolute !important;
    top: 0.8rem !important;
    left: 0.8rem !important;
    z-index: 2 !important;
    font-size: 0.55rem !important;
    padding: 0.3rem 0.6rem !important;
  }
  .product-info {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 1.8rem 2.2rem !important;
    border-left: 3px solid var(--gold) !important;
  }
  .product-name {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 1.4rem !important;
    font-weight: 500 !important;
    line-height: 1.25 !important;
    color: var(--deep) !important;
    margin: 0 0 0.5rem 0 !important;
  }
  .product-desc {
    font-size: 0.82rem !important;
    font-weight: 300 !important;
    line-height: 1.65 !important;
    color: rgba(46,26,14,0.6) !important;
    margin: 0 !important;
    max-width: 380px !important;
  }
  .product-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-top: auto !important;
    padding-top: 1rem !important;
    border-top: 1px solid rgba(92,61,30,0.08) !important;
  }
  .product-price {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 1.1rem !important;
    font-weight: 600 !important;
    color: var(--earth) !important;
  }
  .product-footer .btn-ghost {
    font-size: 0.62rem !important;
    letter-spacing: 0.18em !important;
  }

  /* Certs Bar */
  .certs-bar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 3rem 6rem !important;
    gap: 2rem !important;
  }
  .cert-items { display: flex !important; gap: 2.5rem !important; flex-wrap: wrap !important; }

  /* Footer CTA */
  .footer-cta-section {
    padding: 6rem 8rem !important;
    text-align: center !important;
    position: relative !important;
    overflow: hidden !important;
  }
  .footer-cta-title { font-size: clamp(2rem, 3.5vw, 3.5rem) !important; }
  .footer-cta-sub { max-width: 450px !important; margin: 1.2rem auto 0 !important; font-size: 0.9rem !important; }

  /* ═════════════════════════
     ABOUT PAGE
  ═════════════════════════ */
  .page-header {
    padding: 5rem 6rem 4rem !important;
  }
  .page-header-inner { max-width: 700px; }
  .page-hero-title { font-size: clamp(2.5rem, 3.5vw, 4rem); line-height: 1.1; }
  .page-hero-sub { max-width: 560px; font-size: 0.92rem; line-height: 1.85; }

  .about-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .about-visual { min-height: 500px; position: relative; overflow: hidden; }
  .about-text {
    padding: 5rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
  }
  .about-text p { font-size: 0.92rem; line-height: 1.9; }

  .values-section {
    padding: 5rem 6rem !important;
  }
  .values-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    margin-top: 3rem;
  }
  .value-card { padding: 2rem 1.5rem; }

  /* ═════════════════════════
     MISSION PAGE
  ═════════════════════════ */
  .mission-hero {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 5rem !important;
    align-items: center !important;
    padding: 6rem !important;
  }
  .mission-visual { min-height: 420px; border-radius: 2px; overflow: hidden; }
  .mission-statement { font-size: clamp(1.6rem, 2.5vw, 2.5rem); line-height: 1.35; }
  .mission-body { font-size: 0.9rem; line-height: 1.85; max-width: 520px; }

  .commitments-section {
    padding: 5rem 6rem !important;
  }
  .commitments-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
    margin-top: 3rem;
  }
  .commitment-item {
    padding: 2rem;
    display: flex;
    gap: 1.2rem;
  }

  /* ═════════════════════════
     SHOP PAGE
  ═════════════════════════ */
  .shop-hero {
    padding: 4rem 6rem 3rem !important;
  }
  .shop-product-main {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
  }
  .shop-gallery {
    padding: 4rem 4rem 4rem 6rem !important;
  }
  .shop-gallery-main { aspect-ratio: 1; margin-bottom: 1rem; }
  .shop-thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; }
  .shop-details {
    padding: 4rem 6rem 4rem 3rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
  }
  .shop-product-name { font-size: clamp(1.8rem, 2.5vw, 2.5rem); line-height: 1.2; }
  .shop-price { font-size: 2rem; }
  .variant-options { display: flex; gap: 0.6rem; }
  .shop-cta-wrap { display: flex; gap: 1rem; align-items: center; margin-top: 2rem; }

  /* ═════════════════════════
     BLOG PAGE
  ═════════════════════════ */
  .blog-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 2.5rem !important;
    padding: 4rem 6rem !important;
  }
  .blog-card { overflow: hidden; }
  .blog-img { aspect-ratio: 16/9; }
  .blog-card-body { padding: 1.8rem 2rem 2.2rem; }
  .blog-card-title { font-size: 1.6rem; line-height: 1.25; }
  .blog-excerpt { font-size: 0.84rem; line-height: 1.75; }
  .blog-post-content {
    max-width: 760px;
    margin: 0 auto;
    padding: 4rem 2rem 6rem;
  }

  /* ═════════════════════════
     CONTACT PAGE
  ═════════════════════════ */
  .contact-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 70vh;
  }
  .contact-info {
    padding: 6rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
  }
  .contact-items { margin-top: 3rem !important; display: flex !important; flex-direction: column !important; gap: 2rem !important; }
  .contact-map {
    padding: 6rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
  }
  .map-placeholder { width: 100%; aspect-ratio: 4/3; }

  /* ═════════════════════════
     CODE OF ETHICS PAGE
  ═════════════════════════ */
  .ethics-page-hero {
    display: grid !important;
    grid-template-columns: 1.2fr 1fr !important;
    gap: 5rem !important;
    align-items: center !important;
    padding: 6rem !important;
  }
  .ethics-visual { min-height: 350px !important; }
  .ethics-body {
    padding: 5rem 8rem !important;
  }
  .ethics-section {
    margin-bottom: 3.5rem;
    padding-bottom: 3.5rem;
  }
  .ethics-section-title { font-size: 1.7rem; margin-bottom: 1.2rem; }
  .ethics-section p { font-size: 0.9rem; line-height: 1.85; }

  /* ═════════════════════════
     EXPORTS PAGE
  ═════════════════════════ */
  .exports-hero {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5rem;
    align-items: center;
    padding: 6rem clamp(4rem, 8vw, 10rem);
  }
  .exports-visual { min-height: 380px; }
  .exports-hero-body { font-size: 0.92rem; line-height: 1.85; }
  .exports-hero-ctas { margin-top: 2rem; display: flex; gap: 1.2rem; }

  .exports-body {
    padding: 5rem clamp(4rem, 8vw, 10rem);
  }
  .exports-body > p { font-size: 0.92rem; line-height: 1.85; max-width: 700px; }
  .exports-highlights {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    margin-top: 3rem;
  }
  .export-card { padding: 2rem; }
  .export-card-title { font-size: 1.2rem; }
  .export-card-text { font-size: 0.82rem; line-height: 1.65; }

  .exports-contact {
    padding: 5rem clamp(4rem, 8vw, 10rem);
    text-align: center;
  }
  .exports-contact-details {
    margin-top: 2.5rem;
    display: flex;
    justify-content: center;
    gap: 3rem;
    flex-wrap: wrap;
  }

  /* ═════════════════════════
     FOOTER
  ═════════════════════════ */
  footer {
    padding: 3rem 4rem 2rem !important;
    grid-template-columns: 1fr 1fr 1fr !important;
    gap: 3rem !important;
  }
  .footer-brand p { max-width: 280px !important; line-height: 1.7 !important; }
  .footer-col h4 { margin-bottom: 1rem !important; }
  .footer-col ul li { margin-bottom: 0.5rem !important; }

  .footer-bottom {
    display: flex !important;
    background: #2E1A0E !important;
    padding: 1.2rem 4rem !important;
    justify-content: space-between !important;
    align-items: center !important;
    border-top: 1px solid rgba(245,239,224,0.08) !important;
  }

  .whatsapp-bar {
    display: flex !important;
    background: #6B7B52 !important;
    padding: 0.7rem 4rem !important;
    align-items: center !important;
    justify-content: space-between !important;
  }

  /* ── DIVIDER ── */
  .divider { margin: 0 6rem !important; }
}


/* ══════════════════════════════════════════════════════════
   EXTRA-WIDE SCREENS (≥1600px)
   Additional containment for ultra-wide monitors
══════════════════════════════════════════════════════════ */

@media(min-width:1600px){
  nav { padding: 0 8rem; }

  .hero-left { padding: 5rem 5rem 5rem 10rem; }
  .hero-headline { font-size: 5rem; }

  .story-content { padding: 5rem 6rem; }

  .ethics-banner { padding: 5rem 16rem; }

  .products-section { padding: 5rem 12rem !important; }
  .products-grid { gap: 2.5rem !important; }
  .product-card { height: 360px !important; }
  .product-img { flex: 0 0 35% !important; width: 35% !important; }
  .product-info { padding: 3rem 4rem !important; }
  .product-name { font-size: 1.8rem !important; }

  .certs-bar { padding: 3rem 12rem; }

  .footer-cta-section { padding: 6rem 16rem; }

  .page-header { padding: 5rem 12rem 4rem; }

  .about-text { padding: 5rem 6rem; }

  .values-section { padding: 5rem 12rem; }

  .mission-hero { padding: 6rem 12rem; }

  .commitments-section { padding: 5rem 12rem; }

  .shop-hero { padding: 4rem 12rem 3rem; }
  .shop-gallery { padding: 4rem 4rem 4rem 8rem; }
  .shop-details { padding: 4rem 8rem 4rem 3rem; }

  .blog-grid { padding: 4rem 12rem; }

  .contact-info { padding: 6rem 8rem; }
  .contact-map { padding: 6rem 8rem; }

  .ethics-page-hero { padding: 6rem 12rem; }
  .ethics-body { padding: 5rem 18rem; }

  .exports-hero { padding: 6rem 12rem; }
  .exports-body { padding: 5rem 12rem; }
  .exports-contact { padding: 5rem 12rem; }

  footer { padding: 3rem 8rem 2rem !important; }
  .footer-bottom { padding: 1.2rem 8rem !important; }
  .whatsapp-bar { padding: 0.7rem 8rem !important; }

  .divider { margin: 0 12rem; }
}