:root{
  --bg:#0b0d14; --bg-alt:#0f1320; --fg:#eef2f8; --muted:#a7b1c7;
  --accent:#e41c23; --card:#131829; --border:#20283e; --radius:14px;
  --shadow:0 10px 30px rgba(0,0,0,.25);
  --step-1:clamp(1.2rem,1.1rem + 0.9vw,1.5rem);
  --step-2:clamp(1.6rem,1.4rem + 1.5vw,2.1rem);
  --step-3:clamp(2.3rem,1.9rem + 2vw,3.1rem);
}
*{box-sizing:border-box} html,body{height:100%} body{margin:0;font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;color:var(--fg);background:linear-gradient(180deg,var(--bg),var(--bg-alt));line-height:1.6}
img{max-width:100%;display:block} a{color:var(--fg);text-decoration:none} a:hover{color:var(--accent)} p{color:var(--muted)}
.container{width:min(1200px,92%);margin-inline:auto} .narrow{width:min(840px,92%);margin-inline:auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(10,12,20,.7);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.header-inner{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;padding:.75rem 0}
.brand{display:flex;align-items:center;gap:.75rem;font-weight:800} .brand-mark{width:60px;height:60px;object-fit:contain}
.brand-stack{display:grid;line-height:1} .brand-top{font-family:Oswald,system-ui;font-size:1.05rem;letter-spacing:.4px}
.brand-bottom{font-family:Oswald,system-ui;font-weight:700;font-size:1.25rem;color:var(--accent);letter-spacing:.6px}
.site-nav ul{display:flex;gap:1rem;justify-content:center;list-style:none;margin:0;padding:0}
.site-nav a{padding:.55rem .8rem;border-radius:10px;border:1px solid transparent;font-weight:600}
.site-nav a:hover{border-color:var(--border);background:rgba(255,255,255,0.04)} .nav-toggle{display:none;border:1px solid var(--border);background:transparent;color:var(--fg);padding:.45rem .65rem;border-radius:10px}
.section{padding:clamp(2.5rem,6vw,5rem) 0;border-bottom:1px solid var(--border);scroll-margin-top:86px}
.section-alt{background:linear-gradient(180deg,rgba(255,255,255,0.02),rgba(255,255,255,0.00))} .section-tight{padding:clamp(2rem,5vw,3.5rem) 0}
.section-head{display:grid;gap:.4rem;margin-bottom:1.25rem} .section-title{font-family:Oswald,system-ui;font-size:var(--step-2);letter-spacing:.5px}
.display{font-family:Oswald,system-ui;font-size:var(--step-3);letter-spacing:.8px} .accent{color:var(--accent)} .lead{font-size:var(--step-1);margin:.5rem 0 1rem}
.hero{position:relative;isolation:isolate;overflow:hidden}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.7;z-index:-1}
.hero-wrap{display:grid;grid-template-columns:1.2fr .8fr;gap:2rem;align-items:center}
.btn{display:inline-block;padding:.65rem 1rem;border-radius:12px;border:1px solid var(--border);font-weight:600;box-shadow:var(--shadow)} .btn-primary{background:var(--accent);color:#0b0d14;border-color:transparent}
.grid{display:grid;gap:1rem} .grid.two{grid-template-columns:repeat(2,1fr);gap:1rem} .products{grid-template-columns:repeat(5,1fr)}
.card{background:var(--card);border:1px solid var(--border);padding:1rem;border-radius:var(--radius);box-shadow:var(--shadow)}
.card h3{font-family:Oswald,system-ui;margin:.15rem 0 .35rem}
.products .card{cursor:pointer;transition:transform .15s ease,box-shadow .15s ease;display:grid;gap:.5rem}
.products .card:hover{transform:translateY(-2px);box-shadow:0 16px 40px rgba(0,0,0,.28)}
.products .thumb{width:100%;aspect-ratio:4/3;border-radius:var(--radius);border:1px solid var(--border);background:#0c1020;overflow:hidden}
.products .thumb img{width:100%;height:100%;object-fit:cover}
.price-tag{display:inline-block;margin-top:.35rem;font-weight:700;padding:.18rem .45rem;border-radius:8px;background:rgba(255,255,255,.08);border:1px solid var(--border);color:#fff;font-size:.95rem}
.gallery{grid-template-columns:repeat(4,1fr)} .gallery .tile{display:grid;gap:.5rem}
.gallery .tile .thumb{width:100%;aspect-ratio:4/3;border-radius:var(--radius);border:1px solid var(--border);overflow:hidden;display:block;background:#0c1020}
.gallery .tile img{width:100%;height:100%;object-fit:cover}
.muted{color:var(--muted)} .small{font-size:.92rem} .center{text-align:center}

/* Drawer */
.mdc-drawer{ position:fixed; inset:0; display:none; z-index:1000; }
.mdc-drawer.open{ display:block; }
.mdc-drawer__backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.6); z-index:1; }
.mdc-drawer__panel{
  position:absolute; right:0; top:0; height:100%;
  width:min(560px,96vw);
  background:var(--bg);
  border-left:1px solid var(--border);
  box-shadow:-20px 0 60px rgba(0,0,0,.35);
  border-top-left-radius:14px; border-bottom-left-radius:14px;
  display:grid; grid-template-rows:auto 1fr; gap:.75rem; padding:1rem;
  overflow:hidden; z-index:2;
}
.mdc-drawer__close{ position:absolute; top:.6rem; right:.6rem; background:transparent; color:var(--fg); border:1px solid var(--border); border-radius:10px; padding:.45rem .6rem; }
.mdc-drawer__head{ display:grid; gap:.2rem; padding-right:2.4rem; }
.mdc-drawer__panel form{ overflow:auto; padding-right:.25rem; }

/* Form visuals */
.mdc-calc{ display:grid; gap:1rem; }
.mdc-calc label span, .mdc-calc legend{ font-weight:600; color:#fff; }
.mdc-calc input, .mdc-calc select, .mdc-calc textarea{ width:100%; background:#0c1020; color:var(--fg); border:1px solid var(--border); border-radius:12px; padding:.75rem .9rem; }
.mdc-calc input:focus, .mdc-calc select:focus, .mdc-calc textarea:focus{ outline:2px solid var(--accent); outline-offset:2px; }

.mdc-opts{ border:1px dashed var(--border); border-radius:12px; padding:.75rem .9rem; display:grid; gap:.6rem; }
.mdc-opts legend{ margin-bottom:.25rem; }
.mdc-opts label{ display:grid; grid-template-columns:1fr auto; align-items:center; gap:.6rem; }

.grid.two{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
@media (max-width:640px){ .grid.two{ grid-template-columns:1fr; } }

.mdc-est{ display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; padding:.75rem; border:1px solid var(--border); border-radius:12px; background:rgba(255,255,255,.03); }
.mdc-est > div{ display:grid; gap:.25rem; }

.dropzone{ border:2px dashed var(--border); border-radius:12px; padding:1rem; text-align:center; background:rgba(255,255,255,.03); }
.dropzone.drag{ background:rgba(255,255,255,.08); }
.previews{ display:flex; gap:.5rem; flex-wrap:wrap; margin-top:.5rem; }
.preview{ border:1px solid var(--border); border-radius:8px; padding:.25rem .4rem; font-size:.85rem; }

#form-status{ min-height:1em; }

.site-footer{padding:2rem 0} .footer-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap} .footer-links{display:flex;gap:1rem;list-style:none;padding:0;margin:0}
@media (max-width:1024px){.hero-wrap{grid-template-columns:1fr}.products{grid-template-columns:repeat(3,1fr)} .gallery{grid-template-columns:repeat(3,1fr)} .hero-logo{display:none}}
@media (max-width:640px){.nav-toggle{display:inline-block} .site-nav{display:none} .site-nav.open{display:block} .site-nav ul{flex-direction:column;padding:.5rem 0} .products{grid-template-columns:repeat(2,1fr)} .gallery{grid-template-columns:repeat(2,1fr)} .grid.two{grid-template-columns:1fr}}