:root{--paper:#f6f4f9;--ink:#2a1233;--plum:#3b1b49;--radish:#d9366f;--leaf:#3f7d4b;--lemon:#f1d24a;--line:#d9d2e0;--r:18px;--wrap:1280px}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{font:17px/1.65 "Instrument Sans",system-ui,sans-serif;color:var(--ink);background:var(--paper)}
h1,h2,h3{font-family:"Bricolage Grotesque","Instrument Sans",sans-serif;line-height:1.08;letter-spacing:-.02em}
a{color:inherit}
:focus-visible{outline:3px solid var(--radish);outline-offset:3px}
.wrap{width:min(var(--wrap),100% - 48px);margin-inline:auto}
section{padding:112px 0}
h2{font-size:clamp(2rem,4vw,3.2rem);font-weight:700}
h3{font-size:1.25rem;font-weight:700}
.btn{display:inline-block;background:var(--radish);color:#fff;text-decoration:none;font-weight:600;padding:15px 28px;border-radius:999px;border:2px solid var(--radish);cursor:pointer;font:600 1rem "Instrument Sans",sans-serif;transition:background .2s,transform .2s}
.btn:hover{background:var(--ink);border-color:var(--ink);transform:translateY(-2px)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:#fff}
.btn.small{padding:9px 20px}
.site-header{position:sticky;top:0;z-index:20;background:rgba(246,244,249,.96);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{display:flex;align-items:center;gap:10px;font:800 1.3rem "Bricolage Grotesque",sans-serif;text-decoration:none}
.mark{width:22px;height:22px;background:var(--radish);border-radius:50% 50% 50% 0;transform:rotate(-45deg)}
.nav{display:flex;align-items:center;gap:32px}
.nav a{text-decoration:none;font-weight:500}
.nav a:not(.btn):hover{color:var(--radish)}
.menu-btn{display:none;background:none;border:2px solid var(--ink);border-radius:999px;padding:7px 18px;font:600 .95rem "Instrument Sans",sans-serif;color:var(--ink);cursor:pointer}
.hero{background:var(--plum);color:#fff;padding:96px 0 104px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:64px;align-items:center}
.hero h1{font-size:clamp(2.8rem,6.4vw,5.6rem);font-weight:800;letter-spacing:-.035em}
.lead{font-size:1.2rem;max-width:34em;margin:28px 0 36px;color:#e6dcec}
.actions{display:flex;flex-wrap:wrap;gap:14px}
.hero .btn.ghost{color:#fff;border-color:#fff}
.hero .btn.ghost:hover{background:#fff;color:var(--ink)}
.facts{list-style:none;padding:0;margin-top:56px;display:grid;grid-template-columns:repeat(3,auto);gap:36px;justify-content:start}
.facts li{font-size:.92rem;color:#cdbfd6;border-left:3px solid var(--lemon);padding-left:14px}
.facts strong{display:block;font:700 1.15rem "Bricolage Grotesque",sans-serif;color:#fff}
.crate{position:relative;aspect-ratio:1/1;max-width:520px;width:100%;margin-inline:auto}
.slats{position:absolute;left:4%;right:4%;bottom:4%;height:44%;background:repeating-linear-gradient(0deg,#c58b52 0 22px,#a86f3a 22px 26px);border-radius:10px 10px 18px 18px}
.tag{position:absolute;right:-2%;bottom:14%;background:var(--lemon);color:var(--ink);font:700 1rem/1.2 "Bricolage Grotesque",sans-serif;padding:14px 18px;border-radius:12px;transform:rotate(-5deg);z-index:3;animation:sway 5s ease-in-out infinite alternate}
.fruit{position:absolute;border-radius:50%;z-index:2}
.f1{width:36%;aspect-ratio:1;background:var(--radish);left:6%;bottom:36%}
.f2{width:32%;aspect-ratio:1;background:#e8892d;left:38%;bottom:42%}
.f3{width:30%;aspect-ratio:1;background:var(--leaf);right:8%;bottom:34%}
.f4{width:24%;aspect-ratio:1;background:#7a3a8f;left:24%;bottom:62%}
.f5{width:26%;aspect-ratio:1;background:var(--lemon);right:22%;bottom:60%}
.leaf{position:absolute;width:12%;height:22%;background:#5fae6d;border-radius:0 100% 0 100%;z-index:2}
.l1{left:18%;bottom:66%;transform:rotate(-20deg)}.l2{right:30%;bottom:80%;transform:rotate(25deg)}
@keyframes sway{to{transform:rotate(-2deg) translateY(-6px)}}
.strip{background:var(--lemon);color:var(--ink);overflow:hidden;padding:16px 0;font:700 1.4rem "Bricolage Grotesque",sans-serif}
.strip-track{display:flex;gap:44px;width:max-content;animation:slide 40s linear infinite}
.strip-track span::after{content:"";display:inline-block;width:10px;height:10px;background:var(--radish);border-radius:50%;margin-left:44px}
@keyframes slide{to{transform:translateX(-50%)}}
.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:80px}
.about-head h2{margin-bottom:40px}
.ph{border-radius:var(--r);min-height:300px;display:flex;align-items:flex-end;padding:18px;font-size:.9rem;color:#fff;position:relative;overflow:hidden}
.ph-shop{background:linear-gradient(135deg,var(--leaf),#2b5d37)}
.ph-veg{background:linear-gradient(135deg,var(--radish),#8a2350);min-height:340px}
.ph::before{content:"";position:absolute;width:60%;aspect-ratio:1;border-radius:50%;background:rgba(255,255,255,.12);top:-15%;right:-10%}
.ph span{position:relative}
.about-body p{margin-bottom:22px;max-width:40em}
.panels{display:grid;grid-template-columns:repeat(3,1fr);margin-top:44px;border-top:2px solid var(--ink)}
.panels div{padding:22px 20px 0 0}
.panels div+div{padding-left:20px;border-left:1px solid var(--line)}
.panels h3{font-size:1.05rem;margin-bottom:6px}
.panels p{font-size:.93rem;margin:0}
.services{background:#fff;border-block:1px solid var(--line)}
.sec-head{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:end;margin-bottom:56px}
.svc-list{list-style:none;padding:0;border-top:2px solid var(--ink)}
.svc-list li{display:grid;grid-template-columns:.8fr 1.4fr auto;gap:40px;align-items:center;padding:34px 12px;border-bottom:1px solid var(--line);transition:background .25s,padding .25s}
.svc-list li:hover{background:var(--paper);padding-left:28px}
.svc-list h3{font-size:1.7rem}
.chip{font-size:.85rem;font-weight:600;border:1.5px solid var(--leaf);color:var(--leaf);border-radius:999px;padding:5px 14px;white-space:nowrap}
.why{background:var(--ink);color:#fff}
.why-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;align-items:start}
.why-intro{position:sticky;top:110px}
.why-intro p{margin:20px 0 36px;color:#d9cce2}
.why-list{list-style:none;padding:0;display:grid;gap:18px}
.why-list li{padding:26px 30px;border-radius:var(--r);background:var(--plum);border-left:6px solid var(--lemon)}
.why-list li:nth-child(even){margin-left:48px;border-left-color:var(--radish)}
.why-list p{color:#d9cce2;margin-top:8px}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:72px}
.contact-info p{margin:18px 0 32px}
dl{border-top:2px solid var(--ink)}
dt{font-weight:700;margin-top:18px}
dd{margin:2px 0 0}
dd a{color:var(--radish);font-weight:600}
.form{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:40px;box-shadow:0 18px 40px -28px rgba(42,18,51,.5)}
.form h3{font-size:1.6rem;margin-bottom:12px}
label{display:block;font-weight:600;margin-top:16px;font-size:.95rem}
input,textarea{width:100%;font:inherit;padding:13px 14px;margin-top:6px;border:1.5px solid #b9aec4;border-radius:10px;background:var(--paper);color:var(--ink)}
input:focus,textarea:focus{outline:3px solid rgba(217,54,111,.35);border-color:var(--radish)}
input.bad,textarea.bad{border-color:#b3123f}
.err{color:#b3123f;font-size:.88rem;min-height:1.2em;margin:4px 0 0}
.form .btn{margin-top:18px}
.status{margin-top:14px;font-weight:600;color:var(--leaf)}
.site-footer{background:var(--plum);color:#e6dcec;padding:48px 0;font-size:.95rem}
.foot{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.foot a{color:var(--lemon)}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s,transform .6s}
.reveal.in{opacity:1;transform:none}
@media(max-width:960px){
section{padding:80px 0}
.hero-grid,.about-grid,.why-grid,.contact-grid,.sec-head{grid-template-columns:1fr;gap:44px}
.crate{max-width:380px}
.why-intro{position:static}
.svc-list li{grid-template-columns:1fr;gap:10px}
.facts{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
.menu-btn{display:block}
.nav{position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:flex-start;gap:0;background:var(--paper);border-bottom:1px solid var(--line);padding:8px 24px 20px;display:none}
.nav.open{display:flex}
.nav a{padding:12px 0;width:100%}
.nav .btn{width:auto;margin-top:8px}
.panels{grid-template-columns:1fr}
.panels div+div{padding-left:0;border-left:0;border-top:1px solid var(--line);margin-top:16px}
.why-list li:nth-child(even){margin-left:0}
.foot{grid-template-columns:1fr}
.form{padding:26px}
.hero{padding:64px 0 72px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}.reveal{opacity:1;transform:none}}
