:root{
  --orange-600:#ea580c; --orange-700:#c2410c;
  --emerald-500:#10b981; --emerald-600:#059669;
  --slate-100:#f1f5f9; --slate-500:#64748b; --slate-700:#334155; --slate-800:#1f2937; --slate-900:#0f172a;
  --border:#e5e7eb;
}
*{box-sizing:border-box} html,body{margin:0;padding:0}
body{min-height:100vh;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Helvetica,Arial,sans-serif;color:var(--slate-900);background:#fff}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.btn{border-radius:16px;padding:.5rem 1rem;font-weight:600;display:inline-block}
.btn.border{border:1px solid var(--border);background:#fff}
.btn.orange{background:var(--orange-600);color:#fff}
.btn.orange:hover{background:var(--orange-700)}
.btn.green{background:var(--emerald-500);color:#fff}
.btn.green:hover{background:var(--emerald-600)}
/* layout */
.container{max-width:72rem;margin:0 auto;padding:0 1rem}
nav.sticky{position:sticky;top:0;background:rgba(255,255,255,.9);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--border);z-index:50}
nav .tabs a{padding:.5rem .75rem;border-radius:16px}
nav .tabs a:hover{background:var(--slate-100)}
header.hero{padding:5rem 1rem;text-align:center;color:#fff;background:linear-gradient(90deg,var(--orange-600),var(--orange-700))}
h1{font-size:2.25rem;line-height:1.1;margin:.25rem 0  .5rem;font-weight:800}
h2{font-size:1.5rem;line-height:1.2;margin:0 0 1rem;font-weight:700;color:var(--orange-700);text-align:center}
p.lead{font-size:1.125rem;max-width:42rem;margin:0 auto 1.25rem}
section{padding:2.5rem 1rem}
/* grids */
.grid{display:grid;gap:1rem}
.grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.grid.cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}
@media (max-width:1024px){.grid.cols-6{grid-template-columns:repeat(4,1fr)}}
@media (max-width:768px){.grid.cols-4{grid-template-columns:repeat(3,1fr)} .grid.cols-6{grid-template-columns:repeat(3,1fr)}}
@media (max-width:640px){.grid.cols-2,.grid.cols-4,.grid.cols-6{grid-template-columns:repeat(2,1fr)}}
.card{border:1px solid var(--border);border-radius:14px;background:#fff}
.card.padded{padding:12px}
.caption{font-size:.8rem;color:var(--slate-700);text-align:center;margin-top:.4rem}
/* lists */
ul.catalog{list-style:disc;padding-left:1.25rem;color:var(--slate-700)}
/* contact */
.footer{border-top:1px solid var(--border);text-align:center;padding:1.25rem 1rem;color:var(--slate-700);font-size:.9rem}
/* floating button */
.fab{position:fixed;right:1.5rem;bottom:1.5rem;background:var(--emerald-500);color:#fff;border-radius:9999px;padding:1rem;box-shadow:0 10px 25px rgba(0,0,0,.15);z-index:40}
.fab:hover{background:var(--emerald-600)}
/* admin panel */
.admin{position:fixed;right:1rem;bottom:1rem;z-index:60;width:min(860px,95vw);border:1px solid var(--border);border-radius:18px;background:#fff;box-shadow:0 20px 50px rgba(0,0,0,.15)}
.admin .bar{display:flex;align-items:center;gap:.5rem;padding:.5rem;border-bottom:1px solid var(--border)}
.admin .grow{margin-left:auto}
.admin .body{max-height:70vh;overflow:auto;padding:1rem}
.admin label span{display:block;color:var(--slate-700);font-size:.9rem}
.admin input,.admin textarea{width:100%;margin-top:.25rem;border:1px solid var(--border);border-radius:8px;padding:.5rem}
.hidden{display:none}
.small{font-size:.8rem;color:#16a34a}
/* utility */
.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}
.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}
.text-center{text-align:center}
.text-xs{font-size:.75rem}