/* ====== Variables & Base ====== */
:root{
--brand:#ff8f1c;
--dark:#0f1724;
--muted:#6b7280;
--glass: rgba(255,255,255,0.06);
--max:1200px;
font-family: 'Inter', system-ui;
}
*{box-sizing:border-box}
body{margin:0;color:var(--dark);background:#ffffff;}
a{text-decoration:none;color:inherit}
img{max-width:100%;}
.container{max-width:var(--max);margin:auto;padding:0 20px}


/* ====== Hero ====== */
.hero{display:grid;grid-template-columns:1fr 520px;gap:36px;padding:48px 0;align-items:center}
.hero h1{font-size:42px;margin:0 0 12px}
.hero p{color:var(--muted);margin:0 0 20px}
.btn{padding:12px 16px;border-radius:10px;font-weight:700;display:inline-flex;align-items:center;gap:8px}
.btn-primary{background:var(--brand);color:white}
.btn-outline{border:1px solid rgba(0,0,0,.1)}


.card-visual{background:rgba(255,143,28,.06);padding:18px;border-radius:14px;box-shadow:0 6px 30px rgba(0,0,0,.06)}


/* ====== Features ====== */
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding:44px 0}
.feature{background:white;padding:18px;border-radius:12px;box-shadow:0 6px 18px rgba(0,0,0,.05)}
.feature p{color:var(--muted)}


/* ====== About Strip ====== */
.about-strip{background:#fff4e8;padding:34px;border-radius:12px;display:flex;justify-content:space-between;align-items:center}


/* ====== Contact ====== */
.contact{padding:24px 0}
.contact input,.contact textarea{width:100%;padding:12px;border-radius:8px;border:1px solid rgba(0,0,0,.1)}


/* ====== Responsive ====== */
@media(max-width:980px){.hero{grid-template-columns:1fr}.features{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.features{grid-template-columns:1fr}.hero h1{font-size:28px}}