:root{--paper:#f3dfb5;--paper2:#ead0a0;--cream:#f9ebca;--ink:#082f37;--rust:#a54818;--brown:#7d3717;--gold:#e0a137;--line:#bd8750;--max:1360px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#25231f;background:var(--paper);font-family:'Roboto Slab',Georgia,serif;background-image:linear-gradient(rgba(95,55,20,.025) 1px,transparent 1px),radial-gradient(circle at 30% 10%,rgba(255,255,255,.35),transparent 30%);background-size:100% 5px,auto}a{text-decoration:none;color:inherit}img{display:block;max-width:100%}.wrap{width:100%;max-width:1536px;margin:0 auto;padding-left:clamp(22px,4vw,72px);padding-right:clamp(22px,4vw,72px)}
.top{height:104px;background:#f4e2bd;border-bottom:1px solid rgba(110,60,20,.13);position:relative;z-index:20}.nav{height:104px;display:flex;align-items:center;gap:28px}.brand{width:220px;flex:none}.brand img{width:100%;mix-blend-mode:multiply}.links{display:flex;align-items:center;gap:34px;margin-left:auto;font:700 14px/1 'Oswald',Arial,sans-serif}.links a{padding:14px 0 11px;border-bottom:2px solid transparent}.links a.active,.links a:hover{color:var(--rust);border-color:var(--rust)}.cart{font:600 16px 'Oswald',sans-serif;white-space:nowrap}.order,.ctaButton,.darkButton{background:var(--rust);color:#fff;border-radius:4px;padding:15px 23px;font:700 14px 'Oswald',sans-serif;letter-spacing:.035em}.menuBtn{display:none}
.approvedHero{height:350px;position:relative;overflow:hidden;background:#d8b77e}.heroScene{position:absolute;inset:0;background:url('hero-approved-1800.webp') center/cover no-repeat}.heroLayout{height:100%;position:relative}.heroPlaque{position:absolute;left:78px;top:26px;width:515px;height:292px;background:#f7e8c4;border:3px solid #9b4b1c;border-radius:34% 34% 32% 32% / 15% 15% 14% 14%;box-shadow:0 0 0 5px rgba(247,232,196,.92),0 0 0 7px rgba(126,58,20,.38);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.plaqueTop{font:700 19px 'Oswald',sans-serif;letter-spacing:.13em;color:var(--brown);margin-bottom:6px}.heroPlaque h1{font:700 52px/.95 'Oswald',sans-serif;color:var(--ink);margin:0;letter-spacing:.01em}.scriptLine{font:italic 28px/1 Georgia,serif;color:var(--rust);margin:16px 0 10px}.chemLine{font:700 17px 'Oswald',sans-serif;letter-spacing:.08em;color:var(--ink)}.beeMark{margin-top:10px;color:var(--brown)}.yardStamp{position:absolute;right:108px;top:28px;width:118px;height:118px;border:3px solid #8d491f;border-radius:50%;background:#f4dfb6;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#281f18;transform:rotate(-4deg);box-shadow:0 0 0 4px rgba(244,223,182,.65)}.yardStamp span{font:700 14px 'Oswald',sans-serif;letter-spacing:.1em}.yardStamp b{font:700 20px 'Oswald',sans-serif;margin-top:6px}
.benefitBand{background:#082d35;color:#f7ead0;border-top:3px solid #0b3138}.benefitGrid{display:grid;grid-template-columns:repeat(4,1fr)}.benefit{min-height:92px;padding:13px 24px;display:flex;gap:16px;align-items:center;border-right:1px solid rgba(255,255,255,.2)}.benefit:last-child{border:0}.roundIcon{width:58px;height:58px;border:2px solid var(--gold);border-radius:50%;display:grid;place-items:center;color:#f3b64e;font-size:25px;flex:none}.benefit b{font:700 14px 'Oswald',sans-serif;color:#f1b34d;letter-spacing:.02em}.benefit p{font-size:13px;line-height:1.4;margin:5px 0 0}
.honeySection{padding:12px 0 18px}.sectionHeading{display:grid;grid-template-columns:1fr auto 1fr;gap:18px;align-items:center;width:470px;max-width:100%;margin:0 auto 6px}.sectionHeading span{height:1px;background:#a95c25}.sectionHeading h2{font:700 34px 'Oswald',sans-serif;color:var(--ink);margin:0}.honeyGrid{display:grid;grid-template-columns:repeat(4,1fr) 1.03fr;gap:14px;align-items:stretch}.honeyCard,.shopCta{border:1px solid #bd8851;background:rgba(249,235,202,.72);border-radius:9px;padding:10px;text-align:center;min-width:0}.honeyCard{display:flex;flex-direction:column}.honeyCard h3{font:700 19px/1.03 'Oswald',sans-serif;color:var(--ink);height:42px;margin:2px 0 7px;display:flex;align-items:center;justify-content:center}.honeyCard img{width:100%;aspect-ratio:1.08/1;object-fit:cover}.honeyCard span{border:1px solid #a65b25;border-radius:3px;padding:6px 12px;margin:9px auto 0;font:700 12px 'Oswald',sans-serif;color:#4b2a16}.shopCta{display:flex;flex-direction:column;justify-content:center;padding:18px 16px}.shopCta h3{font:700 34px/.98 'Oswald',sans-serif;color:var(--ink);margin:0 0 12px}.shopCta p{font-size:14px;line-height:1.5;margin:9px 0 18px}.miniBee{color:var(--brown)}.shopCta .ctaButton{margin:auto auto 0}
.aboutStrip{border-top:1px solid rgba(130,75,35,.18);background:rgba(239,215,170,.6);padding-top:22px}.aboutGrid{display:grid;grid-template-columns:.72fr 1.45fr;gap:35px;align-items:end}.aboutText{padding:8px 0 28px}.eyebrow{font:700 14px 'Oswald',sans-serif;color:var(--rust);letter-spacing:.13em}.aboutText h2{font:700 42px/1.02 'Oswald',sans-serif;color:var(--ink);margin:6px 0 14px}.aboutText h2 em{font-family:Georgia,serif;font-weight:400;color:var(--rust)}.aboutText p{font-size:16px;line-height:1.55;max-width:470px}.darkButton{display:inline-block;background:var(--ink);margin-top:8px}.aboutGrid>img{width:100%;height:305px;object-fit:cover;object-position:center 58%;mix-blend-mode:multiply}.motto{background:#082d35;color:#f0c26e;text-align:center;padding:21px 20px;font:italic 24px Georgia,serif}
.footer{background:#e5c995;border-top:1px solid #b9854c;padding:30px 0 42px}.footgrid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:30px}.footerLogo{width:190px;mix-blend-mode:multiply}.footer h4{font:700 14px 'Oswald',sans-serif;color:var(--ink);margin:0 0 8px}.footer a{display:block;font-size:13px;line-height:1.8}
/* inner pages keep the same approved BeeCool shell */
.hero{position:relative;overflow:hidden;border-bottom:5px solid var(--ink)}.hero .wrap{min-height:460px;display:grid;grid-template-columns:1fr 1fr;align-items:center}.hero.art-about{background:linear-gradient(90deg,rgba(244,226,188,.98) 0 42%,rgba(244,226,188,.14) 64%),url('hero-about-1800.webp') right/65% 100% no-repeat}.hero.art-nature{background:linear-gradient(90deg,rgba(244,226,188,.98) 0 40%,rgba(244,226,188,.1) 62%),url('hero-nature-1800.webp') right/70% 100% no-repeat}.display{font:700 clamp(48px,6vw,78px)/.95 'Oswald',sans-serif;color:var(--ink);text-transform:uppercase;margin:8px 0 16px}.script{font:italic clamp(26px,3vw,40px) Georgia,serif;color:var(--rust)}.lead{font-size:18px;line-height:1.55}.section{padding:58px 0}.section h2,.pageTitle h1{font-family:'Oswald',sans-serif;color:var(--ink)}.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.card,.news article,.contactBox{background:rgba(249,235,202,.72);border:1px solid var(--line);border-radius:8px;padding:20px}.storyRow{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.story{background:var(--ink);color:#fff}.story img{width:100%;height:205px;object-fit:cover}.story div{padding:18px}.story h3{font:700 16px 'Oswald',sans-serif;color:#f1b34d}.quote{background:var(--cream);border:1px solid var(--line);padding:30px;text-align:center;font:italic 28px Georgia,serif;color:var(--rust)}.split{display:grid;grid-template-columns:1fr 1.2fr;gap:35px;align-items:center}.pageTitle{text-align:center;padding:36px 0 10px}.pageTitle h1{font-size:48px}.news{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.notice{padding:18px;border-left:4px solid var(--rust);background:rgba(249,235,202,.7)}
@media(max-width:980px){.wrap{width:min(var(--max),calc(100% - 34px))}.top,.nav{height:88px}.brand{width:185px}.links,.order,.cart{display:none}.menuBtn{display:block;margin-left:auto;border:1px solid #a66c3b;background:transparent;border-radius:4px;padding:9px 12px}.nav.open{height:auto;min-height:88px;flex-wrap:wrap;padding-bottom:16px}.nav.open .links{display:flex;flex-direction:column;width:100%;align-items:flex-start;gap:5px;order:4}.nav.open .order{display:inline-block;order:5}.approvedHero{height:570px}.heroScene{background-position:center}.heroPlaque{left:50%;transform:translateX(-50%);top:28px;width:min(540px,85%)}.yardStamp{right:5%;top:330px}.benefitGrid{grid-template-columns:repeat(2,1fr)}.honeyGrid{grid-template-columns:repeat(2,1fr)}.shopCta{min-height:260px}.aboutGrid,.footgrid,.split{grid-template-columns:1fr}.aboutGrid>img{height:280px}.grid4{grid-template-columns:repeat(2,1fr)}.storyRow,.news{grid-template-columns:1fr}}
@media(max-width:600px){.wrap{width:calc(100% - 22px)}.brand{width:155px}.approvedHero{height:515px}.heroPlaque{top:22px;width:90%;height:280px;padding:15px}.heroPlaque h1{font-size:40px}.plaqueTop{font-size:15px}.scriptLine{font-size:24px}.chemLine{font-size:14px}.yardStamp{width:95px;height:95px;right:5%;top:360px}.yardStamp b{font-size:16px}.benefitGrid,.honeyGrid,.grid4{grid-template-columns:1fr}.benefit{border-right:0;border-bottom:1px solid rgba(255,255,255,.18)}.sectionHeading{width:100%}.shopCta{min-height:240px}.aboutText h2{font-size:36px}.footgrid{grid-template-columns:1fr}.hero .wrap{grid-template-columns:1fr;min-height:520px}}


/* BeeCool v4 — full-width approved layout */
html,body{width:100%;max-width:none;overflow-x:hidden}
.top{width:100%}
.nav{width:100%}
.approvedHero{height:auto;min-height:0;width:100%;background:none;overflow:hidden}
.approvedHero .heroScene,.approvedHero .heroLayout,.approvedHero .heroPlaque,.approvedHero .yardStamp{display:none!important}
.approvedHero>img{display:block;width:100%;height:auto;max-width:none;object-fit:cover}
.benefitBand{width:100%}
.benefitBand .wrap{max-width:none;padding-left:clamp(22px,4vw,72px);padding-right:clamp(22px,4vw,72px)}
.honeySection>.wrap,.aboutStrip>.wrap,.footer>.wrap{max-width:1536px}
.honeySection{width:100%}
.honeyGrid{width:100%}
.aboutStrip{width:100%}
.footer{width:100%}
@media (min-width:1200px){
  .nav{gap:30px}
  .links{gap:30px}
  .benefit{padding-left:20px;padding-right:20px}
}
@media(max-width:980px){
  .wrap{width:100%;padding-left:18px;padding-right:18px}
  .approvedHero{height:auto}
  .benefitBand .wrap{padding-left:0;padding-right:0}
}
@media(max-width:600px){
  .wrap{width:100%;padding-left:12px;padding-right:12px}
}

/* Targeted production fixes: shared typography, content and navigation. */
button{font-family:inherit;color:inherit}
a:focus-visible,button:focus-visible{outline:3px solid var(--rust);outline-offset:4px}
.textLink{text-decoration:underline;text-underline-offset:3px}
.visuallyHidden,.skipLink:not(:focus){position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skipLink:focus{position:fixed;top:8px;left:8px;z-index:100000;background:var(--cream);padding:12px;color:var(--ink)}
/* The banner contains a stray fragment at its very top, outside the scene. */
.approvedHero>img{margin-top:-0.5%;width:100%}
.links a,.order{white-space:nowrap}
.footerBrand img{width:190px;mix-blend-mode:multiply}
.products{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.product{min-width:0;background:rgba(249,235,202,.72);border:1px solid var(--line);border-radius:8px;padding:16px;display:flex;flex-direction:column}
.product img{width:100%;height:auto;aspect-ratio:1;object-fit:cover}
.product h3,.card h3,.news h2{font-family:'Oswald',sans-serif;color:var(--ink)}
.product p:last-child{margin-top:auto;padding-top:12px}
.unavailable{display:inline-block;border:1px solid var(--line);border-radius:4px;padding:10px 14px;color:#604728;cursor:default}
.aboutCopy{max-width:960px;line-height:1.8}
.aboutCopy h2{line-height:1.25;margin-top:1.8em}
.aboutCopy h2:first-child{margin-top:0}
.news p,.card p,.contactBox p{line-height:1.65}
.hero .wrap>div,.benefit>div{min-width:0}
@media(max-width:1180px){
 .top{height:auto;min-height:88px}.nav{height:88px;gap:20px;background:#f4e2bd}
 .brand{width:185px}.links,.order,.cart{display:none}
 .menuBtn{display:block;margin-left:auto;border:1px solid #a66c3b;background:transparent;border-radius:4px;padding:10px 14px;min-height:44px;min-width:44px}
 .nav.open{height:auto;min-height:88px;flex-wrap:wrap;padding-top:6px;padding-bottom:16px}
 .nav.open .links{display:flex;flex-direction:column;flex-basis:100%;align-items:stretch;gap:0;order:4;margin:0}
 .nav.open .links a{min-height:44px;display:flex;align-items:center}
 .nav.open .order{display:inline-block;order:5}
 .benefitGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:980px){.products{grid-template-columns:repeat(2,minmax(0,1fr))}.hero .wrap{gap:16px;padding-top:28px;padding-bottom:28px}.display{font-size:clamp(40px,6vw,66px)}}
@media(max-width:600px){
 .brand{width:155px}.products,.benefitGrid{grid-template-columns:1fr}
 .hero.art-about,.hero.art-nature{background-size:auto,auto 100%;background-position:center,right}
 .hero .wrap{background:rgba(244,226,188,.87);min-height:0;padding-top:36px;padding-bottom:36px}
 .hero .wrap>div:empty{display:none}.display{font-size:clamp(36px,10vw,48px)}
 .section{padding:36px 0}.lead{font-size:17px}.benefit{padding:16px}
 .footer a{min-height:32px;display:flex;align-items:center}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Keep illustrated backgrounds proportional instead of stretching the hives. */
.hero.art-about,.hero.art-nature{background-size:auto,auto 100%}

/* Product cards keep the complete artwork at its natural proportions. */
.honeyCard img,.product img{height:auto;aspect-ratio:auto;object-fit:contain}

/* Shared product framing across the home and honey pages. */
.honeyCard,.product{border-radius:9px;padding:10px}
.product>p{padding-left:6px;padding-right:6px}

/* 2026 performance/accessibility pass */
#beecool-intro{position:fixed;inset:0;z-index:99999;background:#f3eadb;display:flex;align-items:center;justify-content:center;overflow:hidden;opacity:1;transition:opacity .55s ease;touch-action:none}
#beecool-intro.is-done{opacity:0;pointer-events:none}#beecool-intro video{width:100%;height:100%;object-fit:contain;display:block;background:#f3eadb}.intro-lock{overflow:hidden}.alignLeft{text-align:left}
.approvedHero img{width:100%;height:auto;object-fit:contain;display:block}
@media(max-width:767px){#beecool-intro video{width:100vw;height:100dvh;object-fit:contain}}@media(prefers-reduced-motion:reduce){#beecool-intro{display:none!important}}


/* ===== v10 ===== */
/* intro: hidden unless intro.js enables it (no JS / blocked JS = no overlay) */
#beecool-intro{display:none}
html.has-intro #beecool-intro{display:flex}
html.has-intro:not(.intro-done) body{overflow:hidden}
.introSkip{position:absolute;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:2;min-height:44px;padding:10px 18px;border:1px solid #a66c3b;border-radius:4px;background:rgba(243,234,219,.85);color:#082f37;font:700 14px/1 'Oswald',Arial,sans-serif;letter-spacing:.06em;cursor:pointer}
.introSkip:hover{background:#f3eadb}
/* transparent logo: no blend tricks needed */
.brand img,.footerLogo,.footerBrand img{mix-blend-mode:normal;height:auto}
img{height:auto}
/* icons */
.roundIcon .ico{width:28px;height:28px}
.icon{width:52px;height:52px;border:2px solid var(--gold,#dfa544);border-radius:50%;display:grid;place-items:center;color:var(--rust,#a64718);margin-bottom:12px}
.icon .ico{width:26px;height:26px}
.miniBee .ico{width:26px;height:26px;color:var(--rust,#a64718)}
/* product thumbnails: identical frames everywhere */
.honeyCard img,.product img{width:100%;height:auto;aspect-ratio:1.09/1;object-fit:cover}
/* banner used as a small card: show the jar, not half a sentence */
.story img.cropJar{object-position:98% center}
/* footer */
.footTitle{font:700 14px 'Oswald',sans-serif;color:var(--ink);margin:0 0 8px}
.footTag{margin:8px 0 0;font-size:14px}
.footer a{display:block;font-size:14px;line-height:1.4;padding:7px 0}
.footNav{display:block}
@media(max-width:980px){.footer a{padding:13px 0}}
/* hero on phones: crop to the lettering plaque instead of a 90px-high strip */
@media(max-width:700px){
 .approvedHero{height:260px}
 .approvedHero>img{height:100%;width:100%;max-width:none;object-fit:cover;object-position:16% center;margin-top:0}
 .story img.cropJar{object-position:78% center}
}

/* v10b – hero backgrounds without distortion (desktop/tablet); thumbnails centred in tall cards */
@media(min-width:601px){
 .hero.art-about{background-size:auto,cover;background-position:center,right 62%}
 .hero.art-nature{background-size:auto,cover;background-position:center,right center}
}
.honeyCard{justify-content:center}


/* v11 – honey images are square 1254px sources */
.honeyCard img,.product img{aspect-ratio:1/1;object-fit:contain}

/* BeeCool new logo */
.brand img,.footerLogo{object-fit:contain}


/* v13 – corrected header/footer logo sizing and uncropped honey cards */
.brand{width:300px;display:flex;align-items:center;overflow:visible}
.brand img{display:block;width:100%;max-width:100%;height:auto;max-height:88px;object-fit:contain}
.footerBrand{display:block}
.footerLogo,.footerBrand img{display:block;width:240px;max-width:100%;height:auto;object-fit:contain}
.honeyCard img,.product img{width:100%;height:auto;aspect-ratio:1/1;object-fit:contain}
.honeyCard{display:flex;align-items:center;justify-content:center}
@media(max-width:980px){.brand{width:220px}.brand img{max-height:72px}.footerLogo,.footerBrand img{width:210px}}
@media(max-width:600px){.brand{width:190px}.brand img{max-height:64px}.footerLogo,.footerBrand img{width:180px}}


/* v14 – transparent logo asset */
.brand img,.footerLogo,.footerBrand img{background:transparent}
