:root { color-scheme: light; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
[data-theme="dark"] { color-scheme: dark; }

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background: var(--bg);
    color: var(--text);
    font-size: 16px;
    line-height: 1.5;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; }

.site-header {
    position: sticky;
    top: 0;
    z-index: 40;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 28px;
    min-height: 74px;
    padding: 12px clamp(18px, 4vw, 56px);
    border-bottom: 1px solid transparent;
    background: color-mix(in srgb, var(--bg) 82%, transparent);
    backdrop-filter: blur(18px);
}
.site-header.is-scrolled { border-color: var(--line); }
.brand-mark {
    display: grid;
    place-items: center;
    width: 140px;
    height: 50px;
    color: var(--text);
}
.brand-mark svg { width: 38px; height: 38px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.brand-mark img { display: block; width: 100%; height: 100%; object-fit: contain; }
.brand-mark.small { width: 36px; height: 36px; }
.brand-mark.small:has(img) { width: 110px; }
.desktop-nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 26px;
    color: var(--muted);
    font-size: 14px;
}
.desktop-nav a:hover { color: var(--text); }
.mega-trigger {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 52px;
}
.mega-trigger::after {
    content: "";
    position: absolute;
    left: -28px;
    right: -28px;
    top: 100%;
    height: 18px;
}
.mega-menu {
    position: absolute;
    left: 50%;
    top: calc(100% + 10px);
    z-index: 20;
    display: grid;
    width: min(760px, 90vw);
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--bg);
    box-shadow: var(--shadow);
    opacity: 0;
    pointer-events: none;
    transform: translateX(-50%) translateY(8px);
    transition: .2s ease;
}
.mega-trigger:hover .mega-menu { opacity: 1; pointer-events: auto; transform: translateX(-50%) translateY(0); }
.mega-trigger:focus-within .mega-menu { opacity: 1; pointer-events: auto; transform: translateX(-50%) translateY(0); }
.mega-menu a {
    display: grid;
    gap: 6px;
    min-height: 84px;
    padding: 14px;
    border-radius: 10px;
    background: var(--panel);
}
.mega-menu small { color: var(--muted); }
.header-actions { display: flex; align-items: center; gap: 8px; }
.icon-btn {
    position: relative;
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: color-mix(in srgb, var(--bg) 72%, transparent);
    cursor: pointer;
}
.icon-btn svg, .mobile-tabbar svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.cart-button span, .mobile-tabbar b {
    position: absolute;
    right: -2px;
    top: -2px;
    display: grid;
    place-items: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--accent);
    color: #fff;
    font-size: 11px;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 20px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--bg);
    color: var(--text);
    cursor: pointer;
    font-weight: 650;
}
.btn.primary { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.btn.subtle { background: var(--panel); }

main { min-height: 70vh; }
.hero {
    position: relative;
    min-height: min(760px, calc(100vh - 74px));
    overflow: hidden;
    display: grid;
    align-items: end;
    isolation: isolate;
}
.hero img {
    position: absolute;
    inset: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(90deg, rgba(255,255,255,.88), rgba(255,255,255,.36) 48%, rgba(255,255,255,.04));
}
[data-theme="dark"] .hero::after { background: linear-gradient(90deg, rgba(0,0,0,.74), rgba(0,0,0,.28) 52%, rgba(0,0,0,.02)); }
.hero-copy {
    width: min(650px, 92vw);
    padding: clamp(48px, 9vw, 110px) clamp(20px, 6vw, 80px);
}
.hero-copy span, .section-head p, .filters p, .product-detail > p, .text-page p:first-child,
.journal-page > p, .support-page > p, .contacts-page p:first-child, .checkout-page p:first-child,
.account-page > p, .admin-page > p, .promo-page p:first-of-type {
    color: var(--accent);
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 760;
    text-transform: uppercase;
    letter-spacing: 0;
}
h1, h2, h3, p { overflow-wrap: anywhere; }
.hero h1 {
    margin: 0 0 18px;
    max-width: 620px;
    font-size: clamp(42px, 7vw, 86px);
    line-height: .96;
    letter-spacing: 0;
}
.hero p { max-width: 520px; margin: 0 0 28px; color: var(--muted); font-size: 18px; }

.section-head, .text-page, .journal-page, .support-page, .contacts-page, .account-page, .admin-page {
    width: min(1180px, calc(100% - 36px));
    margin: 80px auto 30px;
}
.section-head h2, .text-page h1, .journal-page h1, .support-page h1, .contacts-page h1,
.checkout-page h1, .account-page h1, .admin-page h1 {
    margin: 0;
    font-size: clamp(32px, 5vw, 60px);
    line-height: 1.02;
    letter-spacing: 0;
}
.product-grid {
    width: min(1180px, calc(100% - 36px));
    margin: 0 auto 86px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}
.product-card {
    position: relative;
    display: grid;
    gap: 14px;
    min-width: 0;
}
.product-media {
    position: relative;
    aspect-ratio: 1;
    overflow: hidden;
    border-radius: var(--radius);
    background: var(--panel);
}
.product-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .35s ease;
}
.product-card:hover .product-media img { transform: scale(1.035); }
.product-media span {
    position: absolute;
    left: 12px;
    top: 12px;
    padding: 5px 9px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--bg) 82%, transparent);
    font-size: 12px;
}
.card-gallery-dots {
    position: absolute;
    left: 50%;
    bottom: 12px;
    z-index: 3;
    display: flex;
    transform: translateX(-50%);
    gap: 6px;
    padding: 6px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--surface) 72%, transparent);
    backdrop-filter: blur(12px);
}
.card-gallery-dots button {
    width: 8px;
    height: 8px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: color-mix(in srgb, var(--text) 24%, transparent);
    cursor: pointer;
}
.card-gallery-dots button.active {
    background: var(--accent);
}
.product-media.is-color-changing .card-gallery-track{animation:cardColorChange .22s ease both}@keyframes cardColorChange{from{opacity:.35;transform:scale(.985)}to{opacity:1;transform:scale(1)}}
.product-info {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}
.product-info h3 { margin: 0; font-size: 16px; }
.product-info p { margin: 2px 0 0; color: var(--muted); font-size: 14px; }
.card-color-options{display:flex;align-items:center;gap:7px;margin-top:-5px}.card-color-options button{position:relative;width:18px;height:18px;padding:0;border:2px solid var(--surface);border-radius:50%;background:var(--card-color);box-shadow:0 0 0 1px color-mix(in srgb,var(--text) 18%,transparent);cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.card-color-options button:hover{transform:scale(1.12)}.card-color-options button.is-active{box-shadow:0 0 0 2px var(--accent),0 2px 6px color-mix(in srgb,var(--text) 16%,transparent)}.card-color-options button:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 28%,transparent);outline-offset:3px}
.card-color-options button.is-unavailable{opacity:.35;filter:grayscale(1)}.card-color-options button.is-unavailable::after{content:"";position:absolute;inset:7px -2px auto;height:1px;background:currentColor;transform:rotate(-45deg)}
.card-price { display:grid; justify-items:end; align-content:start; gap:2px; white-space:nowrap; }
.card-price strong { font-size:16px; }
.card-price del { color:var(--muted); font-size:11px; }
.card-price.has-discount strong,.price-line.has-discount strong { color:#d53a36; }
.price-line.has-discount span { color:var(--muted); font-size:13px; }
.card-buy {
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 76px;
    opacity: 0;
    transform: translateY(8px);
    transition: .2s ease;
}
.product-card:hover .card-buy { opacity: 1; transform: translateY(0); }
.product-card[data-product-url] { cursor:pointer; }
.product-card.is-unavailable { opacity:.5; filter:saturate(.35); transition:opacity .2s ease,filter .2s ease; }
.product-card.is-unavailable:hover { opacity:.65; filter:saturate(.5); }
.product-card.is-unavailable .card-price { max-width:112px; white-space:normal; text-align:right; }
.card-unavailable-label { color:var(--muted); font-size:13px!important; line-height:1.15; }

.category-showcase {
    width: min(1180px, calc(100% - 36px));
    margin: 0 auto 28px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.category-showcase a {
    min-height: 170px;
    display: grid;
    align-content: end;
    gap: 8px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--panel);
    transition: transform .2s ease, background .2s ease;
}
.category-showcase a:hover {
    transform: translateY(-3px);
    background: var(--panel-strong);
}
.category-showcase span,
.series-feature p:first-child,
.bundle-band p,
.journal-strip p,
.support-cta p {
    margin: 0;
    color: var(--accent);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}
.category-showcase strong { font-size: 22px; line-height: 1.05; }
.category-showcase small { color: var(--muted); }

.series-feature {
    width: min(1180px, calc(100% - 36px));
    margin: 0 auto 28px;
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
    gap: 1px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--line);
}
.series-feature > div {
    display: grid;
    align-content: center;
    gap: 18px;
    padding: clamp(26px, 5vw, 54px);
    background: var(--bg);
}
.series-feature h2,
.bundle-band h2,
.journal-strip h2,
.support-cta h2 {
    margin: 0;
    font-size: clamp(30px, 4.7vw, 58px);
    line-height: 1.02;
}
.series-feature p:not(:first-child) {
    margin: 0;
    color: var(--muted);
    max-width: 560px;
}
.series-feature img {
    width: 100%;
    height: 100%;
    min-height: 520px;
    object-fit: cover;
    background: var(--panel);
}
.feature-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.feature-pills span {
    padding: 7px 10px;
    border-radius: 999px;
    background: var(--panel);
    color: var(--muted);
    font-size: 13px;
}
.bundle-band,
.support-cta {
    width: min(1180px, calc(100% - 36px));
    margin: 0 auto 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    padding: clamp(22px, 4vw, 38px);
    border-radius: var(--radius);
    background: var(--accent);
    color: var(--on-accent);
}
.bundle-band p,
.support-cta p { color: currentColor; opacity: .72; }
.bundle-band .btn.primary,
.support-cta .btn.primary {
    background: var(--bg);
    border-color: var(--bg);
    color: var(--text);
}
.compatibility,
.proof-section {
    width: min(1180px, calc(100% - 36px));
    margin: 0 auto 28px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.compatibility div,
.proof-section article {
    min-height: 150px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--panel);
}
.compatibility span,
.proof-section span {
    color: var(--accent);
    font-weight: 800;
}
.compatibility strong,
.proof-section strong {
    display: block;
    margin-top: 28px;
    font-size: 20px;
}
.compatibility small,
.proof-section p {
    display: block;
    margin-top: 8px;
    color: var(--muted);
}
.journal-strip {
    width: min(1180px, calc(100% - 36px));
    margin: 0 auto 28px;
    display: grid;
    grid-template-columns: 1fr auto 260px 260px;
    gap: 12px;
    align-items: stretch;
}
.journal-strip > div,
.journal-strip > a,
.journal-strip article {
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--panel);
}
.journal-strip > a {
    display: grid;
    place-items: center;
    font-weight: 800;
}
.journal-strip article {
    display: grid;
    gap: 10px;
}
.journal-strip img {
    width: 100%;
    aspect-ratio: 1.5;
    object-fit: cover;
    border-radius: 10px;
}
.journal-strip article span {
    color: var(--accent);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}
.support-cta {
    margin-bottom: 96px;
    background: var(--panel);
    color: var(--text);
    border: 1px solid var(--line);
}
.support-cta > div:last-child {
    display: flex;
    gap: 10px;
}

.benefits {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    width: min(1180px, calc(100% - 36px));
    margin: 0 auto 96px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--line);
}
.benefits article { min-height: 210px; padding: 28px; background: var(--bg); }
.benefits span { color: var(--accent); font-weight: 800; }
.benefits h3 { margin: 44px 0 10px; }
.benefits p { margin: 0; color: var(--muted); }

.catalog-layout {
    width: min(1320px, calc(100% - 36px));
    margin: 34px auto 90px;
    display: grid;
    grid-template-columns: 290px 1fr;
    gap: 34px;
}
.filters {
    position: sticky;
    top: 96px;
    align-self: start;
    display: grid;
    gap: 16px;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--panel);
}
.filters h1 { margin: 0 0 8px; }
.filters label { display: grid; gap: 8px; color: var(--muted); font-size: 13px; }
select, input, textarea {
    width: 100%;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--bg);
    min-height: 44px;
    padding: 0 12px;
}
input[type="file"] {
    padding: 10px;
    min-height: 48px;
}
textarea { padding-top: 12px; resize: vertical; }
.color-filters { display: flex; gap: 10px; }
.color-filters button, .swatches a, .swatches button {
    width: 28px;
    height: 28px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--swatch);
    cursor: pointer;
}
.catalog-top { display: flex; align-items: baseline; gap: 8px; margin: 0 0 16px; color: var(--muted); }
.catalog-top span { color: var(--text); font-weight: 800; font-size: 26px; }
.catalog-grid { width: 100%; margin: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); }

