:root{--primary:#8b6f47;--primary-dark:#6b5637;--accent:#d4a574;--text:#3a3a3a;--muted:#666;--border:#d9ccc1;--bg:#faf8f5;--card:#fff;--radius:14px}
@media (prefers-color-scheme:dark){:root{--text:#ece6de;--muted:#b4aa9d;--border:#4a4036;--bg:#1d1914;--card:#262019;--primary:#d4a574;--primary-dark:#e6c498}}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:17px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--text);background:var(--bg)}
a{color:var(--primary-dark)}
.wrap{max-width:1040px;margin:0 auto;padding:0 16px}
header{position:sticky;top:0;background:var(--bg);border-bottom:1px solid var(--border);z-index:5}
header .wrap{display:flex;align-items:center;gap:1rem;min-height:3.5rem}
.brand{display:flex;align-items:center;gap:.5rem;font-weight:700;text-decoration:none;color:var(--text)}
.brand img{width:28px;height:28px}
nav{margin-left:auto;display:flex;align-items:center;gap:1rem;font-size:.95rem}
nav a{text-decoration:none;color:var(--muted)}
nav a:hover{color:var(--text)}
button.lang{font:inherit;font-size:.9rem;border:1px solid var(--border);background:var(--card);color:var(--text);border-radius:8px;padding:.25rem .6rem;cursor:pointer}
.hero{padding:4.5rem 0 3rem;text-align:center}
.hero h1{font-size:clamp(2rem,5vw,3.2rem);line-height:1.15;margin:0 0 1rem}
.hero p{max-width:40rem;margin:0 auto 1.6rem;color:var(--muted);font-size:1.15rem}
.btn{display:inline-block;background:var(--primary);color:#fff;text-decoration:none;padding:.75rem 1.4rem;border-radius:10px;font-weight:600}
.btn:hover{background:var(--primary-dark)}
.btn.alt{background:transparent;color:var(--primary-dark);border:1.5px solid var(--primary)}
.btn.alt:hover{background:var(--card)}
.cta{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap}
section{padding:3rem 0}
h2{font-size:1.7rem;margin:0 0 .4rem;text-align:center}
.sub{text-align:center;color:var(--muted);margin:0 auto 2rem;max-width:38rem}
.grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(15.5rem,1fr))}
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:1.2rem}
.card .ic{font-size:1.6rem}
.card h3{margin:.3rem 0 .3rem;font-size:1.05rem}
.card p{margin:0;color:var(--muted);font-size:.97rem}
.steps{counter-reset:s;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
.steps .card::before{counter-increment:s;content:counter(s);display:inline-grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:var(--primary);color:#fff;font-weight:700;margin-bottom:.4rem}
.band{background:var(--card);border-block:1px solid var(--border)}
.price-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));max-width:44rem;margin:0 auto}
.price{text-align:center}
.price .amt{font-size:2.3rem;font-weight:700;margin:.2rem 0}
.price .amt small{font-size:1rem;font-weight:400;color:var(--muted)}
.price.best{border:2px solid var(--primary)}
.tag{display:inline-block;font-size:.78rem;background:var(--accent);color:#3a2a14;border-radius:99px;padding:.1rem .6rem;font-weight:600}
ul.tick{list-style:none;padding:0;margin:1rem auto;max-width:34rem}
ul.tick li{padding:.25rem 0 .25rem 1.6rem;position:relative}
ul.tick li::before{content:"✓";position:absolute;left:0;color:var(--primary);font-weight:700}
details{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:.8rem 1rem;margin:.6rem auto;max-width:44rem}
summary{cursor:pointer;font-weight:600}
details p{margin:.6rem 0 0;color:var(--muted)}
.note{font-size:.85rem;color:var(--muted);text-align:center;margin-top:1rem}
footer{padding:2rem 0;text-align:center;color:var(--muted);font-size:.9rem;border-top:1px solid var(--border)}
@media (max-width:640px){nav a.hide-s{display:none}.hero{padding:3rem 0 2rem}}
.about{max-width:640px;margin:2rem auto 3rem;padding:0 1.75rem 1.5rem;background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.08);font-size:15px;line-height:1.55}
.about-hero{text-align:center;margin:0 -1.75rem 1rem;padding:2rem 1.75rem 1.25rem;border-radius:16px 16px 0 0;background:linear-gradient(180deg,#f3ece2 0%,var(--card) 100%)}
@media (prefers-color-scheme:dark){.about-hero{background:linear-gradient(180deg,#332a1f 0%,var(--card) 100%)}}
.about-emoji{font-size:3rem;line-height:1}
.about-hero h1{margin:.4rem 0 .2rem;font-size:1.8rem;color:var(--primary)}
.about-hero .about-tagline{margin:0;color:var(--primary-dark);font-style:italic;font-size:inherit}
.about h3{margin:1.4rem 0 .5rem;font-size:1rem;color:var(--primary-dark)}
.about p{margin:.5rem 0}
.about-features{list-style:none;margin:.5rem 0;padding:0;display:grid;gap:.55rem}
.about-features li{display:flex;gap:.7rem;align-items:flex-start;padding:0}
.about-features li>span:first-child{flex:0 0 1.6rem;font-size:1.2rem;text-align:center}
.about-sign{margin-top:1.4rem!important;text-align:center;color:var(--muted);font-size:14px}
.about-actions{display:flex;justify-content:center;margin-top:.75rem!important}
@media (max-width:480px){.about{padding:0 1.1rem 1.25rem;font-size:14.5px;margin:1rem auto 2rem}.about-hero{margin:0 -1.1rem 1rem;padding:1.5rem 1.1rem 1rem}}
nav a[aria-current=page]{color:var(--text);font-weight:600}
