@font-face{font-family:Fraunces;src:url("/fonts/fraunces.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:Fraunces;src:url("/fonts/fraunces-italic.woff2") format("woff2");font-weight:100 900;font-style:italic;font-display:swap}
@font-face{font-family:Nunito;src:url("/fonts/nunito.woff2") format("woff2");font-weight:200 900;font-style:normal;font-display:swap}
@font-face{font-family:Nunito;src:url("/fonts/nunito-italic.woff2") format("woff2");font-weight:200 900;font-style:italic;font-display:swap}

:root{
  --bg:#fffdf7;--bg2:#ffffff;--mint:#0a5c50;--mint2:#0d6e60;--mintsoft:#e7f4f1;
  --saffron:#b45309;--saffsoft:#fde8d4;--ink:#1c2a24;--muted:#4d5f58;--line:#e4ebe8;--wa:#1f8f4e;--r:24px
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:17px/1.65 Nunito,system-ui,sans-serif;color:var(--ink);background:var(--bg);padding-bottom:84px}
img,video{max-width:100%;height:auto;display:block}
a{color:var(--mint)}
h1,h2,h3{font-family:Fraunces,Georgia,serif;line-height:1.2;margin:0 0 .5em;font-weight:600;color:var(--ink)}
h1{font-size:clamp(2.1rem,7vw,3.4rem)}
h2{font-size:clamp(1.7rem,4.4vw,2.45rem)}
h3{font-size:1.15rem}
.wrap{max-width:1080px;margin:0 auto;padding:0 18px}
.narrow{max-width:740px}
.center{text-align:center}
.small{font-size:.92rem;color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 22px;border-radius:999px;font-weight:800;text-decoration:none;border:2px solid transparent;text-align:center;cursor:pointer;font-family:inherit;background:transparent;color:var(--ink)}
.btn.mint{background:var(--mint);color:#fff;border-color:var(--mint)}
.btn.mint:hover{background:var(--mint2)}
.btn.saffron{background:var(--saffron);color:#fff;border-color:var(--saffron)}
.btn.saffron:hover{filter:brightness(1.05)}
.btn.ghost{border-color:var(--mint);color:var(--mint)}
.btn.ghost:hover{background:var(--mintsoft)}
.btn.wa{background:var(--wa);color:#fff;border-color:var(--wa)}
.btn.wa:hover{background:#18763f;border-color:#18763f}
.btn-sm{padding:8px 16px;font-size:.9rem}
.top{position:sticky;top:0;z-index:20;background:rgba(255,253,247,.95);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.top-in{display:flex;align-items:center;gap:16px;min-height:62px}
.brand{display:flex;flex-direction:column;text-decoration:none;line-height:1.1;padding:8px 0}
.brand .name{font-family:Fraunces,Georgia,serif;font-weight:650;font-size:1.15rem;color:var(--ink)}
.brand .role{font-size:.72rem;letter-spacing:.04em;color:var(--mint);font-weight:800}
.nav{display:none;gap:16px;margin-left:auto}
.nav a{color:var(--ink);text-decoration:none;font-weight:700;font-size:.95rem}
.top .btn{margin-left:auto}
.mnav{display:flex;gap:14px;padding:0 0 10px;overflow:auto;font-size:.85rem}
.mnav a{color:var(--ink);text-decoration:none;font-weight:700;white-space:nowrap}

.hero{padding:16px 0 20px;background:linear-gradient(180deg,var(--mintsoft) 0%,var(--bg) 100%)}
.hero-in{display:grid;gap:16px;padding-bottom:8px}
.hero-media{max-width:160px;margin:0 auto}
.hero-media img{width:100%;border-radius:50%;aspect-ratio:1;object-fit:cover;object-position:center 15%;border:5px solid #fff;box-shadow:0 12px 32px rgba(10,92,80,.18)}
.eyebrow{display:inline-block;background:var(--saffsoft);color:var(--saffron);font-weight:800;font-size:.8rem;padding:4px 12px;border-radius:999px;margin:0 0 .8em}
.lead{font-size:1.08rem;color:var(--muted)}
.hing{font-family:Fraunces,Georgia,serif;font-style:italic;color:var(--saffron);font-weight:600}
.hing.big{font-size:1.3rem}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0 10px}

.sec{padding:52px 0}
.sec.mint{background:var(--mint);color:#fff}
.sec.mint h2,.sec.mint h3{color:#fff}
.sec.mint .sub{color:#d7efe9}
.sec.alt{background:var(--bg2)}
.sub{color:var(--muted);margin-top:-.15em}
.hi{color:var(--mint);font-weight:800}

.checks{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:12px}
.checks li{background:#fff;border-radius:var(--r);padding:16px 18px 16px 52px;position:relative;border:1px solid var(--line);box-shadow:0 4px 14px rgba(28,42,36,.04);font-weight:700}
.checks li::before{content:"";position:absolute;left:16px;top:16px;width:22px;height:22px;border-radius:6px;border:2px solid var(--mint);background:var(--mintsoft)}
.checks li::after{content:"";position:absolute;left:23px;top:21px;width:7px;height:11px;border:solid var(--mint);border-width:0 2px 2px 0;transform:rotate(45deg)}
.checks .en{display:block;font-weight:600;color:var(--muted);font-size:.9rem;margin-top:.15em}

.cards{display:grid;gap:14px}
.card{background:#fff;border-radius:var(--r);padding:20px;border:1px solid var(--line);box-shadow:0 6px 18px rgba(28,42,36,.05)}
.card h3{color:var(--mint)}
.card p{margin:.3em 0}

.about{display:grid;gap:22px}
.about img{width:100%;max-width:280px;border-radius:28px;object-fit:cover;aspect-ratio:4/5;object-position:center 15%;margin:0 auto}
.facts{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.facts li{background:var(--mintsoft);border-radius:18px;padding:14px 16px}
.facts b{display:block;color:var(--mint)}
.facts span{color:var(--ink);font-size:.95rem}

.pills{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.pill{background:var(--saffsoft);color:var(--saffron);border-radius:999px;padding:10px 16px;font-weight:800;font-size:.95rem}

.steps{list-style:none;counter-reset:s;padding:0;margin:0 0 24px;display:grid;gap:12px}
.steps li{counter-increment:s;position:relative;padding:16px 16px 16px 66px;background:#fff;border-radius:var(--r);border:1px solid var(--line)}
.steps li::before{content:counter(s);position:absolute;left:16px;top:16px;width:36px;height:36px;border-radius:50%;background:var(--saffron);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center}
.steps b{display:block}
.steps span{color:var(--muted)}

.reels{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-bottom:20px}
.reels figure{margin:0}
.reels figcaption{font-size:.9rem;font-weight:800;margin-top:8px}
.reel{position:relative;display:block;width:100%;padding:0;border:0;border-radius:20px;overflow:hidden;cursor:pointer;background:#1c2a24;aspect-ratio:9/16}
.reel img{width:100%;height:100%;object-fit:cover}
.play{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:rgba(255,253,247,.95)}
.play::after{content:"";position:absolute;left:25px;top:18px;border-style:solid;border-width:14px 0 14px 22px;border-color:transparent transparent transparent var(--mint)}
video{border-radius:20px;aspect-ratio:9/16;width:100%;background:#000}

.share-row{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0 8px}
#copy-status{min-height:1.4em;font-weight:800}

details{background:var(--bg);border:1px solid var(--line);border-radius:18px;padding:14px 18px;margin-bottom:10px}
summary{font-weight:800;cursor:pointer}
details p{margin:.6em 0 0;color:var(--muted)}

.foot{background:var(--mint);color:#e7f4f1;padding:36px 0 28px}
.foot a{color:#fff}
.foot-in{display:grid;gap:16px}
.foot-brand .name{font-family:Fraunces,Georgia,serif;font-size:1.3rem;color:#fff}
.foot-brand .role{font-size:.8rem;font-weight:800;color:#cfe8e2;margin:.15em 0 .5em}
.foot p{margin:.2em 0}
.copy{font-size:.85rem;opacity:.85}

.wa-bar{position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--mint);padding:10px 14px calc(10px + env(safe-area-inset-bottom));box-shadow:0 -6px 20px rgba(10,92,80,.25)}
.wa-bar .inner{max-width:1080px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:10px}
.wa-bar p{margin:0;color:#d7efe9;font-weight:700;font-size:.9rem}
.wa-bar .btn{flex:0 0 auto}

@media (min-width:640px){
  .cards{grid-template-columns:repeat(2,1fr)}
  .about{grid-template-columns:240px 1fr;align-items:center}
  .about img{margin:0}
  .checks{grid-template-columns:1fr 1fr}
  .foot-in{grid-template-columns:1fr auto;align-items:start}
}
@media (min-width:900px){
  .nav{display:flex}.mnav{display:none}.top .btn{margin-left:8px}
  .hero{padding:48px 0 20px}
  .hero-in{grid-template-columns:auto 1fr;align-items:center;gap:40px}
  .hero-media{max-width:280px;margin:0}
  .cards{grid-template-columns:repeat(3,1fr)}
  .cards .card:last-child{grid-column:span 2}
  .reels{grid-template-columns:repeat(4,1fr)}
  .steps{grid-template-columns:repeat(4,1fr)}
  .steps li{padding:62px 16px 16px}
}
@media (min-width:1100px){
  .cards{grid-template-columns:repeat(4,1fr)}
  .cards .card:last-child{grid-column:auto}
}