.product-page {
    width: min(1220px, calc(100% - 36px));
    margin: 38px auto 100px;
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(340px, .92fr);
    gap: 48px;
}
.gallery > img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: var(--radius);
    background: var(--panel);
}
.thumb-row { display: grid; grid-template-columns: repeat(2, 92px); gap: 10px; margin-top: 12px; }
.thumb-row button { border: 1px solid var(--line); border-radius: 10px; padding: 0; overflow: hidden; background: var(--panel); }
.product-detail { align-self: start; position: sticky; top: 98px; }
.product-detail h1 { margin: 0 0 12px; font-size: clamp(36px, 5vw, 64px); line-height: 1; }
.product-detail p { color: var(--muted); }
.price-line { display: flex; align-items: center; gap: 12px; margin: 0 0 22px; }
.price-line strong { font-size: 24px; }
.price-line span { color: var(--muted); text-decoration: line-through; }
.price-line small { color:var(--muted); font-size:13px; font-weight:700; }
.variant-block { display: grid; gap: 12px; margin: 26px 0; }
.swatches { display: flex; gap: 10px; }
.swatches button.variant-no-color { width: auto; min-width: 28px; padding: 0 10px; border-radius: 999px; background: var(--panel); color: var(--text); font-size: 12px; font-weight: 700; }
.swatches .active { outline: 2px solid var(--accent); outline-offset: 3px; }
.swatches button.is-unavailable{opacity:.35;filter:grayscale(1);cursor:pointer;position:relative}.swatches button.is-unavailable::after{content:"";position:absolute;left:-3px;right:-3px;top:50%;height:2px;background:currentColor;transform:rotate(-45deg)}
.variant-stock{margin:10px 0;color:var(--muted);font-weight:700}.variant-message{min-height:20px;color:#b42318}.sale-countdown{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 0;padding:12px 14px;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));border-radius:14px;background:color-mix(in srgb,var(--accent) 7%,var(--surface))}.sale-countdown span{font-size:12px;color:var(--muted)}.sale-countdown strong{font-variant-numeric:tabular-nums}
.specs {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--line);
}
.specs div { padding: 14px; background: var(--panel); }
.specs dt { color: var(--muted); font-size: 12px; }
.specs dd { margin: 4px 0 0; font-weight: 700; }
.feature-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; padding: 0; list-style: none; }
.feature-list li { padding: 12px; border-radius: 10px; background: var(--panel); }
.add-main { width: 100%; margin: 12px 0; }
.stock-request-form{display:grid;gap:14px;margin:18px 0;padding:22px;border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));border-radius:20px;background:color-mix(in srgb,var(--panel) 88%,var(--accent) 4%)}.stock-request-form[hidden]{display:none}.stock-request-form>div>span{display:inline-flex;margin-bottom:6px;padding:5px 9px;border-radius:999px;background:var(--surface-muted);color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}.stock-request-form h3{margin:0 0 5px;font-size:22px}.stock-request-form p{margin:0;line-height:1.45}.stock-request-form label{display:grid;gap:7px;color:var(--muted);font-size:12px;font-weight:700}.stock-request-consent{grid-template-columns:auto 1fr!important;align-items:start}.stock-request-consent input{width:18px;min-height:18px;margin:1px 0 0}.stock-request-consent span{line-height:1.4}.stock-request-form [data-stock-request-status]{min-height:20px;color:var(--text);font-weight:700}.stock-request-form.is-success{border-color:color-mix(in srgb,#2f8a57 45%,var(--line));background:color-mix(in srgb,#2f8a57 8%,var(--panel))}.stock-request-trap{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
[data-variant-add][hidden],[data-stock-request-scroll][hidden]{display:none!important}
.bundle { margin-top: 16px; padding: 18px; border-radius: var(--radius); background: var(--panel); }
.bundle p { margin: 8px 0 14px; }
.sticky-cta { display: none; }

.checkout-page, .contacts-page {
    width: min(1120px, calc(100% - 36px));
    margin: 48px auto 96px;
    display: grid;
    grid-template-columns: 1fr 390px;
    gap: 40px;
}
.checkout-form, .contact-form {
    display: grid;
    gap: 14px;
    margin-top: 28px;
}
.checkout-form label, .contact-form label { display: grid; gap: 8px; color: var(--muted); font-size: 14px; }
.delivery-method-card{display:grid;grid-template-columns:130px minmax(0,1fr) auto;align-items:center;gap:15px;padding:14px 16px;border:1px solid color-mix(in srgb,#da291c 30%,var(--line));border-radius:16px;background:color-mix(in srgb,#da291c 5%,var(--surface));box-shadow:var(--shadow-soft)}.delivery-method-card img{width:130px;height:auto}.delivery-method-card div{display:grid;gap:2px}.delivery-method-card span,.delivery-method-card small{color:var(--muted);font-size:11px}.delivery-method-card strong{color:var(--text);font-size:16px}.delivery-method-card>b{padding:7px 10px;border-radius:999px;background:#e7f5eb;color:#287248;font-size:11px}.delivery-method-card input{display:none}
@media(max-width:480px){.delivery-method-card{grid-template-columns:100px minmax(0,1fr);gap:10px}.delivery-method-card img{width:100px}.delivery-method-card>b{grid-column:1/-1;justify-self:start}}
.checkout-form label>small{font-size:11px;line-height:1.4}.ua-phone-field{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;min-height:48px;border:1px solid var(--line);border-radius:12px;background:var(--bg);overflow:hidden}.ua-phone-field>span{height:100%;padding:0 12px;display:flex;align-items:center;border-right:1px solid var(--line);background:var(--panel);color:var(--text);font-weight:800}.ua-phone-field>input{min-height:46px;border:0;border-radius:0;box-shadow:none}.ua-phone-field:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent)}.np-combobox{position:relative}.np-combobox>input{position:relative;z-index:1}.np-combobox>input:disabled{cursor:not-allowed;opacity:.6}.np-suggestions{position:absolute;z-index:20;top:calc(100% + 6px);left:0;right:0;max-height:280px;overflow:auto;padding:6px;border:1px solid var(--line);border-radius:14px;background:var(--surface);box-shadow:0 18px 48px rgba(20,30,27,.16)}.np-suggestions button{width:100%;padding:10px 11px;border:0;border-radius:9px;background:transparent;color:var(--text);display:grid;gap:3px;text-align:left;cursor:pointer}.np-suggestions button:hover,.np-suggestions button:focus{background:var(--panel)}.np-suggestions strong{font-size:13px}.np-suggestions small{color:var(--muted);font-size:11px}
.segmented, .pay-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.segmented { grid-template-columns: repeat(2, 1fr); }
.segmented label, .pay-row button {
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--panel);
}
.segmented input { width: auto; min-height: 0; margin-right: 8px; }
.checkout-summary {
    align-self: start;
    padding: 20px;
    border-radius: var(--radius);
    background: var(--panel);
}
.checkout-summary h2 { margin-top: 0; }
.mini-cart-row { display: grid; grid-template-columns: 54px 1fr auto; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line); }
.mini-cart-row img { width: 54px; height: 54px; object-fit: cover; border-radius: 8px; }
.checkout-pricing { display:grid; gap:8px; margin-top:16px; padding-top:14px; border-top:1px solid var(--line); }
.checkout-pricing>div { display:flex; justify-content:space-between; gap:16px; color:var(--muted); font-size:12px; }
.checkout-pricing .is-saving strong { color:#2d8557; }
.checkout-pricing .is-total { align-items:baseline; color:var(--text); font-size:14px; }
.checkout-pricing .is-total strong { font-size:20px; }
.form-note { color: var(--muted); font-size: 14px; }

.image-led {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 36px;
    align-items: center;
}
.image-led img { border-radius: var(--radius); aspect-ratio: 1.15; object-fit: cover; }
.text-page > p:not(:first-child), .text-page div p:not(:first-child) { color: var(--muted); font-size: 18px; }
.journal-grid, .account-grid, .admin-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-top: 28px;
}
.journal-grid article, .account-grid article, .admin-grid article, .support-page details {
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--panel);
}
.journal-grid img { aspect-ratio: 1.1; object-fit: cover; border-radius: 10px; margin-bottom: 16px; }
.journal-grid span, .account-grid span { color: var(--accent); font-size: 13px; font-weight: 800; }
.journal-grid h2, .admin-grid h2 { font-size: 22px; line-height: 1.12; }
.support-page { max-width: 860px; }
.support-page details { margin-top: 12px; }
.support-page summary { cursor: pointer; font-weight: 750; }
.bulk-row { display: grid; grid-template-columns: 1fr 70px 70px; gap: 8px; margin: 12px 0; }

.admin-shell {
    width: min(1480px, calc(100% - 28px));
    margin: 22px auto 110px;
}
.admin-login {
    width: min(560px, 100%);
    margin: 84px auto;
    padding: 28px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--panel);
}
.admin-login h1, .admin-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
}
.admin-hero {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 14px;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--panel);
}
.admin-shell p:first-child,
.admin-panel-head p {
    color: var(--accent);
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 760;
    text-transform: uppercase;
}
.admin-flash,
.admin-warning {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin: 14px 0;
    padding: 12px 14px;
    border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--line));
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--accent) 10%, var(--panel));
}
.admin-warning span {
    padding: 4px 8px;
    border-radius: 999px;
    background: var(--bg);
    color: var(--muted);
    font-size: 13px;
}
.admin-layout {
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}
.admin-sidebar {
    position: sticky;
    top: 90px;
    min-height: calc(100vh - 112px);
    display: grid;
    grid-template-rows: auto 1fr auto;
    gap: 18px;
    padding: 18px;
    border-radius: var(--radius);
    background: #101410;
    color: #f6f5ef;
    box-shadow: var(--shadow);
}
.admin-brand {
    display: grid;
    gap: 5px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(255,255,255,.12);
}
.admin-brand span {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: #d8e6dd;
    color: #101410;
    font-size: 12px;
    font-weight: 900;
}
.admin-brand small { color: rgba(246,245,239,.62); }
.admin-tabs {
    display: grid;
    align-content: start;
    gap: 7px;
}
.admin-tabs a {
    padding: 11px 12px;
    border-radius: 10px;
    color: rgba(246,245,239,.72);
}
.admin-tabs a:hover { background: rgba(255,255,255,.1); color: #fff; }
.admin-sidebar-note {
    margin-top: 20px;
    padding: 14px;
    border-radius: 12px;
    background: rgba(255,255,255,.08);
}
.admin-sidebar-note span {
    display: block;
    font-size: 32px;
    font-weight: 900;
    line-height: 1;
}
.admin-sidebar-note p {
    margin: 8px 0 0;
    color: rgba(246,245,239,.65);
}
.admin-main {
    min-width: 0;
}
.admin-command {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    align-items: center;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--bg);
}
.admin-command p {
    margin: 0 0 8px;
    color: var(--accent);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}
.admin-command h2 {
    margin: 0;
    font-size: clamp(28px, 4vw, 48px);
    line-height: 1.02;
}
.admin-command-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}
.admin-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 18px 0;
}
.admin-stats article,
.admin-panel,
.admin-editor,
.admin-card {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--panel);
}
.admin-stats article { padding: 16px; }
.admin-stats span { color: var(--muted); font-size: 13px; }
.admin-stats strong { display: block; margin: 8px 0; font-size: 34px; line-height: 1; }
.admin-stats p { margin: 0; color: var(--muted); }
.admin-panel {
    margin-top: 18px;
    padding: clamp(16px, 3vw, 24px);
    background: color-mix(in srgb, var(--panel) 76%, var(--bg));
}
.admin-panel-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}
.admin-panel h2 {
    margin: 0;
    font-size: clamp(28px, 4vw, 44px);
    line-height: 1.05;
}
.admin-form {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.admin-form.compact,
.settings-form { grid-template-columns: 1fr; }
.admin-form label {
    display: grid;
    gap: 7px;
    color: var(--muted);
    font-size: 13px;
}
.admin-form .wide { grid-column: 1 / -1; }
.admin-form .check {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding-top: 21px;
}
.admin-form .check input {
    width: auto;
    min-height: 0;
}
.admin-form small { color: var(--muted); }
.bulk-form {
    align-items: end;
    margin: 14px 0 18px;
    padding: 14px;
    border-radius: var(--radius);
    background: var(--bg);
}
.admin-product-list {
    display: grid;
    gap: 10px;
}
.admin-editor {
    overflow: hidden;
    background: var(--bg);
}
.admin-editor summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px;
    cursor: pointer;
}
.admin-editor summary span {
    display: grid;
    gap: 3px;
}
.admin-editor summary small { color: var(--muted); }
.product-form {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding: 0 16px 16px;
}
.product-media-admin {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--soft-line);
    border-radius: 16px;
    background: color-mix(in srgb, var(--panel) 74%, var(--bg));
}
.media-admin-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
.media-admin-head div {
    display: grid;
    gap: 4px;
}
.media-admin-head strong {
    font-size: 15px;
}
.media-admin-head span,
.media-tile small,
.media-note,
.media-empty {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.45;
}
.admin-form .media-upload-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 14px;
    border: 1px solid var(--ink);
    border-radius: 999px;
    background: var(--ink);
    color: var(--bg);
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}
.admin-form .media-upload-btn input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}
.media-grid,
.media-preview {
    display: grid;
    grid-template-columns: repeat(5, minmax(120px, 1fr));
    gap: 12px;
}
.media-preview:empty {
    display: none;
}
.media-tile {
    position: relative;
    display: grid;
    gap: 8px;
    min-width: 0;
    padding: 8px;
    border: 1px solid var(--soft-line);
    border-radius: 14px;
    background: var(--bg);
}
.media-tile.is-main {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent);
}
.media-tile img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 10px;
    background: var(--panel);
}
.admin-form .media-main,
.admin-form .media-remove {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: auto;
    padding: 0;
    font-size: 12px;
    font-weight: 700;
}
.admin-form .media-remove {
    color: #8d1f1f;
}
.media-tile:has(.media-remove input:checked) {
    opacity: .48;
}
.media-tile:has(.media-remove input:checked)::after {
    content: "Будет убрано";
    position: absolute;
    inset: 8px 8px auto auto;
    padding: 5px 7px;
    border-radius: 999px;
    background: #8d1f1f;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
}
.media-note {
    grid-column: 1 / -1;
    margin: 0;
}
.admin-actions,
.admin-row-actions {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.admin-row-actions {
    padding: 0 16px 16px;
}
.btn.danger {
    background: #8d1f1f;
    border-color: #8d1f1f;
    color: #fff;
}
.new-editor { margin-top: 14px; }
.admin-columns {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}
.admin-card {
    padding: 14px;
    background: var(--bg);
}
.admin-card h3 { margin: 0 0 12px; }
.filter-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}
.filter-list span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 9px;
    border-radius: 999px;
    background: var(--panel);
    font-size: 13px;
}
.filter-list form { display: inline-flex; }
.filter-list button {
    display: grid;
    place-items: center;
    width: 18px;
    height: 18px;
    border: 0;
    border-radius: 50%;
    background: color-mix(in srgb, var(--text) 10%, transparent);
    color: var(--muted);
    cursor: pointer;
    line-height: 1;
}
.filter-list i {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: var(--swatch);
}
.filter-list small { color: var(--muted); }
.orders-table {
    display: grid;
    gap: 8px;
}
.orders-table article {
    display: grid;
    grid-template-columns: 1fr .8fr 1fr .9fr;
    gap: 12px;
    padding: 12px;
    border-radius: 10px;
    background: var(--bg);
}
.orders-table span,
.orders-table small { color: var(--muted); }
.admin-delete-inline {
    margin: -4px 0 12px;
    padding: 0 14px 14px;
}

