:root{--g1:#0f3d2a;--g2:#1f5c3a;--g3:#5a9e45;--o:#e8731a;--o2:#c45a0c;--cream:#faf6ec;--sand:#f0e9d6;--brown:#3a2616;--ink:#26231d;--r:20px;--sh:0 14px 40px rgba(15,61,42,.14)}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{font:400 1.0625rem/1.65 "DM Sans",system-ui,sans-serif;color:var(--ink);background:var(--cream);overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:"Playfair Display",Georgia,serif;line-height:1.15;color:var(--g1)}
h1{font-size:clamp(2.4rem,6vw,4.4rem);color:#fff}
h2{font-size:clamp(1.8rem,3.6vw,2.7rem);margin-bottom:.6em}
h3{font-size:1.3rem;margin-bottom:.4em}
.wrap{width:min(1200px,100% - 40px);margin-inline:auto}
.narrow{width:min(780px,100% - 40px)}
.center{text-align:center}
.skip{position:absolute;left:-999px}.skip:focus{left:10px;top:10px;background:#fff;padding:8px 14px;z-index:99}
:focus-visible{outline:3px solid var(--o);outline-offset:3px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:48px;padding:.7em 1.6em;border-radius:999px;border:2px solid transparent;font:700 1rem "DM Sans",sans-serif;text-decoration:none;cursor:pointer;transition:transform .2s,background .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px)}
.btn-o{background:var(--o);color:#fff;box-shadow:0 8px 20px rgba(232,115,26,.35)}.btn-o:hover{background:var(--o2)}
.btn-ghost{border-color:rgba(255,255,255,.7);color:#fff}.btn-ghost:hover{background:rgba(255,255,255,.12)}
.btn-wa{background:var(--g2);color:#fff}.btn-wa:hover{background:var(--g1)}
.btn-line{border-color:var(--g2);color:var(--g2)}.btn-line:hover{background:var(--g2);color:#fff}
.full{width:100%}

.site-header{position:fixed;inset:0 0 auto;z-index:50;transition:background .3s,box-shadow .3s}
.site-header.solid{background:rgba(15,61,42,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 4px 24px rgba(0,0,0,.18)}
.bar{display:flex;align-items:center;justify-content:space-between;height:76px}
.logo{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font:700 1.15rem/1 "DM Sans",sans-serif;letter-spacing:.06em}
.logo svg{color:var(--o)}.logo small{font-size:.7em;opacity:.8;letter-spacing:.12em}
.nav{display:flex;align-items:center;gap:28px}
.nav a:not(.btn){color:#fff;text-decoration:none;font-weight:500;opacity:.9}.nav a:not(.btn):hover{opacity:1;color:#ffd7b0}
.nav-cta{min-height:44px;padding:.5em 1.4em}
.burger{display:none;background:none;border:0;width:48px;height:48px;cursor:pointer}
.burger span{display:block;width:26px;height:3px;background:#fff;margin:5px auto;border-radius:3px;transition:.25s}

.hero{position:relative;overflow:hidden;padding:150px 0 90px;background:radial-gradient(circle at 78% 40%,#2c7a4a 0,transparent 55%),linear-gradient(135deg,var(--g1),var(--g2))}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;position:relative;z-index:2}
.hero-copy p{color:#e4efe5;font-size:1.25rem;max-width:30em;margin:1.2em 0 2em}
.actions{display:flex;flex-wrap:wrap;gap:14px}
.hero-copy>*{animation:up .8s both}.hero-copy p{animation-delay:.15s}.hero-copy .actions{animation-delay:.3s}
.hero-art{display:grid;place-items:center;animation:up 1s .2s both}
.frame{width:min(420px,100%);aspect-ratio:4/5;border-radius:200px 200px 28px 28px;overflow:hidden;border:6px solid rgba(255,255,255,.18);box-shadow:0 0 90px rgba(232,115,26,.35),0 30px 60px rgba(0,0,0,.35)}
.frame img{width:100%;height:100%;object-fit:cover;object-position:50% 38%;transform:scale(1.55);transform-origin:50% 42%}
.leaf{position:absolute;fill:rgba(90,158,69,.45);stroke:rgba(255,255,255,.25);stroke-width:1.5;z-index:1;animation:float 7s ease-in-out infinite}
.l1{width:90px;top:18%;right:6%}.l2{width:60px;bottom:12%;right:42%;animation-delay:-2s;fill:rgba(232,115,26,.4)}.l3{width:120px;bottom:-20px;left:-20px;animation-delay:-4s;transform:rotate(50deg)}
@keyframes float{50%{translate:0 -18px;rotate:8deg}}
@keyframes up{from{opacity:0;translate:0 24px}}

.trust{background:var(--sand);padding:26px 0}
.trust-list{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.trust-list li{display:flex;align-items:center;gap:12px;font-weight:700;color:var(--g1)}
.ico{display:inline-grid;place-items:center;width:46px;height:46px;flex:none;border-radius:50%;background:var(--g2);color:#fff;font-size:1.1rem}
.ico.big{width:64px;height:64px;font-size:1.6rem;margin-bottom:16px;background:var(--sand);color:var(--g1)}

.sec{padding:96px 0}
.head{max-width:640px;margin:0 auto 48px;text-align:center}
.head p{color:#5b564a}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:32px}
.pcard{background:#fff;border-radius:var(--r);box-shadow:var(--sh);overflow:hidden;display:flex;flex-direction:column;transition:transform .3s,box-shadow .3s}
.pcard:hover{transform:translateY(-6px);box-shadow:0 22px 50px rgba(15,61,42,.22)}
.pimg{aspect-ratio:1/1;overflow:hidden;background:var(--sand)}
.pimg img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.pcard:hover .pimg img{transform:scale(1.06)}
.pimg.crop img{object-position:50% 40%;transform:scale(1.35)}.pcard:hover .pimg.crop img{transform:scale(1.42)}
.pbody{padding:28px;display:flex;flex-direction:column;gap:10px;flex:1}
.cat{color:var(--o2);font-weight:700;font-size:.9rem}
.price{font-size:1.1rem}.price strong{color:var(--g1);font-size:1.5rem}
.pbody .actions{margin-top:auto;padding-top:12px}

.about{background:var(--g1);color:#dcebdc}.about h2{color:#fff}.about p+p{margin-top:1em}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.about-img img{border-radius:var(--r);box-shadow:0 20px 50px rgba(0,0,0,.35)}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.card{background:#fff;border-radius:var(--r);padding:32px 26px;box-shadow:var(--sh)}
.how{background:var(--sand)}
.steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;counter-reset:s}
.steps li{background:#fff;border-radius:var(--r);padding:32px;border-top:6px solid var(--o)}
.steps b{display:block;font:700 3rem/1 "Playfair Display",serif;color:var(--o);margin-bottom:12px}

.order-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:32px;align-items:start}
.form,.summary{background:#fff;border-radius:var(--r);box-shadow:var(--sh);padding:36px}
.form{display:grid;gap:18px}.form h2{margin:0}
label{display:grid;gap:6px;font-weight:700;color:var(--g1);font-size:.95rem}label small{font-weight:400;color:#777}
input,select,textarea{font:inherit;min-height:48px;padding:10px 14px;border:1.5px solid #d4cdb8;border-radius:12px;background:var(--cream);color:var(--ink);width:100%}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--g2);box-shadow:0 0 0 3px rgba(31,92,58,.2)}
.invalid{border-color:#c0392b!important}
.err{color:#c0392b;font-size:.85rem;font-weight:500}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.qty{display:inline-flex;align-items:center;border:1.5px solid #d4cdb8;border-radius:999px;background:var(--cream);width:max-content}
.qty button{width:48px;height:48px;border:0;background:none;font-size:1.4rem;cursor:pointer;color:var(--g1)}
.qty input{width:56px;border:0;text-align:center;background:none;padding:0;font-weight:700}
.summary{position:sticky;top:96px;background:var(--g1);color:#fff}.summary h3{color:#fff}
.summary dl{display:grid;grid-template-columns:auto 1fr;gap:10px 16px;margin:18px 0}
.summary dt{opacity:.7}.summary dd{text-align:right;font-weight:700}
.total{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-top:1px dashed rgba(255,255,255,.35);padding-top:14px}
.total strong{font-size:1.8rem;color:#ffb877}

.faq{background:var(--sand)}
.faq-item{background:#fff;border-radius:16px;margin-bottom:12px;overflow:hidden}
.faq-q{width:100%;display:flex;justify-content:space-between;gap:16px;align-items:center;text-align:left;padding:20px 24px;min-height:60px;background:none;border:0;font:700 1.05rem "DM Sans",sans-serif;color:var(--g1);cursor:pointer}
.faq-q::after{content:"+";font-size:1.6rem;color:var(--o);transition:transform .25s}
.faq-q[aria-expanded=true]::after{transform:rotate(45deg)}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s}
.faq-a>div{overflow:hidden}.faq-a p{padding:0 24px 20px}
.faq-q[aria-expanded=true]+.faq-a{grid-template-rows:1fr}

.contact{background:linear-gradient(135deg,var(--g1),var(--g2));color:#e4efe5}.contact h2{color:#fff}
.wa-num{margin:14px 0 26px;font-size:1.2rem}

.footer{background:#0a2a1d;color:#b9cfbf;padding:64px 0 28px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
.foot-grid h4{color:#fff;margin-bottom:12px}.foot-grid a{display:block;text-decoration:none;padding:4px 0}.foot-grid a:hover{color:#ffb877}
.logo-t{color:#fff;font-weight:700;letter-spacing:.06em;margin-bottom:8px}
.legal{margin-top:40px;padding-top:20px;border-top:1px solid rgba(255,255,255,.12);font-size:.88rem;display:grid;gap:6px}

dialog{border:0;border-radius:24px;width:min(980px,94vw);max-height:92vh;padding:0;margin:auto;background:var(--cream);overflow:auto}
dialog::backdrop{background:rgba(10,42,29,.65);backdrop-filter:blur(4px)}
dialog[open]{animation:pop .3s}
@keyframes pop{from{opacity:0;scale:.96}}
.close{position:sticky;top:12px;float:right;margin:12px 12px 0 0;width:44px;height:44px;border-radius:50%;border:0;background:#fff;font-size:1.6rem;cursor:pointer;z-index:2;box-shadow:0 4px 14px rgba(0,0,0,.2)}
.m-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:32px;padding:32px}
.m-img{border-radius:var(--r);overflow:hidden;background:var(--sand);align-self:start}.m-img img{width:100%}
.m-body{display:grid;gap:14px;align-content:start}.m-body h2{margin:0}
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px}.chips li{background:var(--sand);color:var(--g1);padding:6px 14px;border-radius:999px;font-size:.9rem;font-weight:500}
fieldset{border:0}legend{font-weight:700;color:var(--g1);margin-bottom:8px}
.pkgs{display:grid;gap:10px}
.pkg{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:56px;padding:12px 18px;border:2px solid #d4cdb8;border-radius:14px;background:#fff;font:500 1rem "DM Sans",sans-serif;cursor:pointer;text-align:left}
.pkg[aria-pressed=true]{border-color:var(--g2);background:#eef6ee;box-shadow:inset 0 0 0 1px var(--g2)}
.qrow{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.qrow .total{border:0;padding:0;flex:1;min-width:150px}.qrow .total strong{color:var(--o2)}
.art summary{cursor:pointer;font-weight:700;color:var(--g2);padding:6px 0}.art p{font-size:.9rem;color:#666;margin:8px 0}.art img{border-radius:12px}

.toast{position:fixed;left:50%;bottom:28px;translate:-50% 30px;background:var(--g1);color:#fff;padding:14px 24px;border-radius:999px;opacity:0;pointer-events:none;transition:.3s;z-index:90;max-width:92vw;text-align:center}
.toast.show{opacity:1;translate:-50% 0}.toast.bad{background:#a93226}
.top{position:fixed;right:20px;bottom:24px;width:50px;height:50px;border-radius:50%;border:0;background:var(--o);color:#fff;font-size:1.3rem;cursor:pointer;box-shadow:var(--sh);opacity:0;pointer-events:none;transition:.3s;z-index:40}
.top.show{opacity:1;pointer-events:auto}

.reveal{opacity:0;translate:0 26px;transition:opacity .7s,translate .7s}.reveal.in{opacity:1;translate:0 0}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal{opacity:1;translate:none}}
