:root{
  --g:#067a33; --g2:#045e27; --gold:#ffb703; --ink:#16201a;
  --bg:#f2f5f2; --card:#fff; --mut:#5d6b61; --line:#e2e8e2;
  --r:14px; --shadow:0 1px 3px rgba(10,40,20,.08),0 4px 14px rgba(10,40,20,.05);
}
@media (prefers-color-scheme:dark){
  :root{--bg:#0e1411; --card:#19231d; --ink:#e8efe9; --mut:#93a398;
        --line:#26332b; --shadow:0 2px 8px rgba(0,0,0,.4)}
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
     background:var(--bg);color:var(--ink);font-size:16px;line-height:1.55;
     padding-bottom:env(safe-area-inset-bottom)}
header{position:sticky;top:0;z-index:10;
       background:linear-gradient(135deg,var(--g),var(--g2));
       box-shadow:0 2px 10px rgba(0,60,25,.25)}
.bar{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;
     padding:.7rem .9rem;max-width:760px;margin:0 auto}
.logo{color:#fff;font-weight:800;font-size:1.3rem;text-decoration:none;
      letter-spacing:-.5px}
.logo span{color:var(--gold)}
.logo small{font-weight:500;font-size:.7rem;opacity:.8;margin-left:.25rem}
.search{display:flex;flex:1;min-width:190px;background:rgba(255,255,255,.16);
        border:1px solid rgba(255,255,255,.25);border-radius:99px;
        overflow:hidden;backdrop-filter:blur(4px)}
.search input{flex:1;padding:.55rem .9rem;border:0;background:transparent;
              color:#fff;font-size:1rem;outline:none}
.search input::placeholder{color:rgba(255,255,255,.75)}
.search button{background:transparent;border:0;padding:0 .9rem;cursor:pointer;
               font-size:1rem}
.cats{display:flex;gap:.45rem;overflow-x:auto;padding:.55rem .9rem .8rem;
      max-width:760px;margin:0 auto;scrollbar-width:none;
      -webkit-overflow-scrolling:touch}
.cats::-webkit-scrollbar{display:none}
.cats a{white-space:nowrap;text-decoration:none;color:#fff;font-size:.83rem;
        font-weight:600;padding:.32rem .85rem;border-radius:99px;
        background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);
        transition:background .15s}
.cats a.on{background:var(--gold);color:#1d1602;border-color:var(--gold)}
main{max-width:760px;margin:0 auto;padding:1rem .9rem 2rem}
.meta{font-size:.85rem;color:var(--mut);margin:.1rem 0 .8rem}
.card{position:relative;display:block;background:var(--card);
      border:1px solid var(--line);border-radius:var(--r);
      padding:1rem 1.05rem;margin-bottom:.75rem;text-decoration:none;
      color:inherit;box-shadow:var(--shadow);
      transition:transform .15s,box-shadow .15s}
@media (hover:hover){
  a.card:hover{transform:translateY(-2px);
       box-shadow:0 6px 20px rgba(10,40,20,.13)}
}
.card h2{font-size:1.06rem;color:var(--g);line-height:1.35;padding-right:4.5rem}
@media (prefers-color-scheme:dark){.card h2{color:#5dd388}}
.featured{border-left:4px solid var(--gold)}
.ribbon{position:absolute;top:.8rem;right:.8rem;background:var(--gold);
        color:#1d1602;font-size:.68rem;font-weight:800;padding:.18rem .55rem;
        border-radius:99px}
.firm{font-weight:600;font-size:.9rem;margin:.25rem 0}
.firm i{color:var(--mut);font-style:normal}
.sum{font-size:.89rem;color:var(--mut)}
.tag{display:flex;justify-content:space-between;align-items:center;
     font-size:.78rem;color:var(--mut);margin-top:.55rem}
.tag b{color:var(--g);font-weight:600}
@media (prefers-color-scheme:dark){.tag b{color:#5dd388}}
.detail h1{font-size:1.4rem;color:var(--g);line-height:1.3;margin-bottom:.3rem}
@media (prefers-color-scheme:dark){.detail h1{color:#5dd388}}
.detail .body{margin:.8rem 0;white-space:pre-line}
.btn{display:inline-block;background:var(--g);color:#fff;font-weight:700;
     padding:.72rem 1.2rem;border-radius:10px;text-decoration:none;border:0;
     font-size:.97rem;cursor:pointer;margin-top:.5rem;
     transition:filter .15s}
.btn:active{filter:brightness(.9)}
.btn.gold{background:var(--gold);color:#1d1602}
.btn.ghost{background:transparent;color:var(--g);border:1.5px solid var(--g)}
.btn.wa-share{background:#25d366;color:#fff}
.share{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.3rem}
.promo h2{font-size:1.02rem;margin-bottom:.25rem}
.pager{display:flex;justify-content:space-between;align-items:center;
       padding:.5rem .2rem;font-size:.92rem;color:var(--mut)}
.pager a{color:var(--g);font-weight:700;text-decoration:none}
.prices{list-style:none}
.prices li{display:grid;grid-template-columns:1fr auto;gap:.1rem .6rem;
           padding:.65rem 0;border-bottom:1px solid var(--line)}
.prices em{font-style:normal;font-weight:800;color:var(--g)}
.prices span{grid-column:1/-1;font-size:.84rem;color:var(--mut)}
.steps{padding-left:1.2rem;margin:.4rem 0 .8rem}
.steps li{margin:.3rem 0}
.form label{display:block;margin:.65rem 0;font-weight:600;font-size:.9rem}
.form input,.form select,.form textarea{width:100%;padding:.6rem;
     margin-top:.25rem;border:1px solid var(--line);border-radius:8px;
     font-size:1rem;font-family:inherit;background:var(--bg);color:var(--ink)}
.form .chk{display:flex;gap:.5rem;align-items:center;font-weight:500}
.form .chk input{width:auto}
.err{background:#fde8e8;color:#b00020;padding:.65rem;border-radius:8px;
     margin-bottom:.5rem}
.empty{text-align:center;padding:2rem 1rem}
footer{text-align:center;padding:1.2rem .9rem 2.2rem;font-size:.85rem;
       color:var(--mut);max-width:760px;margin:0 auto}
footer a{color:var(--g)}
.wa{display:block;background:#25d366;color:#fff;font-weight:700;
    padding:.85rem;border-radius:12px;text-decoration:none;
    margin-bottom:.9rem;box-shadow:var(--shadow)}