@media (max-width: 980px) {
    .admin-stats,
    .admin-columns,
    .admin-form,
    .product-form,
    .orders-table article {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .media-grid,
    .media-preview {
        grid-template-columns: repeat(3, minmax(110px, 1fr));
    }
}

.support-chat-button { position:fixed; right:24px; bottom:24px; z-index:80; display:flex; align-items:center; gap:11px; padding:9px 10px 9px 18px; border:1px solid color-mix(in srgb,#fff 16%,transparent); border-radius:999px; color:#fff; background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 88%,#fff),var(--accent)); box-shadow:0 18px 50px rgba(15,30,25,.24),inset 0 1px 0 rgba(255,255,255,.12); font:700 14px/1 inherit; cursor:pointer; transition:right .25s ease,transform .2s ease,box-shadow .2s ease; }
.support-chat-button:hover { transform:translateY(-2px); box-shadow:0 22px 56px rgba(15,30,25,.3),inset 0 1px 0 rgba(255,255,255,.16); }.support-chat-button:active { transform:translateY(0) scale(.97); }.support-chat-icon { display:grid; place-items:center; width:40px; height:40px; border-radius:14px; }.support-chat-icon svg { width:30px; height:30px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; transition:transform .22s ease; }.support-chat-button:hover .support-chat-icon svg { transform:scale(1.06); }
.support-unread-badge { position:absolute; top:-5px; right:-5px; min-width:22px; height:22px; padding:0 6px; display:grid; place-items:center; border:2px solid var(--bg); border-radius:999px; color:#fff; background:#d64141; box-shadow:0 5px 16px rgba(122,24,24,.28); font-size:11px; font-weight:850; line-height:1; }
.support-unread-badge[hidden] { display:none; }
.support-chat { position:fixed; right:24px; bottom:88px; z-index:81; width:min(380px,calc(100vw - 28px)); max-height:min(650px,calc(100vh - 120px)); display:grid; grid-template-rows:auto minmax(180px,1fr) auto; overflow:hidden; border:1px solid var(--soft-line); border-radius:24px; background:var(--panel); box-shadow:0 28px 90px rgba(15,25,22,.25); opacity:0; transform:translateY(16px) scale(.98); pointer-events:none; transition:.22s ease; }
.support-chat.open { opacity:1; transform:none; pointer-events:auto; }
.support-chat header { display:flex; align-items:center; justify-content:space-between; padding:18px 20px; color:#fff; background:var(--accent); }
.support-chat header div { display:grid; gap:3px; }.support-chat header span { font-size:12px; opacity:.75; }.support-chat header button { border:0; color:#fff; background:transparent; font-size:28px; cursor:pointer; }
.support-chat-messages { min-height:230px; padding:16px; display:flex; flex-direction:column; overflow:auto; background:color-mix(in srgb,var(--bg) 76%,var(--panel)); }
.support-chat-messages>:first-child { margin-top:auto; }
.support-welcome { color:var(--muted); font-size:14px; }.support-message { width:82%; margin:8px 0; padding:10px 12px; border-radius:15px; background:var(--panel); box-shadow:0 5px 18px rgba(20,30,26,.06); }.support-message.is-guest { margin-left:auto; color:#fff; background:var(--accent); }.support-message.is-system { width:100%; margin:12px 0; padding:0 12px; color:var(--muted); background:transparent; box-shadow:none; text-align:center; }.support-message.is-system p { margin:0; font-size:11px; line-height:1.4; }.support-message strong { font-size:11px; opacity:.7; }.support-message p { margin:4px 0 0; white-space:pre-wrap; font-size:14px; line-height:1.45; }
.support-chat form { display:grid; gap:9px; padding:14px; border-top:1px solid var(--soft-line); }.support-identity { display:grid; grid-template-columns:1fr 1fr; gap:8px; }.support-identity[hidden],.support-edit-identity[hidden] { display:none!important; }.support-chat input,.support-chat textarea { width:100%; padding:11px 12px; border:1px solid var(--soft-line); border-radius:12px; color:var(--text); background:var(--bg); font:inherit; resize:none; }.support-chat form>div:last-child { display:flex; align-items:center; justify-content:space-between; gap:12px; }.support-chat form button { padding:10px 16px; border:0; border-radius:12px; color:#fff; background:var(--accent); font-weight:800; cursor:pointer; }.support-chat form .support-edit-identity { justify-self:start; padding:2px 0; border:0; color:var(--accent); background:transparent; font-size:12px; font-weight:700; }.support-chat form small { color:var(--muted); }
.product-device-summary { display:flex; flex-wrap:wrap; gap:5px; padding:0 16px 12px; }.product-device-summary span { padding:5px 8px; border:1px solid var(--soft-line); border-radius:999px; color:var(--muted); background:var(--bg); font-size:10px; font-weight:700; }.product-device-picker { margin:18px 0; padding:0; border:0; }.product-device-picker legend { margin-bottom:9px; color:var(--muted); font-size:12px; font-weight:750; }.product-device-picker>div { display:flex; flex-wrap:wrap; gap:8px; }.product-device-picker label { position:relative; cursor:pointer; }.product-device-picker input { position:absolute; opacity:0; pointer-events:none; }.product-device-picker span { display:flex; min-height:40px; align-items:center; padding:9px 13px; border:1px solid var(--soft-line); border-radius:999px; background:var(--bg); color:var(--muted); font-size:12px; font-weight:750; transition:.18s ease; }.product-device-picker input:checked+span { border-color:var(--accent); background:var(--accent); color:#fff; }.product-device-picker input:focus-visible+span { box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 18%,transparent); }
.product-device-summary+.card-buy { position:static; margin:0 4px 4px; opacity:1; transform:none; }
.cart-row>div>small,.mini-cart-row span small { display:block; margin-top:3px; color:var(--muted); font-size:11px; }

@media (max-width: 680px) {
    .support-chat-button { right:14px; bottom:154px; padding:7px; }.support-chat-button .support-chat-label { display:none; }.support-identity { grid-template-columns:1fr; }
    .admin-hero,
    .admin-panel-head {
        align-items: stretch;
        flex-direction: column;
    }
    .admin-stats,
    .admin-columns,
    .admin-form,
    .product-form,
    .orders-table article {
        grid-template-columns: 1fr;
    }
    .media-admin-head {
        align-items: stretch;
        flex-direction: column;
    }
    .media-grid,
    .media-preview {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .admin-tabs {
        top: 68px;
    }
}

@media (max-width: 980px) {
    .support-chat { inset:0; width:auto; height:auto; min-height:0; max-height:none; grid-template-rows:auto minmax(0,1fr) auto; overflow-x:hidden; overflow-y:auto; border:0; border-radius:0; overscroll-behavior:contain; transition:opacity .18s ease,transform .18s ease; }
    .support-chat header { padding-top:max(18px,env(safe-area-inset-top)); }
    .support-chat-messages { min-height:0; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
    .support-chat form { position:relative; z-index:2; padding-bottom:max(14px,env(safe-area-inset-bottom)); background:var(--panel); }
    .support-chat-open { overflow:hidden; overscroll-behavior:none; }
    input:not([type="checkbox"]):not([type="radio"]),
    textarea,
    select,
    [contenteditable="true"] { font-size:16px!important; }
}

/* Mobile storefront navigation */
.site-menu-toggle,
.mobile-site-menu,
.mobile-site-menu-scrim { display: none; }

@media (max-width: 980px) {
    .site-header { grid-template-columns: auto auto minmax(0,1fr); gap: 10px; }
    .site-header .brand-mark { width: clamp(72px,16vw,120px); }
    .site-menu-toggle { width: 42px; height: 42px; padding: 10px; display: flex; flex-direction: column; align-items: stretch; justify-content: center; gap: 4px; border: none; border-radius: 13px; background: var(--surface); cursor: pointer; }
    .site-menu-toggle span { display: block; height: 2px; border-radius: 2px; background: currentColor; transition: transform .25s ease,opacity .25s ease; }
    .site-menu-open .site-menu-toggle span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
    .site-menu-open .site-menu-toggle span:nth-child(2) { opacity: 0; }
    .site-menu-open .site-menu-toggle span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
    .mobile-site-menu { position: fixed; inset: 0 auto 0 0; z-index: 70; width: min(88vw,390px); padding: max(18px,env(safe-area-inset-top)) 18px max(22px,env(safe-area-inset-bottom)); display: flex; flex-direction: column; overflow-y: auto; color: var(--text); background: color-mix(in srgb,var(--surface) 96%,transparent); box-shadow: 24px 0 80px rgba(16,22,18,.18); backdrop-filter: blur(24px); transform: translateX(-104%); transition: transform .3s cubic-bezier(.22,.8,.24,1); }
    .site-menu-open .mobile-site-menu { transform: none; }
    .mobile-site-menu > header { min-height: 54px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--line); }
    .mobile-site-menu > header a { font-size: 18px; font-weight: 850; letter-spacing: -.03em; }
    .mobile-site-menu > header button { width: 38px; height: 38px; border: 0; border-radius: 50%; background: var(--panel); font-size: 25px; cursor: pointer; }
    .mobile-site-menu > nav { margin-top: 15px; display: grid; }
    .mobile-site-menu > nav a { min-height: 70px; padding: 12px 3px; display: grid; grid-template-columns: 30px 1fr; align-content: center; border-bottom: 1px solid var(--line); }
    .mobile-site-menu > nav span { grid-row: 1/3; color: var(--accent); font-size: 10px; font-weight: 800; }
    .mobile-site-menu > nav strong { font-size: 17px; letter-spacing: -.02em; }
    .mobile-site-menu > nav small { overflow: hidden; color: var(--muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
    .mobile-menu-links { padding: 18px 2px; display: flex; flex-wrap: wrap; gap: 10px 18px; }
    .mobile-menu-links a { color: var(--muted); font-size: 12px; font-weight: 700; }
    .mobile-menu-account { margin-top: auto; padding: 13px; display: grid; grid-template-columns: 38px 1fr auto; align-items: center; gap: 11px; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); }
    .mobile-menu-account svg { width: 22px; height: 22px; margin: auto; fill: none; stroke: currentColor; stroke-width: 1.7; }
    .mobile-menu-account span { min-width: 0; display: grid; }
    .mobile-menu-account strong,.mobile-menu-account small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .mobile-menu-account small { color: var(--muted); font-size: 10px; }
    .mobile-menu-account b { font-size: 18px; }
    .mobile-site-menu-scrim { position: fixed; inset: 0; z-index: 65; display: block; border: 0; background: rgba(13,18,15,.42); opacity: 0; pointer-events: none; transition: opacity .28s ease; backdrop-filter: blur(3px); }
    .site-menu-open .mobile-site-menu-scrim { opacity: 1; pointer-events: auto; }
    body.site-menu-open { overflow: hidden; }
}

/* Customer account */
.customer-account { padding-top: clamp(55px,8vw,105px); padding-bottom: 110px; }
.account-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.account-heading p,.account-section-head p,.account-profile-card>div>p { margin: 0 0 8px; color: var(--accent); font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.account-heading h1 { max-width: 850px; margin: 0; font-size: clamp(42px,6vw,78px); line-height: .98; letter-spacing: -.06em; text-wrap: balance; }
.account-flash { margin-bottom: 22px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--panel); }
.account-flash.is-success { border-color: color-mix(in srgb,#2d8a59 35%,var(--line)); color: #267049; background: color-mix(in srgb,#e6f6ec 75%,var(--surface)); }
.account-flash.is-error { border-color: color-mix(in srgb,#c84d4d 35%,var(--line)); color: #a43e3e; background: color-mix(in srgb,#fdeaea 75%,var(--surface)); }
.account-auth-layout { display: grid; grid-template-columns: 1.08fr .92fr; gap: 18px; align-items: start; }
.account-auth-card { padding: clamp(25px,4vw,48px); border: 1px solid var(--line); border-radius: 28px; background: var(--surface); box-shadow: var(--shadow-soft); }
.account-auth-card.is-primary { background: linear-gradient(145deg,color-mix(in srgb,var(--panel) 76%,var(--surface)),var(--surface)); }
.account-auth-intro span { color: var(--accent); font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.account-auth-intro h2,.account-section-head h2,.account-profile-card h2 { margin: 8px 0 10px; font-size: clamp(30px,4vw,46px); line-height: 1; letter-spacing: -.045em; }
.account-auth-intro p,.account-profile-card>div>span { max-width: 570px; margin: 0; color: var(--muted); line-height: 1.6; }
.account-form { margin-top: 28px; display: grid; gap: 13px; }
.account-form label { display: grid; gap: 7px; color: var(--muted); font-size: 11px; font-weight: 750; }
.account-form>label>input,.account-form .ua-phone-field { min-height: 50px; border: 1px solid var(--line); border-radius: 14px; background: var(--bg); }
.account-form>label>input { width: 100%; padding: 12px 14px; outline: 0; }
.account-form>label>input:focus,.account-form .ua-phone-field:focus-within { border-color: var(--accent); box-shadow: 0 0 0 4px color-mix(in srgb,var(--accent) 12%,transparent); }
.account-form small { color: var(--muted); line-height: 1.5; }
.form-note a { color: var(--accent); font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.account-privacy-note { margin-top: 28px; padding: 14px; display: flex; align-items: center; gap: 12px; border-radius: 14px; color: var(--muted); background: var(--panel); font-size: 11px; }
.account-privacy-note svg { width: 25px; height: 25px; flex: 0 0 auto; fill: none; stroke: var(--accent); stroke-width: 1.6; }
.account-overview { margin: 34px 0 22px; display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.account-overview article { min-height: 145px; padding: 22px; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid var(--line); border-radius: 22px; background: var(--surface); box-shadow: var(--shadow-soft); }
.account-overview span,.account-overview small { color: var(--muted); font-size: 11px; }
.account-overview strong { overflow-wrap: anywhere; font-size: clamp(24px,3vw,38px); letter-spacing: -.04em; }
.account-content-grid { display: grid; grid-template-columns: minmax(0,1fr) 340px; gap: 20px; align-items: start; }
.account-orders,.account-profile-card { padding: 24px; border: 1px solid var(--line); border-radius: 24px; background: var(--surface); box-shadow: var(--shadow-soft); }
.account-section-head { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 16px; }
.account-section-head h2 { margin-bottom: 0; }
.account-profile-card { position: sticky; top: 110px; }
.account-empty { padding: 54px 20px; text-align: center; border: 1px dashed var(--line); border-radius: 18px; }
.account-empty span { color: var(--accent); font-size: 11px; font-weight: 800; text-transform: uppercase; }
.account-empty h3 { margin: 8px 0; font-size: 28px; }.account-empty p { margin: 0 0 20px; color: var(--muted); }
.customer-order-list { display: grid; gap: 10px; }
.customer-order-card { overflow: hidden; border: 1px solid var(--line); border-radius: 17px; background: var(--bg); }
.customer-order-card>summary { min-height: 88px; padding: 14px 17px; display: flex; align-items: center; justify-content: space-between; gap: 14px; list-style: none; cursor: pointer; }
.customer-order-card>summary::-webkit-details-marker { display: none; }
.customer-order-card>summary .customer-order-copy { min-width: 0; display: grid; grid-template-columns: auto auto; align-items: baseline; gap: 3px 12px; }
.customer-order-card>summary .customer-order-copy>span { grid-column: 1/-1; color: var(--muted); font-size: 10px; }
.customer-order-card>summary strong { font-size: 20px; }.customer-order-card>summary small { color: var(--muted); font-size: 11px; }
.order-state { padding: 7px 10px; border-radius: 999px; color: #38654b; background: #e6f3eb; font-size: 10px; white-space: nowrap; }
.order-state.is-cancelled { color: #9a4242; background: #fae7e7; }
.order-progress { position: relative; margin: 2px 28px 22px; display: grid; grid-template-columns: repeat(5,1fr); }
.order-progress::before,.order-progress>i { content:""; position: absolute; left: 10%; right: 10%; top: 7px; height: 2px; background: var(--line); }
.order-progress>i { right: auto; z-index: 1; width: calc((var(--order-step) - 1) * 20%); max-width: 80%; background: var(--accent); }
.order-progress span { position: relative; z-index: 2; display: grid; justify-items: center; gap: 6px; color: var(--muted); text-align: center; }
.order-progress span b { width: 15px; height: 15px; border: 3px solid var(--bg); border-radius: 50%; background: #c9cec9; box-shadow: 0 0 0 1px var(--line); }
.order-progress span.is-done b { background: var(--accent); }.order-progress span small { font-size: 9px; }
.customer-order-items { padding: 0 17px; display: grid; }
.customer-order-items article { padding: 11px 0; display: grid; grid-template-columns: 48px 1fr auto; align-items: center; gap: 11px; border-top: 1px solid var(--line); }
.customer-order-items img { width: 48px; height: 48px; border-radius: 11px; object-fit: cover; background: var(--panel); }
.customer-order-items div { min-width: 0; display: grid; }.customer-order-items strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }.customer-order-items small { color: var(--muted); font-size: 10px; }.customer-order-items article>span { font-size: 11px; white-space: nowrap; }
.customer-order-delivery { padding: 16px 17px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; border-top: 1px solid var(--line); background: var(--panel); }
.customer-order-delivery div { display: grid; gap: 2px; }.customer-order-delivery span,.customer-order-delivery small { color: var(--muted); font-size: 10px; }.customer-order-delivery strong { font-size: 12px; }

@media (max-width: 900px) {
    .account-auth-layout,.account-content-grid { grid-template-columns: 1fr; }
    .account-profile-card { position: static; }
}
@media (max-width: 680px) {
    .customer-account { width: calc(100% - 24px); padding-top: 48px; }
    .account-heading { align-items: start; flex-direction: column; }.account-heading h1 { font-size: 45px; }.account-logout { align-self: stretch; }.account-logout .btn { width: 100%; }
    .account-auth-card,.account-orders,.account-profile-card { padding: 20px; border-radius: 20px; }
    .account-overview { grid-template-columns: 1fr; }.account-overview article { min-height: 112px; }
    .account-section-head { align-items: start; flex-direction: column; }.account-section-head .btn { width: 100%; }
    .customer-order-card>summary { align-items: flex-start; flex-direction: column; }.order-state { align-self: flex-start; }
    .order-progress { margin-inline: 10px; }.order-progress span small { display: none; }
    .customer-order-items article { grid-template-columns: 42px minmax(0,1fr); }.customer-order-items img { width: 42px; height: 42px; }.customer-order-items article>span { grid-column: 2; }
    .customer-order-delivery { grid-template-columns: 1fr; }
}

.search-panel {
    position: fixed;
    left: 50%;
    top: 86px;
    z-index: 50;
    width: min(620px, calc(100% - 28px));
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--bg);
    box-shadow: var(--shadow);
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -10px);
    transition: .2s ease;
}
.search-panel.open { opacity: 1; pointer-events: auto; transform: translate(-50%, 0); }
.search-panel label { display: grid; gap: 8px; color: var(--muted); font-size: 13px; }
.search-results { display: grid; gap: 8px; margin-top: 10px; }
.search-result { display: grid; grid-template-columns: 46px 1fr auto; gap: 10px; align-items: center; padding: 8px; border-radius: 10px; background: var(--panel); }
.search-result img { width: 46px; height: 46px; object-fit: cover; border-radius: 8px; }
.search-result.search-collection { grid-template-columns:minmax(0,1fr) auto; min-height:58px; padding:10px 13px; background:color-mix(in srgb,var(--accent) 7%,var(--panel)); }
.search-collection>span { display:grid; gap:2px; }
.search-collection small { color:var(--accent); font-size:9px; font-weight:850; letter-spacing:.08em; text-transform:uppercase; }
.search-collection b { overflow:hidden; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }

.cart-drawer {
    position: fixed;
    inset: 0 0 0 auto;
    z-index: 70;
    display: grid;
    grid-template-rows: auto 1fr auto;
    width: min(430px, 100%);
    background: var(--bg);
    box-shadow: var(--shadow);
    transform: translateX(100%);
    transition: transform .25s ease;
}
.cart-drawer.open { transform: translateX(0); }
.cart-head, .cart-summary { padding: 18px; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; align-items: center; }
.cart-summary { width:100%; padding:15px 18px 20px; border-top:1px solid var(--line); border-bottom:0; display:grid; grid-template-columns:minmax(0,1fr); align-items:stretch; gap:4px; background:color-mix(in srgb,var(--panel) 76%,var(--bg)); box-shadow:0 -10px 32px rgba(20,30,26,.05); }
.cart-summary [data-cart-checkout][hidden],.checkout-form [data-checkout-submit][hidden] { display:none!important; }
.cart-summary > div { width:100%; min-width:0; min-height:24px; padding:3px 2px; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:16px; border-radius:0; }
.cart-summary > div>span,.cart-summary > div>strong { color:var(--muted); font-size:10px; font-weight:650; line-height:1.3; }
.cart-summary > div>strong { justify-self:end; text-align:right; }
.cart-summary .cart-pricing-row.is-saving { color:#2d8557; background:transparent; }
.cart-summary .cart-pricing-row.is-saving>span,.cart-summary .cart-pricing-row.is-saving>strong { color:#2d8557; }
.cart-summary .cart-pricing-row.is-total { min-height:54px; margin-top:7px; padding:12px 2px 5px; border-top:1px solid var(--line); border-radius:0; }
.cart-summary .cart-pricing-row.is-total>span { color:var(--text); font-size:14px; font-weight:750; }
.cart-summary .cart-pricing-row.is-total>strong { color:var(--text); font-size:20px; font-weight:850; }
.cart-summary [data-cart-checkout] { width:100%; min-height:48px; margin-top:4px; display:flex; align-items:center; justify-content:center; }
.cart-items { overflow: auto; padding: 8px 18px; }
.cart-row { display: grid; grid-template-columns: 64px 1fr auto; gap: 12px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--line); }
.cart-row,.cart-bundle-line{position:relative;padding-right:34px}.cart-trash{display:flex;position:absolute;right:0;top:10px!important;width:28px;height:28px!important;padding:6px!important;border:0!important;border-radius:50%!important;color:#9d2b2b!important;background:color-mix(in srgb,#c33 8%,transparent)!important}.cart-trash svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7}
.cart-error{margin:0 0 10px;padding:10px 12px;border-radius:10px;color:#8f1d1d;background:#fff0f0;font-size:12px}
.cart-row,.cart-bundle-line,.mini-cart-row { cursor:pointer; }
.cart-row button,.cart-bundle-line button { cursor:pointer; }
.cart-row img { width: 64px; height: 64px; object-fit: cover; border-radius: 10px; }
.cart-product-image { display:block; border-radius:11px; }
.cart-product-image:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.cart-product-name { color:inherit; text-decoration:none; }
.cart-product-name:hover { color:var(--accent); }
.cart-variant-meta { max-width:100%; margin-top:4px; display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; color:var(--muted); font-size:8.5px; font-weight:650; line-height:1.25; }
.cart-variant-meta>span { min-width:0; display:inline-flex; align-items:center; gap:4px; }
.cart-variant-model b { color:color-mix(in srgb,var(--muted) 72%,transparent); font-size:7px; font-weight:850; letter-spacing:.06em; text-transform:uppercase; }
.cart-variant-color i { --cart-color:#b8b8b8; position:relative; width:14px; height:14px; flex:0 0 14px; display:grid; place-items:center; border:1px solid color-mix(in srgb,var(--text) 16%,transparent); border-radius:50%; background:var(--cart-color); box-shadow:0 0 0 2px var(--surface),0 0 0 3px color-mix(in srgb,var(--accent) 24%,transparent); }
.cart-variant-color i::after { content:"✓"; color:#fff; font-size:8px; font-weight:950; line-height:1; text-shadow:0 1px 2px rgba(0,0,0,.72); }
.cart-bundle-quantity { display:block; margin-top:4px; }
.qty-row { display: flex; align-items: center; gap: 8px; color: var(--muted); }
.qty-row button { width: 28px; height: 28px; border-radius: 999px; border: 1px solid var(--line); background: var(--panel); }
.cart-pricing-row.is-saving { color:#2d8557; }
.cart-pricing-row.is-total { align-items:baseline; }
.cart-pricing-row.is-total strong { font-size:20px; }
.cart-line-price { display:grid; justify-items:end; gap:2px; white-space:nowrap; }
.cart-line-price strong { font-size:11px; }
.cart-line-price del { color:var(--muted); font-size:9px; font-weight:600; }
.cart-line-price.has-discount strong { color:#d94742; }
.cart-line-price.is-bundle-price>span { display:flex; align-items:center; justify-content:flex-end; gap:4px; }
.cart-line-price.is-bundle-price em { padding:2px 4px; border-radius:999px; color:#fff; background:#d94742; font-size:7px; font-style:normal; font-weight:900; line-height:1; }
.cart-bundle-card { margin:10px 0 14px; overflow:hidden; border:1px solid color-mix(in srgb,#2d8557 25%,var(--soft-line)); border-radius:18px; background:linear-gradient(145deg,color-mix(in srgb,#e8f7ee 72%,var(--surface)),var(--surface)); box-shadow:var(--shadow-soft); }
.cart-bundle-card>header { padding:12px 13px; display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:1px solid color-mix(in srgb,#2d8557 16%,var(--soft-line)); }
.cart-bundle-card>header>span { display:grid; gap:1px; min-width:0; }
.cart-bundle-card>header small { color:#2d8557; font-size:9px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.cart-bundle-card>header strong { overflow:hidden; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
.cart-bundle-card>header>b { flex:0 0 auto; padding:6px 8px; border-radius:999px; color:#fff; background:#2d8557; font-size:10px; }
.cart-bundle-lines { padding:0 12px; }
.cart-bundle-line { position:relative; display:grid; grid-template-columns:54px minmax(0,1fr) auto; align-items:center; gap:9px; padding:10px 0; }
.cart-bundle-line+ .cart-bundle-line { border-top:1px solid color-mix(in srgb,#2d8557 12%,var(--soft-line)); }
.cart-bundle-line+ .cart-bundle-line::before,.cart-bundle-card.is-mini .mini-cart-row+ .mini-cart-row::before { content:"+"; position:absolute; left:21px; top:-9px; z-index:2; width:18px; height:18px; display:grid; place-items:center; border-radius:50%; color:#2d8557; background:var(--surface); box-shadow:0 3px 10px rgba(30,80,50,.12); font-size:12px; font-weight:900; }
.cart-bundle-line img { width:54px; height:54px; border-radius:11px; object-fit:cover; }
.cart-bundle-line>div { min-width:0; }
.cart-bundle-line>div>strong { display:block; overflow:hidden; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.cart-bundle-line>div>small { color:#2d8557; font-size:9px; }
.cart-bundle-line>.qty-row { margin-top:4px; }
.cart-bundle-line>span { font-size:10px; white-space:nowrap; }
.cart-bundle-card>footer { padding:9px 12px; display:flex; justify-content:space-between; gap:10px; color:#2d8557; background:color-mix(in srgb,#2d8557 7%,transparent); font-size:9px; }
.cart-other-title { margin:16px 0 2px; color:var(--muted); font-size:10px; font-weight:850; letter-spacing:.08em; text-transform:uppercase; }
.cart-bundle-suggestion { margin:2px 0 14px 76px; padding:12px; border:1px solid color-mix(in srgb,#2d8557 20%,var(--soft-line)); border-radius:15px; background:color-mix(in srgb,#2d8557 6%,var(--surface)); animation:cart-suggestion-in .3s ease both; }
.cart-bundle-suggestion>header { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.cart-bundle-suggestion>header>span { min-width:0; display:grid; gap:2px; }
.cart-bundle-suggestion>header small { color:#2d8557; font-size:8px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.cart-bundle-suggestion>header strong { overflow:hidden; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.cart-bundle-suggestion>header>b { flex:0 0 auto; color:#2d8557; font-size:11px; }
.cart-bundle-suggestion>p { margin:7px 0 9px; color:var(--muted); font-size:10px; line-height:1.4; }
.cart-bundle-suggestion>div { display:grid; gap:7px; }
.cart-bundle-suggestion article { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:8px; }
.cart-bundle-suggestion article>a { min-width:0; display:grid; grid-template-columns:38px minmax(0,1fr); align-items:center; gap:8px; color:inherit; text-decoration:none; }
.cart-bundle-suggestion article img { width:38px; height:38px; border-radius:9px; object-fit:cover; }
.cart-bundle-suggestion article span { min-width:0; display:grid; gap:2px; }
.cart-bundle-suggestion article .cart-variant-meta { margin-top:2px; display:flex; gap:3px 6px; }
.cart-bundle-suggestion article .cart-variant-meta>span { display:inline-flex; }
.cart-bundle-suggestion article .cart-variant-color i { width:12px; height:12px; flex-basis:12px; }
.cart-bundle-suggestion article strong { overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.cart-bundle-suggestion article small { color:var(--muted); font-size:9px; }
.cart-bundle-suggestion article button { min-height:32px; padding:6px 9px; border:0; border-radius:9px; color:#fff; background:#2d8557; font-size:9px; font-weight:850; cursor:pointer; }
@keyframes cart-suggestion-in { from { opacity:0; transform:translateY(7px); } to { opacity:1; transform:none; } }
.cart-bundle-card.is-mini { margin:8px 0 12px; border-radius:15px; box-shadow:none; }
.cart-bundle-card.is-mini .cart-bundle-lines { padding:0 10px; }
.cart-bundle-card.is-mini .mini-cart-row { position:relative; border-bottom:0; }
[data-theme="dark"] .cart-bundle-card { background:linear-gradient(145deg,rgba(45,133,87,.14),var(--surface)); }
.drawer-scrim {
    position: fixed;
    inset: 0;
    z-index: 60;
    background: rgba(0,0,0,.28);
    opacity: 0;
    pointer-events: none;
}
.cart-drawer.open + .drawer-scrim { opacity: 1; pointer-events: auto; }
@media (min-width:981px) { body.cart-open .support-chat-button { right:454px; } }
@media (max-width:480px) { .cart-bundle-suggestion { margin-left:0; } }

.site-footer {
    display: grid;
    grid-template-columns: 1.4fr .7fr .9fr;
    gap: 28px;
    padding: 46px clamp(18px, 4vw, 56px) 96px;
    border-top: 1px solid var(--line);
    background: var(--panel);
}
.site-footer p { max-width: 360px; color: var(--muted); }
.site-footer nav, .footer-tools, .socials { display: grid; gap: 10px; align-content: start; }
.language-switch { display: flex; gap: 8px; }
.language-switch button { border: 1px solid var(--line); border-radius: 999px; background: var(--bg); padding: 8px 12px; }
.site-footer small { grid-column: 1 / -1; color: var(--muted); }

.mobile-tabbar { display: none; }
.promo-body { background: #050605; color: #fff; }
.promo-page {
    min-height: 100vh;
    display: grid;
    align-items: center;
    width: min(980px, calc(100% - 32px));
    margin: auto;
    padding: 36px 0;
}
.promo-video { position: relative; overflow: hidden; border-radius: var(--radius); }
.promo-video img { width: 100%; max-height: 58vh; object-fit: cover; }
.promo-video span { position: absolute; left: 16px; bottom: 16px; padding: 8px 12px; border-radius: 999px; background: rgba(0,0,0,.55); }
.promo-page h1 { font-size: clamp(42px, 8vw, 88px); line-height: .96; margin: 22px 0 12px; }
.video-reviews { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 18px; }
.video-reviews article { padding: 16px; border: 1px solid rgba(255,255,255,.16); border-radius: var(--radius); }

@media (max-width: 980px) {
    .desktop-nav { display: none; }
    .site-header { grid-template-columns: auto 1fr; }
    .header-actions { justify-content: end; }
    .product-grid, .benefits, .journal-grid, .account-grid, .admin-grid,
    .category-showcase, .compatibility, .proof-section { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .catalog-layout, .product-page, .checkout-page, .contacts-page, .image-led { grid-template-columns: 1fr; }
    .series-feature, .journal-strip { grid-template-columns: 1fr; }
    .series-feature img { min-height: 360px; }
    .filters, .product-detail { position: static; }
    .admin-layout { grid-template-columns: 1fr; }
    .admin-sidebar {
        position: static;
        min-height: 0;
        grid-template-rows: auto;
    }
    .admin-tabs {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 680px) {
    body { padding-bottom: 72px; }
    .site-header { min-height: 64px; padding: 10px 14px; }
    .header-actions .icon-btn:nth-child(3) { display: none; }
    .hero { min-height: calc(100vh - 120px); }
    .hero::after { background: linear-gradient(0deg, rgba(255,255,255,.92), rgba(255,255,255,.18)); }
    [data-theme="dark"] .hero::after { background: linear-gradient(0deg, rgba(0,0,0,.82), rgba(0,0,0,.15)); }
    .hero-copy { padding: 42px 18px; align-self: end; }
    .hero h1 { font-size: 46px; }
    .product-grid, .catalog-grid, .benefits, .journal-grid, .account-grid, .admin-grid, .video-reviews,
    .category-showcase, .compatibility, .proof-section { grid-template-columns: 1fr; }
    .card-buy { opacity: 1; transform: none; position: static; }
    .specs, .feature-list, .segmented, .pay-row, .site-footer { grid-template-columns: 1fr; }
    .checkout-summary { order: -1; }
    .bundle-band,
    .support-cta,
    .admin-command {
        align-items: stretch;
        flex-direction: column;
    }
    .support-cta > div:last-child,
    .admin-command-actions {
        justify-content: stretch;
    }
    .support-cta .btn,
    .admin-command .btn {
        width: 100%;
    }
    .admin-tabs {
        grid-template-columns: repeat(2, 1fr);
    }
    .sticky-cta {
        position: fixed;
        left: 10px;
        right: 10px;
        bottom: 76px;
        z-index: 35;
        display: grid;
        grid-template-columns: 1fr auto;
        align-items: center;
        gap: 12px;
        padding: 10px;
        border: 1px solid var(--line);
        border-radius: var(--radius);
        background: var(--bg);
        box-shadow: var(--shadow);
    }
    .mobile-tabbar {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 50;
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        min-height: 66px;
        border-top: 1px solid var(--line);
        background: color-mix(in srgb, var(--bg) 92%, transparent);
        backdrop-filter: blur(18px);
    }
    .mobile-tabbar a, .mobile-tabbar button {
        position: relative;
        display: grid;
        place-items: center;
        align-content: center;
        gap: 3px;
        border: 0;
        background: transparent;
        color: var(--muted);
        font-size: 11px;
    }
    .mobile-tabbar b { right: 18px; top: 8px; }
}

/* Polished visual pass */
:root {
    --bg: #fbfbf8;
    --panel: #f2f3ef;
    --panel-strong: #e8ebe5;
    --surface: #ffffff;
    --surface-elevated: #ffffff;
    --surface-muted: #f4f5f1;
    --text: #11140f;
    --muted: #6d7269;
    --line: rgba(17, 20, 15, .20);
    --soft-line: rgba(17, 20, 15, .07);
    --accent: #1c352d;
    --accent-2: #8aa899;
    --accent-deep: #10231d;
    --on-accent: #ffffff;
    --scrim: rgba(13, 18, 15, .38);
    --radius: 16px;
    --radius-lg: 24px;
    --shadow: 0 28px 80px rgba(22, 27, 21, .10);
    --shadow-soft: 0 14px 42px rgba(22, 27, 21, .075);
    --shadow-overlay: 0 26px 80px rgba(18, 24, 20, .18);
}

[data-theme="dark"] {
    --bg: #111310;
    --panel: #171a16;
    --panel-strong: #20241e;
    --surface: #161915;
    --surface-elevated: #1c201b;
    --surface-muted: #191d18;
    --text: #e9ece6;
    --muted: #9da49a;
    --line: rgba(235, 239, 232, .075);
    --soft-line: rgba(235, 239, 232, .045);
    --accent-2: #789487;
    --accent-deep: #253d34;
    --on-accent: #ffffff;
    --scrim: rgba(4, 6, 5, .64);
    --shadow: 0 26px 72px rgba(0, 0, 0, .20);
    --shadow-soft: 0 10px 32px rgba(0, 0, 0, .14);
    --shadow-overlay: 0 28px 90px rgba(0, 0, 0, .34);
}

body {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--panel) 70%, transparent), transparent 420px),
        var(--bg);
}

.site-header {
    width: min(1440px, calc(100% - 28px));
    margin: 12px auto 0;
    top: 12px;
    border: 1px solid var(--soft-line);
    border-radius: 18px;
    box-shadow: 0 12px 38px rgba(17,20,15,.055);
    background: color-mix(in srgb, var(--surface) 86%, transparent);
}

.icon-btn,
.btn,
select,
input,
textarea {
    box-shadow: inset 0 1px 0 rgba(255,255,255,.5);
}

.btn {
    min-height: 48px;
    border-radius: 13px;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.btn:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-soft);
}

.hero {
    width: min(1440px, calc(100% - 28px));
    min-height: min(760px, calc(100vh - 112px));
    margin: 14px auto 0;
    border-radius: 28px;
    border: 1px solid var(--soft-line);
    box-shadow: var(--shadow);
}
.hero-copy {
    padding: clamp(54px, 9vw, 118px) clamp(26px, 7vw, 88px);
}
.hero h1 {
    max-width: 680px;
}
.hero p {
    color: color-mix(in srgb, var(--text) 58%, transparent);
}

.section-head,
.product-grid,
.category-showcase,
.series-feature,
.bundle-band,
.compatibility,
.benefits,
.proof-section,
.journal-strip,
.support-cta,
.catalog-layout,
.product-page,
.checkout-page,
.contacts-page,
.text-page,
.journal-page,
.support-page,
.account-page {
    width: min(1220px, calc(100% - 40px));
}

.section-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 28px;
    margin-top: 96px;
    margin-bottom: 22px;
}
.section-head h2 {
    max-width: 720px;
}

.category-showcase,
.compatibility,
.proof-section {
    gap: 18px;
    margin-bottom: 34px;
}
.category-showcase a,
.compatibility div,
.proof-section article,
.product-media,
.filters,
.checkout-summary,
.journal-grid article,
.account-grid article,
.support-page details,
.admin-card,
.admin-editor {
    border: 1px solid var(--soft-line);
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}

.category-showcase a {
    min-height: 190px;
    padding: 22px;
    border-radius: var(--radius-lg);
}
.category-showcase a:nth-child(1) { background: linear-gradient(160deg, #ffffff, #eaf0ea); }
.category-showcase a:nth-child(2) { background: linear-gradient(160deg, #ffffff, #eef2f2); }
.category-showcase a:nth-child(3) { background: linear-gradient(160deg, #ffffff, #ececea); }
.category-showcase a:nth-child(4) { background: linear-gradient(160deg, #ffffff, #e7eee9); }
[data-theme="dark"] .category-showcase a {
    background: linear-gradient(160deg, #161914, #10130f);
}

.product-grid {
    gap: 22px;
    margin-bottom: 44px;
}
.product-card {
    padding: 10px;
    border: 1px solid var(--soft-line);
    border-radius: 22px;
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}
.product-media {
    border-radius: 18px;
    box-shadow: none;
}
.product-info {
    padding: 0 4px 2px;
}

.series-feature {
    margin-top: 22px;
    margin-bottom: 34px;
    border-radius: 28px;
    box-shadow: var(--shadow);
}
.series-feature > div {
    background: var(--surface);
}
.series-feature img {
    min-height: 560px;
}

.bundle-band {
    margin-bottom: 34px;
    border-radius: 24px;
    box-shadow: var(--shadow);
    background: linear-gradient(135deg, var(--accent-deep), #21463b);
}

.compatibility div,
.proof-section article {
    border-radius: 22px;
    padding: 22px;
}

.benefits {
    gap: 18px;
    overflow: visible;
    border: 0;
    background: transparent;
    margin-top: 34px;
}
.benefits article {
    min-height: 230px;
    border: 1px solid var(--soft-line);
    border-radius: 22px;
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}

.journal-strip {
    gap: 18px;
    margin-top: 34px;
}
.journal-strip > div,
.journal-strip > a,
.journal-strip article {
    border-radius: 22px;
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}

.support-cta {
    border-radius: 24px;
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}

.site-footer {
    width: min(1440px, calc(100% - 28px));
    margin: 0 auto 14px;
    border: 1px solid var(--soft-line);
    border-radius: 28px;
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}

/* Admin polish */
.admin-shell {
    width: min(1500px, calc(100% - 28px));
    margin-top: 18px;
}
.admin-hero {
    border-radius: 24px;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--accent) 13%, transparent), transparent 45%),
        var(--surface);
    box-shadow: var(--shadow-soft);
}
.admin-layout {
    gap: 22px;
}
.admin-sidebar {
    top: 104px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.08), transparent 38%),
        #101511;
}
.admin-tabs a {
    border: 1px solid transparent;
}
.admin-tabs a:hover {
    border-color: rgba(255,255,255,.12);
}
.admin-command,
.admin-stats article,
.admin-panel {
    border: 1px solid var(--soft-line);
    border-radius: 24px;
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}
.admin-command {
    padding: 26px;
}
.admin-stats {
    gap: 18px;
    margin: 22px 0;
}
.admin-stats article {
    padding: 20px;
}
.admin-panel {
    padding: 24px;
    margin-top: 22px;
}
.admin-panel-head {
    padding-bottom: 18px;
    border-bottom: 1px solid var(--soft-line);
}
.admin-warning,
.admin-flash {
    border-radius: 16px;
    box-shadow: var(--shadow-soft);
}
.bulk-form {
    border: 1px solid var(--soft-line);
    border-radius: 18px;
    background: var(--panel);
}
.admin-product-list {
    gap: 14px;
}
.admin-editor {
    border-radius: 18px;
}
.admin-editor summary {
    min-height: 72px;
    background: linear-gradient(180deg, color-mix(in srgb, var(--panel) 52%, transparent), transparent);
}
.admin-editor[open] summary {
    border-bottom: 1px solid var(--soft-line);
}
.product-form {
    padding-top: 18px;
}
.admin-columns {
    gap: 18px;
}
.admin-card {
    border-radius: 18px;
    padding: 18px;
}
.admin-delete-inline {
    width: fit-content;
    margin-top: -8px;
    padding: 0;
}
.admin-form input,
.admin-form select,
.admin-form textarea {
    min-height: 46px;
    border-color: var(--soft-line);
    background: var(--bg);
}
.admin-form textarea {
    min-height: 92px;
}
.orders-table article {
    min-height: 64px;
    align-items: center;
    border: 1px solid var(--soft-line);
    background: var(--panel);
}

@media (max-width: 980px) {
    .site-header,
    .hero,
    .site-footer {
        width: min(100% - 20px, 100%);
    }
    .section-head {
        align-items: start;
        flex-direction: column;
        margin-top: 62px;
    }
    .admin-sidebar {
        top: auto;
    }
}

@media (max-width: 680px) {
    .site-header {
        top: 8px;
        margin-top: 8px;
        border-radius: 16px;
    }
    .hero {
        min-height: calc(100vh - 96px);
        border-radius: 22px;
    }
    .hero-copy {
        padding: 34px 20px;
    }
    .category-showcase a,
    .compatibility div,
    .proof-section article,
    .benefits article,
    .product-card,
    .admin-panel,
    .admin-command,
    .admin-stats article {
        border-radius: 18px;
    }
    .series-feature img {
        min-height: 300px;
    }
    .admin-shell {
        width: min(100% - 18px, 100%);
    }
}

@media (max-width: 980px) {
    .site-header { grid-template-columns: auto auto minmax(0,1fr); }
}
@media (max-width: 420px) {
    .site-header { gap: 7px; }
    .site-header .brand-mark { width: 100px; }
    .site-header .icon-btn,.site-menu-toggle { width: 38px; height: 38px; }
    .site-header .header-actions { gap: 5px; }
}

/* Progressive navigation and Case Aura carousel */
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

#main { outline: none; transition: opacity .2s ease; }
body.is-page-loading #main { opacity: .42; pointer-events: none; }
.connectivity-notice {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 120;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: 100%;
    min-height: calc(42px + env(safe-area-inset-top));
    padding: calc(8px + env(safe-area-inset-top)) 18px 8px;
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, #e3a52b 30%, transparent);
    border-radius: 0;
    color: #5d430d;
    background: color-mix(in srgb, #fff4d7 94%, transparent);
    box-shadow: 0 10px 30px rgba(87, 60, 8, .10);
    backdrop-filter: blur(14px);
    pointer-events: none;
    font-size: 12px;
    font-weight: 720;
    text-align: center;
    transform: translateY(-100%);
    opacity: 0;
    transition: opacity .22s ease, transform .22s ease;
}
.connectivity-notice::before { content: ""; flex: 0 0 auto; width: 7px; height: 7px; border-radius: 50%; background: #d29119; box-shadow: 0 0 0 4px rgba(210,145,25,.12); }
.connectivity-notice.is-visible { opacity: 1; transform: translateY(0); }
.connectivity-notice.is-offline { color: #7a302c; border-color: color-mix(in srgb, #d85b52 34%, transparent); background: color-mix(in srgb, #ffebe8 95%, transparent); }
.connectivity-notice.is-offline::before { background: #d85b52; box-shadow: 0 0 0 4px rgba(216,91,82,.12); }
.connectivity-notice.is-restored { color: #285f43; border-color: color-mix(in srgb, #3b9b68 30%, transparent); background: color-mix(in srgb, #e9f7ee 95%, transparent); }
.connectivity-notice.is-restored::before { background: #3b9b68; box-shadow: 0 0 0 4px rgba(59,155,104,.12); }
[data-theme="dark"] .connectivity-notice { color: #f1d99e; background: color-mix(in srgb, #332a18 94%, transparent); }
[data-theme="dark"] .connectivity-notice.is-offline { color: #f1b1aa; background: color-mix(in srgb, #3a201f 95%, transparent); }
[data-theme="dark"] .connectivity-notice.is-restored { color: #add9bd; background: color-mix(in srgb, #173023 95%, transparent); }
.store-preloader[hidden] { display: none; }
.store-preloader {
    position: fixed;
    inset: 0;
    z-index: 38;
    display: grid;
    place-content: center;
    padding-top: 76px;
    background: color-mix(in srgb, var(--bg) 84%, transparent);
    backdrop-filter: blur(12px);
}
.store-preloader-mark {
    position: relative;
    width: 132px;
    height: 70px;
    display: grid;
    place-items: center;
}
.store-preloader-mark img { position: relative; z-index: 2; width: 132px; height: 80px; max-width: none; object-fit: contain; top: -4px;}
.aura-rings {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    overflow: visible;
}
.aura-path {
    fill: none;
    stroke: url(#aura-wave);
    stroke-width: 4.5;
    stroke-linecap: round;
    stroke-linejoin: round;
    transform-box: view-box;
    transform-origin: 82.605px 71.305px;
    opacity: 0;
    animation: aura-travel 4s cubic-bezier(.3,.05,.25,1) infinite;
    animation: aura-travel 2s linear infinite;
}
.aura-path.is-wave-two { animation-delay: -1s; }
@keyframes aura-travel {
    0% { transform: scale(1); opacity: 0; }
    18% { transform: scale(1.04); opacity: .62; }
    44% { transform: scale(1.18); opacity: .68; }
    72% { transform: scale(1.34); opacity: .34; }
    100% { transform: scale(1.46); opacity: 0; }
}

.store-slider {
    position: relative;
    width: min(1440px, calc(100% - 28px));
    min-height: min(760px, calc(100svh - 112px));
    margin: 14px auto 0;
    overflow: hidden;
    border-radius: 28px;
    background: var(--panel-strong);
    box-shadow: var(--shadow);
    isolation: isolate;
    outline: none;
}
.store-slider:focus-visible { box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 22%, transparent), var(--shadow); }
.store-slider-track { position: absolute; inset: 0; }
.store-slide {
    position: absolute;
    inset: 0;
    display: grid;
    align-items: end;
    opacity: 0;
    visibility: hidden;
    transform: scale(1.015);
    transition: opacity .65s ease, transform 1s cubic-bezier(.2,.7,.2,1), visibility .65s;
}
.store-slide.is-active { opacity: 1; visibility: visible; transform: scale(1); }
.store-slide > img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.store-slide::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(45deg, color-mix(in srgb, var(--bg) 60%, transparent), color-mix(in srgb, var(--bg) 38%, transparent) 52%, transparent 78%);
}
.store-slide-copy { width: min(720px, 92vw); padding: clamp(54px, 9vw, 118px) clamp(26px, 7vw, 88px); }
.store-slide-copy > span { display: block; margin-bottom: 12px; color: var(--accent); font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.store-slide-copy h1 { max-width: 680px; margin: 0 0 18px; font-size: clamp(42px, 7vw, 86px); line-height: .96; }
.store-slide-copy p { max-width: 540px; margin: 0 0 28px; color: color-mix(in srgb, var(--text) 64%, transparent); font-size: 18px; }
.store-slider-controls { position: absolute; right: 28px; bottom: 26px; z-index: 4; display: flex; align-items: center; gap: 10px; }
.store-slider-controls > button { display: grid; place-items: center; width: 42px; height: 42px; border: 0; border-radius: 50%; color: var(--text); background: color-mix(in srgb, var(--surface-elevated) 86%, transparent); box-shadow: var(--shadow-soft); cursor: pointer; }
.store-slider-controls > div { display: flex; gap: 6px; padding: 10px 12px; border-radius: 999px; background: color-mix(in srgb, var(--surface-elevated) 82%, transparent); backdrop-filter: blur(12px); }
.store-slider-controls [data-slider-dot] { width: 7px; height: 7px; padding: 0; border: 0; border-radius: 999px; background: color-mix(in srgb, var(--text) 28%, transparent); transition: width .25s ease, background .25s ease; cursor: pointer; }
.store-slider-controls [data-slider-dot].is-active { width: 24px; background: var(--accent); }

/* Quiet dark surfaces: hierarchy comes from tone instead of outlines. */
[data-theme="dark"] body { background: linear-gradient(180deg, #151813, var(--bg) 380px); }
[data-theme="dark"] .site-header,
[data-theme="dark"] .mega-menu,
[data-theme="dark"] .search-panel,
[data-theme="dark"] .cart-drawer,
[data-theme="dark"] .mobile-site-menu { background: color-mix(in srgb, var(--surface-elevated) 90%, transparent); border-color: var(--soft-line); box-shadow: var(--shadow-overlay); }
[data-theme="dark"] .product-card,
[data-theme="dark"] .product-media,
[data-theme="dark"] .filters,
[data-theme="dark"] .checkout-summary,
[data-theme="dark"] .account-auth-card,
[data-theme="dark"] .account-orders,
[data-theme="dark"] .account-profile-card,
[data-theme="dark"] .customer-order-card,
[data-theme="dark"] .journal-grid article,
[data-theme="dark"] .support-page details { border-color: var(--soft-line); background: var(--surface); box-shadow: var(--shadow-soft); }
[data-theme="dark"] .category-showcase a { border-color: transparent; background: linear-gradient(150deg, var(--surface-elevated), var(--surface-muted)); box-shadow: var(--shadow-soft); }
[data-theme="dark"] .icon-btn,
[data-theme="dark"] .btn,
[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea { box-shadow: none; }
[data-theme="dark"] .drawer-scrim,
[data-theme="dark"] .mobile-site-menu-scrim { background: var(--scrim); }
[data-theme="dark"] .bundle-band { background: linear-gradient(135deg, #1d3029, #17231f); }
[data-theme="dark"] .order-state { color: #a8ceb6; background: rgba(83, 143, 105, .16); }
[data-theme="dark"] .order-state.is-cancelled { color: #e0a3a3; background: rgba(170, 74, 74, .15); }
[data-theme="dark"] .account-flash.is-success { color: #a7d1b5; background: rgba(58, 122, 81, .13); }
[data-theme="dark"] .account-flash.is-error { color: #e0a3a3; background: rgba(160, 64, 64, .13); }

@media (max-width: 680px) {
    .store-slider { width: calc(100% - 20px); min-height: calc(100svh - 96px); border-radius: 22px; }
    .store-slide::after { background: linear-gradient(0deg, color-mix(in srgb, var(--bg) 60%, transparent), color-mix(in srgb, var(--bg) 20%, transparent) 70%, transparent); }
    .store-slide-copy { align-self: end; padding: 94px 20px 92px; }
    .store-slide-copy h1 { font-size: clamp(40px, 13vw, 58px); }
    .store-slide-copy p { font-size: 16px; }
    .store-slider-controls { right: 16px; bottom: 18px; }
    .store-slider-controls > button { width: 38px; height: 38px; }
    .store-preloader { padding-top: 58px; }
}

@media (prefers-reduced-motion: reduce) {
    .aura-path { animation: none; opacity: .72; transform: scale(1); }
    .aura-path.is-wave-two { opacity: .36; transform: scale(1.46); }
    .store-slide { transition: none; transform: none; }
    #main { transition: none; }
}

/* Store hierarchy */
.store-breadcrumbs {
    width: min(1220px, calc(100% - 40px));
    margin: 28px auto -10px;
    overflow: hidden;
}
.store-breadcrumbs ol {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0;
    padding: 0;
    overflow-x: auto;
    scrollbar-width: none;
    list-style: none;
}
.store-breadcrumbs ol::-webkit-scrollbar { display: none; }
.store-breadcrumbs li { display: flex; align-items: center; gap: 7px; flex: 0 0 auto; }
.store-breadcrumbs li:not(:last-child)::after { content: "›"; color: color-mix(in srgb, var(--muted) 55%, transparent); font-size: 15px; }
.store-breadcrumbs a,
.store-breadcrumbs span {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 11px;
    border-radius: 999px;
    color: var(--muted);
    background: var(--surface-muted);
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}
.store-breadcrumbs a { transition: color .18s ease, background .18s ease; }
.store-breadcrumbs a:hover { color: var(--text); background: var(--panel-strong); }
.store-breadcrumbs span[aria-current="page"] { color: var(--text); background: transparent; }
.store-breadcrumbs + .catalog-layout,
.store-breadcrumbs + .product-page,
.store-breadcrumbs + .checkout-page,
.store-breadcrumbs + .contacts-page { margin-top: 30px; }
.store-breadcrumbs + .text-page,
.store-breadcrumbs + .journal-page,
.store-breadcrumbs + .support-page,
.store-breadcrumbs + .account-page { margin-top: 54px; }

/* Payment methods are enabled only by server capability and browser support. */
.payment-methods { min-width: 0; margin: 4px 0; padding: 0; border: 0; }
.payment-methods > legend { margin-bottom: 10px; color: var(--text); font-size: 14px; font-weight: 760; }
.payment-methods > div { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px; }
.payment-method {
    position: relative;
    display: grid !important;
    grid-template-columns: 42px minmax(0,1fr) auto;
    align-items: center;
    gap: 11px !important;
    min-height: 76px;
    padding: 11px 12px;
    border: 1px solid var(--soft-line);
    border-radius: 16px;
    color: var(--text) !important;
    background: var(--surface);
    cursor: pointer;
    transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.payment-method:hover:not(.is-disabled) { transform: translateY(-1px); border-color: color-mix(in srgb, var(--accent) 30%, var(--line)); }
.payment-method:has(input:checked) { border-color: color-mix(in srgb, var(--accent) 55%, var(--line)); background: color-mix(in srgb, var(--accent) 7%, var(--surface)); }
.payment-method > input { position: absolute; width: 1px; height: 1px; min-height: 0; opacity: 0; }
.payment-method:has(input:focus-visible) { box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 17%, transparent); }
.payment-method-mark { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; color: var(--text); background: var(--panel); font-size: 10px; font-weight: 850; letter-spacing: -.02em; }
.payment-method > span:nth-of-type(2) { display: grid; gap: 3px; min-width: 0; }
.payment-method strong { font-size: 13px; line-height: 1.2; }
.payment-method small { color: var(--muted); font-size: 10px; line-height: 1.3; }
.payment-method > b { color: var(--accent); font-size: 10px; }
.payment-method.is-disabled { opacity: .52; cursor: not-allowed; filter: grayscale(.35); }
.payment-method.is-disabled > b { color: var(--muted); }
.payment-methods > p { margin: 9px 2px 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.payment-methods > p:empty { display:none; }
.payment-description{max-height:0;margin:0!important;padding:0 12px;overflow:hidden;border-radius:12px;background:color-mix(in srgb,var(--accent) 7%,var(--surface));opacity:0;transform:translateY(-6px);transition:max-height .32s ease,opacity .24s ease,transform .32s ease,padding .32s ease,margin .32s ease}.payment-description.is-visible{max-height:180px;margin-top:10px!important;padding:12px;opacity:1;transform:none}.privacy-consent{display:flex!important;align-items:flex-start;gap:10px;padding:13px 14px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}.privacy-consent input{width:18px!important;height:18px;min-height:18px!important;flex:0 0 auto;margin-top:1px;accent-color:var(--accent)}.privacy-consent span{font-size:12px;line-height:1.5}
.order-confirmation-methods{display:grid;gap:12px;margin:0;padding:0;border:0}.order-confirmation-methods>legend{margin:0 0 2px;font-size:16px;font-weight:800}.order-confirmation-methods>p{margin:-7px 0 0;color:var(--muted);font-size:11px}.order-confirmation-methods>div{display:grid;gap:8px}.confirmation-method{position:relative;display:grid!important;grid-template-columns:24px minmax(0,1fr);align-items:center;gap:12px;min-height:62px;padding:12px 14px!important;border:1px solid var(--line);border-radius:16px;background:var(--surface);cursor:pointer;transition:border-color .2s ease,background .2s ease,box-shadow .2s ease,transform .2s ease}.confirmation-method:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--accent) 35%,var(--line))}.confirmation-method>input{position:absolute;width:1px!important;height:1px!important;opacity:0}.confirmation-radio{display:grid;width:22px;height:22px;border:2px solid color-mix(in srgb,var(--muted) 45%,transparent);border-radius:50%;background:var(--surface);box-shadow:inset 0 0 0 5px var(--surface);transition:border-color .18s ease,background .18s ease}.confirmation-method>span:last-child{display:grid;gap:3px}.confirmation-method strong{font-size:13px}.confirmation-method small{color:var(--muted);font-size:10px;line-height:1.35}.confirmation-method:has(input:checked){border-color:color-mix(in srgb,var(--accent) 55%,var(--line));background:color-mix(in srgb,var(--accent) 6%,var(--surface));box-shadow:0 8px 24px color-mix(in srgb,var(--accent) 10%,transparent)}.confirmation-method:has(input:checked) .confirmation-radio{border-color:var(--accent);background:var(--accent)}.confirmation-method:has(input:focus-visible){outline:3px solid color-mix(in srgb,var(--accent) 20%,transparent);outline-offset:2px}

/* Promotion and bundle cards */
.promo-banner { position: relative; overflow: hidden; isolation: isolate; }
.promo-banner > img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; opacity: .34; }
.promo-banner::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, color-mix(in srgb, var(--accent-deep) 94%, transparent), color-mix(in srgb, var(--accent-deep) 56%, transparent)); }
.promo-banner div { max-width: 760px; }
.promo-banner h2 { margin: 2px 0; }
.promo-banner div > span { display: block; margin-top: 8px; color: color-mix(in srgb, currentColor 78%, transparent); }
.bundle-related-products { display: grid; gap: 8px; margin: 12px 0; }
.bundle-related-products article { display: grid; grid-template-columns: 52px minmax(0,1fr) auto; align-items: center; gap: 10px; padding: 8px; border-radius: 13px; background: var(--surface); }
.bundle-related-products img { width: 52px; height: 52px; border-radius: 10px; object-fit: cover; background: var(--panel); }
.bundle-related-products span { display: grid; gap: 2px; min-width: 0; }
.bundle-related-products b { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.bundle-related-products small { color: var(--muted); font-size: 11px; }
.bundle-related-products .btn { min-height: 36px; padding: 0 11px; font-size: 11px; }

@media (max-width: 680px) {
    .store-breadcrumbs { width: calc(100% - 24px); margin-top: 20px; }
    .store-breadcrumbs a,.store-breadcrumbs span { min-height: 30px; padding: 0 9px; font-size: 11px; }
    .payment-methods > div { grid-template-columns: 1fr; }
    .payment-method { min-height: 70px; }
    .promo-banner { align-items: flex-start; flex-direction: column; }
    .bundle-related-products article { grid-template-columns: 46px minmax(0,1fr) auto; }
    .bundle-related-products img { width: 46px; height: 46px; }
    .connectivity-notice { justify-content: flex-start; padding-left: 14px; padding-right: 14px; text-align: left; }
}

/* Product view modes and swipe galleries */
.product-view-toggle { display:none; align-items:center; gap:4px; padding:4px; border:1px solid var(--soft-line); border-radius:13px; background:var(--surface); box-shadow:var(--shadow-soft); }
.product-view-toggle button { width:38px; height:34px; padding:8px; display:grid; place-items:center; border:0; border-radius:9px; color:var(--muted); background:transparent; cursor:pointer; transition:color .18s ease,background .18s ease,transform .18s ease; }
.product-view-toggle button:hover { transform:translateY(-1px); }
.product-view-toggle button[aria-pressed="true"] { color:#fff; background:var(--accent); }
.product-view-toggle svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linejoin:round; }
.popular-products-head { margin-top:34px; }
.popular-products-head>div:first-child { display:grid; gap:5px; }
.popular-products-head p { margin:0; color:var(--accent); font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.popular-product-grid>[data-progressive-product], [data-progressive-grid]>[data-progressive-product] { min-width:0; animation:product-reveal .42s both; animation-delay:calc(var(--reveal-order,0) * 45ms); }
.popular-product-grid>[data-progressive-product]>.product-card { height:100%; }
[data-progressive-product][hidden] { display:none!important; }
@keyframes product-reveal { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
.product-load-sentinel { grid-column:1/-1; min-height:64px; display:grid; place-items:center; }
.product-load-sentinel i { width:24px; height:24px; border:2px solid color-mix(in srgb,var(--accent) 18%,transparent); border-top-color:var(--accent); border-radius:50%; animation:product-loader .8s linear infinite; }
@keyframes product-loader { to { transform:rotate(1turn); } }
.catalog-top { justify-content:space-between; align-items:center; }
.catalog-applied-filter{display:block;margin-top:5px;color:var(--muted);font-size:12px}.catalog-applied-filter b{color:var(--text)}
.price-range-filter{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px}.price-range-filter>input{grid-column:1/-1;width:100%}.price-range-filter>strong{white-space:nowrap}.price-range-bounds{grid-column:1/-1;display:flex;justify-content:space-between;color:var(--muted);font-size:11px}.price-range-filter input:disabled{opacity:.45}
.catalog-top>div:first-child { display:flex; align-items:baseline; gap:8px; }

.card-gallery-link { position:absolute; inset:0; display:block; overflow:hidden; }
.product-media .card-gallery-track { position:relative; inset:auto; width:100%; height:100%; padding:0; display:flex; border-radius:0; background:transparent; backdrop-filter:none; transition:transform .38s cubic-bezier(.22,.72,.22,1); will-change:transform; touch-action:pan-y; }
.card-gallery-track img { flex:0 0 100%; min-width:100%; max-width:none; }
.product-media .card-gallery-link>em { position:absolute; left:12px; top:12px; z-index:2; padding:5px 9px; border-radius:999px; color:var(--text); background:color-mix(in srgb,var(--bg) 82%,transparent); font-size:12px; font-style:normal; }
.product-media .card-gallery-link>em:empty { display:none; }
.card-gallery-dots { z-index:4; }

.product-gallery-stage { position:relative; aspect-ratio:1; overflow:hidden; border:1px solid var(--soft-line); border-radius:var(--radius); background:var(--panel); box-shadow:var(--shadow-soft); touch-action:pan-y; }
.product-gallery-track { width:100%; height:100%; display:flex; transition:transform .42s cubic-bezier(.22,.72,.22,1); will-change:transform; }
.product-gallery-track img { flex:0 0 100%; width:100%; min-width:100%; height:100%; object-fit:cover; transition:filter .3s ease,opacity .3s ease; }
.product-gallery-track img.is-original { animation:productImageResolve .35s ease both; }
@keyframes productImageResolve { from { opacity:.78;filter:blur(2px) } to { opacity:1;filter:none } }
.product-image-loader { position:absolute;left:50%;top:50%;z-index:2;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--surface-elevated) 82%,transparent);box-shadow:var(--shadow-soft);opacity:0;pointer-events:none;transform:translate(-50%,-50%) scale(.82);transition:opacity .2s ease,transform .2s ease;backdrop-filter:blur(10px) }
.product-image-loader i { width:20px;height:20px;border:2px solid color-mix(in srgb,var(--accent) 20%,transparent);border-top-color:var(--accent);border-radius:50%;animation:product-loader .75s linear infinite }
.product-gallery-stage.is-image-loading .product-image-loader { opacity:1;transform:translate(-50%,-50%) scale(1) }
.product-gallery-arrow { position:absolute; top:50%; z-index:3; width:44px; height:44px; display:grid; place-items:center; border:1px solid color-mix(in srgb,var(--text) 10%,transparent); border-radius:50%; color:var(--text); background:color-mix(in srgb,var(--surface-elevated) 84%,transparent); box-shadow:var(--shadow-soft); backdrop-filter:blur(12px); cursor:pointer; opacity:.9; transform:translateY(-50%); transition:opacity .18s ease,transform .18s ease; }
.product-gallery-arrow:hover { opacity:1; transform:translateY(-50%) scale(1.05); }
.product-gallery-arrow.is-prev { left:16px; }
.product-gallery-arrow.is-next { right:16px; }
.thumb-row { padding:5px;grid-template-columns:repeat(auto-fit,minmax(68px,92px)); }
.thumb-row button { opacity:.62; cursor:pointer; transition:opacity .18s ease,border-color .18s ease,transform .18s ease; }
.thumb-row button.is-active { opacity:1; border-color:var(--accent); transform:translateY(-2px); }
.thumb-row img { width:100%; aspect-ratio:1; object-fit:cover; }

/* Full-screen mobile navigation and catalog filter drawer. */
@media (max-width: 980px) {
    .checkout-summary { order: -1; }
    .mobile-site-menu { inset:0 auto 0 0; height:100dvh; padding:max(18px,env(safe-area-inset-top)) 18px max(22px,env(safe-area-inset-bottom)); border-radius:0; overflow-y:auto; }
    .mobile-site-menu-scrim { inset:0; }
    .mobile-site-menu>header { min-height:48px; }
    .mobile-menu-levels { position:relative; flex:0 0 auto; min-height:280px; overflow:visible; }
    .mobile-menu-level { display:grid; align-content:start; margin-top:10px; animation:mobile-level-in .24s cubic-bezier(.22,.72,.22,1); }
    .mobile-menu-level[hidden] { display:none; }
    @keyframes mobile-level-in { from { opacity:0; transform:translateX(18px); } to { opacity:1; transform:none; } }
    .mobile-menu-level>a,.mobile-menu-level>button { width:100%; min-height:70px; padding:12px 5px; display:grid; grid-template-columns:56px minmax(0,1fr) auto; align-content:center; align-items:center; column-gap:10px; border:0; border-bottom:1px solid var(--line); color:var(--text); background:transparent; text-align:left; cursor:pointer; }
    .mobile-menu-level>a>span,.mobile-menu-level>button>span { grid-row:1/3; align-self:center; color:var(--accent); font-size:10px; font-weight:850; text-transform:uppercase; }
    .mobile-menu-level strong { overflow:hidden; font-size:17px; letter-spacing:-.02em; text-overflow:ellipsis; white-space:nowrap; }
    .mobile-menu-level small { overflow:hidden; color:var(--muted); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
    .mobile-menu-level b { grid-column:3; grid-row:1/3; color:var(--muted); font-size:18px; }
    .mobile-menu-level>.mobile-menu-back { min-height:48px; grid-template-columns:24px 1fr; border-bottom:0; border-radius:13px; background:var(--panel); }
    .mobile-menu-level>.mobile-menu-back span { grid-row:auto; font-size:18px; }
    .mobile-menu-level>.mobile-menu-back strong { font-size:13px; }

    .catalog-layout { position:relative; }
    .catalog-layout>.filters { position:fixed; inset:0 auto 0 0; z-index:76; width:min(88vw,390px); height:100dvh; padding:max(18px,env(safe-area-inset-top)) 18px max(24px,env(safe-area-inset-bottom)); overflow-y:auto; border:0; border-radius:0 22px 22px 0; box-shadow:24px 0 80px rgba(16,22,18,.2); transform:translateX(-104%); transition:transform .3s cubic-bezier(.22,.8,.24,1); }
    .filter-drawer-open .catalog-layout>.filters { transform:none; }
    .filter-drawer-head { display:flex; align-items:center; justify-content:space-between; gap:16px; }
    .filter-drawer-head button { width:40px; height:40px; display:grid; place-items:center; border:0; border-radius:50%; background:var(--panel-strong); font-size:25px; cursor:pointer; }
    .filter-drawer-scrim { position:fixed; inset:0; z-index:74; display:block; border:0; background:var(--scrim); opacity:0; pointer-events:none; transition:opacity .28s ease; backdrop-filter:blur(3px); }
    .filter-drawer-open .filter-drawer-scrim { opacity:1; pointer-events:auto; }
    body.filter-drawer-open { overflow:hidden; }
    .mobile-filter-button { position:fixed; left:50%; bottom:calc(82px + env(safe-area-inset-bottom)); z-index:52; min-height:48px; max-width:calc(100vw - 28px); padding:6px 10px 6px 14px; display:flex; align-items:center; gap:8px; border:1px solid color-mix(in srgb,var(--accent) 22%,var(--soft-line)); border-radius:999px; color:#fff; background:color-mix(in srgb,var(--accent) 94%,#fff); box-shadow:0 16px 42px rgba(15,30,25,.24); transform:translateX(-50%); cursor:pointer; }
    .mobile-filter-button svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; }
    .mobile-filter-button span { font-size:12px; font-weight:850; }
    .mobile-filter-button b { max-width:145px; padding:7px 10px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.14); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
}

.mobile-floating-actions { display:contents; }
.mobile-filter-button,.filter-drawer-scrim,.filter-drawer-head button { display:none; }
.filter-drawer-head>div>p { margin:0; }
.filter-apply-button { display:none; }
@media (max-width:980px) {
    .mobile-filter-button { display:flex; }
    .filter-drawer-scrim { display:block; }
    .filter-drawer-head button { display:grid; }
    .filter-apply-button { position:sticky; bottom:0; width:100%; min-height:48px; display:block; border:0; border-radius:13px; color:#fff; background:var(--accent); font-weight:850; box-shadow:0 12px 30px rgba(15,30,25,.2); cursor:pointer; }
}

@media (max-width: 680px) {
    .product-view-toggle { display:flex; }
    .store-slider { min-height:clamp(420px,64svh,540px); }
    .store-slide-copy { padding:78px 18px 76px; }
    .store-slide-copy h1 { font-size:clamp(34px,10.5vw,48px); }
    .store-slide-copy p { display:-webkit-box; overflow:hidden; -webkit-line-clamp:2; -webkit-box-orient:vertical; font-size:14px; }
    .store-slider-controls { bottom:14px; }

    .section-head.popular-products-head { width:calc(100% - 24px); margin-top:26px; align-items:center; flex-direction:row; }
    .popular-products-head h2 { font-size:30px; }
    .product-view-toggle { flex:0 0 auto; }
    .product-grid[data-product-view="compact"] { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; width:calc(100% - 20px); }
    .product-grid[data-product-view="large"] { grid-template-columns:1fr; }
    .product-grid[data-product-view="compact"] .product-card { gap:8px; padding:6px; border-radius:15px; }
    .product-grid[data-product-view="compact"] .product-media { border-radius:12px; }
    .product-grid[data-product-view="compact"] .product-info { display:grid; gap:5px; padding:0 3px; }
    .product-grid[data-product-view="compact"] .product-info h3 { display:-webkit-box; overflow:hidden; min-height:32px; font-size:13px; line-height:1.25; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
    .product-grid[data-product-view="compact"] .product-info p,.product-grid[data-product-view="compact"] .product-device-summary { display:none; }
    .product-grid[data-product-view="compact"] .card-price { justify-items:start; }
    .product-grid[data-product-view="compact"] .card-price strong { font-size:13px; }
    .product-grid[data-product-view="compact"] .card-price del { font-size:9px; }
    .product-grid[data-product-view="compact"] .card-buy { min-height:38px; margin:0; padding:0 8px; border-radius:10px; font-size:11px; }
    .product-grid[data-product-view="compact"] .product-media .card-gallery-link>em { left:7px; top:7px; max-width:calc(100% - 14px); padding:3px 6px; overflow:hidden; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
    .product-grid[data-product-view="compact"] .card-gallery-dots { bottom:6px; gap:4px; padding:4px; }
    .product-grid[data-product-view="compact"] .card-gallery-dots button { width:5px; height:5px; }
    .catalog-top { align-items:center; }
    .catalog-top>div:first-child { display:block; }
    .catalog-top p { margin:0; font-size:11px; }

    .product-gallery-arrow { display:none; }
    .product-gallery-stage { border-radius:18px; }
    .thumb-row { display:flex; overflow-x:auto; scrollbar-width:none; }
    .thumb-row::-webkit-scrollbar { display:none; }
    .thumb-row button { flex:0 0 66px; }

    .mobile-floating-actions { position:fixed; left:10px; right:10px; bottom:calc(76px + env(safe-area-inset-bottom)); z-index:49; display:flex; flex-direction:column; align-items:flex-end; gap:8px; pointer-events:none; }
    .mobile-floating-actions>* { pointer-events:auto; }
    .mobile-floating-actions .support-chat-button { position:relative; right:auto; bottom:auto; margin:0; padding:7px; }
    .mobile-floating-actions .sticky-cta { position:static; width:100%; display:grid; margin:0; }
    .support-chat-button { right:14px; bottom:calc(82px + env(safe-area-inset-bottom)); }
    .site-header .cart-button { display:none; }
}


@media (min-width: 981px){
    .checkout-summary {
        position: sticky;
        top: 97px;
    }
}

@media (orientation:landscape) and (max-height:600px) and (pointer:coarse){
    .store-slider{width:calc(100% - 20px);min-height:max(360px,calc(100dvh - 12px));height:auto;overflow:hidden}
    .store-slider-track,.store-slide{min-height:inherit}
    .store-slide-copy{align-self:center;max-height:none;padding:48px 92px 48px 24px;overflow:visible}
    .store-slide-copy h1{font-size:clamp(30px,7vw,48px);margin-bottom:10px}
    .store-slide-copy p{margin-bottom:16px;font-size:14px}
    .store-slider-controls{right:14px;bottom:14px}
}

/* Catalog collections: visual taxonomy above products, without a left column. */
.catalog-page{width:min(1320px,calc(100% - 36px));margin:34px auto 96px}.catalog-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:24px}.catalog-heading p,.catalog-section-picker p{margin:0 0 6px;color:var(--accent);font-size:11px;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.catalog-heading h1{margin:0;font-size:clamp(42px,6vw,76px);line-height:.95;letter-spacing:-.06em}.catalog-heading span{display:block;margin-top:12px;color:var(--muted)}
.catalog-category-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}.catalog-category-tile{display:grid;min-width:0;gap:8px}.catalog-category-media{position:relative;display:grid;place-items:center;overflow:hidden;aspect-ratio:1;border:2px solid transparent;border-radius:20px;background:linear-gradient(145deg,var(--panel),var(--panel-strong));box-shadow:var(--shadow-soft);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.catalog-category-media img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}.catalog-category-media>b{font-size:clamp(34px,5vw,70px);font-weight:850;opacity:.24}.catalog-category-media.is-all svg{width:34%;fill:none;stroke:currentColor;stroke-width:1.5;opacity:.66}.catalog-category-media>i{position:absolute;top:10px;right:10px;display:grid;width:25px;height:25px;place-items:center;border-radius:50%;color:#fff;background:var(--accent);font-size:13px;font-style:normal;opacity:0;transform:scale(.65);transition:opacity .18s,transform .18s}.catalog-category-tile>small{padding:0 3px;color:var(--muted);font-size:12px;font-weight:750;line-height:1.35}.catalog-category-tile:hover .catalog-category-media{transform:translateY(-2px);box-shadow:var(--shadow)}.catalog-category-tile:hover img{transform:scale(1.025)}.catalog-category-tile.is-active .catalog-category-media{border-color:var(--accent);box-shadow:0 8px 26px color-mix(in srgb,var(--accent) 18%,transparent)}.catalog-category-tile.is-active .catalog-category-media>i{opacity:1;transform:scale(1)}.catalog-category-tile.is-active>small{color:var(--text)}
.catalog-section-tiles{margin-top:8px}.catalog-section-tiles>header{margin:0 0 16px}.catalog-section-tiles>header p{margin:0 0 4px;color:var(--accent);font-size:11px;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.catalog-section-tiles>header h2{margin:0;font-size:clamp(28px,4vw,44px);letter-spacing:-.045em}.catalog-empty-level{padding:22px;border:1px dashed var(--line);border-radius:18px;color:var(--muted);background:var(--panel)}
.catalog-section-picker{margin:24px 0 4px;padding:16px 18px;display:flex;align-items:center;gap:22px;border:1px solid var(--line);border-radius:18px;background:var(--panel)}.catalog-section-picker[hidden]{display:none!important}.catalog-section-picker>div{flex:0 0 auto}.catalog-section-picker>div p{margin-bottom:1px}.catalog-section-picker>div strong{font-size:15px}.catalog-section-picker nav{display:flex;min-width:0;gap:8px;overflow-x:auto;scrollbar-width:none}.catalog-section-picker nav::-webkit-scrollbar{display:none}.catalog-section-picker nav a{flex:0 0 auto;padding:9px 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--muted);font-size:12px;font-weight:750}.catalog-section-picker nav a[hidden]{display:none}.catalog-section-picker nav a.is-active{border-color:var(--accent);color:#fff;background:var(--accent)}
.catalog-results-head{margin:34px 0 14px;display:flex;align-items:center;justify-content:space-between;gap:16px}.catalog-results-head>div:first-child{display:grid;grid-template-columns:auto auto;align-items:baseline;column-gap:7px}.catalog-results-head span{font-size:28px;font-weight:850}.catalog-results-head p{margin:0;color:var(--muted)}.catalog-results-head .catalog-applied-filter{grid-column:1/-1}.catalog-result-actions{display:flex;align-items:center;gap:10px}.catalog-filter-toggle{display:none;min-height:42px;padding:0 14px;align-items:center;gap:7px;border:1px solid var(--line);border-radius:12px;background:var(--surface);font-weight:750;cursor:pointer}.catalog-filter-toggle svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.catalog-filter-panel{position:static;grid-template-columns:repeat(4,minmax(0,1fr)) auto;align-items:end;margin:0 0 20px;padding:15px 16px;border-radius:18px}.catalog-filter-panel .filter-drawer-head{grid-column:1/-1}.catalog-filter-panel .filter-drawer-head h2{margin:0;font-size:20px}.catalog-filter-panel .color-filters{min-height:44px;align-items:center}.catalog-page>.catalog-grid{width:100%;margin:0;grid-template-columns:repeat(4,minmax(0,1fr))}.catalog-page>.filter-drawer-scrim{display:none}
body:has([data-catalog-page]) .mobile-tabbar [data-catalog-tab]{color:var(--accent);font-weight:800}

@media(max-width:980px){.catalog-category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.catalog-page>.catalog-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.catalog-filter-toggle{display:flex}.catalog-page>.catalog-filter-panel{position:fixed;inset:0 auto 0 0;z-index:76;width:min(88vw,390px);height:100dvh;margin:0;padding:max(18px,env(safe-area-inset-top)) 18px max(24px,env(safe-area-inset-bottom));display:grid;grid-template-columns:1fr;align-content:start;overflow-y:auto;border:0;border-radius:0 22px 22px 0;box-shadow:24px 0 80px rgba(16,22,18,.2);transform:translateX(-104%);transition:transform .3s cubic-bezier(.22,.8,.24,1)}.filter-drawer-open .catalog-page>.catalog-filter-panel{transform:none}.catalog-page>.filter-drawer-scrim{position:fixed;inset:0;z-index:74;display:block;border:0;background:var(--scrim);opacity:0;pointer-events:none;transition:opacity .28s ease;backdrop-filter:blur(3px)}.filter-drawer-open .catalog-page>.filter-drawer-scrim{opacity:1;pointer-events:auto}.catalog-filter-panel .filter-drawer-head{display:flex}.catalog-filter-panel .filter-drawer-head button{display:grid}.catalog-filter-panel .filter-apply-button{display:block}.site-header{grid-template-columns:auto minmax(0,1fr)}}
@media(max-width:680px){.catalog-page{width:calc(100% - 20px);margin-top:20px}.catalog-heading{margin-bottom:18px}.catalog-heading h1{font-size:44px}.catalog-heading span{font-size:13px}.catalog-category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.catalog-category-media{border-radius:16px}.catalog-category-tile{gap:6px}.catalog-category-tile>small{font-size:11px}.catalog-section-picker{margin-top:18px;padding:13px;align-items:flex-start;flex-direction:column;gap:10px}.catalog-section-picker nav{width:100%}.catalog-results-head{margin-top:25px}.catalog-results-head span{font-size:24px}.catalog-result-actions{gap:7px}.catalog-filter-toggle{min-height:40px;padding:0 11px}.catalog-filter-toggle span{display:none}.catalog-page>.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}

/* iOS 26-inspired mobile controls: glass belongs to the control layer, fields stay legible. */
@media (max-width:980px) and (pointer:coarse) {
    html { scroll-behavior:auto; }
    :root {
        --mobile-field-height:52px;
        --mobile-field-radius:16px;
        --mobile-field-fill:color-mix(in srgb,var(--surface-elevated) 96%,var(--bg));
        --mobile-field-fill-focus:var(--surface-elevated);
        --mobile-field-border:color-mix(in srgb,var(--text) 18%,transparent);
        --mobile-field-focus:color-mix(in srgb,var(--accent) 62%,var(--text));
        --mobile-field-ring:color-mix(in srgb,var(--accent) 16%,transparent);
        --mobile-field-placeholder:color-mix(in srgb,var(--muted) 76%,transparent);
        --mobile-field-error:#b83f3f;
        --mobile-glass-sheet:color-mix(in srgb,var(--surface-elevated) 84%,transparent);
        --mobile-field-shadow:0 4px 14px rgba(16,24,20,.04),inset 0 1px 0 rgba(255,255,255,.7);
    }
    [data-theme="dark"] {
        --mobile-field-fill:color-mix(in srgb,var(--surface-elevated) 79%,transparent);
        --mobile-field-fill-focus:color-mix(in srgb,var(--surface-elevated) 92%,transparent);
        --mobile-field-border:rgba(235,239,232,.17);
        --mobile-field-focus:#9fc5b3;
        --mobile-field-ring:rgba(159,197,179,.18);
        --mobile-field-placeholder:rgba(220,225,218,.48);
        --mobile-field-error:#ff8c86;
        --mobile-field-shadow:0 10px 28px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.07);
    }
    :where(#main,.search-panel,.support-chat,.catalog-filter-panel) :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]),select,textarea) {
        min-height:var(--mobile-field-height);
        padding-inline:15px;
        border:1px solid var(--mobile-field-border);
        border-radius:var(--mobile-field-radius);
        outline:0;
        color:var(--text);
        background:var(--mobile-field-fill);
        box-shadow:var(--mobile-field-shadow);
        caret-color:var(--accent);
        scroll-margin-block:20px;
        -webkit-tap-highlight-color:transparent;
        transition:border-color .17s ease,box-shadow .17s ease,background-color .17s ease;
    }
    :where(#main,.search-panel,.support-chat,.catalog-filter-panel) textarea { min-height:56px; max-height:136px; padding-block:14px; line-height:1.42; resize:vertical; }
    :where(#main,.search-panel,.support-chat,.catalog-filter-panel) :where(input,textarea)::placeholder { color:var(--mobile-field-placeholder); opacity:1; }
    :where(#main,.search-panel,.support-chat,.catalog-filter-panel) :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]),select,textarea):focus {
        border-color:var(--mobile-field-focus);
        background:var(--mobile-field-fill-focus);
        box-shadow:0 0 0 3px var(--mobile-field-ring),0 8px 24px rgba(16,24,20,.07),inset 0 1px 0 rgba(255,255,255,.72);
    }
    :where(#main,.search-panel,.support-chat,.catalog-filter-panel) :where(input,textarea,select):is(:user-invalid,[aria-invalid="true"]) { border-color:var(--mobile-field-error); box-shadow:0 0 0 4px color-mix(in srgb,var(--mobile-field-error) 14%,transparent); }
    :where(#main,.search-panel,.support-chat,.catalog-filter-panel) :where(input,textarea,select):disabled { border-color:var(--soft-line); color:var(--muted); background:color-mix(in srgb,var(--surface-muted) 90%,transparent); box-shadow:none; opacity:1; -webkit-text-fill-color:var(--muted); cursor:not-allowed; }
    :where(#main,.search-panel,.support-chat,.catalog-filter-panel) :where(input,textarea):-webkit-autofill { -webkit-text-fill-color:var(--text); box-shadow:0 0 0 1000px var(--surface-elevated) inset,0 0 0 4px var(--mobile-field-ring); }
    #main form label,.catalog-filter-panel label { gap:7px; color:var(--muted); font-size:12px; font-weight:720; }
    #main form label:has(:focus),.catalog-filter-panel label:has(:focus) { color:var(--text); }
    #main form label:has(:is(:user-invalid,[aria-invalid="true"])),.catalog-filter-panel label:has(:is(:user-invalid,[aria-invalid="true"])) { color:var(--mobile-field-error); }
    #main form label>small,.catalog-filter-panel label>small { margin-inline:2px; font-size:11px; line-height:1.4; }
    :where(.checkout-form,.contact-form,.account-form) { gap:16px; }

    .ua-phone-field,.account-form .ua-phone-field {
        min-height:var(--mobile-field-height);
        overflow:hidden;
        border:1px solid var(--mobile-field-border);
        border-radius:var(--mobile-field-radius);
        background:var(--mobile-field-fill);
        box-shadow:var(--mobile-field-shadow);
        transition:border-color .17s ease,box-shadow .17s ease,background-color .17s ease;
    }
    .ua-phone-field>span { padding-inline:14px; border-right-color:var(--mobile-field-border); background:color-mix(in srgb,var(--panel) 54%,transparent); }
    #main .ua-phone-field>input,.account-form .ua-phone-field>input { min-height:50px; border:0; border-radius:0; outline:0; background:transparent; box-shadow:none; }
    .ua-phone-field:focus-within,.account-form .ua-phone-field:focus-within { border-color:var(--mobile-field-focus); background:var(--mobile-field-fill-focus); box-shadow:0 0 0 4px var(--mobile-field-ring),0 12px 32px rgba(16,24,20,.09),inset 0 1px 0 rgba(255,255,255,.68); }

    .search-panel,.catalog-page>.catalog-filter-panel,.support-chat form {
        background:var(--mobile-glass-sheet);
        -webkit-backdrop-filter:blur(24px) saturate(150%);
        backdrop-filter:blur(24px) saturate(150%);
    }
    .np-suggestions { border-color:var(--mobile-field-border); border-radius:18px; background:color-mix(in srgb,var(--surface-elevated) 94%,transparent); box-shadow:0 20px 55px rgba(16,24,20,.16); -webkit-backdrop-filter:blur(20px) saturate(140%); backdrop-filter:blur(20px) saturate(140%); }
    .np-suggestions button { min-height:48px; border-radius:12px; }
    .support-chat { background:color-mix(in srgb,var(--bg) 92%,transparent); }
    .support-chat header { min-height:66px; border-bottom:1px solid rgba(255,255,255,.14); background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 91%,#fff),var(--accent)); box-shadow:0 10px 30px rgba(15,30,25,.12); }
    .support-chat header button { width:44px; height:44px; display:grid; place-items:center; border-radius:50%; }
    .support-chat-messages { scroll-padding-block:18px; background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 68%,transparent),color-mix(in srgb,var(--bg) 92%,transparent)); }
    .support-chat form { gap:10px; padding:12px 12px max(12px,env(safe-area-inset-bottom)); border-top:1px solid var(--mobile-field-border); box-shadow:0 -15px 42px rgba(15,25,22,.09); }
    .support-chat textarea { min-height:54px; max-height:126px; border-radius:18px; }
    .support-chat form>div:last-child>button { min-width:104px; min-height:46px; padding-inline:19px; border-radius:999px; box-shadow:0 9px 24px color-mix(in srgb,var(--accent) 24%,transparent),inset 0 1px 0 rgba(255,255,255,.2); }
    .support-message { border:1px solid color-mix(in srgb,var(--text) 6%,transparent); border-radius:18px 18px 18px 6px; box-shadow:0 8px 24px rgba(16,24,20,.055); }
    .support-message.is-guest { border-color:transparent; border-radius:18px 18px 6px 18px; }

    #main input[type="range"] { min-height:32px; padding:0; border:0; background:transparent; box-shadow:none; accent-color:var(--accent); }
    #main input[type="range"]::-webkit-slider-runnable-track { height:6px; border-radius:999px; background:color-mix(in srgb,var(--accent) 20%,var(--panel-strong)); }
    #main input[type="range"]::-webkit-slider-thumb { width:28px; height:28px; margin-top:-11px; border:1px solid var(--mobile-field-border); border-radius:50%; background:var(--surface-elevated); box-shadow:0 5px 16px rgba(16,24,20,.16); -webkit-appearance:none; }
    #main :where(input[type="checkbox"],input[type="radio"]) { accent-color:var(--accent); }
}

@media (max-width:980px) and (pointer:coarse) and (prefers-reduced-transparency:reduce) {
    :root { --mobile-field-fill:var(--surface-elevated); --mobile-field-fill-focus:var(--surface-elevated); --mobile-glass-sheet:var(--surface-elevated); }
    .search-panel,.catalog-page>.catalog-filter-panel,.support-chat form,.np-suggestions { -webkit-backdrop-filter:none; backdrop-filter:none; }
}
@media (max-width:980px) and (pointer:coarse) and (prefers-contrast:more) {
    :root { --mobile-field-border:color-mix(in srgb,var(--text) 32%,transparent); --mobile-field-ring:color-mix(in srgb,var(--accent) 30%,transparent); }
}
@media (max-width:980px) and (pointer:coarse) and (prefers-reduced-motion:reduce) {
    :where(#main,.search-panel,.support-chat,.catalog-filter-panel) :where(input,select,textarea),.ua-phone-field { transition:none!important; scroll-behavior:auto!important; }
}

.custom-content-page{width:min(880px,100%);margin:0 auto;padding:clamp(24px,5vw,68px) 20px 90px}.custom-content-page>header{padding-bottom:clamp(20px,4vw,36px);border-bottom:1px solid var(--soft-line)}.custom-content-page>header p{margin:0 0 8px;color:var(--accent);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.custom-content-page h1{margin:0;font-size:clamp(34px,6vw,64px);line-height:1.05}.custom-content-body{padding-top:clamp(24px,4vw,42px);color:var(--text);font-size:clamp(16px,2vw,18px);line-height:1.75}.custom-content-body h2,.custom-content-body h3,.custom-content-body h4{margin:1.8em 0 .55em;line-height:1.2}.custom-content-body p{margin:0 0 1.25em}.custom-content-body ul{display:grid;gap:8px;margin:0 0 1.4em;padding-left:1.4em}.privacy-consent a{color:var(--accent);font-weight:700;text-underline-offset:2px}
.custom-content-body ol{display:grid;gap:8px;margin:0 0 1.4em;padding-left:1.4em}.custom-content-body blockquote{margin:1.6em 0;padding:18px 22px;border-left:4px solid var(--accent);border-radius:0 16px 16px 0;background:color-mix(in srgb,var(--accent) 8%,var(--panel));font-size:1.08em}.custom-content-body hr{margin:2.2em 0;border:0;border-top:1px solid var(--soft-line)}.custom-content-body .content-button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;margin:8px 8px 8px 0;padding:11px 20px;border-radius:999px;background:var(--accent);color:#fff;font-size:14px;font-weight:800;line-height:1.2;text-decoration:none;box-shadow:0 10px 26px color-mix(in srgb,var(--accent) 25%,transparent);transition:transform .2s ease,box-shadow .2s ease}.custom-content-body .content-button:hover{transform:translateY(-2px);box-shadow:0 14px 32px color-mix(in srgb,var(--accent) 34%,transparent)}.custom-content-body .content-button-secondary{border:1px solid var(--soft-line);background:var(--panel);color:var(--text);box-shadow:none}.custom-content-body .content-lead{font-size:1.25em;line-height:1.6}.custom-content-body .content-effect-highlight{padding:2px 6px;border-radius:6px;background:linear-gradient(transparent 20%,#ffe899 20%,#ffe899 88%,transparent 88%)}.custom-content-body .content-effect-gradient{background:linear-gradient(90deg,var(--accent),#7c5cff);background-clip:text;-webkit-background-clip:text;color:transparent;font-weight:850}.custom-content-body .content-effect-fade{display:inline-block;animation:contentFadeUp .75s ease both}.custom-content-body .content-align-center{display:block;text-align:center}.custom-content-body .content-align-right{display:block;text-align:right}@keyframes contentFadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.custom-content-body .content-effect-fade{animation:none}}

/* Focused storefront and order completion */
.store-slide>picture{position:absolute;inset:0;z-index:-2}.store-slide>picture img{display:block;width:100%;height:100%;object-fit:cover}.store-slide-copy{position:relative;z-index:1}.promo-code-form{display:grid;gap:6px;margin:0 0 14px}.promo-code-form label{font-size:12px;font-weight:700}.promo-code-form>div{display:flex;gap:7px}.promo-code-form input{min-width:0;width:100%;padding:10px;border:1px solid var(--soft-line);border-radius:10px;background:var(--panel)}.promo-code-form .btn{padding:0 12px;white-space:nowrap}.promo-code-form small{min-height:15px;color:var(--muted)}.promo-code-form small.is-error{color:#d94742}.promo-code-form small.is-success{color:#27804b}
.home-product-section,.home-category-section{display:grid;gap:18px;margin-block:clamp(38px,6vw,82px)}.section-head>a{align-self:end;color:var(--text);font-size:13px;font-weight:750;text-decoration:none}.home-category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.home-category-grid a{display:grid;overflow:hidden;aspect-ratio:1;border-radius:20px;background:var(--panel);color:var(--text);text-decoration:none}.home-category-grid img,.home-category-grid>a>span{width:100%;height:100%;min-height:0;object-fit:cover}.home-category-grid>a>span{display:grid;place-items:center;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 18%,var(--panel)),var(--panel));font-size:44px;font-weight:800}.home-category-grid small{margin-top:-38px;z-index:1;padding:18px 12px 10px;background:linear-gradient(transparent,rgba(0,0,0,.64));color:#fff;font-weight:750}
.site-footer{grid-template-columns:minmax(220px,1.25fr) repeat(4,minmax(120px,.75fr));gap:30px}.footer-brand{display:grid;align-content:start;gap:13px}.footer-brand p{max-width:330px;margin:0;color:var(--muted);line-height:1.55}.footer-column{display:grid;align-content:start;gap:9px}.footer-column>strong{margin-bottom:4px;font-size:12px}.footer-column a,.footer-column span{color:var(--muted);font-size:12px;text-decoration:none}.footer-column a:hover{color:var(--text)}.footer-column span{display:grid;gap:2px}.footer-column small{color:var(--text)}.footer-column em{color:var(--accent);font-size:11px}.footer-bottom{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding-top:20px;border-top:1px solid var(--soft-line)}
.order-success-page{display:grid;gap:26px;max-width:1180px;margin:0 auto;padding:clamp(18px,4vw,52px) 0 80px}.order-success-hero{display:flex;align-items:center;gap:18px;padding:clamp(20px,4vw,38px);border-radius:28px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 13%,var(--panel)),var(--panel))}.order-success-hero>span{display:grid;width:64px;height:64px;flex:0 0 auto;place-items:center;border-radius:50%;background:var(--accent);color:#fff;font-size:30px}.order-success-hero p,.order-success-hero h1{margin:0}.order-success-hero p{color:var(--muted);font-size:12px}.order-success-hero h1{margin:3px 0 8px;font-size:clamp(28px,5vw,54px)}.order-success-hero div{display:grid}.order-success-hero small{color:var(--muted)}.order-success-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(290px,.75fr);gap:16px}.order-success-card{padding:22px;border-radius:22px;background:var(--panel)}.order-success-card>header{display:flex;align-items:center;justify-content:space-between}.order-success-card h2{margin:0}.order-success-items{display:grid;margin-top:16px}.order-success-items article{display:grid;grid-template-columns:74px minmax(0,1fr) auto;align-items:center;gap:13px;padding:12px 0;border-top:1px solid var(--soft-line)}.order-success-items img{width:74px;height:74px;object-fit:cover;border-radius:14px}.order-success-items article>div{display:grid;gap:3px}.order-success-items span,.order-success-items small{color:var(--muted);font-size:11px}.order-success-total{display:flex;justify-content:space-between;padding-top:12px;border-top:1px solid var(--soft-line)}.order-success-total.is-final{margin-top:10px;font-size:20px}.order-delivery-card dl{display:grid;gap:13px}.order-delivery-card dl div{display:grid;grid-template-columns:90px 1fr;gap:10px}.order-delivery-card dt{color:var(--muted);font-size:11px}.order-delivery-card dd{display:grid;margin:0;font-weight:700}.order-delivery-card dd small{margin-top:3px;color:var(--muted);font-weight:400}.order-success-actions{display:grid;gap:8px;margin-top:20px}.success-recommendations{min-width:0}.success-product-rail{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media(max-width:980px){.site-footer{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-brand,.footer-bottom{grid-column:1/-1}.home-category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.order-success-layout{grid-template-columns:1fr}.success-product-rail{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-16px;padding-inline:16px}.success-product-rail>div{flex:0 0 min(72vw,300px);scroll-snap-align:start}}
@media(max-width:600px){.home-category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.site-footer{grid-template-columns:1fr;gap:22px}.footer-brand,.footer-bottom{grid-column:1}.footer-bottom{align-items:flex-start;flex-direction:column}.order-success-page{padding-top:10px}.order-success-hero{align-items:flex-start;border-radius:20px}.order-success-hero>span{width:48px;height:48px}.order-success-items article{grid-template-columns:58px minmax(0,1fr)}.order-success-items img{width:58px;height:58px}.order-success-items article>b{grid-column:2}.order-success-card{padding:16px;border-radius:18px}}


#main > section > div.product-grid.catalog-grid > article.product-card.is-unavailable > div.product-media {
    opacity: 0.4;
}
