:root{--ink:#17231d;--muted:#707a73;--paper:#f8f9f5;--green:#c9f36a;--line:#e5e9e2;--sage:#eaf2df}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.5;font-size:14px}button,input,select,textarea{font:inherit}button,a{cursor:pointer}a{color:inherit}.announcement{background:var(--ink);color:white;text-align:center;padding:7px;font-size:10px;letter-spacing:.5px}
header{position:sticky;top:0;z-index:10;background:#fffffff2;backdrop-filter:blur(12px);border-bottom:1px solid var(--line);padding:13px max(20px,calc((100% - 1200px)/2));display:flex;align-items:center;gap:28px}.brand{display:flex;gap:10px;align-items:center;text-decoration:none;font-weight:900;letter-spacing:.5px;white-space:nowrap}.logo{width:43px;height:43px;border-radius:13px;background:var(--green);display:grid;place-items:center;font-weight:950;letter-spacing:-2px}.brand small{display:block;font-size:9px;letter-spacing:2.7px;color:var(--muted)}nav{display:flex;gap:22px;flex:1}nav a,.head-actions a{font-size:12px;text-decoration:none;color:#59655d;font-weight:700}nav a:hover{color:var(--ink)}.head-actions{display:flex;align-items:center;gap:9px}.head-actions button,.head-actions>a{position:relative;width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--line);background:white;border-radius:10px;font-size:21px;color:var(--ink)}.count{position:absolute;right:-5px;top:-6px;border-radius:20px;background:var(--ink);color:white;font-size:9px;font-style:normal;padding:2px 5px}.menu{display:none}.searcharea{display:none;background:white;border-bottom:1px solid var(--line);padding:12px 20px}.searcharea.open{display:flex;justify-content:center;gap:8px}.searcharea input{width:min(100%,900px);padding:12px;border:1px solid var(--line);border-radius:9px;outline-color:#a4c85d}.searcharea button{border:1px solid var(--line);border-radius:9px;background:white;padding:0 14px}
main{max-width:1200px;margin:auto;padding:27px 22px 65px}.view{display:none}.view.active{display:block}.hero{display:grid;grid-template-columns:1fr 1fr;min-height:420px;background:var(--sage);border-radius:26px;overflow:hidden}.hero-copy{align-self:center;padding:50px 7%}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:850;color:#5d7932;margin:0 0 12px}.hero h1{font-size:clamp(42px,5vw,67px);letter-spacing:-3px;line-height:1;margin:0 0 20px}.hero em{font-style:normal;color:#66863a}.hero p:not(.eyebrow){max-width:410px;color:#5f6c61;line-height:1.8}.btn{display:inline-flex;justify-content:center;align-items:center;gap:12px;border:0;border-radius:11px;padding:13px 16px;text-decoration:none;font-size:12px;font-weight:800;margin-top:12px}.dark{background:var(--ink);color:white}.light{background:var(--green);color:var(--ink)}.plain{display:inline-block;background:none;border:0;color:var(--ink);font-size:11px;font-weight:800;text-decoration:none;margin-left:18px}
.hero-art{position:relative;display:grid;place-items:center;background:#dcebc8;overflow:hidden}.circle{position:absolute;width:310px;height:310px;border:1px solid #a9c27e;border-radius:50%;box-shadow:0 0 0 35px #dcebc8,0 0 0 36px #a9c27e}.bag{z-index:1;width:165px;height:190px;border-radius:22px 22px 34px 34px;background:var(--ink);color:var(--green);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:44px;font-weight:950;transform:rotate(-8deg);box-shadow:15px 20px #17231d14}.bag:before{content:"";position:absolute;width:65px;height:40px;border:7px solid var(--ink);border-bottom:0;border-radius:40px 40px 0 0;top:-32px}.bag small{font-size:9px;letter-spacing:2px;text-align:center;line-height:1.5}.sticker{position:absolute;right:11%;top:15%;width:80px;height:80px;display:grid;place-content:center;text-align:center;border-radius:50%;background:var(--green);font-size:11px;font-weight:900;transform:rotate(8deg)}
.section{margin-top:58px}.secthead{display:flex;justify-content:space-between;align-items:end;gap:15px;margin-bottom:20px}.secthead h2,.promo h2{font-size:clamp(26px,3vw,36px);letter-spacing:-1.2px;margin:0;line-height:1.1}.secthead>p,.secthead div>p:not(.eyebrow),.promo p:not(.eyebrow){font-size:12px;color:var(--muted)}.categories{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.categories button{min-height:145px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;padding:18px;border:1px solid var(--line);border-radius:16px;background:white;font-size:32px;transition:.15s}.categories button:nth-child(2){background:#f7eae8}.categories button:nth-child(3){background:#f5f0df}.categories button:nth-child(4){background:#eaf0f5}.categories button:nth-child(5){background:#eeeafa}.categories button:hover{transform:translateY(-3px)}.categories b{font-size:12px}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.product{min-width:0;border:1px solid var(--line);background:white;border-radius:16px;overflow:hidden;transition:.18s}.product:hover{transform:translateY(-3px);box-shadow:0 12px 35px #17231d0d}.photo{aspect-ratio:1;background:#edf1e8;display:grid;place-items:center;position:relative;overflow:hidden;font-size:52px}.photo img{width:100%;height:100%;object-fit:cover}.photo.image-error img{display:none}.heart{position:absolute;right:9px;top:9px;width:33px;height:33px;border:0;border-radius:50%;background:#fffffff2;font-size:20px}.heart.saved{color:#c72f50}.badge{position:absolute;left:9px;top:9px;background:var(--green);padding:5px 8px;border-radius:20px;font-size:8px;font-weight:900;text-transform:uppercase}.pinfo{padding:13px}.pcat{font-size:9px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);font-weight:800}.pinfo h3{font-size:13px;margin:5px 0}.description{font-size:11px;color:var(--muted);min-height:32px;margin:0 0 10px}.pfoot{display:flex;align-items:center;justify-content:space-between;gap:8px}.price{font-size:14px;font-weight:900}.add{border:0;background:var(--green);border-radius:10px;width:33px;height:33px;font-size:22px}
.promo{margin-top:60px;background:var(--ink);color:white;border-radius:21px;padding:32px 5%;display:flex;align-items:center;justify-content:space-between;gap:20px}.promo .eyebrow{color:var(--green)}.banner{background:var(--sage);padding:38px 5%;border-radius:20px;margin-bottom:28px}.banner h1{font-size:clamp(34px,4.5vw,52px);letter-spacing:-2px;line-height:1.05;margin:0 0 10px}.banner>p:last-child{color:#657064;font-size:13px;margin:0}.toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;gap:15px;font-size:12px;color:var(--muted)}.toolbar>div{display:flex;gap:10px}.toolbar select,.panel input,.panel textarea{border:1px solid var(--line);border-radius:10px;background:white;padding:11px;color:var(--ink);min-width:0;max-width:100%;outline-color:#a4c85d}.empty{padding:38px 20px;text-align:center;border:1px dashed #d6ded0;background:white;border-radius:17px;color:var(--muted);margin:20px 0}.empty h3{color:var(--ink);margin:6px 0}.empty p{font-size:12px}.hidden{display:none!important}
.cartlayout{display:grid;grid-template-columns:1.5fr .8fr;gap:20px;align-items:start}.cartrow{display:grid;grid-template-columns:85px 1fr auto;gap:13px;align-items:center;background:white;border:1px solid var(--line);border-radius:15px;padding:11px;margin-bottom:11px}.thumb{width:85px;aspect-ratio:1;background:#edf1e8;border-radius:10px;display:grid;place-items:center;overflow:hidden;font-size:30px}.thumb img{width:100%;height:100%;object-fit:cover}.cartrow h3{font-size:13px;margin:0 0 4px}.muted,.cartrow p{font-size:11px;color:var(--muted);line-height:1.6}.qty{display:flex;align-items:center;gap:8px;margin-top:8px}.qty button{border:1px solid var(--line);background:white;border-radius:7px;width:26px;height:26px}.cartend{text-align:right;font-size:12px}.remove{border:0;background:none;color:#b42318;font-size:10px;display:block;margin:8px 0 0 auto}.summary,.panel{background:white;border:1px solid var(--line);border-radius:16px;padding:22px}.summary{position:sticky;top:100px}.summary h2,.panel h2{font-size:18px;margin:0 0 15px}.sumrow{display:flex;justify-content:space-between;gap:10px;padding:12px 0;border-top:1px solid var(--line);font-size:12px}.total{font-weight:850}.wide{width:100%}.btn:disabled{opacity:.45;cursor:not-allowed}.summary small,.panel small{font-size:10px;color:var(--muted);line-height:1.6;display:block;margin-top:10px}
.story{display:grid;grid-template-columns:1fr 1fr;gap:6%;align-items:center;padding:8px 4% 40px}.storyart{min-height:320px;background:#e2edcf;border-radius:20px;display:grid;place-items:center;font-size:52px;font-weight:950;color:#66863a;position:relative}.storyart:before{content:"";position:absolute;width:230px;height:230px;border:1px solid #a9c27e;border-radius:50%}.storyart small{position:absolute;bottom:18px;right:18px;color:#5d7932;font-size:8px;letter-spacing:1px}.story h2{font-size:31px;letter-spacing:-1px}.story p:not(.eyebrow){font-size:13px;color:var(--muted);line-height:1.9}.values{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.values article{background:white;border:1px solid var(--line);padding:22px;border-radius:15px}.values b{font-size:24px;color:#6a8a3a}.values h3{font-size:14px}.values p{font-size:11px;color:var(--muted)}.contactgrid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.panel{padding:24px}.panel p{font-size:12px;color:var(--muted);line-height:1.7}.panel label{display:grid;gap:6px;font-size:10px;font-weight:800;color:var(--muted);margin:12px 0}.panel input,.panel textarea{width:100%;font:inherit;font-size:12px}.panel textarea{resize:vertical}
footer{background:white;border-top:1px solid var(--line);padding:30px max(22px,calc((100% - 1150px)/2)) 0}.footer-top{display:flex;align-items:center;gap:25px;flex-wrap:wrap;padding-bottom:22px}.footer-top>p{font-size:11px;color:var(--muted);flex:1}.footer-top>div{display:flex;gap:16px}.footer-top>div a{font-size:11px;text-decoration:none;color:var(--muted)}.footer-bottom{border-top:1px solid var(--line);padding:15px 0;display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.toast{position:fixed;z-index:30;bottom:20px;left:50%;transform:translate(-50%,12px);opacity:0;pointer-events:none;background:var(--ink);color:white;padding:12px 18px;border-radius:12px;font-size:12px;transition:.2s;max-width:90%;text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:980px){header{gap:16px}nav{gap:13px}.hero{min-height:370px}.hero-copy{padding:35px}.categories button{padding:13px}.grid{gap:11px}}
@media(max-width:740px){header{padding:10px 14px;gap:10px;flex-wrap:wrap}.menu{display:block;order:2;background:white;border:1px solid var(--line);border-radius:9px;width:38px;height:38px;font-size:19px}.head-actions{order:1;margin-left:auto}.brand{margin-right:auto}.brand .logo{width:39px;height:39px}nav{display:none;order:3;flex-basis:100%;flex-direction:column;gap:0;padding:5px 0}nav.open{display:flex}nav a{padding:11px 5px;border-top:1px solid var(--line)}main{padding:17px 13px 45px}.hero{grid-template-columns:1fr;min-height:360px;position:relative}.hero-copy{position:relative;z-index:2;padding:35px 24px;max-width:560px}.hero h1{font-size:clamp(42px,8vw,58px)}.hero-art{position:absolute;right:-40px;bottom:-40px;width:270px;height:270px;opacity:.4}.section{margin-top:43px}.categories{grid-template-columns:repeat(2,1fr);gap:9px}.categories button{min-height:125px}.categories button:last-child{grid-column:span 2}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.promo{align-items:flex-start;flex-direction:column}.secthead{align-items:flex-start;flex-direction:column}.toolbar{align-items:flex-start;flex-direction:column}.toolbar>div{width:100%}.toolbar select{flex:1;width:50%}.cartlayout,.story,.contactgrid{grid-template-columns:1fr}.summary{position:static}.story{padding:0 0 28px;gap:20px}.storyart{min-height:240px}.values{grid-template-columns:1fr}.footer-top{gap:14px}.footer-top>p{flex-basis:100%;order:3}}
@media(max-width:420px){.hero-copy{padding:28px 20px}.hero h1{letter-spacing:-2.5px}.hero .plain{margin-left:8px}.secthead h2{font-size:27px}.pinfo{padding:10px}.pinfo h3{font-size:12px}.price{font-size:12px}.photo{aspect-ratio:.95}.cartrow{grid-template-columns:60px minmax(0,1fr) auto;gap:8px;padding:8px}.thumb{width:60px}.cartend{font-size:10px}.footer-bottom{font-size:9px}}

/* Our Story and Contact: responsive finishing touches */
.storyart {
  overflow: hidden;
}

.storyart::before {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.panel input,
.panel textarea {
  display: block;
  box-sizing: border-box;
}

.panel textarea {
  min-height: 110px;
}

@media (max-width: 700px) {
  .story {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .storyart {
    min-height: 260px;
  }

  .values {
    grid-template-columns: 1fr;
  }

  .contactgrid {
    grid-template-columns: 1fr;
  }

  .panel {
    padding: 18px;
    min-width: 0;
  }

  .panel input,
  .panel textarea {
    width: 100%;
    max-width: 100%;
  }
}
