:root {
    --ink: #090a0c;
    --ink-2: #14161b;
    --paper: #f3f1eb;
    --paper-2: #e7e3d8;
    --line: rgba(9, 10, 12, .08);
    --gold: #ffe14a;
    --gold-2: #f0cc12;
    --text: #16181c;
    --muted: #5d636c;
    --ok: #1c7a45;
    --warn: #9a6b00;
    --danger: #b42318;
    --info: #1d4e89;
    --shadow: 0 24px 60px rgba(9, 10, 12, .12);
    --header: 118px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background: var(--paper);
    color: var(--text);
    font-family: "Outfit", sans-serif;
    font-size: 16px;
    line-height: 1.55;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
h1, h2, h3, .product-title {
    font-family: "Barlow Condensed", sans-serif;
    font-weight: 600;
    letter-spacing: .03em;
    text-transform: uppercase;
    line-height: .95;
}
.skip-link {
    position: absolute; left: 12px; top: -40px; background: var(--gold); color: #111; padding: 8px 12px; z-index: 20;
}
.skip-link:focus { top: 12px; }
.site-header { position: sticky; top: 0; z-index: 30; background: #000; color: #fff; }
.topbar { border-bottom: 1px solid rgba(255,255,255,.08); font-size: 13px; color: #c9cdd3; }
.topbar-row, .nav-row, .cat-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 38px; }
.topbar-meta, .topbar-side, .head-actions, .cat-row, .hero-actions, .carousel-nav { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.topbar a { color: #fff; text-decoration: none; }
.nav-row { min-height: 86px; }
.site-header .brand-logo,
.site-footer .brand-logo,
.admin-logo,
.auth-card .brand-logo { border: 0; background: transparent; line-height: 0; flex: none; }
.brand-logo img { height: 72px; width: auto; mix-blend-mode: screen; }
.footer-logo img, .admin-logo img { height: 60px; }
.head-search { position: relative; flex: 1; max-width: 560px; }
.head-search i { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: #888; }
.head-search input, .news-form input, .coupon-form input {
    width: 100%; height: 48px; border-radius: 999px; border: 0; background: #16181c; color: #fff; padding: 0 18px 0 44px;
}
.head-search input:focus, .form-control:focus, .form-select:focus {
    outline: 0; box-shadow: 0 0 0 4px rgba(255, 225, 74, .45); border-color: #111;
}
.suggest {
    position: absolute; left: 0; right: 0; top: calc(100% + 8px); background: #fff; color: #111;
    border-radius: 16px; box-shadow: var(--shadow); overflow: hidden; z-index: 5;
}
.suggest-item { display: flex; gap: 12px; align-items: center; padding: 10px 12px; text-decoration: none; }
.suggest-item:hover { background: #f6f3ea; }
.suggest-item img { width: 48px; height: 48px; object-fit: cover; border-radius: 8px; background: #111; }
.suggest-item span { display: flex; flex-direction: column; }
.suggest-item em { font-style: normal; color: var(--muted); font-size: 13px; }
.head-actions a, .cart-launch, .icon-btn, .text-btn, .admin-top button, .admin-top a {
    background: transparent; border: 0; color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: 6px;
}
.head-actions em, .cart-launch em {
    min-width: 18px; height: 18px; border-radius: 99px; background: var(--gold); color: #111; font-style: normal;
    font-size: 11px; display: inline-grid; place-items: center; padding: 0 5px;
}
.cat-nav { background: #0c0d10; }
.cat-row { min-height: 46px; overflow: auto; }
.cat-row a { color: #ddd; text-decoration: none; white-space: nowrap; font-size: 14px; }
.cat-row a:hover { color: var(--gold); }
.mode-pill { border: 1px solid rgba(255,225,74,.5); color: var(--gold); border-radius: 99px; padding: 2px 8px; font-size: 12px; }
.mode-pill.is-off { color: #bbb; border-color: rgba(255,255,255,.2); }
.mode-switch { border: 0; background: transparent; color: inherit; display: inline-flex; align-items: center; gap: 8px; padding: 0; }
.mode-switch .track { width: 44px; height: 26px; border-radius: 99px; background: #3a3f46; position: relative; display: inline-block; }
.mode-switch .track i { position: absolute; width: 20px; height: 20px; border-radius: 50%; background: #fff; top: 3px; left: 3px; transition: transform .2s; }
.mode-switch.is-on .track { background: var(--gold); }
.mode-switch.is-on .track i { transform: translateX(18px); background: #111; }
.mobile-nav { background: #0c0d10; color: #fff; }
.mobile-nav a { display: block; color: #fff; text-decoration: none; padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.hero { position: relative; min-height: 78vh; background: #000; color: #fff; overflow: hidden; }
.hero-slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity .7s ease; display: grid; align-items: center; padding: 120px 0 90px; }
.hero-slide.is-active { opacity: 1; visibility: visible; z-index: 1; }
.hero-photo, .hero-shade { position: absolute; inset: 0; }
.hero-photo { background-size: cover; background-position: center; transform: scale(1.08); transition: transform 7s linear; }
.hero-slide.is-active .hero-photo { transform: scale(1); }
.hero-shade { background: linear-gradient(90deg, rgba(0,0,0,.78), rgba(0,0,0,.2)); }
.theme-gold { background: radial-gradient(circle at 80% 20%, rgba(255,225,74,.35), transparent 36%), linear-gradient(160deg, #14120a, #050505 60%); }
.theme-steel { background: radial-gradient(circle at 70% 30%, rgba(213,216,222,.28), transparent 32%), linear-gradient(160deg, #1a1e24, #050505 62%); }
.theme-ember { background: radial-gradient(circle at 75% 20%, rgba(255,120,40,.28), transparent 34%), linear-gradient(160deg, #1a100c, #050505 60%); }
.hero-copy { position: relative; z-index: 2; max-width: 820px; }
.hero h1, .hero .lead { color: #fff; }
.hero-slide.is-active .eyebrow { animation: rise .6s .05s both; }
.hero-slide.is-active h1 { animation: rise .7s .12s both; }
.hero-slide.is-active .lead { animation: rise .7s .22s both; }
.hero-slide.is-active .hero-actions { animation: rise .7s .32s both; }
@keyframes rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
.hero h1 { font-size: clamp(52px, 8vw, 108px); margin: 8px 0 16px; max-width: 14ch; }
.eyebrow { color: var(--gold); letter-spacing: .18em; text-transform: uppercase; font-size: 12px; margin: 0 0 8px; }
.hero .lead, .page-hero p { max-width: 58ch; color: #d7d4cc; }
.hero-ui { position: absolute; z-index: 2; left: 0; right: 0; bottom: 28px; display: flex; align-items: center; gap: 12px; width: min(1280px, calc(100% - 32px)); margin: 0 auto; }
.hero-ui button, .carousel-nav button { width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(255,255,255,.3); background: transparent; color: #fff; }
.hero-dots { display: flex; gap: 8px; }
.hero-dots button { width: 9px; height: 9px; border-radius: 50%; border: 0; background: rgba(255,255,255,.35); padding: 0; }
.hero-dots button.is-active { background: var(--gold); }
.hero-progress { margin-left: auto; width: 120px; height: 2px; background: rgba(255,255,255,.2); position: relative; overflow: hidden; }
.hero-progress.is-run::after { content: ""; position: absolute; inset: 0; background: var(--gold); transform-origin: left; animation: load 7s linear; }
@keyframes load { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.hero-orbit { position: absolute; width: 420px; height: 420px; border: 1px solid rgba(255,225,74,.35); border-radius: 50%; right: -80px; top: -60px; animation: spin 22s linear infinite; }
.hero-orbit::after { content: ""; position: absolute; width: 14px; height: 14px; background: var(--gold); border-radius: 50%; top: 40px; left: 50%; }
@keyframes spin { to { transform: rotate(360deg); } }
.ticker { background: var(--gold); color: #111; overflow: hidden; }
.ticker-track { display: flex; gap: 42px; white-space: nowrap; padding: 10px 0; animation: marquee 22s linear infinite; font-family: "Barlow Condensed", sans-serif; letter-spacing: .14em; text-transform: uppercase; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.section { padding: 72px 0; }
.section-tight { padding-top: 28px; }
.section-head, .admin-head { display: flex; justify-content: space-between; align-items: end; gap: 16px; margin-bottom: 22px; }
.section-head h2, .page-hero h1, .product-title { font-size: clamp(36px, 5vw, 64px); margin: 0; }
.cat-grid, .stats-grid, .about-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.cat-tile, .panel, .filter-card, .summary-card, .quote-card, .empty-state, .result-card, .auth-card {
    background: #fff; border: 1px solid var(--line); border-radius: 22px;
}
.cat-tile { padding: 22px; text-decoration: none; min-height: 150px; display: flex; flex-direction: column; justify-content: flex-end; transition: transform .2s, background .2s; }
.cat-tile i { font-size: 28px; margin-bottom: auto; }
.cat-tile:hover { transform: translateY(-4px); background: #111; color: #fff; }
.cat-tile span, .muted, .card-sku, .card-brand { color: var(--muted); font-size: 13px; }
.product-card { position: relative; background: #fff; border-radius: 22px; overflow: hidden; border: 1px solid var(--line); height: 100%; display: flex; flex-direction: column; }
.card-media { background: #101114; aspect-ratio: 1 / .86; display: block; }
.card-media img { width: 100%; height: 100%; object-fit: cover; }
.card-body { padding: 14px 14px 16px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.card-body h3 { font-size: 26px; margin: 0; }
.card-body h3 a { text-decoration: none; }
.card-foot, .summary-line, .summary-card p, .cart-line { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.card-foot { margin-top: auto; }
.price { display: flex; flex-direction: column; }
.price s { color: var(--muted); font-size: 13px; }
.price strong { font-size: 18px; }
.price-lg strong { font-size: 36px; font-family: "Barlow Condensed", sans-serif; }
.badge-cut, .badge-stock, .status-pill { position: absolute; left: 12px; top: 12px; background: var(--gold); color: #111; border-radius: 99px; padding: 4px 8px; font-size: 12px; }
.badge-stock { left: auto; right: 12px; background: #fff; }
.badge-stock.is-low { background: #ffd7a8; }
.status-pill { position: static; display: inline-flex; }
.status-pill.is-ok { background: #d9f5e4; color: var(--ok); }
.status-pill.is-warn { background: #fff1c7; color: var(--warn); }
.status-pill.is-info { background: #d9e8ff; color: var(--info); }
.status-pill.is-danger { background: #ffd9d5; color: var(--danger); }
.status-pill.is-muted { background: #eee; color: #555; }
.add-btn, .wish-btn, .icon-btn {
    width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--line); background: #fff; display: inline-grid; place-items: center; text-decoration: none;
}
.wish-btn { position: absolute; right: 12px; bottom: 86px; }
.wish-btn.is-on { background: #111; color: var(--gold); }
.btn-gold, .btn-ink {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 0; border-radius: 999px;
    padding: 12px 18px; text-decoration: none; cursor: pointer;
}
.btn-gold { background: var(--gold); color: #151515; font-weight: 650; }
.btn-ink { background: #111; color: #fff; }
.btn-ghost { border: 1px solid rgba(255,255,255,.72); color: #fff; border-radius: 999px; padding: 12px 18px; text-decoration: none; }
.btn-gold:hover { background: var(--gold-2); }
.btn-gold:disabled { opacity: .6; }
.split-banner { background: #111; color: #fff; padding: 48px 0; }
.split-grid, .news-grid, .steps { display: flex; justify-content: space-between; gap: 18px; align-items: center; }
.steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, minmax(120px, 1fr)); gap: 12px; width: min(720px, 100%); }
.steps li { border-top: 1px solid rgba(255,225,74,.6); padding-top: 10px; }
.steps strong { display: block; color: var(--gold); font-family: "Barlow Condensed", sans-serif; font-size: 28px; }
.brand-section { background: #ebe6db; }
.brand-scroller { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 8px; }
.brand-scroller::-webkit-scrollbar { display: none; }
.brand-card {
    flex: 0 0 240px; scroll-snap-align: start; background: #111; color: #fff; border-radius: 22px; min-height: 280px;
    padding: 18px; text-decoration: none; display: flex; flex-direction: column; justify-content: flex-end;
}
.brand-card .brand-logo { flex: 1; display: grid; place-items: center; border: 1px solid rgba(255,225,74,.35); border-radius: 16px; margin-bottom: 16px; min-height: 150px; }
.brand-card .brand-logo span { font-family: "Barlow Condensed", sans-serif; font-size: 64px; color: var(--gold); }
.brand-card .brand-logo img { height: auto; max-height: 72px; mix-blend-mode: normal; }
.brand-card em { font-style: normal; color: #bbb; }
.stats { background: #000; color: #fff; }
.stats-grid { padding: 28px 0; }
.stats strong { display: block; font-family: "Barlow Condensed", sans-serif; font-size: 64px; color: var(--gold); line-height: 1; }
.quote-card, .panel, .summary-card, .filter-card, .empty-state, .result-card { padding: 22px; }
.quote-card footer { display: flex; flex-direction: column; }
.stars { color: #e0b000; letter-spacing: 2px; }
.newsletter { background: var(--gold); }
.news-form { display: flex; gap: 8px; width: min(520px, 100%); }
.news-form input { background: #fff; color: #111; padding-left: 18px; }
.site-footer { background: #000; color: #ddd; padding: 56px 0 24px; }
.site-footer h3 { font-size: 18px; color: #fff; }
.site-footer a, .site-footer p { display: block; color: #c8c8c8; text-decoration: none; margin: 0 0 8px; }
.footer-bottom { display: flex; justify-content: space-between; gap: 12px; border-top: 1px solid rgba(255,255,255,.08); margin-top: 28px; padding-top: 16px; font-size: 13px; }
.page-hero { padding: 42px 0 10px; }
.page-hero.compact { padding-bottom: 0; }
.page-hero h1 { color: #111; }
.crumbs { display: flex; gap: 8px; flex-wrap: wrap; color: var(--muted); font-size: 14px; margin-bottom: 10px; }
.crumbs a { color: inherit; }
.gallery img { width: 100%; border-radius: 24px; background: #111; }
.thumbs { display: flex; gap: 8px; margin-top: 8px; }
.thumbs button { border: 0; padding: 0; background: transparent; width: 74px; }
.thumbs img { border-radius: 10px; }
.buy-row, .qty { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.qty { border: 1px solid var(--line); border-radius: 999px; padding: 4px; background: #fff; }
.qty button { width: 32px; height: 32px; border: 0; border-radius: 50%; background: #f3f1eb; }
.qty input { width: 48px; border: 0; text-align: center; background: transparent; }
.reassure { list-style: none; padding: 0; margin: 18px 0 0; }
.reassure li { padding: 8px 0; border-top: 1px solid var(--line); }
.prose p, .product-lead { font-size: 17px; }
.spec-table { width: 100%; background: #fff; border-radius: 18px; overflow: hidden; }
.spec-table th, .spec-table td { padding: 12px 14px; border-bottom: 1px solid var(--line); }
.spec-table th { width: 40%; color: var(--muted); font-weight: 500; }
.review, .cart-line { padding: 16px 0; border-bottom: 1px solid var(--line); }
.cart-line img { width: 96px; height: 96px; object-fit: cover; border-radius: 14px; background: #111; }
.cart-line h2 { font-size: 28px; margin: 0; }
.summary-card .total, .summary-line.total { font-size: 20px; }
.form-control, .form-select, textarea.form-control { border-radius: 12px; min-height: 46px; border-color: #e4dfd4; background: #fff; }
label { display: block; font-size: 13px; margin-bottom: 4px; color: #333; }
.check-line { display: flex; gap: 8px; align-items: center; }
.form-alert { background: #ffd9d5; color: var(--danger); border-radius: 12px; padding: 10px 12px; margin-bottom: 12px; }
.form-alert p { margin: 0; }
.empty-state, .result-card { text-align: center; padding: 48px 20px; }
.narrow { max-width: 760px; }
.result-mark { width: 72px; height: 72px; margin: 0 auto 12px; border-radius: 50%; display: grid; place-items: center; background: #111; color: #fff; font-size: 32px; }
.result-card.is-ok .result-mark { background: var(--gold); color: #111; }
.address-block { white-space: pre-wrap; font-family: inherit; background: #f6f3ea; border-radius: 12px; padding: 12px; }
.auth-body { min-height: 100vh; display: grid; place-items: center; background: #000; }
.auth-card { width: min(440px, calc(100% - 24px)); padding: 28px; }
.auth-card h1 { font-size: 48px; }
.auth-links { display: flex; justify-content: space-between; margin-top: 14px; }
.pager { display: flex; gap: 6px; margin-top: 22px; }
.pager a { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; text-decoration: none; background: #fff; }
.pager a.is-active { background: #111; color: #fff; }
.toast-stack { position: fixed; right: 16px; bottom: 16px; z-index: 80; display: flex; flex-direction: column; gap: 10px; width: min(360px, calc(100% - 24px)); }
.toast-card { background: #111; color: #fff; border-radius: 18px; padding: 14px 14px 12px; box-shadow: var(--shadow); transform: translateY(12px); opacity: 0; transition: .25s ease; position: relative; overflow: hidden; }
.toast-card.is-in { transform: none; opacity: 1; }
.toast-card strong { display: block; }
.toast-card p { margin: 4px 0 0; color: #d0d0d0; }
.toast-card::after { content: ""; position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: var(--gold); animation: load 4.6s linear; }
.toast-card.is-error::after { background: #ff5d4d; }
.toast-card button { position: absolute; right: 8px; top: 8px; border: 0; background: transparent; color: #fff; }
.sg-modal { position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 90; display: grid; place-items: center; opacity: 0; transition: .2s; }
.sg-modal.is-in { opacity: 1; }
.sg-dialog { width: min(420px, calc(100% - 24px)); background: #fff; border-radius: 22px; padding: 22px; }
.drawer-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 60; }
.cart-drawer { position: fixed; top: 0; right: 0; height: 100%; width: min(420px, 100%); background: #fff; z-index: 70; transform: translateX(104%); transition: transform .3s ease; display: flex; flex-direction: column; }
.cart-drawer.is-open { transform: none; }
.cart-drawer header, .cart-drawer footer { padding: 16px 18px; display: flex; justify-content: space-between; align-items: center; }
.cart-drawer header { border-bottom: 1px solid var(--line); }
.cart-drawer footer { border-top: 1px solid var(--line); }
.cart-drawer-body { overflow: auto; padding: 8px 18px 18px; flex: 1; }
.mini-item { display: grid; grid-template-columns: 72px 1fr; gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.mini-item img { width: 72px; height: 72px; object-fit: cover; border-radius: 10px; background: #111; }
.wa-float { position: fixed; left: 16px; bottom: 16px; width: 52px; height: 52px; border-radius: 50%; background: #1fa855; color: #fff; display: grid; place-items: center; font-size: 26px; z-index: 40; text-decoration: none; }
.admin-body { background: #ece8df; }
.admin-shell { display: grid; grid-template-columns: 250px 1fr; min-height: 100vh; }
.admin-side { background: #000; color: #fff; padding: 18px 14px; position: sticky; top: 0; height: 100vh; overflow: auto; }
.admin-side nav { display: flex; flex-direction: column; gap: 4px; margin-top: 18px; }
.admin-side a { color: #ddd; text-decoration: none; padding: 10px 12px; border-radius: 12px; display: flex; gap: 8px; }
.admin-side a.is-active, .admin-side a:hover { background: #1a1c20; color: var(--gold); }
.admin-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 22px; position: sticky; top: 0; background: rgba(236,232,223,.92); backdrop-filter: blur(8px); z-index: 5; }
.admin-top-actions { display: flex; gap: 14px; align-items: center; }
.admin-content { padding: 8px 22px 40px; }
.stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 18px; }
.stat-grid article { background: #111; color: #fff; border-radius: 18px; padding: 16px; }
.stat-grid strong { display: block; font-family: "Barlow Condensed", sans-serif; font-size: 36px; color: var(--gold); }
.table-wrap { background: #fff; border-radius: 18px; overflow: auto; border: 1px solid var(--line); }
.thumb { width: 54px; height: 54px; object-fit: cover; border-radius: 8px; background: #111; }
.inline { display: inline; }
.filter-inline, .chip-row, .spec-edit, .thumb-row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.chip-row { margin-bottom: 12px; }
.chip-row a { text-decoration: none; background: #fff; border-radius: 99px; padding: 6px 10px; }
.chip-row a.is-active { background: #111; color: #fff; }
.spec-edit { margin-bottom: 8px; }
.spec-edit .form-control { flex: 1; }
.thumb-check { width: 90px; font-size: 12px; }
.switch-card, .big-switch { display: flex; justify-content: space-between; gap: 16px; align-items: center; }
.big-switch input { position: absolute; opacity: 0; }
.big-switch span { width: 64px; height: 36px; background: #ccc; border-radius: 99px; position: relative; display: inline-block; }
.big-switch span::after { content: ""; width: 28px; height: 28px; border-radius: 50%; background: #fff; position: absolute; top: 4px; left: 4px; transition: .2s; }
.big-switch input:checked + span { background: var(--gold); }
.big-switch input:checked + span::after { transform: translateX(28px); }
.text-link { text-decoration: none; border-bottom: 1px solid #111; }
@media (max-width: 991px) {
    .cat-grid, .about-grid, .stats-grid, .admin-shell, .stat-grid { grid-template-columns: 1fr; }
    .head-search { display: block; flex: 1 1 100%; max-width: none; order: 5; }
    .nav-row { flex-wrap: wrap; padding: 10px 0; }
    .admin-side { position: fixed; z-index: 40; transform: translateX(-105%); transition: .25s; width: min(280px, 86vw); }
    .admin-side.is-open { transform: none; }
    .head-actions span { display: none; }
    .hero { min-height: 86vh; }
    .split-grid, .news-grid, .steps { display: grid; grid-template-columns: 1fr 1fr; }
    .footer-bottom, .section-head, .admin-head { align-items: start; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; }
}