*{box-sizing:border-box;margin:0;padding:0}
:root{--g:#1f5c3a;--gd:#143d27;--o:#f08a1c;--cream:#fff8ee;--ink:#2a2118}
html{scroll-behavior:smooth}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:#fff;line-height:1.55;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
:focus-visible{outline:3px solid var(--o);outline-offset:2px}
.sample-banner{display:block;text-align:center;background:#111;color:#fff;font-size:.8rem;padding:7px 10px;text-decoration:none}
.nav{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:10px 16px;background:var(--cream);border-bottom:1px solid #f0e2cc}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:800;color:var(--gd);font-size:1.1rem}
.brand img{border-radius:50%;height:36px;width:36px}
.nav-cta{background:var(--g);color:#fff;text-decoration:none;font-weight:700;padding:8px 16px;border-radius:99px;font-size:.9rem}
.hero{display:grid;gap:22px;padding:28px 18px 36px;background:linear-gradient(160deg,var(--cream),#ffe9c9);align-items:center}
.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.75rem;font-weight:700;color:var(--g)}
h1{font-size:2.8rem;line-height:1.05;color:var(--gd);margin:6px 0 10px;font-weight:900}
.tagline{font-size:1.15rem;margin-bottom:20px;max-width:30ch}
.hero-photo{width:min(210px,58%);margin:0 auto;border-radius:22px;overflow:hidden;box-shadow:0 14px 34px rgba(20,61,39,.28);transform:rotate(2deg);border:5px solid #fff}
.hero-photo img{width:100%;aspect-ratio:9/16;object-fit:cover}
.btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;max-width:420px;padding:16px 20px;border-radius:14px;font-weight:800;font-size:1.05rem;text-decoration:none;margin-top:12px;text-align:center}
.btn-wa{background:#25d366;color:#06361a;box-shadow:0 6px 16px rgba(37,211,102,.35)}
.btn-ghost{border:2px solid var(--g);color:var(--g)}
.btn-ig{background:var(--gd);color:#fff}
.section{padding:44px 18px}
.section.alt{background:var(--cream)}
h2{font-size:1.8rem;color:var(--gd);line-height:1.15;margin-bottom:8px}
h2::after{content:"";display:block;width:48px;height:4px;background:var(--o);border-radius:4px;margin-top:8px}
.lead{margin:12px 0 22px;color:#5a4b3b}
.cards{display:grid;gap:16px}
.card{display:flex;gap:14px;background:#fff;border:1px solid #f0e2cc;border-radius:16px;overflow:hidden;box-shadow:0 4px 14px rgba(0,0,0,.05)}
.card img{width:100px;flex:none;object-fit:cover;aspect-ratio:9/16;align-self:flex-start;height:auto}
.card div{padding:14px 14px 14px 0;align-self:center}
h3{font-size:1.05rem;color:var(--gd)}
.card p,.menu p,.steps p{font-size:.92rem;color:#5a4b3b}
.menu{list-style:none;display:grid;gap:12px;margin-bottom:10px}
.menu li{background:#fff;border-left:5px solid var(--o);border-radius:12px;padding:14px 16px;box-shadow:0 3px 10px rgba(0,0,0,.05);display:grid;gap:6px}
.price{font-weight:700;color:var(--g);font-size:.9rem}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}
.grid img{width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:12px}
.steps{list-style:none;display:grid;gap:14px;margin-bottom:10px}
.steps li{display:flex;gap:14px;align-items:flex-start;background:#fff;padding:14px;border-radius:14px}
.steps span{flex:none;width:36px;height:36px;border-radius:50%;background:var(--g);color:#fff;font-weight:800;display:grid;place-items:center}
.contact{text-align:left}
.num{font-size:1.7rem;font-weight:900;color:var(--gd);margin-bottom:6px}
.num a{text-decoration:none}
.footer{background:var(--gd);color:#e9dcc6;text-align:center;padding:26px 16px 90px;font-size:.9rem}
.footer a{color:#ffd9a0}
.fab{position:fixed;right:16px;bottom:16px;width:58px;height:58px;border-radius:50%;background:#25d366;color:#06361a;display:grid;place-items:center;box-shadow:0 6px 18px rgba(0,0,0,.3);z-index:30}
@media(min-width:760px){
 .hero{grid-template-columns:1.2fr .8fr;padding:60px max(24px,calc((100% - 1000px)/2))}
 h1{font-size:4rem}
 .section{padding:64px max(24px,calc((100% - 1000px)/2))}
 .cards{grid-template-columns:repeat(3,1fr)}
 .card{flex-direction:column}.card img{width:100%;aspect-ratio:9/16;max-height:420px}.card div{padding:0 16px 16px}
 .grid{grid-template-columns:repeat(4,1fr)}
 .menu li{grid-template-columns:1fr auto;align-items:center}
 .btn{width:auto;display:inline-flex}
}
