:root{
  --bg:#101010;--surface:#191919;--surface2:#222;--text:#f7f2ea;
  --muted:#b9b0a5;--accent:#e76f31;--accent2:#ff8a4b;
  --line:rgba(255,255,255,.12);--cream:#efe9df;--ink:#171717;
  --max:1180px;--radius:24px
}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--bg);color:var(--text);line-height:1.55}
a{color:inherit;text-decoration:none}img{display:block;width:100%}
.container{width:min(calc(100% - 36px),var(--max));margin-inline:auto}
header{position:sticky;top:0;z-index:30;background:rgba(16,16,16,.88);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{font-size:1.22rem;font-weight:900;letter-spacing:.18em}
.navlinks{display:flex;gap:24px;color:#ded6cb;font-size:.94rem}
.controls{display:flex;align-items:center;gap:10px}
.lang{border:1px solid var(--line);background:transparent;color:#fff;border-radius:999px;padding:9px 12px;cursor:pointer}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:14px 22px;font-weight:800;border:1px solid transparent;cursor:pointer}
.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent2)}
.btn-outline{border-color:rgba(255,255,255,.26)}
.hero{min-height:82vh;display:grid;align-items:end;padding:120px 0 70px;background:
linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.28)),
linear-gradient(0deg,#101010,transparent 42%),
url('/assets/hero-family-fire.webp') center/cover}
.eyebrow{color:#f0a175;text-transform:uppercase;letter-spacing:.18em;font-size:.76rem;font-weight:900;margin-bottom:18px}
h1{font-size:clamp(3.2rem,8vw,7.2rem);line-height:.92;letter-spacing:-.06em;margin:0;max-width:820px}
.hero p{max-width:670px;font-size:1.18rem;color:#ddd5cb;margin:26px 0 30px}
.actions{display:flex;gap:12px;flex-wrap:wrap}
section{padding:92px 0}
.head{display:grid;grid-template-columns:1.2fr .8fr;gap:36px;align-items:end;margin-bottom:42px}
h2{font-size:clamp(2.2rem,5vw,4.2rem);line-height:1.03;letter-spacing:-.045em;margin:0}
.head p,.muted{color:var(--muted)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:.25s}
.card:hover{transform:translateY(-5px);border-color:rgba(231,111,49,.42)}
.card img{aspect-ratio:4/3;object-fit:cover}
.card-body{padding:24px}.kicker{font-size:.74rem;font-weight:900;letter-spacing:.15em;text-transform:uppercase;color:#eb986b}
.card h3{font-size:1.65rem;margin:8px 0}.card p{color:var(--muted);min-height:74px}
.link{display:inline-flex;margin-top:8px;font-weight:800}.link span{color:var(--accent);margin-left:7px}
.why{background:var(--cream);color:var(--ink)}.why p{color:#625c54}
.benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.benefit{border-top:1px solid rgba(0,0,0,.18);padding-top:20px}
.product-hero{padding:80px 0 64px}
.product-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:48px;align-items:start}
.gallery-main{border-radius:28px;overflow:hidden;background:#222;border:1px solid var(--line)}
.gallery-main img{aspect-ratio:4/3;object-fit:cover}
.thumbs{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:12px}
.thumbs img{border-radius:16px;aspect-ratio:4/3;object-fit:cover;border:1px solid var(--line)}
.product-copy h1{font-size:clamp(2.8rem,6vw,5.7rem)}
.lead{font-size:1.16rem;color:var(--muted)}
.specs{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:28px 0}
.spec{padding:15px;background:var(--surface);border:1px solid var(--line);border-radius:14px}
.spec small{display:block;color:var(--muted);margin-bottom:4px}
.notice{padding:16px 18px;border:1px solid rgba(231,111,49,.35);background:rgba(231,111,49,.08);border-radius:16px;color:#f4d7c8}
.contact{background:#151515}
.contact-card{display:grid;grid-template-columns:.9fr 1.1fr;gap:44px;background:var(--surface);border:1px solid var(--line);border-radius:28px;padding:clamp(28px,5vw,58px)}
form{display:grid;grid-template-columns:1fr 1fr;gap:14px}.full{grid-column:1/-1}
label{display:block;font-size:.88rem;font-weight:800;color:#ddd4ca;margin-bottom:6px}
input,select,textarea{width:100%;padding:14px 15px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:#101010;color:#fff}
textarea{min-height:110px}
footer{padding:30px 0;border-top:1px solid var(--line);color:#9f978d}
@media(max-width:900px){
 .navlinks{display:none}.head,.product-grid,.contact-card{grid-template-columns:1fr}
 .cards{grid-template-columns:1fr}.benefits{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
 .benefits{grid-template-columns:1fr}.specs,form{grid-template-columns:1fr}.full{grid-column:auto}
 .container{width:min(calc(100% - 24px),var(--max))}
}

.card{box-shadow:0 24px 70px rgba(0,0,0,.26)}
.card img{transition:transform .45s ease,filter .35s ease;filter:saturate(1.03) contrast(1.02)}
.card:hover img{transform:scale(1.045)}
.card-body{background:linear-gradient(180deg,rgba(255,255,255,.015),rgba(255,255,255,0))}
.gallery-main img,.thumbs img{transition:transform .35s ease,filter .35s ease}
.gallery-main:hover img,.thumbs img:hover{transform:scale(1.02);filter:contrast(1.04) saturate(1.04)}