:root{--green:#446A2C;--brown:#743D2A;--gold:#C4953D;--paper:#FCFAF5;--ink:#2b2b2b;--muted:#7a7a7a;--radius:16px;--shadow:0 8px 20px rgba(0,0,0,.06)}
*{box-sizing:border-box}html,body{height:100%}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Helvetica,Arial,sans-serif;color:var(--ink);background:radial-gradient(24px 24px at 16px 16px,rgba(196,149,61,.10)1px,transparent 2px)repeat,linear-gradient(180deg,#fff 0%,var(--paper)100%);background-size:32px 32px,auto}
a{color:var(--green);text-decoration:none}img{max-width:100%;height:auto;display:block}.container{width:min(1100px,92vw);margin-inline:auto}
.topbar{background:var(--green);color:#fff;font-size:.875rem;padding:.5rem 1rem}
.topbar .container{display:flex;align-items:center;gap:1rem;justify-content:space-between}.topbar small{opacity:.9}
header.header{position:sticky;top:0;z-index:30;backdrop-filter:saturate(1.2)blur(8px);background:rgba(255,255,255,.75);border-bottom:1px solid rgba(0,0,0,.06)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:.75rem 0;gap:1rem}
.brand svg{height:clamp(36px,6vw,56px);width:auto;display:block}
.nav .menu{display:flex;align-items:center;gap:1rem;font-weight:600;color:var(--brown)}
.nav .menu a{color:var(--brown);opacity:.9}.nav .menu a:hover{opacity:1;text-decoration:underline}
.nav a.btn{padding:.6rem .9rem;border-radius:999px;color:#fff;background:var(--green);box-shadow:var(--shadow)}
.hero{position:relative;padding:clamp(2rem,5vw,4rem)0 clamp(2rem,6vw,5rem)}
.hero .box{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(1rem,4vw,3rem);align-items:center;background:#fff;border-radius:var(--radius);padding:clamp(1rem,4vw,3rem);box-shadow:var(--shadow);border:1px solid rgba(0,0,0,.06)}
.hero h2{margin:0 0 .5rem 0;font:800 clamp(1.6rem,3vw,2.2rem)/1.15 Georgia,serif;color:var(--brown)}
.hero p.lead{font-size:clamp(1rem,1.3vw,1.125rem);color:#3b3b3b;margin:.5rem 0 1rem}
.badges{display:flex;flex-wrap:wrap;gap:.5rem}
.chip{background:#fff7e8;color:#6b4b1b;border:1px solid #f3e1bb;padding:.35rem .6rem;border-radius:999px;font-weight:600;font-size:.85rem}
.cta{display:flex;gap:.6rem;align-items:center;margin-top:1rem;flex-wrap:wrap}
.btn-primary{background:var(--green);color:#fff;border:0;border-radius:999px;padding:.75rem 1rem;font-weight:700}
.btn-ghost{border:2px solid var(--green);color:var(--green);background:transparent;border-radius:999px;padding:.65rem .95rem;font-weight:700}
.section{padding:clamp(1.5rem,4vw,3rem)0}
.section h3{font:800 clamp(1.2rem,2.2vw,1.6rem)/1.1 Georgia,serif;color:var(--brown);margin:0 0 1rem}
.grid{display:grid;gap:clamp(.9rem,2vw,1.2rem);grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.card{background:#fff;border-radius:calc(var(--radius)-4px);border:1px solid rgba(0,0,0,.06);box-shadow:var(--shadow);overflow:hidden}
.card .img-wrap{aspect-ratio:4/3;overflow:hidden;background:#faf7f0}
.card h4{margin:.75rem .9rem 0;font:700 1.05rem/1.2 system-ui;color:var(--brown)}
.card p{margin:.35rem .9rem .9rem;color:var(--muted);font-size:.95rem}
.price{margin:.25rem .9rem .9rem;color:var(--green);font-weight:800}
.card .actions{display:flex;gap:.5rem;padding:.9rem}.card .actions .btn{flex:1;text-align:center}
.story{background:linear-gradient(180deg,rgba(68,106,44,.08),rgba(68,106,44,.02));border-radius:var(--radius);padding:clamp(1rem,3vw,2rem);border:1px solid rgba(68,106,44,.18)}
blockquote{margin:0;padding:0;border-left:4px solid var(--gold);padding-left:1rem;color:#4a3b33;font-style:italic}
footer{margin-top:3rem;padding:1.2rem 0;border-top:1px solid rgba(0,0,0,.06);color:#5a5a5a;font-size:.95rem}
@media (max-width:860px){.hero .box{grid-template-columns:1fr}}