:root{--black:#000;--white:#fff;--text:#0f172a;--muted:#6b7280;--border:#e5e7eb;--orange:#f97316;--container:1200px}
*{box-sizing:border-box}html,body{margin:0;padding:0}
body{font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--text);background:#fff}
a{text-decoration:none;color:inherit}.container{max-width:var(--container);margin:0 auto;padding:0 16px}.hidden{display:none}
.grid{display:grid}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.gap-5{gap:20px}.gap-6{gap:24px}.gap-8{gap:32px}.gap-10{gap:40px}
.flex{display:flex}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.flex-wrap{flex-wrap:wrap}
.mx-auto{margin-left:auto;margin-right:auto}.px-4{padding-left:16px;padding-right:16px}
.py-3{padding-top:12px;padding-bottom:12px}.py-10{padding-top:40px;padding-bottom:40px}.py-12{padding-top:48px;padding-bottom:48px}.py-14{padding-top:56px;padding-bottom:56px}
.mt-1{margin-top:4px}.mt-2{margin-top:8px}.mt-3{margin-top:12px}.mt-4{margin-top:16px}.mt-5{margin-top:20px}.mt-6{margin-top:24px}.mt-8{margin-top:32px}.mt-10{margin-top:40px}
.text-sm{font-size:14px}.text-xs{font-size:12px}.text-2xl{font-size:24px}.text-3xl{font-size:28px}.text-4xl{font-size:36px}.text-5xl{font-size:44px}
.font-bold{font-weight:800}.font-semibold{font-weight:600}.font-medium{font-weight:500}
.rounded-xl{border-radius:14px}.rounded-2xl{border-radius:18px}.rounded-3xl{border-radius:24px}
.border{border:1px solid var(--border)}.border-t{border-top:1px solid var(--border)}.shadow-sm{box-shadow:0 3px 8px rgba(0,0,0,.05)}
.cols-1{grid-template-columns:1fr}@media(min-width:900px){.md-cols-2{grid-template-columns:1fr 1fr}.md-cols-3{grid-template-columns:repeat(3,1fr)}}
.max-w-7xl{max-width:var(--container)}.small{font-size:12px;color:var(--muted)}
.header{position:sticky;top:0;z-index:40;background:#000;color:#fff;border-bottom:1px solid rgba(255,255,255,.1)}
.footer{background:#000;color:#fff;border-top:1px solid rgba(255,255,255,.1)}
.nav a{color:#fff;opacity:.9;margin-left:20px;padding:6px 8px;border-radius:10px;transition:.15s}
.nav a:hover,.nav a:focus{color:#fff;opacity:1;background:rgba(249,115,22,.15);outline:none}.nav a.active{background:rgba(249,115,22,.25)}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--orange);color:#000;border-radius:14px;padding:12px 18px;font-weight:700;border:1px solid rgba(0,0,0,.2)}
.btn-ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.35)}
.section{padding:56px 0;border-top:1px solid var(--border)}.card{border:1px solid var(--border);border-radius:16px;padding:16px;background:#fff;box-shadow:0 3px 8px rgba(0,0,0,.03)}
.hero{background:#000;color:#fff}.square{position:relative;width:100%;aspect-ratio:1/1;border-radius:24px;overflow:hidden;background:#000;border:1px solid rgba(255,255,255,.15);box-shadow:0 10px 30px rgba(0,0,0,.35)}
.pre{position:absolute;inset:0;background:#000;transition:opacity .5s}
.video-pane{position:absolute;inset:0;opacity:0;transition:opacity 1s}.video-pane.active{opacity:1}.video{width:100%;height:100%;object-fit:cover}
.input,select,textarea{width:100%;padding:12px;border:1px solid var(--border);border-radius:12px}.addon{display:flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:12px;padding:12px;background:#f7f7f7}
.range{font-weight:800;font-size:24px;color:var(--orange)}