/* Header: gr-* classes sit outside the theme's float/background rules; the theme forces focus and wrapper padding with !important. */
.wrapper.wrapper--page { padding-top: 112px !important; }
html.gr-nav-open { overflow: hidden; }

.header.gr-header {
    --gr-bar-h: 72px;
    --gr-trust-h: 40px;
    --gr-red: #e12126;
    --gr-ease: cubic-bezier(.2, .7, .2, 1);
    --gr-font: "Rethink Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    background: #111111;
    color: #f2f2f2;
    font-family: var(--gr-font);
    transition: box-shadow 220ms var(--gr-ease);
}
.header.gr-header.is-compact { box-shadow: 0 8px 24px -12px rgba(0, 0, 0, .6); }

.header a:focus { color: inherit; text-decoration: none; }
.header a:focus-visible,
.header button:focus-visible,
.header summary:focus-visible { outline: 2px solid #ffffff !important; outline-offset: 2px; border-radius: 6px; }
.header .nav-link:focus-visible { outline-offset: -10px; }
.header .static-mega-menu-container a:focus-visible,
.header .static-mega-menu-container button:focus-visible { outline-color: var(--gr-red) !important; }

.gr-bar { position: relative; z-index: 2; background: #111111; }
.gr-bar__inner {
    box-sizing: border-box;
    max-width: 1280px;
    height: var(--gr-bar-h);
    margin: 0 auto;
    padding: 0 15px;
    display: grid;
    grid-template-columns: auto auto minmax(200px, 1fr) auto;
    grid-template-areas: "logo nav search cart";
    align-items: center;
    column-gap: 16px;
    transition: height 220ms var(--gr-ease);
}

.header .gr-icon-btn {
    display: inline-grid; place-items: center;
    width: 44px; height: 44px; margin: 0; padding: 0;
    border: 0; border-radius: 6px; background: transparent; color: #f2f2f2;
    cursor: pointer; transition: background-color 160ms ease;
}
.header .gr-icon-btn:hover { background: rgba(255, 255, 255, .08); }
.header .gr-bar__toggle { display: none; grid-area: toggle; }

.header .gr-logo { grid-area: logo; position: static; display: block; margin: 0 8px 0 0; line-height: 0; transform-origin: left center; transition: transform 220ms var(--gr-ease); }
.header .gr-logo img { display: block; width: 220px; height: auto; }

.header .gr-nav { grid-area: nav; display: block; height: 100%; max-width: none; margin: 0; }
.header .gr-nav .nav-list { display: flex; align-items: stretch; height: 100%; margin: 0; padding: 0; list-style: none; }
.header .gr-nav .nav-item { display: flex; position: relative; }
.header .nav-link {
    position: relative; box-sizing: border-box;
    display: inline-flex; align-items: center; gap: 6px;
    height: 100%; padding: 0 10px; border: 0; background: transparent; cursor: pointer;
    font-family: var(--gr-font); font-size: 15px; font-weight: 600; line-height: 1; letter-spacing: -.005em;
    text-transform: none; text-decoration: none; white-space: nowrap;
    color: #e6e6e6; opacity: 1;
    transition: color 160ms ease;
}
.header .nav-link::after {
    content: ""; position: absolute; left: 10px; right: 10px; bottom: 0; height: 3px;
    border-radius: 3px 3px 0 0; background: var(--gr-red);
    transform: scaleX(0); transition: transform 220ms var(--gr-ease);
}
.header .nav-link:hover,
.header .nav-link:focus,
.header .nav-item.active > .nav-link,
.header .nav-link[aria-current="page"] { color: #ffffff; opacity: 1; text-decoration: none; }
.header .nav-link:hover::after,
.header .nav-item.active > .nav-link::after,
.header .nav-link[aria-current="page"]::after { transform: scaleX(1); }
.header .nav-link .dropdown-arrow-svg { width: 12px; height: 12px; margin: 0; fill: currentColor; opacity: .55; transition: transform 220ms var(--gr-ease), opacity 160ms ease; }
.header .nav-item.active .dropdown-arrow-svg { transform: rotate(180deg); opacity: 1; }

.header form.gr-search { grid-area: search; position: relative; float: none; width: 100%; max-width: 560px; justify-self: center; margin: 0; }
.header form.gr-search input.gr-search__input {
    display: block; box-sizing: border-box; width: 100%; max-width: none; height: 44px; margin: 0;
    padding: 0 48px 0 16px;
    font-family: var(--gr-font); font-size: 15px; font-weight: 500; color: #f2f2f2;
    background: #1c1c1c; border: 1px solid #2e2e2e; border-radius: 6px; box-shadow: none;
    -webkit-appearance: none; appearance: none;
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}
.header form.gr-search input.gr-search__input::placeholder { color: #8c8c8c; opacity: 1; }
.header form.gr-search input.gr-search__input::-webkit-search-decoration,
.header form.gr-search input.gr-search__input::-webkit-search-cancel-button { -webkit-appearance: none; }
.header form.gr-search input.gr-search__input:hover { border-color: #3d3d3d; }
.header form.gr-search input.gr-search__input:focus { background: #ffffff; border-color: #ffffff; color: #111111; box-shadow: 0 0 0 3px rgba(225, 33, 38, .55); outline: none; }
.header form.gr-search input.gr-search__input:focus::placeholder { color: #737373; }
.header form.gr-search button.gr-search__btn {
    position: absolute; top: 2px; right: 2px;
    display: grid; place-items: center;
    width: 40px; height: 40px; margin: 0; padding: 0;
    background: transparent none; border: 0; border-radius: 4px;
    color: #a3a3a3; text-indent: 0; overflow: visible; cursor: pointer;
    transition: color 160ms ease;
}
.header form.gr-search button.gr-search__btn:hover { color: #ffffff; }
.header form.gr-search:focus-within button.gr-search__btn { color: #111111; }

.header .gr-tools {
    grid-area: cart; display: flex; align-items: center; gap: 2px;
}
.header .gr-compare-link,
.header .gr-cart {
    position: relative;
    display: grid; place-items: center; width: 44px; height: 44px;
    border-radius: 6px; color: #f2f2f2; text-decoration: none;
    transition: background-color 160ms ease, color 160ms ease;
}
.header .gr-compare-link:hover,
.header .gr-compare-link:focus,
.header .gr-cart:hover,
.header .gr-cart:focus { background: rgba(255, 255, 255, .08); color: #ffffff; }
.header .gr-compare-link svg,
.header .gr-cart svg { transition: transform 100ms ease; }
.header .gr-compare-link:active svg,
.header .gr-cart:active svg { transform: scale(.94); }
.header .gr-cart__badge {
    position: absolute; top: 3px; right: 1px;
    box-sizing: border-box; min-width: 18px; height: 18px; padding: 0 5px;
    border-radius: 9px; background: var(--gr-red); color: #ffffff;
    font: 700 11px/18px var(--gr-font); font-variant-numeric: tabular-nums; text-align: center;
    box-shadow: 0 0 0 2px #111111;
}

.gr-trust {
    position: relative; z-index: 1; box-sizing: border-box;
    height: var(--gr-trust-h); overflow: hidden;
    background: #1a1a1a; border-top: 1px solid rgba(255, 255, 255, .06);
    transition: height 220ms var(--gr-ease), opacity 160ms ease, visibility 0s;
}
.gr-trust__inner { box-sizing: border-box; max-width: 1280px; height: 100%; margin: 0 auto; padding: 0 15px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.gr-trust__list { display: flex; align-items: center; gap: 28px; margin: 0; padding: 0; list-style: none; }
.header .gr-trust a { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 500; line-height: 1; color: #a6a6a6; text-decoration: none; white-space: nowrap; transition: color 160ms ease; }
.header .gr-trust a:hover,
.header .gr-trust a:focus { color: #ffffff; }
.header .gr-trust strong { font-weight: 700; color: #f2f2f2; }
.gr-trust__list img { display: block; width: 16px; height: 16px; filter: invert(1); opacity: .7; }
.gr-trust__aside { display: flex; align-items: center; gap: 20px; }
.header .gr-trust__help strong { color: #ffffff; }
.header .gr-trust__help:hover strong { text-decoration: underline; text-underline-offset: 3px; }
.gr-trust__help svg { opacity: .7; }
.header .gr-trust__mark { padding-left: 20px; border-left: 1px solid rgba(255, 255, 255, .12); line-height: 0; }
.gr-trust__mark img { display: block; width: auto; height: 18px; }

.gr-drawer {
    position: fixed; inset: 0 auto 0 0;
    width: min(88vw, 360px); height: 100%; max-width: none; max-height: none;
    margin: 0; padding: 0; border: 0;
    background: #111111; color: #f2f2f2; font-family: var(--gr-font);
    transform: translateX(-100%);
    transition: transform 280ms cubic-bezier(.32, .72, 0, 1), overlay 280ms allow-discrete, display 280ms allow-discrete;
}
.gr-drawer[open] { transform: none; }
@starting-style { .gr-drawer[open] { transform: translateX(-100%); } }
.gr-drawer::backdrop { background: rgba(0, 0, 0, 0); transition: background-color 280ms ease, overlay 280ms allow-discrete, display 280ms allow-discrete; }
.gr-drawer[open]::backdrop { background: rgba(0, 0, 0, .55); }
@starting-style { .gr-drawer[open]::backdrop { background: rgba(0, 0, 0, 0); } }
.gr-drawer__inner { display: flex; flex-direction: column; height: 100%; overflow-y: auto; overscroll-behavior: contain; }
.gr-drawer__head { flex: none; display: flex; align-items: center; justify-content: space-between; height: 56px; padding: 0 8px 0 16px; border-bottom: 1px solid rgba(255, 255, 255, .08); }
.gr-drawer__head img { display: block; width: 160px; height: auto; }
.gr-drawer__nav { padding: 8px 0; }
.header .gr-drawer__link,
.header .gr-acc > summary {
    display: flex; align-items: center; justify-content: space-between;
    min-height: 52px; padding: 0 16px;
    font-size: 16px; font-weight: 600; color: #f2f2f2; text-decoration: none;
    list-style: none; cursor: pointer; border-bottom: 1px solid rgba(255, 255, 255, .06);
}
.header .gr-acc > summary::-webkit-details-marker { display: none; }
.gr-acc__chev { width: 14px; height: 14px; fill: currentColor; opacity: .6; transition: transform 200ms var(--gr-ease); }
.gr-acc[open] > summary .gr-acc__chev { transform: rotate(180deg); }
.gr-acc__body { padding: 4px 16px 16px; background: #161616; border-bottom: 1px solid rgba(255, 255, 255, .06); }
.gr-acc__label { margin: 16px 0 4px; font-size: 14px; font-weight: 700; color: #a6a6a6; }
.gr-acc__list { margin: 0; padding: 0; list-style: none; }
.header .gr-acc__list a { display: flex; align-items: center; min-height: 44px; font-size: 15px; font-weight: 500; color: #d4d4d4; text-decoration: none; }
.header .gr-acc__list a:hover,
.header .gr-acc__list a:focus { color: #ffffff; }
.header .gr-drawer__help { display: flex; align-items: center; gap: 12px; margin: 16px; padding: 14px 16px; border-radius: 8px; background: #1c1c1c; color: #f2f2f2; text-decoration: none; }
.gr-drawer__help small { display: block; font-size: 12px; line-height: 16px; color: #9a9a9a; }
.gr-drawer__help strong { display: block; font-size: 15px; line-height: 20px; font-weight: 700; }
.gr-drawer__quick-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 12px; margin: 0 16px 16px; padding-bottom: 12px; border-bottom: 1px solid rgba(255, 255, 255, .12); }
.header .gr-drawer__quick-links a { display: flex; align-items: center; min-height: 44px; color: #f2f2f2; font-size: 14px; font-weight: 600; line-height: 1.35; text-decoration: none; }
.header .gr-drawer__quick-links a:focus-visible { outline: 2px solid #fff; outline-offset: -2px; border-radius: 4px; }
.gr-drawer__trust { display: grid; gap: 12px; margin: 0; padding: 4px 16px 16px; list-style: none; }
.header .gr-drawer__trust a { display: flex; align-items: center; gap: 10px; font-size: 14px; color: #a6a6a6; text-decoration: none; }
.gr-drawer__trust strong { font-weight: 700; color: #f2f2f2; }
.gr-drawer__trust img { width: 18px; height: 18px; filter: invert(1); opacity: .7; }
.header .gr-drawer__mark { display: block; margin-top: auto; padding: 16px 16px 24px; line-height: 0; }
.gr-drawer__mark img { width: auto; height: 20px; }

@media (min-width: 1200px) {
    .header.gr-header.is-compact { --gr-bar-h: 60px; }
    .header.gr-header.is-compact .gr-logo { transform: scale(.91); }
    .header.gr-header.is-compact .gr-trust {
        height: 0; opacity: 0; visibility: hidden; border-top-width: 0;
        transition: height 220ms var(--gr-ease), opacity 120ms ease, visibility 0s linear 220ms;
    }

    .header .static-mega-menu-container {
        display: block; position: absolute; top: var(--gr-bar-h); left: 0; right: 0;
        width: auto; min-height: 0; z-index: 3;
        background: #ffffff; color: #111111;
        box-shadow: 0 24px 48px -16px rgba(0, 0, 0, .35);
        opacity: 0; visibility: hidden; pointer-events: none;
        transform: translateY(-6px);
        transition: opacity 160ms ease, transform 200ms var(--gr-ease), visibility 0s linear 200ms, top 220ms var(--gr-ease);
    }
    .header .static-mega-menu-container.visible {
        opacity: 1; visibility: visible; pointer-events: auto; transform: none;
        transition: opacity 160ms ease, transform 200ms var(--gr-ease), visibility 0s, top 220ms var(--gr-ease);
    }
    .header .static-mega-menu-container::after {
        content: ""; position: absolute; top: 100%; left: 0; right: 0; height: 100vh;
        background: rgba(10, 10, 10, .45); pointer-events: none;
    }
}

.header .mega-menu-content-wrapper {
    position: relative; box-sizing: border-box;
    max-width: 1280px; min-height: 0; max-height: calc(100vh - var(--gr-bar-h));
    margin: 0 auto; padding: 28px 15px 32px;
    overflow-y: auto; overscroll-behavior: contain;
}
.header .mega-menu-main-area { display: block; }
.header .mega-menu-links-area { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px 40px; }
.header #racunari-content .mega-menu-links-area { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.header #workstations-content .mega-menu-links-area { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.header #workstations-content .gaming-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 245px), 1fr)); }
.header #workstations-content .gaming-card { max-width: 400px; }
.header #periferija-content .mega-menu-links-area,
.header #smart-content .mega-menu-links-area { grid-template-columns: repeat(3, minmax(0, 1fr)); padding-right: 44px; }
.header .mega-menu-column { flex: none; min-width: 0; }
.header .column-title { display: block; margin: 0 0 10px; padding: 0; font-family: var(--gr-font); font-size: 15px; font-weight: 700; line-height: 20px; letter-spacing: 0; text-transform: none; color: #111111; }
.header .column-title--spaced { margin-top: 28px; }
.header .column-title--spaced-sm { margin-top: 20px; }
.header .link-list { margin: 0; padding: 0; list-style: none; }
.header .link-list a { display: block; padding: 6px 0; font-family: var(--gr-font); font-size: 15px; font-weight: 500; line-height: 20px; color: #3a3a3a; text-decoration: none; transition: color 120ms ease; }
.header .link-list a:hover,
.header .link-list a:focus { padding-left: 0; color: var(--gr-red); text-decoration: none; }
.header .desc-lead { margin: 0 0 16px; padding: 0; font-size: 15px; line-height: 22px; color: #6b6b6b; }
.header .desc-main { margin: 0; padding-left: 12px; border-left: 2px solid var(--gr-red); }
.header .desc-main p { margin: 0; padding-left: 0; border-left: 0; font-size: 14px; line-height: 21px; color: #333333; }
.header .gaming-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; }
.header .gaming-card {
    --accent: var(--gr-red);
    display: grid; grid-template-columns: 56px minmax(0, 1fr); align-items: center; gap: 14px;
    padding: 8px 12px 8px 8px; border: 1px solid transparent; border-radius: 8px;
    background: #f5f5f5; color: #111111; text-decoration: none;
    transition: background-color 160ms ease, border-color 160ms ease, box-shadow 200ms var(--gr-ease);
}
.header .gaming-card--text { grid-template-columns: minmax(0, 1fr); min-height: 74px; padding: 12px; }
.header .gaming-card.budget { --accent: #ff6000; }
.header .gaming-card.intel { --accent: #0097ff; }
.header .gaming-card.pro { --accent: #ae00ff; }
.header .gaming-card.amd { --accent: #1cf98b; }
.header .gaming-card.amdpro { --accent: #ff1212; }
.header .gaming-card:hover,
.header .gaming-card:focus { background: #ffffff; border-color: #e6e6e6; color: #111111; box-shadow: inset 3px 0 0 var(--accent), 0 8px 20px -10px rgba(0, 0, 0, .3); }
.header .pc-thumb { display: grid; place-items: center; width: 56px; height: 56px; margin: 0; overflow: hidden; border-radius: 6px; background: #ffffff; }
.header .pc-thumb img { width: 100%; height: 100%; object-fit: contain; }
.header .pc-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.header .pc-name { display: block; font-size: 14px; font-weight: 700; line-height: 18px; color: #111111; }
.header .pc-tagline { display: block; margin: 0; font-size: 13px; line-height: 17px; color: #6b6b6b; }
.header .mega-menu-close-btn {
    position: absolute; top: 16px; right: 15px;
    display: grid; place-items: center; width: 36px; height: 36px; padding: 0;
    border: 0; border-radius: 6px; background: transparent; color: #8a8a8a;
    font-size: 24px; line-height: 1; cursor: pointer;
    transition: background-color 160ms ease, color 160ms ease;
}
.header .mega-menu-close-btn:hover { background: #f2f2f2; color: #111111; }

@media (min-width: 1200px) and (max-width: 1279px) {
    .gr-bar__inner { column-gap: 12px; }
    .header .gr-logo img { width: 188px; }
    .header .nav-link { padding: 0 10px; }
    .header .nav-link::after { left: 10px; right: 10px; }
    .gr-trust__list { gap: 20px; }
    .gr-trust__help-q { display: none; }
}

@media (max-width: 1199px) {
    .header.gr-header { --gr-bar-h: 56px; }
    .gr-bar__inner {
        height: auto; padding: 0 8px;
        grid-template-columns: 44px minmax(0, 1fr) auto;
        grid-template-rows: 56px 56px;
        grid-template-areas: "toggle logo cart" "search search search";
        column-gap: 8px;
    }
    .header .gr-bar__toggle { display: inline-grid; }
    .header .gr-logo { justify-self: center; margin: 0; }
    .header .gr-logo img { width: 176px; }
    .header .gr-nav,
    .header .static-mega-menu-container,
    .gr-trust { display: none; }
    .header form.gr-search { box-sizing: border-box; max-width: none; align-self: start; padding: 0 8px 12px; }
    .header form.gr-search input.gr-search__input { font-size: 16px; }
    .header form.gr-search button.gr-search__btn { right: 10px; }
}
@media (max-width: 359px) {
    .header .gr-logo img { width: 150px; }
}

@media (prefers-reduced-motion: reduce) {
    .header.gr-header,
    .header.gr-header *,
    .header.gr-header *::after,
    .gr-drawer,
    .gr-drawer::backdrop { transition-duration: 0s !important; }
}
.arrowedSlider {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    list-style: none;
    margin: 0;
    padding: 0 0 12px;
}
.arrowedSlider > li {
    flex: 0 0 220px;
}
.page-body {
    margin-top: 16px;
}

/* Gaming računari listing (/gaming-racunari) and its chooser dialog. The theme removes outlines on :focus with !important. */
.pc-listing,
.pc-ch,
.home-shelf,
.compare-bar {
    --pc-ink: #111111;
    --pc-ink-2: #3a3a3f;
    --pc-muted: #5c5c66;
    --pc-line: #e4e4e7;
    --pc-line-strong: #d4d4d8;
    --pc-plate: #f4f4f5;
    --pc-red: #e12126;
    --pc-red-hover: #c4161b;
    --pc-green-hover: #1ebb40;
    --pc-buy: #15803d;
    --pc-buy-hover: #166534;
    --pc-buy-active: #14532d;
    --pc-buy-tint: #e7f6ec;
    --pc-ease: cubic-bezier(.2, .7, .2, 1);
    --pc-font: "Rethink Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-family: var(--pc-font);
    color: var(--pc-ink);
}
.pc-listing [hidden],
.pc-ch [hidden],
.home-shelf [hidden] { display: none !important; }
.pc-listing ::selection,
.pc-ch ::selection,
.home-shelf ::selection { background: #111111; color: #ffffff; }
.pc-listing a:focus-visible,
.pc-listing button:focus-visible,
.pc-ch a:focus-visible,
.pc-ch button:focus-visible,
.home-shelf a:focus-visible,
.home-shelf button:focus-visible { outline: 2px solid #111111 !important; outline-offset: 3px; }
.pc-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.pc-wrap { box-sizing: border-box; max-width: 1280px; margin: 0 auto; padding-left: 15px; padding-right: 15px; }

.pc-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    box-sizing: border-box; min-width: 0; min-height: 48px; margin: 0; padding: 0 22px;
    border: 1px solid transparent; border-radius: 10px;
    font: 700 16px/1.1 var(--pc-font); text-decoration: none; text-align: center; cursor: pointer;
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, transform 100ms ease;
}
.pc-btn:active { transform: scale(.98); }
.pc-btn svg { flex: none; transition: transform 200ms var(--pc-ease); }
.pc-btn--red,
.pc-listing a.pc-btn--red,
.pc-ch a.pc-btn--red { background: var(--pc-red); color: #ffffff; }
.pc-btn--red:hover,
.pc-listing a.pc-btn--red:hover,
.pc-ch a.pc-btn--red:hover { background: var(--pc-red-hover); color: #ffffff; text-decoration: none; }
.pc-btn--red:hover svg { transform: translateX(3px); }
.pc-btn--buy,
.pc-listing a.pc-btn--buy,
.pc-ch a.pc-btn--buy { background: var(--pc-buy); color: #ffffff; }
.pc-btn--buy:hover,
.pc-listing a.pc-btn--buy:hover,
.pc-ch a.pc-btn--buy:hover { background: var(--pc-buy-hover); color: #ffffff; text-decoration: none; }
.pc-btn--buy:active,
.pc-listing a.pc-btn--buy:active,
.pc-ch a.pc-btn--buy:active { background: var(--pc-buy-active); }
.pc-btn--buy:hover svg { transform: translateX(3px); }
.pc-btn--dark,
.pc-listing a.pc-btn--dark { background: #111111; color: #ffffff; }
.pc-btn--dark:hover,
.pc-listing a.pc-btn--dark:hover { background: #2b2b2e; color: #ffffff; text-decoration: none; }
.pc-btn--ghost { background: #ffffff; border-color: var(--pc-line-strong); color: var(--pc-ink); }
.pc-btn--ghost:hover { border-color: #111111; }

.pc-hero { background: var(--pc-plate); border-bottom: 1px solid var(--pc-line); }
.pc-hero__grid {
    display: grid; grid-template-columns: minmax(0, 1fr) 380px; align-items: end; gap: 32px 56px;
    padding-top: 24px; padding-bottom: 40px;
}
.pc-crumbs ol { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 28px; padding: 0; list-style: none; font-size: 14px; line-height: 20px; color: var(--pc-muted); }
.pc-crumbs li { margin: 0; }
.pc-crumbs li + li::before { content: "/"; margin-right: 8px; color: #8e8e96; }
.pc-crumbs a { color: var(--pc-muted); text-decoration: none; }
.pc-crumbs a:hover { color: var(--pc-ink); text-decoration: underline; text-underline-offset: 3px; }
.pc-hero__title { margin: 0; font: 700 clamp(34px, 1.4vw + 24px, 48px)/1.05 var(--pc-font); letter-spacing: -.025em; color: var(--pc-ink); text-wrap: balance; }
.pc-hero__intro { max-width: 62ch; margin-top: 18px; }
.pc-hero__intro h2 { margin: 0 0 8px; font: 600 19px/1.4 var(--pc-font); letter-spacing: -.005em; color: var(--pc-ink-2); text-wrap: balance; }
.pc-hero__intro p { margin: 0; font-size: 16px; line-height: 1.6; color: var(--pc-muted); }
@media (min-width: 1024px) { .pc-listing .pc-hero__intro { max-width: none; } }

.pc-help {
    padding: 24px; border: 1px solid var(--pc-line); border-radius: 14px; background: #ffffff;
    box-shadow: 0 1px 2px rgba(17, 17, 17, .04), 0 16px 32px -20px rgba(17, 17, 17, .25);
}
.pc-help__title { margin: 0 0 8px; font: 700 21px/1.25 var(--pc-font); letter-spacing: -.01em; color: var(--pc-ink); }
.pc-help__text { margin: 0 0 20px; font-size: 15px; line-height: 1.55; color: var(--pc-muted); }
.pc-help__btn { width: 100%; }
.pc-listing a.pc-help__contact { display: inline-block; margin-top: 14px; font-size: 15px; font-weight: 600; color: var(--pc-ink); text-decoration: underline; text-decoration-color: #b4b4bb; text-underline-offset: 4px; }
.pc-listing a.pc-help__contact:hover { color: var(--pc-ink); text-decoration-color: currentColor; }

.pc-shelf { padding-top: 40px; padding-bottom: 64px; }
.pc-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; margin-bottom: 24px; }
.pc-toolbar__head { display: flex; align-items: baseline; gap: 12px; }
.pc-toolbar__title { margin: 0; font: 700 24px/1.2 var(--pc-font); letter-spacing: -.015em; color: var(--pc-ink); }
.pc-toolbar__count { margin: 0; font-size: 15px; color: var(--pc-muted); font-variant-numeric: tabular-nums; }
.pc-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.pc-chip {
    display: inline-flex; align-items: center; gap: 8px; box-sizing: border-box;
    min-width: 0; min-height: 40px; margin: 0; padding: 0 16px;
    border: 1px solid var(--pc-line-strong); border-radius: 999px; background: #ffffff; color: var(--pc-ink);
    font: 600 15px/1 var(--pc-font); cursor: pointer;
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}
.pc-chip:hover { border-color: #111111; }
.pc-chip__n { font-size: 13px; color: var(--pc-muted); font-variant-numeric: tabular-nums; }
.pc-chip[aria-pressed="true"] { background: #111111; border-color: #111111; color: #ffffff; }
.pc-chip[aria-pressed="true"] .pc-chip__n { color: #b4b4bb; }

.pc-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 0; padding: 0; list-style: none; }
.pc-grid > li { display: grid; grid-row: span 5; grid-template-rows: subgrid; margin: 0; padding: 0; list-style: none; }
.pc-grid.is-filtered > li { animation: pc-in 280ms var(--pc-ease) both; }
@keyframes pc-in { from { opacity: 0; transform: translateY(8px); } }
.pc-empty { margin: 8px 0 0; font-size: 16px; color: var(--pc-ink-2); }
.pc-link-btn { min-width: 0; margin: 0 0 0 6px; padding: 0; border: 0; background: none; font: inherit; font-weight: 700; color: var(--pc-ink); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

.pc-tile {
    position: relative; display: grid; grid-row: span 5; grid-template-rows: subgrid; row-gap: 0;
    padding: 12px 12px 20px; border: 1px solid var(--pc-line); border-radius: 16px; background: #ffffff;
    transition: border-color 200ms ease, box-shadow 280ms var(--pc-ease), transform 280ms var(--pc-ease);
}
.pc-tile:hover { border-color: var(--pc-line-strong); box-shadow: 0 22px 44px -26px rgba(17, 17, 17, .4); transform: translateY(-3px); }
.pc-tile:has(.pc-tile__link:focus-visible) { outline: 2px solid #111111; outline-offset: 3px; }
.pc-tile__plate { display: grid; place-items: center; aspect-ratio: 4 / 3; margin: 0 0 18px; overflow: hidden; border-radius: 10px; }
.pc-tile__plate img { display: block; box-sizing: border-box; width: 100%; height: 100%; padding: 8% 17%; object-fit: contain; mix-blend-mode: multiply; transition: transform 500ms var(--pc-ease); }
.pc-tile:hover .pc-tile__plate img { transform: scale(1.04); }
.pc-tile__badge {
    position: absolute; top: 22px; left: 22px; z-index: 2;
    display: inline-flex; align-items: center; gap: 7px; box-sizing: border-box; max-width: calc(100% - 44px);
    padding: 6px 11px 6px 10px; border-radius: 999px; background: #ffffff;
    font-size: 13px; font-weight: 600; line-height: 1.2; color: var(--pc-ink);
    box-shadow: 0 1px 3px rgba(17, 17, 17, .12);
    pointer-events: none;
}
.pc-tile__badge::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--pc-tone, #8e8e96); }
.pc-tone--budget { --pc-tone: #f97316; }
.pc-tone--plav { --pc-tone: #0284c7; }
.pc-tone--purple { --pc-tone: #9333ea; }
.pc-tone--red { --pc-tone: #e12126; }
.pc-tone--zelen { --pc-tone: #16a34a; }
.pc-tile__title { margin: 0 8px 6px; font: 700 19px/1.25 var(--pc-font); letter-spacing: -.01em; color: var(--pc-ink); }
.pc-listing a.pc-tile__link,
.home-shelf a.pc-tile__link { color: var(--pc-ink); text-decoration: none; }
.pc-tile__link { position: absolute; inset: 0; z-index: 1; border-radius: 16px; }
.pc-tile__link::after { content: none; }
.pc-listing a.pc-tile__link:focus-visible,
.home-shelf a.pc-tile__link:focus-visible { outline: none !important; }
.pc-tile__lines { margin: 0 8px 16px; font-size: 14px; line-height: 1.45; color: var(--pc-muted); }
.pc-tile__lines span + span::before { content: " · "; }
.pc-tile__specs { margin: 0 8px 20px; padding: 0; border-top: 1px solid var(--pc-line); }
.pc-tile__specs > div,
.pc-ch__specs > div { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--pc-line); }
.pc-tile__specs dt,
.pc-ch__specs dt { margin: 0; font-size: 13px; font-weight: 500; line-height: 20px; color: var(--pc-muted); }
.pc-tile__specs dd,
.pc-ch__specs dd { margin: 0; font-size: 14px; font-weight: 600; line-height: 20px; color: var(--pc-ink); }
.pc-tile__foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; align-self: end; margin: 0 8px; }
.pc-tile__price { margin: 0; font-size: 15px; font-weight: 600; line-height: 1; color: var(--pc-ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pc-tile__price b { font-size: 28px; font-weight: 800; letter-spacing: -.02em; color: var(--pc-ink); }
.pc-tile__cta {
    display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 14px 0 18px;
    border-radius: 10px; background: var(--pc-buy); color: #ffffff; font-size: 15px; font-weight: 700;
    transition: background-color 180ms ease;
}
.pc-tile__cta svg { transition: transform 200ms var(--pc-ease); }
.pc-tile:hover .pc-tile__cta { background: var(--pc-buy-hover); }
.pc-tile:active .pc-tile__cta { background: var(--pc-buy-active); }
.pc-tile:hover .pc-tile__cta svg { transform: translateX(2px); }

.home-shelf {
    --home-pcs-gap: 24px;
    --home-pcs-cols: 3;
    margin: 0; padding: 8px 0 12px;
    background: #ffffff;
}
.home-shelf__wrap { min-width: 0; }
.gameComputerBox .home-shelf { float: none; width: auto; }
.home-shelf h2 { float: none; width: auto; }
.home-shelf ul { float: none; width: auto; clear: none; }
.home-shelf__head {
    display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
    gap: 20px 32px; margin: 0 0 28px;
}
.home-shelf__intro { min-width: 0; max-width: 54ch; }
.home-shelf__title { margin: 0 0 8px; font: 700 32px/1.1 var(--pc-font); letter-spacing: -.02em; color: var(--pc-ink); text-wrap: balance; }
.home-shelf a.home-shelf__title,
.home-shelf .home-shelf__title a { color: var(--pc-ink); text-decoration: none; }
.home-shelf .home-shelf__title a:hover { color: var(--pc-ink); text-decoration: none; }
.home-shelf__lede { margin: 0; font-size: 16px; line-height: 1.55; color: var(--pc-muted); text-wrap: pretty; }
.home-shelf__tools { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 20px; margin-left: auto; }
.home-shelf a.home-shelf__all {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 15px; font-weight: 700; line-height: 1; color: var(--pc-ink);
    text-decoration: underline; text-decoration-color: #b4b4bb; text-underline-offset: 4px;
}
.home-shelf a.home-shelf__all:hover { color: var(--pc-ink); text-decoration-color: currentColor; }
.home-shelf a.home-shelf__all svg { transition: transform 200ms var(--pc-ease); }
.home-shelf a.home-shelf__all:hover svg { transform: translateX(2px); }
.home-shelf__arrows { display: flex; gap: 8px; }
.home-shelf__arrow {
    display: grid; place-items: center; box-sizing: border-box;
    width: 44px; height: 44px; margin: 0; padding: 0;
    border: 1px solid var(--pc-line-strong); border-radius: 10px; background: #ffffff; color: var(--pc-ink);
    cursor: pointer; transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease;
}
.home-shelf__arrow:hover { border-color: #111111; }
.home-shelf__arrow:disabled { color: #b4b4bb; border-color: var(--pc-line); background: var(--pc-plate); cursor: default; }
.home-shelf__track {
    display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - (var(--home-pcs-cols) - 1) * var(--home-pcs-gap)) / var(--home-pcs-cols));
    grid-template-rows: auto auto auto auto auto; gap: var(--home-pcs-gap);
    margin: 0; padding: 4px 2px 12px; list-style: none;
    overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory;
    scrollbar-width: none; scroll-padding-inline: 2px;
}
.home-shelf__track::-webkit-scrollbar { display: none; }
.home-shelf__track > li {
    display: grid; grid-template-rows: subgrid; grid-row: 1 / span 5;
    margin: 0; padding: 0; list-style: none; min-width: 0;
    scroll-snap-align: start; scroll-snap-stop: always;
}
.home-shelf .pc-tile { min-width: 0; }
.home-shelf .pc-tile:hover { transform: none; }
.home-shelf--band { padding: 48px 0 56px; border-top: 1px solid var(--pc-line); }
.home-shelf__track--shop { grid-template-rows: auto; }
.home-shelf__track--shop > li { display: block; grid-row: 1; }

.cat-tile {
    position: relative; display: flex; flex-direction: column; height: 100%; box-sizing: border-box;
    padding: 12px 12px 16px; border: 1px solid var(--pc-line); border-radius: 16px; background: #ffffff;
    transition: border-color 200ms ease, box-shadow 280ms var(--pc-ease);
}
.cat-tile:hover { border-color: var(--pc-line-strong); box-shadow: 0 22px 44px -26px rgba(17, 17, 17, .4); }
.cat-tile:has(.cat-tile__link:focus-visible),
.cat-tile:has(.cat-tile__media:focus-visible) { outline: 2px solid #111111; outline-offset: 3px; }
.cat-tile__media { position: relative; display: block; text-decoration: none; color: inherit; }
.cat-listing a.cat-tile__media,
.home-shelf a.cat-tile__media,
.pdp a.cat-tile__media { color: inherit; text-decoration: none; }
.cat-tile__plate { display: grid; place-items: center; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 10px; }
.cat-tile__plate img { display: block; box-sizing: border-box; width: 100%; height: 100%; padding: 2% 15%; object-fit: contain; transition: transform 500ms var(--pc-ease); }
.cat-tile:hover .cat-tile__plate img { transform: scale(1.04); }
.cat-tile__mark {
    position: absolute; left: 2px; bottom: -2px; z-index: 1;
    height: 30px; width: auto; max-width: 88px; padding: 5px 7px; border-radius: 6px; background: #ffffff;
    object-fit: contain; object-position: left center;
}
.cat-tile__title { margin: 14px 8px 0; font: 700 17px/1.3 var(--pc-font); letter-spacing: -.01em; color: var(--pc-ink); text-wrap: pretty; }
.home-shelf a.cat-tile__link,
.cat-listing a.cat-tile__link,
.pdp a.cat-tile__link { color: var(--pc-ink); text-decoration: none; }
.home-shelf a.cat-tile__link:focus-visible,
.cat-listing a.cat-tile__link:focus-visible,
.pdp a.cat-tile__link:focus-visible,
.home-shelf a.cat-tile__media:focus-visible,
.cat-listing a.cat-tile__media:focus-visible { outline: none !important; }
.cat-tile__chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 8px 0; padding: 0; list-style: none; }
.cat-tile__chips li {
    margin: 0; padding: 5px 8px; border-radius: 999px; background: var(--pc-plate);
    font-size: 12px; font-weight: 600; line-height: 1; color: var(--pc-ink-2);
}
.cat-tile__foot { margin: auto 8px 0; padding-top: 16px; }
.cat-tile__price { margin: 0; font-size: 15px; font-weight: 600; line-height: 1; color: var(--pc-ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cat-tile__price b { font-size: 28px; font-weight: 800; letter-spacing: -.02em; color: var(--pc-ink); }
.cat-tile__stock { display: flex; align-items: center; gap: 8px; margin: 8px 0 0; font-size: 13px; font-weight: 600; color: var(--pc-ink); }
.cat-tile__stock::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: #15803d; }
.cat-tile__stock.is-out { color: var(--pc-muted); }
.cat-tile__stock.is-out::before { background: #8e8e96; }
.cat-tile__cart { position: relative; z-index: 2; margin: 12px 0 0; }
.cat-tile__add { width: 100%; min-height: 44px; padding: 0 16px; font-size: 15px; }
.cat-tile__add:disabled, .cat-row__add:disabled { opacity: .45; cursor: not-allowed; }

@media (max-width: 1100px) {
    .home-shelf { --home-pcs-cols: 2; --home-pcs-gap: 20px; }
}
@media (max-width: 640px) {
    .home-shelf { --home-pcs-cols: 1; --home-pcs-gap: 16px; padding: 40px 0 48px; }
    .home-shelf__head { margin-bottom: 20px; }
    .home-shelf__title { font-size: 26px; }
    .home-shelf__tools { width: 100%; margin-left: 0; justify-content: space-between; }
    .home-shelf__track { grid-template-rows: auto; padding-bottom: 8px; }
    .home-shelf__track > li { display: block; grid-row: auto; }
    .home-shelf--band { padding: 36px 0 44px; }
    .cat-tile { grid-row: auto; }
    .cat-tile:hover .cat-tile__plate img { transform: none; }
}

.cat-listing { caret-color: #111111; }
.cat-listing .pc-btn { -webkit-appearance: none; appearance: none; }
.cat-listing ul,
.cat-listing ol { float: none; width: auto; clear: none; }
.cat-listing__hero .pc-wrap { padding-top: 24px; padding-bottom: 36px; }
.cat-listing--filter .cat-listing__hero .pc-wrap { padding-top: 16px; padding-bottom: 4px; }
.cat-listing__lede { max-width: 62ch; margin: 16px 0 0; font-size: 17px; line-height: 1.6; color: var(--pc-muted); text-wrap: pretty; }
.cat-listing__subs { margin-top: 22px; }
.cat-brands { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; padding: 0; list-style: none; }
.cat-brands li { margin: 0; }
.cat-listing a.cat-brands__chip {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px; box-sizing: border-box;
    min-height: 44px; min-width: 88px; padding: 0 14px; border: 1px solid var(--pc-line-strong); border-radius: 10px;
    background: #ffffff; color: var(--pc-ink); text-decoration: none;
    font: 600 13px/1 var(--pc-font);
}
.cat-listing a.cat-brands__chip:hover { border-color: #111111; color: var(--pc-ink); text-decoration: none; }
.cat-listing a.cat-brands__chip.is-on { border-color: #111111; box-shadow: inset 0 0 0 1px #111111; }
.cat-brands__chip img { display: block; height: 16px; width: auto; max-width: 72px; object-fit: contain; }
.cat-listing a.pc-chip {
    color: var(--pc-ink); text-decoration: none;
}
.cat-listing a.pc-chip:hover,
.cat-listing a.pc-chip:focus { color: var(--pc-ink); text-decoration: none; }
.cat-listing__body {
    display: grid; grid-template-columns: 268px minmax(0, 1fr); align-items: start;
    gap: 40px 48px; padding-top: 28px; padding-bottom: 80px;
}

.cat-filters {
    position: sticky; top: 128px; max-height: calc(100dvh - 148px); overflow: auto;
    padding-right: 8px; scrollbar-width: thin; scrollbar-color: #d4d4d8 transparent;
}
.cat-filters__form { margin: 0; }
.cat-filters__form fieldset { margin: 0 0 28px; padding: 0; border: 0 !important; min-width: 0; }
.cat-filters__form legend {
    float: none; display: block; width: 100%; margin: 0 0 12px; padding: 0;
    border: 0; background: transparent;
    font: 700 13px/1.2 var(--pc-font); letter-spacing: .06em; text-transform: uppercase; color: var(--pc-muted);
}
.cat-listing--filter .cat-filters__form legend,
.cat-listing form.cat-filters__form legend {
    float: none; display: block; width: 100%; margin: 0 0 8px; padding: 0;
    border: 0; background: transparent;
    font: 700 16px/1.25 var(--pc-font); letter-spacing: -.01em;
    text-transform: none; color: var(--pc-ink);
}
.cat-filters__form legend + * { clear: both; }
.cat-filters__form ul { margin: 0; padding: 0; list-style: none; }
.cat-filters__form li { margin: 0; }
.cat-filters__form li + li { border-top: 1px solid var(--pc-line); }
.cat-listing--filter .cat-filters__form li + li { border-top: 0; }
.cat-filters__form label {
    display: flex; align-items: center; gap: 10px; min-height: 44px; margin: 0; cursor: pointer;
    font: 600 15px/1.3 var(--pc-font); color: var(--pc-ink);
}
.cat-listing--filter .cat-filters__form label {
    min-height: 36px; font-weight: 500; gap: 8px;
}
.cat-filters__form input[type="checkbox"] {
    appearance: none; -webkit-appearance: none; box-sizing: border-box;
    flex: none; width: 18px; height: 18px; margin: 0; padding: 0;
    border: 1.5px solid var(--pc-line-strong); border-radius: 4px; background: #ffffff;
    cursor: pointer;
}
.cat-filters__form input[type="checkbox"]:checked {
    border-color: #111111; background: #111111 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='m3.5 8.2 3 3 6-6.4'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
}
.cat-filters__n { margin-left: .2em; font-size: 13px; font-weight: 500; color: var(--pc-muted); font-variant-numeric: tabular-nums; }
.cat-filters__more {
    display: inline-flex; align-items: center; gap: 6px; margin: 4px 0 0; padding: 8px 0;
    border: 0; background: none; color: var(--pc-ink); cursor: pointer;
    font: 600 14px/1.2 var(--pc-font);
}
.cat-filters__more:hover { text-decoration: underline; text-underline-offset: 3px; }
.cat-filters__more:focus-visible { outline: 2px solid #111111; outline-offset: 3px; }
.cat-listing--filter .cat-filters__form fieldset { margin: 0 0 22px; }
.cat-filters__price { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; }
.cat-filters__price label { display: block; min-height: 0; }
.cat-filters__price input {
    box-sizing: border-box; width: 100%; height: 44px; margin: 0; padding: 0 10px;
    border: 1px solid var(--pc-line-strong); border-radius: 10px; background: #ffffff;
    font: 600 15px/1 var(--pc-font); color: var(--pc-ink); font-variant-numeric: tabular-nums;
    -moz-appearance: textfield; appearance: textfield;
}
.cat-filters__price input::-webkit-outer-spin-button,
.cat-filters__price input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.cat-filters__price input::placeholder { color: #8e8e96; }
.cat-filters__price input:focus { outline: 2px solid #111111; outline-offset: 2px; border-color: #111111; }
.cat-filters__dash { color: var(--pc-muted); font-weight: 600; }
.cat-filters__unit { margin: 6px 0 0; font-size: 13px; font-weight: 600; color: var(--pc-muted); }
.cat-filters__apply { width: 100%; min-height: 44px; margin-top: 10px; font-size: 15px; }
.cat-filters__clear {
    display: inline-flex; margin: 4px 0 0; font: 700 15px/1.3 var(--pc-font); color: var(--pc-ink);
    text-decoration: underline; text-decoration-color: #b4b4bb; text-underline-offset: 4px;
}
.cat-listing a.cat-filters__clear:hover { color: var(--pc-ink); text-decoration-color: currentColor; }

.cat-toolbar {
    display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin: 0 0 22px;
}
.cat-toolbar__title {
    margin: 0; font: 700 clamp(28px, 1.2vw + 20px, 36px)/1.1 var(--pc-font);
    letter-spacing: -.025em; color: var(--pc-ink); text-wrap: balance;
}
.cat-listing--filter .cat-toolbar {
    align-items: baseline; gap: 10px 16px; margin: 0 0 8px; padding-bottom: 4px;
}
.cat-listing--filter .cat-toolbar__count {
    font-weight: 500; color: var(--pc-ink-2);
}
.cat-listing--filter .cat-toolbar__count::before {
    content: ""; display: inline-block; width: 1px; height: 14px; margin: 0 12px 0 4px;
    background: var(--pc-line-strong); vertical-align: -2px;
}
.cat-toolbar__count { margin: 0; font-size: 15px; font-weight: 600; color: var(--pc-muted); font-variant-numeric: tabular-nums; }
.cat-toolbar__filters { display: none; min-height: 44px; padding: 0 16px; font-size: 15px; }
.cat-toolbar__badge {
    display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px;
    border-radius: 9px; background: #111111; color: #ffffff;
    font: 700 11px/18px var(--pc-font); font-variant-numeric: tabular-nums;
}
.cat-toolbar__sort { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-left: auto; }
.cat-toolbar__sort label { display: grid; gap: 6px; margin: 0; }
.cat-toolbar__sort label span { font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--pc-muted); }
.cat-toolbar__sort select {
    box-sizing: border-box; min-width: 168px; height: 44px; margin: 0; padding: 0 36px 0 14px;
    border: 1px solid var(--pc-line-strong); border-radius: 10px; background: #ffffff;
    font: 600 15px/1 var(--pc-font); color: var(--pc-ink);
    appearance: none; -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%23111111' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='m4 6 4 4 4-4'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 12px center;
    cursor: pointer;
}
.cat-toolbar__sort select:focus { outline: 2px solid #111111; outline-offset: 2px; border-color: #111111; }

.cat-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 24px; margin: 0; padding: 0; list-style: none; }
.cat-grid > li { display: flex; margin: 0; padding: 0; list-style: none; min-width: 0; }
.cat-grid > li > * { flex: 1 1 auto; width: 100%; min-width: 0; }
.cat-spot {
    display: flex; flex-direction: column; justify-content: space-between; gap: 24px; box-sizing: border-box;
    height: 100%; min-height: 100%; padding: 28px 24px; border-radius: 16px;
}
.cat-spot--promo { background: #111111; color: #f2f2f2; }
.cat-spot--info { background: var(--pc-plate); color: var(--pc-ink); border: 1px solid var(--pc-line); }
.cat-spot__title { margin: 0; font: 700 28px/1.15 var(--pc-font); letter-spacing: -.02em; text-wrap: pretty; }
.cat-spot--promo .cat-spot__title { color: #ffffff; }
.cat-spot__text { margin: 12px 0 0; font-size: 16px; line-height: 1.55; text-wrap: pretty; }
.cat-spot--promo .cat-spot__text { color: #c8c8ce; }
.cat-spot--info .cat-spot__text { color: var(--pc-muted); }
.cat-spot__points { display: grid; gap: 10px; margin: 16px 0 0; padding: 0; list-style: none; }
.cat-spot__points li {
    display: flex; align-items: flex-start; gap: 10px; margin: 0;
    font-size: 15px; font-weight: 600; line-height: 1.4; color: var(--pc-ink);
}
.cat-spot__points li::before {
    content: ""; flex: none; width: 16px; height: 16px; margin-top: 1px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='7' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='m4.8 8.2 2.1 2.1 4.3-4.6'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='7' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='m4.8 8.2 2.1 2.1 4.3-4.6'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}
.cat-spot--promo .cat-spot__points li { color: #d4d4d8; }
.cat-spot--info .cat-spot__points li::before { background: #15803d; }
.cat-listing a.cat-spot__cta { align-self: flex-start; margin-top: auto; text-decoration: none; }
.cat-listing a.cat-spot__cta.pc-btn--buy { color: #ffffff; }
.cat-listing a.cat-spot__cta.pc-btn--ghost { color: var(--pc-ink); }
.cat-listing a.cat-spot__cta:hover { text-decoration: none; }
.cat-grid__usps { grid-column: 1 / -1; }
.cat-usps {
    display: flex; flex-wrap: wrap; align-items: center; gap: 10px 28px;
    width: 100%; margin: 0; padding: 14px 4px; list-style: none;
    border-top: 1px solid var(--pc-line); border-bottom: 1px solid var(--pc-line);
}
.cat-usps li {
    display: flex; align-items: center; gap: 8px; margin: 0;
    font-size: 14px; font-weight: 700; color: var(--pc-ink);
}
.cat-usps li::before {
    content: ""; flex: none; width: 16px; height: 16px; background: #15803d;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='7' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='m4.8 8.2 2.1 2.1 4.3-4.6'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='7' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='m4.8 8.2 2.1 2.1 4.3-4.6'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}
.cat-listing--filter .cat-listing__body { grid-template-columns: 248px minmax(0, 1fr); gap: 32px 40px; padding-top: 12px; }
.cat-listing--filter .cat-filters { top: 112px; max-height: calc(100dvh - 128px); }

.cat-rows { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.cat-rows > li { display: block; margin: 0; padding: 0; min-width: 0; border-bottom: 1px solid var(--pc-line); }
.cat-rows > li.cat-rows__usps,
.cat-rows > li.cat-rows__banner { border-bottom: 0; }
.cat-row {
    display: grid; grid-template-columns: 300px minmax(0, 1fr) 240px; align-items: start;
    gap: 16px 28px; box-sizing: border-box; padding: 20px 0; background: #ffffff;
}
.cat-row__media { position: relative; display: block; min-width: 0; text-decoration: none; color: inherit; }
.cat-listing a.cat-row__media { color: inherit; text-decoration: none; }
.cat-listing .cat-row__media img,
.cat-row__media img {
    display: block; box-sizing: border-box; width: 100%; height: auto; max-width: 100%;
    padding: 0; margin: 0; border: 0; background: none;
    object-fit: contain; object-position: center;
}
.cat-row__copy { min-width: 0; padding-top: 4px; }
.cat-row__title { margin: 0; font: 700 18px/1.3 var(--pc-font); letter-spacing: -.015em; color: var(--pc-ink); text-wrap: pretty; }
.cat-listing a.cat-row__link { color: var(--pc-ink); text-decoration: none; }
.cat-listing a.cat-row__link:hover { color: var(--pc-ink); text-decoration: underline; text-underline-offset: 3px; }
.cat-listing a.cat-row__link:focus-visible,
.cat-listing a.cat-row__media:focus-visible { outline: none !important; }
.cat-row:has(.cat-row__link:focus-visible),
.cat-row:has(.cat-row__media:focus-visible) { outline: 2px solid #111111; outline-offset: 3px; }
.cat-row__specs {
    display: grid; gap: 2px; margin: 10px 0 0; padding: 0; list-style: none;
    color: var(--pc-ink-2);
}
.cat-row__specs li {
    display: flex; align-items: flex-start; gap: 8px; margin: 0; padding: 0;
    font: 400 14px/1.5 var(--pc-font); color: var(--pc-ink-2); list-style: none;
}
.cat-row__specs li::before {
    content: ""; flex: none; width: 5px; height: 5px; margin-top: .55em;
    border-radius: 50%; background: currentColor;
}
.cat-row__side { display: grid; align-content: start; gap: 8px; min-width: 0; }
.cat-row__buy { display: grid; justify-items: stretch; align-content: start; gap: 10px; padding-top: 4px; }
.energy-label { display: block; width: 54px; height: 28px; }
.cat-row__buy .energy-label { margin: 0 0 2px; }
.compare-toggle {
    display: inline-flex; align-items: center; gap: 8px; margin: 0;
    font: 500 14px/1.2 var(--pc-font); color: var(--pc-ink); cursor: pointer;
}
.compare-toggle input {
    appearance: none; -webkit-appearance: none; box-sizing: border-box;
    flex: none; width: 18px; height: 18px; margin: 0; padding: 0;
    border: 1.5px solid #111111; border-radius: 4px; background: #ffffff;
    cursor: pointer;
}
.compare-toggle input:checked,
.compare-toggle.is-on input {
    border-color: #111111; background: #111111 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='m3.5 8.2 3 3 6-6.4'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
}
.cat-tile .compare-toggle { margin: 10px 0px 4px; }
.pdp .compare-toggle { margin-top: 14px; }
.cat-row__price { margin: 0; font-size: 15px; font-weight: 600; line-height: 1; color: var(--pc-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cat-row__price b { font-size: 32px; font-weight: 800; letter-spacing: -.03em; color: var(--pc-ink); }
.cat-row__stock { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 14px; font-weight: 600; color: #15803d; }
.cat-row__stock::before {
    content: ""; flex: none; width: 16px; height: 16px; background: #15803d;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='7' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='m4.8 8.2 2.1 2.1 4.3-4.6'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='7' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='m4.8 8.2 2.1 2.1 4.3-4.6'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}
.cat-row__stock.is-out { color: var(--pc-muted); }
.cat-row__stock.is-out::before { background: #8e8e96; }
.cat-row__cart { width: 100%; }
.cat-listing form button.cat-row__add,
.cat-row__add {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    width: 100%; max-width: none; min-height: 48px; padding: 0 16px; font-size: 16px;
}
.cat-row__add:hover svg { transform: none; }
.cat-listing [hidden] { display: none !important; }
.cat-rows__usps .cat-usps {
    padding: 12px 0; border-top: 0;
}
.cat-listing--filter .cat-usps li:first-child { color: #15803d; }
.cat-banner {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center;
    gap: 20px 32px; box-sizing: border-box; margin: 8px 0 16px; padding: 28px 32px;
    background: #111111; color: #f2f2f2;
}
.cat-banner__title { margin: 0; font: 700 28px/1.15 var(--pc-font); letter-spacing: -.02em; color: #ffffff; text-wrap: pretty; }
.cat-banner__text { margin: 8px 0 0; max-width: 52ch; font-size: 16px; line-height: 1.5; color: #c8c8ce; text-wrap: pretty; }
.cat-listing a.cat-banner__cta { text-decoration: none; min-height: 48px; padding: 0 22px; }
.cat-listing a.cat-banner__cta:hover { text-decoration: none; }

.cat-listing .pc-empty { margin: 24px 0 0; }
.cat-listing a.pc-link-btn { color: var(--pc-ink); }

.cat-listing .shop-pages {
    display: flex; align-items: center; justify-content: center; gap: 10px;
    margin: 36px 0 0; padding: 0; font: 600 15px/1 var(--pc-font); font-variant-numeric: tabular-nums;
}
.cat-listing .shop-pages a,
.cat-listing .shop-pages span {
    display: inline-flex; align-items: center; justify-content: center;
    box-sizing: border-box; min-width: 44px; min-height: 44px; padding: 0 16px;
    border: 1px solid var(--pc-line); border-radius: 10px; color: var(--pc-muted); text-decoration: none;
}
.cat-listing .shop-pages a { border-color: var(--pc-line-strong); color: var(--pc-ink); background: #ffffff; }
.cat-listing .shop-pages a:hover { border-color: #111111; color: var(--pc-ink); text-decoration: none; }

.cat-sheet {
    width: min(100%, 720px); max-width: none; height: auto; max-height: min(92dvh, 840px);
    margin: auto; padding: 0; border: 0; border-radius: 16px;
    background: #ffffff; color: var(--pc-ink); box-shadow: 0 24px 64px -24px rgba(17, 17, 17, .45);
}
.cat-sheet::backdrop { background: rgba(17, 17, 17, .5); }
.cat-sheet__chrome {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 14px 16px 10px; border-bottom: 1px solid var(--pc-line);
}
.cat-sheet__chrome h2 { margin: 0; font: 700 20px/1.2 var(--pc-font); letter-spacing: -.015em; }
.cat-sheet__body { padding: 16px 16px calc(20px + env(safe-area-inset-bottom)); overflow: auto; }
html.cat-filters-open { overflow: hidden; }

@media (min-width: 861px) {
    .cat-sheet { display: none !important; }
}
@media (max-width: 1100px) {
    .cat-listing__body { grid-template-columns: 240px minmax(0, 1fr); gap: 32px; }
    .cat-listing--filter .cat-listing__body { grid-template-columns: 220px minmax(0, 1fr); gap: 24px 28px; }
    .cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
    .cat-row { grid-template-columns: 240px minmax(0, 1fr) 200px; gap: 16px 20px; padding: 20px 0; }
    .cat-row__price b { font-size: 26px; }
    .cat-banner { padding: 22px 20px; }
    .cat-banner__title { font-size: 22px; }
}
@media (max-width: 860px) {
    .cat-listing__hero .pc-wrap { padding-top: 16px; padding-bottom: 24px; }
    .cat-listing--filter .cat-listing__hero .pc-wrap { padding-bottom: 0; }
    .cat-listing__body { display: block; padding-top: 16px; padding-bottom: 56px; }
    .cat-listing__body > .cat-filters { display: none; }
    .cat-row {
        grid-template-columns: minmax(0, 148px) minmax(0, 1fr); gap: 12px 14px; padding: 16px 0;
    }
    .cat-row__buy {
        grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center;
        justify-content: space-between; gap: 10px 16px;
    }
    .cat-row__buy .energy-label { margin: 0 auto 0 0; }
    .cat-row__cart { width: auto; margin-left: auto; }
    .cat-listing form button.cat-row__add,
    .cat-row__add { width: auto; min-width: 148px; min-height: 44px; font-size: 15px; }
    .cat-row__title { font-size: 16px; }
    .cat-row__specs { margin-top: 8px; }
    .cat-banner { grid-template-columns: minmax(0, 1fr); padding: 20px 16px; margin: 4px 0 12px; }
    .cat-toolbar {
        position: sticky; top: 56px; z-index: 6;
        margin: 0 -15px 18px; padding: 10px 15px 12px; background: #ffffff;
        border-bottom: 1px solid var(--pc-line);
    }
    .cat-listing--filter .cat-toolbar { align-items: center; }
    .cat-listing--filter .cat-toolbar__title { font-size: 22px; width: 100%; }
    .cat-listing--filter .cat-toolbar__count::before { display: none; }
    .cat-toolbar__filters { display: inline-flex; }
    .cat-toolbar__sort { width: 100%; margin-left: 0; }
    .cat-toolbar__sort select { min-width: 0; flex: 1; width: 100%; }
    .cat-toolbar__sort label { flex: 1; min-width: 0; }
    .cat-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
    .cat-grid > li { display: flex; grid-row: auto; }
    .cat-listing__lede { font-size: 16px; }
    .cat-spot { min-height: 0; padding: 24px 20px; }
    .cat-spot__title { font-size: 24px; }
    .cat-sheet {
        width: min(100%, 520px); margin: auto 0 0; border-radius: 20px 20px 0 0;
        box-shadow: 0 -24px 48px -16px rgba(17, 17, 17, .28);
    }
}

html.compare-open .wrapper.wrapper--page { padding-bottom: calc(var(--compare-bar-height, 108px) + 12px) !important; }
.compare-bar {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
    background: #ffffff; border-top: 1px solid var(--pc-line);
    box-shadow: 0 -16px 40px -24px rgba(17, 17, 17, .35);
}
.compare-bar__inner {
    display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px;
    padding-top: 12px; padding-bottom: calc(12px + env(safe-area-inset-bottom));
}
.compare-bar__count { margin: 0; font: 700 15px/1.2 var(--pc-font); color: var(--pc-ink); }
.compare-bar__list {
    display: flex; flex: 1 1 240px; flex-wrap: wrap; gap: 8px;
    margin: 0; padding: 0; list-style: none;
}
.compare-bar__list li {
    display: flex; align-items: center; gap: 8px; margin: 0;
    padding: 4px 4px 4px 8px; border: 1px solid var(--pc-line); border-radius: 10px;
    background: #ffffff;
}
.compare-bar__list a {
    display: flex; align-items: center; gap: 8px; min-width: 0;
    color: var(--pc-ink); text-decoration: none; font: 600 13px/1.2 var(--pc-font);
}
.compare-bar__list a:hover { color: var(--pc-ink); text-decoration: underline; text-underline-offset: 3px; }
.compare-bar__list img {
    display: block; width: 40px; height: 30px; object-fit: contain; background: #f4f4f5;
}
.compare-bar__list span {
    max-width: 14ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.compare-bar__x {
    flex: none; width: 28px; height: 28px; margin: 0; padding: 0;
    border: 0; border-radius: 6px; background: transparent;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath stroke='%23111111' stroke-width='1.6' stroke-linecap='round' d='m4 4 8 8M12 4 4 12'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: center; background-size: 12px 12px;
    cursor: pointer;
}
.compare-bar__x:hover { background-color: #f2f2f2; }
.compare-bar__actions { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.compare-bar__actions .pc-btn { min-height: 44px; padding: 0 18px; }
.compare-bar a.pc-btn.is-off { opacity: .45; pointer-events: none; }
.compare-bar a.pc-btn.pc-btn--buy,
.compare-page a.pc-btn.pc-btn--buy {
    background: var(--pc-buy) !important; color: #ffffff !important; text-decoration: none;
}
.compare-bar a.pc-btn.pc-btn--buy:hover,
.compare-page a.pc-btn.pc-btn--buy:hover { background: var(--pc-buy-hover) !important; color: #ffffff !important; text-decoration: none; }

.compare-page__body { padding-top: 8px; padding-bottom: 80px; }
.compare-table { display: grid; gap: 0; }
.compare-table__row {
    display: grid; grid-template-columns: 160px repeat(var(--compare-n), minmax(0, 1fr));
    gap: 16px 24px; padding: 16px 0; border-top: 1px solid var(--pc-line);
    align-items: start;
}
.compare-table__row--head { border-top: 0; padding-top: 0; }
.compare-table__key { font: 700 14px/1.4 var(--pc-font); color: var(--pc-muted); }
.compare-table__val { font: 500 15px/1.45 var(--pc-font); color: var(--pc-ink); }
.compare-card { display: grid; justify-items: start; gap: 10px; min-width: 0; }
.compare-card__media {
    position: relative; display: block; width: 100%; aspect-ratio: 16 / 10;
    background: #f4f4f5; overflow: hidden;
}
.compare-card__media img {
    position: absolute; inset: 0; display: block; box-sizing: border-box;
    width: 100%; height: 100%; padding: 6%; object-fit: contain;
}
.compare-card__title { margin: 0; font: 700 16px/1.3 var(--pc-font); letter-spacing: -.01em; text-wrap: pretty; }
.compare-page a.compare-card__title,
.compare-page .compare-card__title a { color: var(--pc-ink); text-decoration: none; }
.compare-page .compare-card__title a:hover { text-decoration: underline; text-underline-offset: 3px; }
.compare-card__price { margin: 0; font-variant-numeric: tabular-nums; }
.compare-card__price b { font-size: 26px; font-weight: 800; letter-spacing: -.02em; }
.compare-card form { width: 100%; }
.compare-card .pc-btn { width: 100%; }
.compare-page a.compare-card__drop {
    font: 600 14px/1.3 var(--pc-font); color: var(--pc-ink);
    text-decoration: underline; text-decoration-color: #b4b4bb; text-underline-offset: 3px;
}
.compare-page a.compare-card__drop:hover { text-decoration-color: currentColor; }
.pdp-price .energy-label { margin-bottom: 4px; }

@media (max-width: 860px) {
    .compare-table__row { grid-template-columns: repeat(var(--compare-n), minmax(0, 1fr)); }
    .compare-table__key { grid-column: 1 / -1; }
    .compare-bar__list span { max-width: 10ch; }
    .compare-bar__actions { width: 100%; margin-left: 0; }
    .compare-bar__actions .pc-btn { flex: 1; }
}

.pdp { caret-color: #111111; }
.pdp h1, .pdp h2, .pdp p, .pdp button { font-family: var(--pc-font); }
.pdp .pc-btn { -webkit-appearance: none; appearance: none; }
.pdp-hero > .pc-wrap { padding-top: 24px; padding-bottom: 56px; }
.pdp-hero .pc-crumbs ol { margin-bottom: 20px; }
.pdp-hero .pc-crumbs li:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pdp-hero__grid {
    display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(280px, .95fr);
    align-items: start; gap: 40px 64px;
}
.pdp-hero__media { min-width: 0; }
.pdp-hero__plate {
    display: grid; place-items: center; box-sizing: border-box;
    aspect-ratio: 4 / 3; padding: 8%; border-radius: 16px; background: #ffffff;
    box-shadow: 0 1px 2px rgba(17, 17, 17, .04), 0 24px 40px -28px rgba(17, 17, 17, .28);
}
.pdp-hero__plate img { display: block; width: 100%; height: 100%; object-fit: contain; }
.pdp-hero__buy { min-width: 0; }
.pdp-hero__brand { display: block; height: 22px; width: auto; max-width: 140px; margin: 0 0 14px; object-fit: contain; object-position: left center; }
.pdp-hero__title {
    margin: 0; font: 700 clamp(28px, 1.1vw + 20px, 40px)/1.12 var(--pc-font);
    letter-spacing: -.025em; color: var(--pc-ink); text-wrap: pretty;
}
.pdp-hero__checks { display: grid; gap: 8px; margin: 16px 0 0; padding: 0; list-style: none; }
.pdp-hero__checks li { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 16px; line-height: 1.4; font-weight: 650; color: var(--pc-ink); }
.pdp-hero__checks svg { flex: none; color: #15803d; }
.pdp-hero__lede { max-width: 42ch; margin: 16px 0 0; font-size: 17px; line-height: 1.55; color: var(--pc-ink-2); text-wrap: pretty; }
.pdp-price { display: grid; gap: 6px; margin: 28px 0 0; }
.pdp-price span[aria-hidden] {
    font-size: 17px; font-weight: 600; line-height: 1; color: var(--pc-ink-2);
    font-variant-numeric: tabular-nums; white-space: nowrap;
}
.pdp-price b { font-size: 40px; font-weight: 800; letter-spacing: -.03em; color: var(--pc-ink); }
.pdp-price small { font-size: 14px; font-weight: 500; color: var(--pc-muted); }
.pdp-stock {
    display: flex; align-items: center; gap: 8px; margin: 12px 0 0;
    font-size: 15px; font-weight: 600; color: var(--pc-ink);
}
.pdp-stock::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: #15803d; }
.pdp-stock.is-out { color: var(--pc-muted); }
.pdp-stock.is-out::before { background: #8e8e96; }
.pdp-hero__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.pdp-hero__actions .pc-btn { flex: 1 1 180px; min-height: 52px; }
.pdp-trust { display: grid; gap: 10px; margin: 28px 0 0; padding: 0; list-style: none; }
.pdp-trust li { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 15px; font-weight: 600; color: var(--pc-ink); }
.pdp-trust svg { flex: none; color: #15803d; }
.pdp .pdp-trust a { color: var(--pc-ink); text-decoration: underline; text-decoration-color: #b4b4bb; text-underline-offset: 3px; }
.pdp .pdp-trust a:hover { color: var(--pc-ink); text-decoration-color: currentColor; }

.pdp-section__title { margin: 0; font: 700 24px/1.2 var(--pc-font); letter-spacing: -.015em; color: var(--pc-ink); }
.pdp-combo { padding: 8px 0 56px; }
.pdp-combo__lede { margin: 12px 0 0; font-size: 16px; line-height: 1.55; color: var(--pc-muted); }
@media (min-width: 860px) { .pdp-combo__lede { white-space: nowrap; } }
.pdp-combo__form { margin-top: 24px; padding: 8px 22px 20px; border: 1px solid var(--pc-line); border-radius: 16px; background: #ffffff; }
.pdp-combo__list { margin: 0; padding: 0; list-style: none; }
.pdp-combo__item { margin: 0; padding: 16px 0; }
.pdp-combo__item + .pdp-combo__item { border-top: 1px solid var(--pc-line); }
.pdp-combo__item.is-main {
    display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; align-items: center; gap: 16px;
}
.pdp-combo__item label {
    display: grid; grid-template-columns: 18px 72px minmax(0, 1fr) auto; align-items: center; gap: 16px;
    margin: 0; cursor: pointer;
}
.pdp-combo__item input {
    appearance: none; -webkit-appearance: none; box-sizing: border-box;
    width: 18px; height: 18px; margin: 0; padding: 0;
    border: 1.5px solid var(--pc-line-strong); border-radius: 4px; background: #ffffff; cursor: pointer;
}
.pdp-combo__item input:checked {
    border-color: #111111; background: #111111 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='m3.5 8.2 3 3 6-6.4'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
}
.pdp-combo__thumb {
    display: grid; place-items: center; width: 72px; height: 72px; overflow: hidden;
    border-radius: 10px; background: var(--pc-plate);
}
.pdp-combo__thumb img { width: 100%; height: 100%; object-fit: contain; padding: 8%; box-sizing: border-box; }
.pdp-combo__copy { min-width: 0; display: grid; gap: 4px; }
.pdp-combo__copy strong { font-size: 15px; line-height: 1.35; color: var(--pc-ink); }
.pdp-combo__copy span { font-size: 13px; font-weight: 600; color: var(--pc-muted); }
.pdp-combo__price { font-size: 15px; font-weight: 700; color: var(--pc-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pdp-combo__item label:has(input:checked) .pdp-combo__thumb { box-shadow: inset 0 0 0 2px #111111; }
.pdp-combo__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin-top: 8px; padding-top: 16px; border-top: 1px solid var(--pc-line); }
.pdp-combo__total { margin: 0; font-size: 16px; font-weight: 700; color: var(--pc-ink); font-variant-numeric: tabular-nums; }
.pdp-specs { padding: 8px 0 56px; }
.pdp-specs__list {
    max-width: 720px; margin: 20px 0 0; padding: 4px 22px; border: 1px solid var(--pc-line);
    border-radius: 14px; background: #ffffff;
}
.pdp-specs__list > div {
    display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 16px; padding: 14px 0;
}
.pdp-specs__list > div + div { border-top: 1px solid var(--pc-line); }
.pdp-specs__list dt { margin: 0; font-size: 14px; font-weight: 500; color: var(--pc-muted); }
.pdp-specs__list dd { margin: 0; font-size: 16px; font-weight: 600; color: var(--pc-ink); }

.pdp-related { padding: 8px 0 64px; }
.pdp-related__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 12px 24px; margin-bottom: 24px; }
.pdp-related a.pdp-related__all {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 15px; font-weight: 700; color: var(--pc-ink);
    text-decoration: underline; text-decoration-color: #b4b4bb; text-underline-offset: 4px;
}
.pdp-related a.pdp-related__all:hover { color: var(--pc-ink); text-decoration-color: currentColor; }
.pdp-related a.pdp-related__all svg { transition: transform 200ms var(--pc-ease); }
.pdp-related a.pdp-related__all:hover svg { transform: translateX(2px); }
.pdp .cat-grid { margin-top: 0; }
.pdp a.cat-tile__link { color: var(--pc-ink); text-decoration: none; }
.pdp a.cat-tile__link:focus-visible { outline: none !important; }

.pdp-bar { display: none; }

@media (max-width: 1100px) {
    .pdp-hero__grid { gap: 32px 40px; }
    .pdp-specs__list > div { grid-template-columns: 132px minmax(0, 1fr); }
    .pdp .cat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
}
@media (max-width: 860px) {
    .pdp { padding-bottom: 88px; }
    .pdp-hero > .pc-wrap { padding-top: 12px; padding-bottom: 28px; }
    .pdp-hero__grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
    .pdp-hero__plate { aspect-ratio: 4 / 3; padding: 6%; }
    .pdp-hero__title { font-size: 26px; }
    .pdp-hero__lede { margin-top: 12px; font-size: 16px; }
    .pdp-price { margin-top: 20px; }
    .pdp-price b { font-size: 32px; }
    .pdp-hero__actions { margin-top: 18px; }
    .pdp-hero__actions .pc-btn { flex: 1 1 100%; min-height: 48px; }
    .pdp-trust { margin-top: 20px; }
    .pdp-specs { padding-bottom: 40px; }
    .pdp-specs__list { padding-left: 16px; padding-right: 16px; }
    .pdp-specs__list > div { grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 12px 0; }
    .pdp-related { padding-bottom: 48px; }
    .pdp-combo__form { padding-left: 16px; padding-right: 16px; }
    .pdp-combo__item.is-main,
    .pdp-combo__item label { grid-template-columns: 18px 56px minmax(0, 1fr); gap: 12px; }
    .pdp-combo__item.is-main { grid-template-columns: 56px minmax(0, 1fr); }
    .pdp-combo__price { grid-column: 2 / -1; }
    .pdp-combo__item.is-main .pdp-combo__price { grid-column: 2; }
    .pdp .cat-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
    .pdp .cat-grid > li { display: flex; grid-row: auto; }
    .pdp-bar {
        display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name add" "price add";
        align-items: center; column-gap: 12px; row-gap: 2px;
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; box-sizing: border-box;
        padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
        border-top: 1px solid var(--pc-line); background: #ffffff;
        box-shadow: 0 -16px 32px -20px rgba(17, 17, 17, .28);
    }
    .pdp-bar__name {
        grid-area: name; margin: 0; font-size: 13px; font-weight: 600; line-height: 1.3; color: var(--pc-ink);
        overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }
    .pdp-bar__price { grid-area: price; margin: 0; font-size: 13px; font-weight: 600; color: var(--pc-ink-2); font-variant-numeric: tabular-nums; }
    .pdp-bar__price b { font-size: 18px; font-weight: 800; letter-spacing: -.02em; color: var(--pc-ink); }
    .pdp-bar__add { grid-area: add; min-height: 48px; padding: 0 16px; font-size: 15px; }
}

.pc-perks { background: #111111; color: #f2f2f2; }
.pc-perks__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin-top: 0; margin-bottom: 0; padding-top: 32px; padding-bottom: 32px; list-style: none; }
.pc-perks__list li { display: flex; align-items: center; gap: 14px; margin: 0; font-size: 14px; line-height: 1.45; color: #a6a6ad; }
.pc-perks__list img { flex: none; width: 32px; height: 32px; filter: invert(1); opacity: .85; }
.pc-perks__list strong { display: block; font-size: 16px; font-weight: 700; color: #ffffff; }

.pc-about { display: grid; grid-template-columns: minmax(0, 1fr) 320px; align-items: start; gap: 48px 72px; padding-top: 64px; padding-bottom: 80px; }
.pc-about:not(:has(.pc-about__main)) { grid-template-columns: minmax(0, 1fr); }
.pc-prose { max-width: 68ch; font-size: 17px; line-height: 1.7; color: var(--pc-ink-2); }
.pc-prose.is-collapsed { max-height: 620px; overflow: hidden; -webkit-mask-image: linear-gradient(#000000 calc(100% - 180px), transparent); mask-image: linear-gradient(#000000 calc(100% - 180px), transparent); }
.pc-prose > :first-child { margin-top: 0; }
.pc-prose h2,
.pc-prose h3 { margin: 44px 0 12px; font: 700 24px/1.25 var(--pc-font); letter-spacing: -.015em; color: var(--pc-ink); text-wrap: balance; }
.pc-prose p { margin: 0 0 16px; color: var(--pc-ink-2); }
.pc-prose img { display: block; width: 100%; max-width: 100%; height: auto; margin: 0 0 24px; border-radius: 12px; }
.pc-prose h2 + img,
.pc-prose h3 + img { margin-top: 8px; }
.pc-prose p + img { margin-top: 36px; }
.pc-listing .pc-prose a { color: var(--pc-red-hover); text-decoration: underline; text-underline-offset: 3px; }
.pc-listing .pc-prose a:hover { color: var(--pc-ink); }
.pc-prose__toggle { margin-top: 12px; }
.pc-about__aside { position: sticky; top: 136px; display: grid; gap: 28px; }
.pc-support { padding: 24px; border-radius: 14px; background: var(--pc-plate); }
.pc-support__img { display: block; width: 72px; height: 72px; object-fit: cover; object-position: top; border-radius: 50%; background: #ffffff; }
.pc-support__title { margin: 16px 0 6px; font: 700 20px/1.25 var(--pc-font); letter-spacing: -.01em; color: var(--pc-ink); }
.pc-support__text { margin: 0 0 18px; font-size: 15px; line-height: 1.55; color: var(--pc-muted); }
.pc-company__title { margin: 0 0 6px; font: 700 16px/1.3 var(--pc-font); color: var(--pc-ink); }
.pc-company__list { margin: 0; padding: 0; list-style: none; }
.pc-company__list li { margin: 0; border-bottom: 1px solid var(--pc-line); }
.pc-listing .pc-company__list a { display: block; padding: 10px 0; font-size: 15px; line-height: 20px; color: var(--pc-ink-2); text-decoration: none; }
.pc-listing .pc-company__list a:hover { color: var(--pc-red-hover); }

@media (max-width: 1100px) {
    .pc-hero__grid { grid-template-columns: minmax(0, 1fr) 340px; gap: 32px 40px; }
    .pc-about { grid-template-columns: minmax(0, 1fr) 280px; gap: 48px; }
}
@media (max-width: 1023px) {
    .pc-hero__grid { grid-template-columns: minmax(0, 1fr); padding-top: 20px; padding-bottom: 32px; }
    .pc-help { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 24px; }
    .pc-help__title,
    .pc-help__text { grid-column: 1; }
    .pc-help__text { margin-bottom: 0; }
    .pc-help__btn { grid-column: 2; grid-row: 1 / span 2; width: auto; }
    .pc-listing a.pc-help__contact { grid-column: 1 / -1; }
    .pc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
    .pc-perks__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 32px; }
    .pc-about { grid-template-columns: minmax(0, 1fr); gap: 48px; padding-top: 48px; padding-bottom: 64px; }
    .pc-about__aside { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 32px; }
}
@media (max-width: 640px) {
    .pc-wrap { padding-left: 16px; padding-right: 16px; }
    .pc-crumbs ol { margin-bottom: 16px; }
    .pc-hero__title { font-size: 34px; }
    .pc-hero__intro { margin-top: 14px; }
    .pc-hero__intro h2 { font-size: 17px; }
    .pc-hero__intro p { font-size: 15px; }
    .pc-help { display: block; padding: 20px; }
    .pc-help__text { margin-bottom: 18px; }
    .pc-help__btn { width: 100%; }
    .pc-shelf { padding-top: 28px; padding-bottom: 48px; }
    .pc-toolbar { margin-bottom: 18px; }
    .pc-toolbar__title { font-size: 21px; }
    .pc-chips { gap: 6px; }
    .pc-chip { gap: 6px; padding: 0 11px; font-size: 14px; }
    .pc-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
    .pc-grid > li { display: block; grid-row: auto; }
    .pc-tile {
        grid-row: auto; grid-template-columns: 116px minmax(0, 1fr); grid-template-rows: none;
        grid-template-areas: "plate title" "plate lines" "plate badge" "specs specs" "foot foot";
        column-gap: 14px; padding: 12px 12px 16px;
    }
    .pc-tile__plate { grid-area: plate; align-self: start; aspect-ratio: 1; margin: 0; }
    .pc-tile__plate img { padding: 8% 17%; }
    .pc-tile__title { grid-area: title; align-self: end; margin: 4px 0 4px; font-size: 18px; }
    .pc-tile__lines { grid-area: lines; margin: 0 0 8px; font-size: 13px; }
    .pc-tile__badge { grid-area: badge; position: static; align-self: start; justify-self: start; max-width: 100%; padding: 4px 9px 4px 0; box-shadow: none; font-size: 12px; }
    .pc-tile__specs { grid-area: specs; margin: 14px 4px 16px; }
    .pc-tile__specs > div { grid-template-columns: 80px minmax(0, 1fr); padding: 8px 0; }
    .pc-tile__foot { grid-area: foot; margin: 0 4px; }
    .pc-tile__price b { font-size: 26px; }
    .pc-perks__list { gap: 20px 16px; padding-top: 28px; padding-bottom: 28px; }
    .pc-perks__list li { flex-direction: column; align-items: flex-start; gap: 10px; }
    .pc-about { padding-top: 40px; padding-bottom: 56px; }
    .pc-prose { font-size: 16px; }
    .pc-prose h2,
    .pc-prose h3 { margin-top: 36px; font-size: 21px; }
    .pc-about__aside { grid-template-columns: minmax(0, 1fr); }
}

html.pc-ch-open { overflow: hidden; }
.pc-ch {
    position: fixed; inset: 0 0 0 auto; box-sizing: border-box;
    width: min(100vw, 520px); height: 100%; max-width: none; max-height: none;
    margin: 0; padding: 0; border: 0; background: #ffffff;
    box-shadow: -24px 0 48px -24px rgba(0, 0, 0, .35);
    transform: translateX(100%);
    transition: transform 340ms cubic-bezier(.32, .72, 0, 1), overlay 340ms allow-discrete, display 340ms allow-discrete;
}
.pc-ch[open] { transform: none; }
@starting-style { .pc-ch[open] { transform: translateX(100%); } }
.pc-ch::backdrop { background: rgba(17, 17, 17, 0); transition: background-color 340ms ease, overlay 340ms allow-discrete, display 340ms allow-discrete; }
.pc-ch[open]::backdrop { background: rgba(17, 17, 17, .55); }
@starting-style { .pc-ch[open]::backdrop { background: rgba(17, 17, 17, 0); } }
.pc-ch__panel { display: flex; flex-direction: column; height: 100%; }
.pc-ch__head { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 14px 12px 28px; border-bottom: 1px solid var(--pc-line); }
.pc-ch__title { margin: 0; font: 700 19px/1.25 var(--pc-font); letter-spacing: -.01em; color: var(--pc-ink); }
.pc-ch__close { display: grid; place-items: center; width: 44px; height: 44px; min-width: 0; margin: 0; padding: 0; border: 0; border-radius: 10px; background: transparent; color: var(--pc-ink); cursor: pointer; transition: background-color 160ms ease; }
.pc-ch__close:hover { background: var(--pc-plate); }
.pc-ch__progress { flex: none; padding: 20px 28px 0; }
.pc-ch__status { margin: 0 0 10px; font-size: 14px; font-weight: 600; line-height: 20px; color: var(--pc-muted); font-variant-numeric: tabular-nums; }
.pc-ch__bar { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 6px; margin: 0; padding: 0; list-style: none; }
.pc-ch__bar li { position: relative; height: 4px; margin: 0; overflow: hidden; border-radius: 2px; background: var(--pc-line); }
.pc-ch__bar li::after { content: ""; position: absolute; inset: 0; background: #111111; transform: scaleX(0); transform-origin: left center; transition: transform 340ms var(--pc-ease), background-color 200ms ease; }
.pc-ch__bar li.is-done::after { transform: scaleX(1); }
.pc-ch__bar li.is-current::after { transform: scaleX(1); background: var(--pc-red); }
.pc-ch__body { flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; padding: 24px 28px 32px; }
.pc-ch__step { min-width: 0; margin: 0; padding: 0; border: 0; }
.pc-ch__q { display: block; float: none; width: auto; margin: 0 0 20px; padding: 0; border: 0; background: none; font: 700 26px/1.2 var(--pc-font); letter-spacing: -.02em; color: var(--pc-ink); text-wrap: balance; }
.pc-ch__opts { display: grid; gap: 10px; }
.pc-ch__opt {
    position: relative; display: grid; grid-template-columns: 20px minmax(0, 1fr); align-items: center; column-gap: 14px; row-gap: 2px;
    box-sizing: border-box; min-height: 64px; margin: 0; padding: 14px 18px;
    border: 1px solid var(--pc-line-strong); border-radius: 12px; background: #ffffff;
    font-weight: 400; cursor: pointer;
    transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}
.pc-ch__opt input { grid-row: 1 / -1; width: 20px; height: 20px; margin: 0; accent-color: var(--pc-ink); cursor: pointer; }
.pc-ch__opt input:focus-visible { outline: none !important; }
.pc-ch__opt-t { grid-column: 2; font-size: 17px; font-weight: 700; line-height: 1.3; color: var(--pc-ink); }
.pc-ch__opt-h { grid-column: 2; font-size: 14px; line-height: 1.4; color: var(--pc-muted); }
.pc-ch__opt:hover { border-color: #111111; }
.pc-ch__opt:has(input:checked) { border-color: #111111; box-shadow: inset 0 0 0 1px #111111; background: #fafafa; }
.pc-ch__opt:has(input:focus-visible) { outline: 2px solid #111111; outline-offset: 2px; }
.pc-ch__foot { flex: none; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 16px 28px calc(16px + env(safe-area-inset-bottom)); border-top: 1px solid var(--pc-line); background: #ffffff; }
.pc-ch__foot [data-next],
.pc-ch__foot [data-cta] { margin-left: auto; }
.pc-ch__error { flex-basis: 100%; margin: 0; font-size: 14px; font-weight: 600; line-height: 20px; color: #b91c1c; }

.pc-ch__plate { display: grid; place-items: center; aspect-ratio: 16 / 9; margin: 0 0 20px; overflow: hidden; border-radius: 12px; background: var(--pc-plate); }
.pc-ch__plate img { display: block; box-sizing: border-box; width: 100%; height: 100%; padding: 3% 10%; object-fit: contain; mix-blend-mode: multiply; }
.pc-ch__pick-title { margin: 0; font: 700 26px/1.2 var(--pc-font); letter-spacing: -.02em; color: var(--pc-ink); }
.pc-ch__pick-title:focus { outline: none; }
.pc-ch__price { margin: 6px 0 18px; font-size: 22px; font-weight: 800; line-height: 1.2; color: var(--pc-ink); font-variant-numeric: tabular-nums; }
.pc-ch__why { display: grid; gap: 10px; margin: 0 0 20px; padding: 0; list-style: none; }
.pc-ch__why li {
    position: relative; margin: 0; padding-left: 32px; font-size: 16px; line-height: 1.45; color: var(--pc-ink-2);
}
.pc-ch__why li::before {
    content: ""; position: absolute; top: 1px; left: 0; width: 22px; height: 22px; border-radius: 50%;
    background: #111111 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='m2.5 6.2 2.3 2.3 4.7-5' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px no-repeat;
}
.pc-ch__specs { margin: 0; padding: 0; border-top: 1px solid var(--pc-line); }
.pc-ch__alt { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--pc-line); }
.pc-ch__alt-title { margin: 0 0 12px; font: 700 16px/1.3 var(--pc-font); color: var(--pc-ink); }
.pc-ch a.pc-ch__alt-card {
    display: grid; grid-template-columns: 88px minmax(0, 1fr) auto; align-items: center; gap: 16px;
    padding: 10px 14px 10px 10px; border: 1px solid var(--pc-line-strong); border-radius: 12px;
    color: var(--pc-ink); text-decoration: none; transition: border-color 160ms ease;
}
.pc-ch a.pc-ch__alt-card:hover { border-color: #111111; color: var(--pc-ink); }
.pc-ch__alt-plate { display: block; height: 72px; overflow: hidden; border-radius: 8px; background: var(--pc-plate); }
.pc-ch__alt-plate img { display: block; box-sizing: border-box; width: 100%; height: 100%; padding: 6%; object-fit: contain; mix-blend-mode: multiply; }
.pc-ch__alt-body { display: grid; gap: 3px; min-width: 0; }
.pc-ch__alt-body strong { font-size: 16px; font-weight: 700; line-height: 1.3; }
.pc-ch__alt-price { font-size: 15px; font-weight: 700; line-height: 1.3; font-variant-numeric: tabular-nums; }
.pc-ch__alt-why { font-size: 14px; line-height: 1.4; color: var(--pc-muted); }
.pc-ch__alt-arrow { color: var(--pc-muted); transition: transform 200ms var(--pc-ease); }
.pc-ch a.pc-ch__alt-card:hover .pc-ch__alt-arrow { transform: translateX(3px); color: var(--pc-ink); }
.pc-ch__answers { margin: 24px 0 0; font-size: 14px; line-height: 1.5; color: var(--pc-muted); }

@media (max-width: 640px) {
    .pc-ch { inset: 0; width: 100%; box-shadow: none; transform: translateY(100%); }
    @starting-style { .pc-ch[open] { transform: translateY(100%); } }
    .pc-ch__head { padding: 8px 8px 8px 20px; }
    .pc-ch__progress { padding: 16px 20px 0; }
    .pc-ch__body { padding: 20px 20px 28px; }
    .pc-ch__foot { padding: 12px 20px calc(12px + env(safe-area-inset-bottom)); }
    .pc-ch__q { font-size: 23px; }
    .pc-ch__pick-title { font-size: 23px; }
}
@media (prefers-reduced-motion: reduce) {
    .pc-listing *,
    .pc-ch,
    .pc-ch *,
    .pc-ch::backdrop,
    .home-shelf *,
    .home-shelf__track { transition-duration: 0s !important; animation: none !important; scroll-behavior: auto; }
    .pc-tile:hover,
    .pc-tile:hover .pc-tile__plate img,
    .cat-tile:hover .cat-tile__plate img { transform: none; }
}

/* PC configurator (/gaming-racunari/{slug}). The root also carries .pc-listing, so tokens, crumbs, .pc-btn, .pc-chip and .pc-perks come from the listing above.
   --cfg-head (fixed header), --cfg-bar-h (sticky bar) and --cfg-land (where #group links land) are kept in sync by pc-configurator.js.
   --cfg-head-compact mirrors the header's .is-compact bar height at >=1200px. */
.cfg { --cfg-head: 112px; --cfg-head-compact: 0px; --cfg-bar-h: 65px; --cfg-land: calc(var(--cfg-head) + var(--cfg-bar-h) + 16px); }
@media (min-width: 1200px) {
    .cfg { --cfg-head-compact: 60px; }
}
/* The page wrapper clips with overflow: hidden, which turns it into a scroll container and stops position: sticky. */
.wrapper.wrapper--page:has(.pc-listing) { overflow: clip; }
.cfg-hero > .pc-wrap { padding-top: 24px; padding-bottom: 48px; }
.cfg-hero .pc-crumbs ol { margin-bottom: 16px; }
.cfg-hero .pc-crumbs li:last-child { min-width: 0; }
.cfg-hero__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: center; gap: 32px 64px; }
.cfg-hero__media { display: grid; place-items: center; min-width: 0; }
.cfg-hero__media img { display: block; width: 100%; max-width: 640px; height: auto; max-height: 540px; object-fit: contain; mix-blend-mode: multiply; }
.cfg-hero__info { min-width: 0; }
.cfg-badge {
    display: inline-flex; align-items: center; gap: 7px; box-sizing: border-box; max-width: 100%;
    margin: 0 0 16px; padding: 6px 12px 6px 10px; border-radius: 999px; background: #ffffff;
    font-size: 13px; font-weight: 600; line-height: 1.2; color: var(--pc-ink);
    box-shadow: 0 1px 3px rgba(17, 17, 17, .12);
}
.cfg-badge::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--pc-tone, #8e8e96); }
.cfg-hero__lines { margin: 10px 0 0; font-size: 17px; line-height: 1.45; color: var(--pc-muted); }
.cfg-hero__lines span + span::before { content: " · "; }
.cfg-specs { margin: 24px 0 0; padding: 2px 18px; border: 1px solid var(--pc-line); border-radius: 14px; background: #ffffff; }
.cfg-specs > div { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 12px; padding: 11px 0; }
.cfg-specs > div + div { border-top: 1px solid var(--pc-line); }
.cfg-specs dt { margin: 0; font-size: 14px; font-weight: 500; line-height: 20px; color: var(--pc-muted); }
.cfg-specs dd { margin: 0; font-size: 15px; font-weight: 600; line-height: 20px; color: var(--pc-ink); overflow-wrap: anywhere; }
.cfg-hero__fit { margin: 14px 0 0; font-size: 14px; line-height: 1.5; color: var(--pc-muted); }
.cfg-buy { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 18px 24px; margin-top: 28px; }
.cfg-price { display: grid; gap: 6px; margin: 0; }
.cfg-price__label { font-size: 14px; font-weight: 500; line-height: 1; color: var(--pc-muted); }
.cfg-price__value,
.cfg-sum__value,
.cfg-bar__value [data-total] { display: inline-block; font-weight: 600; color: var(--pc-ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cfg-price__value { font-size: 17px; line-height: 1; }
.cfg-price__value b { font-size: 38px; font-weight: 800; letter-spacing: -.025em; color: var(--pc-ink); }
.cfg-buy__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.cfg-buy__actions .pc-btn { flex: 1 1 auto; min-height: 52px; }
.pc-listing a.pc-btn--ghost,
.pc-listing a.pc-btn--ghost:hover { color: var(--pc-ink); text-decoration: none; }

.cfg-body { padding: 48px 0 72px; }
.cfg-body__grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; align-items: start; gap: 40px 48px; }
.cfg-main { min-width: 0; }
.cfg-main__title { margin: 0; font: 700 24px/1.2 var(--pc-font); letter-spacing: -.015em; color: var(--pc-ink); }
.cfg-main__intro { max-width: 62ch; margin: 6px 0 0; font-size: 15px; line-height: 1.55; color: var(--pc-muted); }
.cfg-nav { margin: 12px 0 0; padding: 12px 0; }
.cfg-nav ul {
    position: relative; display: flex; flex-wrap: nowrap; gap: 8px; margin: -4px; padding: 4px; list-style: none;
    overflow-x: auto; scrollbar-width: none;
}
.cfg-nav ul::-webkit-scrollbar { display: none; }
.cfg-nav li { flex: none; margin: 0; }
.pc-listing a.cfg-nav__link { color: var(--pc-ink); text-decoration: none; white-space: nowrap; }
.pc-listing a.cfg-nav__link[aria-current] { background: #111111; border-color: #111111; color: #ffffff; }
.cfg-nav__link[aria-current] .pc-chip__n { color: #b4b4bb; }

.cfg-group { margin-top: 24px; scroll-margin-top: var(--cfg-land); }
.cfg-slot { position: relative; scroll-margin-top: var(--cfg-land); }
.cfg-slot--fixed:focus { outline: none !important; }
.cfg-slot--fixed:focus-visible { outline: 2px solid #111111 !important; outline-offset: -2px; border-radius: 15px; }
.cfg-slot.is-flash::after {
    content: ""; position: absolute; inset: 0; border-radius: 15px; background: var(--pc-buy-tint); mix-blend-mode: multiply; pointer-events: none;
    animation: cfg-flash 1400ms ease both;
}
@keyframes cfg-flash { 0% { opacity: 0; } 20% { opacity: 1; } 100% { opacity: 0; } }
.cfg-group__title { margin: 0 0 12px; font: 700 18px/1.3 var(--pc-font); letter-spacing: -.01em; color: var(--pc-ink); }
.cfg-group__title:focus { outline: none !important; }
.cfg-group__title:focus-visible { outline: 2px solid #111111 !important; outline-offset: 4px; border-radius: 4px; }
.cfg-slots { border: 1px solid var(--pc-line); border-radius: 16px; background: #ffffff; }
.cfg-slot + .cfg-slot { border-top: 1px solid var(--pc-line); }
.cfg-slot__h { margin: 0; padding: 0; font: inherit; }
.cfg-slot__head {
    display: grid; grid-template-columns: 56px minmax(0, 1fr) auto auto; grid-template-areas: "thumb text delta more";
    align-items: center; column-gap: 16px; box-sizing: border-box; width: 100%; min-width: 0; min-height: 80px; margin: 0; padding: 12px 18px 12px 12px;
    border: 0; border-radius: 15px; background: transparent; color: var(--pc-ink);
    font: inherit; text-align: left; cursor: pointer;
    transition: background-color 160ms ease;
}
.cfg-slot--fixed .cfg-slot__head { grid-template-columns: 56px minmax(0, 1fr) auto; grid-template-areas: "thumb text delta"; cursor: default; }
button.cfg-slot__head:hover { background: #fafafa; }
.pc-listing .cfg-slot__head:focus-visible { outline-offset: -2px; }
.cfg-slot.is-open button.cfg-slot__head { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.cfg-slot__head > .cfg-thumb { grid-area: thumb; }
.cfg-thumb { display: grid; place-items: center; box-sizing: border-box; width: 56px; height: 56px; overflow: hidden; border-radius: 10px; background: var(--pc-plate); }
.cfg-thumb img { display: block; box-sizing: border-box; width: 100%; height: 100%; padding: 5px; object-fit: contain; mix-blend-mode: multiply; }
.cfg-thumb--sm { width: 44px; height: 44px; border-radius: 8px; }
.cfg-thumb:not(:has(img:not([hidden]))) {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a8a90' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='6' width='12' height='12' rx='2'/%3E%3Crect x='9.5' y='9.5' width='5' height='5' rx='1'/%3E%3Cpath d='M9 3v3M15 3v3M9 18v3M15 18v3M3 9h3M3 15h3M18 9h3M18 15h3'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 45%;
}
.cfg-slot__text { grid-area: text; display: grid; gap: 3px; min-width: 0; }
.cfg-slot__label { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: 13px; font-weight: 600; line-height: 18px; color: var(--pc-muted); }
.cfg-slot__changed { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 700; color: var(--pc-buy); }
.cfg-slot__changed::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--pc-buy); }
.cfg-slot__part { font-size: 16px; font-weight: 700; line-height: 1.35; color: var(--pc-ink); overflow-wrap: anywhere; }
.cfg-slot__delta { grid-area: delta; font-size: 15px; font-weight: 600; line-height: 1.3; color: var(--pc-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cfg-slot.is-changed .cfg-slot__delta { font-weight: 700; color: var(--pc-ink); }
.cfg-slot__more { grid-area: more; display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px; min-width: 100px; font-size: 13px; font-weight: 500; color: var(--pc-muted); white-space: nowrap; }
.cfg-slot__chev { flex: none; color: var(--pc-ink); transition: transform 220ms var(--pc-ease); }
.cfg-slot__head[aria-expanded="true"] .cfg-slot__chev { transform: rotate(180deg); }
.cfg-slot__panel { padding: 4px 16px 18px; }
.cfg-slot.is-open .cfg-slot__panel { animation: cfg-panel-in 240ms var(--pc-ease) both; }
@keyframes cfg-panel-in { from { opacity: 0; transform: translateY(-6px); } }

.cfg-opts { min-width: 0; margin: 0; padding: 0; border: 0; }
.cfg-search { position: relative; margin: 0 0 10px; }
.cfg-search svg { position: absolute; top: 50%; left: 14px; color: var(--pc-muted); transform: translateY(-50%); pointer-events: none; }
.cfg-search input[type="search"] {
    display: block; box-sizing: border-box; width: 100%; height: 46px; margin: 0; padding: 0 14px 0 42px;
    border: 1px solid var(--pc-line-strong); border-radius: 10px; background: #ffffff; box-shadow: none;
    font: 400 16px/1.2 var(--pc-font); color: var(--pc-ink);
    transition: border-color 160ms ease;
}
.cfg-search input[type="search"]::placeholder { color: var(--pc-muted); opacity: 1; }
.cfg-search input[type="search"]:hover { border-color: #8e8e96; }
.cfg-search input[type="search"]:focus { border-color: #111111; outline: none !important; }
.cfg-search input[type="search"]:focus-visible { outline: 2px solid #111111 !important; outline-offset: 2px; }
.cfg .cfg-gpu-brands { display: flex; flex-wrap: wrap; align-items: stretch; gap: 8px; margin: 12px 0; }
.cfg .cfg-gpu-brands .cfg-gpu-brand {
    position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 12px;
    box-sizing: border-box; min-width: 0; min-height: 44px; margin: 0; padding: 10px 12px;
    border: 1px solid var(--pc-line); border-radius: 10px; background: #ffffff; color: var(--pc-ink);
    cursor: pointer; touch-action: manipulation; -webkit-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent;
}
.cfg .cfg-gpu-brands .cfg-gpu-brand__input[type="checkbox"] {
    position: absolute; inset: 0; z-index: 1; display: block; box-sizing: border-box;
    width: 100%; height: 100%; margin: 0; padding: 0; border: 0; opacity: 0; cursor: pointer;
}
.cfg .cfg-gpu-brand__logo { flex: 0 1 68px; width: 68px; max-width: 100%; height: 20px; object-fit: contain; pointer-events: none; -webkit-touch-callout: none; }
.cfg .cfg-gpu-brand__track {
    position: relative; flex: 0 0 36px; box-sizing: border-box; width: 36px; height: 22px;
    border: 1px solid var(--pc-muted); border-radius: 999px; background: var(--pc-plate); pointer-events: none;
    transition: background-color 160ms ease, border-color 160ms ease;
}
.cfg .cfg-gpu-brand__track::before {
    content: ""; position: absolute; top: 2px; left: 2px; box-sizing: border-box; width: 16px; height: 16px;
    border: 1px solid var(--pc-muted); border-radius: 50%; background: #ffffff;
    transition: transform 160ms var(--pc-ease), border-color 160ms ease;
}
.cfg .cfg-gpu-brand__input:checked ~ .cfg-gpu-brand__track { border-color: var(--pc-buy); background: var(--pc-buy); }
.cfg .cfg-gpu-brand__input:checked ~ .cfg-gpu-brand__track::before { border-color: transparent; transform: translateX(14px); }
.cfg .cfg-gpu-brands .cfg-gpu-brand:has(.cfg-gpu-brand__input:focus-visible) { outline: 2px solid var(--pc-ink); outline-offset: 3px; }
.cfg .cfg-gpu-brands .cfg-gpu-brand:active { background: var(--pc-plate); }
@media (hover: hover) and (pointer: fine) {
    .cfg .cfg-gpu-brands .cfg-gpu-brand:hover { border-color: var(--pc-ink); }
}
@media (max-width: 1023px) {
    .cfg .cfg-gpu-brands { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); width: 100%; }
    .cfg .cfg-gpu-brands .cfg-gpu-brand { flex-wrap: wrap; gap: 8px; width: 100%; padding: 10px 8px; }
    .cfg .cfg-gpu-brand__logo { flex: 0 0 68px; }
}
@media (prefers-reduced-motion: reduce) {
    .cfg .cfg-gpu-brand__track,
    .cfg .cfg-gpu-brand__track::before { transition: none; }
}
.cfg-opts__list { display: grid; gap: 6px; }
.cfg-opt {
    display: grid; grid-template-columns: minmax(0, 1fr) 44px; align-items: center; column-gap: 4px;
    box-sizing: border-box; min-height: 62px; margin: 0; padding: 8px 6px 8px 14px;
    border: 1px solid var(--pc-line); border-radius: 12px; background: #ffffff;
    font-weight: 400;
    transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}
.cfg-opt:not(:has(.cfg-opt__info)) { grid-template-columns: minmax(0, 1fr); padding-right: 16px; }
.cfg-opt:hover { border-color: #8e8e96; }
.cfg-opt:has(input:checked) { border-color: #111111; box-shadow: inset 0 0 0 1px #111111; background: #fafafa; }
.cfg-opt:has(input:focus-visible) { outline: 2px solid #111111; outline-offset: 2px; }
.cfg-opt__pick {
    display: grid; grid-template-columns: 20px 44px minmax(0, 1fr) auto; grid-template-areas: "radio thumb text delta";
    align-items: center; column-gap: 12px; min-width: 0; cursor: pointer;
}
.cfg-opt input[type="radio"] { grid-area: radio; width: 20px; height: 20px; margin: 0; accent-color: var(--pc-ink); cursor: pointer; }
.cfg-opt input[type="radio"]:focus-visible { outline: none !important; }
.cfg-opt .cfg-thumb { grid-area: thumb; }
.cfg-opt__text { grid-area: text; display: grid; justify-items: start; gap: 4px; min-width: 0; }
.cfg-opt__title { font-size: 15px; font-weight: 600; line-height: 1.35; color: var(--pc-ink); overflow-wrap: anywhere; }
.cfg-opt__tag { padding: 2px 8px; border-radius: 999px; background: var(--pc-plate); font-size: 12px; font-weight: 600; line-height: 18px; color: var(--pc-ink-2); }
.cfg-opt__meta { grid-area: delta; display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 5px 7px; min-width: 0; }
.cfg-opt__delta { font-size: 14px; font-weight: 600; line-height: 1.3; color: var(--pc-ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cfg-opt__badge { max-width: 100%; padding: 3px 8px; border-radius: 5px; background: var(--cfg-badge-bg, #eaf4ff); color: var(--cfg-badge-color, #174675); font-size: 11px; font-weight: 700; line-height: 1.3; text-align: center; overflow-wrap: anywhere; }
.cfg-opt__old-delta { color: var(--pc-muted); font-size: 12px; line-height: 1.3; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cfg-opt__info {
    display: grid; place-items: center; box-sizing: border-box; width: 44px; height: 44px; min-width: 0; margin: 0; padding: 0;
    border: 0; border-radius: 10px; background: transparent; color: var(--pc-muted); cursor: pointer;
    transition: color 160ms ease, background-color 160ms ease;
}
.cfg-opt__info:hover { color: var(--pc-ink); background: var(--pc-plate); }
.cfg-opt__info:focus-visible { outline: 2px solid #111111; outline-offset: 2px; }
.cfg-opts__empty { margin: 10px 2px 0; font-size: 14px; line-height: 1.5; color: var(--pc-muted); }

.cfg-info {
    box-sizing: border-box; width: calc(100vw - 32px); height: calc(100dvh - 32px); max-height: calc(100dvh - 32px);
    margin: auto; padding: 0; border: 1px solid var(--pc-line); border-radius: 16px; background: #ffffff; color: var(--pc-ink);
    box-shadow: 0 1px 2px rgba(17, 17, 17, .04), 0 24px 48px -20px rgba(17, 17, 17, .4);
    font-family: var(--pc-font);
}
.cfg-info::backdrop { background: rgba(17, 17, 17, .5); }
.cfg-info[open] {
    display: flex; flex-direction: column;
    animation: cfg-info-in 200ms var(--pc-ease) both;
}
.cfg-info[open]::backdrop { animation: cfg-fade 200ms ease both; }
@keyframes cfg-info-in { from { opacity: 0; transform: translateY(10px) scale(.98); } }
@keyframes cfg-fade { from { opacity: 0; } }
.cfg-info__chrome {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
    flex: none; margin: 0; padding: 20px 16px 12px 24px;
}
.cfg-info__title {
    margin: 0; min-width: 0; padding-top: 8px;
    font: 700 19px/1.3 var(--pc-font); letter-spacing: -.015em; color: var(--pc-ink);
}
.cfg-info__title:focus { outline: none; }
.cfg-info__title:focus-visible { outline: 2px solid #111111; outline-offset: 4px; border-radius: 4px; }
.cfg-info__close {
    display: grid; place-items: center; flex: none; width: 44px; height: 44px; margin: 0; padding: 0;
    border: 0; border-radius: 10px; background: transparent; color: var(--pc-ink); cursor: pointer;
}
.cfg-info__close:hover { background: var(--pc-plate); }
.cfg-info__tabs {
    display: flex; flex-wrap: wrap; gap: 4px; flex: none;
    margin: 0 24px; padding: 0; border-bottom: 1px solid var(--pc-line);
}
.cfg-info__tab {
    margin: 0 0 -1px; padding: 10px 12px 12px; border: 0; border-radius: 0;
    background: none; color: var(--pc-muted); font: 600 15px/1.2 var(--pc-font); cursor: pointer;
}
.cfg-info__tab:hover { color: var(--pc-ink); }
.cfg-info__tab[aria-selected="true"] { color: var(--pc-ink); box-shadow: inset 0 -2px 0 #111111; }
.cfg-info__body {
    flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column;
    padding: 20px 24px 24px; overflow: auto; overscroll-behavior: contain;
    scrollbar-width: thin; scrollbar-color: #c4c4c9 transparent;
}
.cfg-info__status { margin: 0; }
.cfg-info__msg { margin: 0 0 14px; font-size: 15px; line-height: 1.55; color: var(--pc-ink-2); }
.cfg-info__retry { min-height: 44px; font-size: 15px; }
.cfg-info__skel { display: grid; gap: 10px; padding: 6px 0 10px; }
.cfg-info__pulse {
    display: block; height: 14px; border-radius: 6px; background: var(--pc-plate);
    animation: cfg-pulse 1.2s ease-in-out infinite;
}
.cfg-info__pulse:nth-child(2) { width: 88%; }
.cfg-info__pulse--short { width: 62%; }
@keyframes cfg-pulse { 50% { opacity: .45; } }
.cfg-info__panel { max-width: 72ch; font-size: 16px; line-height: 1.65; color: var(--pc-ink-2); }
.cfg-info__panel[data-part-panel="slike"]:not([hidden]) {
    max-width: none; flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column;
}
.cfg-info__panel p { margin: 0 0 14px; }
.cfg-info__panel p:last-child { margin-bottom: 0; }
.cfg-info__gallery {
    display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 16px;
    flex: 1 1 auto; min-height: 0; width: 100%; height: 100%;
}
.cfg-info__shot {
    display: grid; place-items: center; margin: 0; padding: 20px; min-height: 0; height: 100%;
    border-radius: 12px; background: var(--pc-plate);
}
.cfg-info__shot img {
    display: block; max-width: 100%; max-height: 100%; width: auto; height: auto;
    object-fit: contain;
}
.cfg-info__thumbs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.cfg-info__thumbs button {
    display: grid; place-items: center; box-sizing: border-box; width: 72px; height: 72px; margin: 0; padding: 6px;
    border: 1px solid var(--pc-line); border-radius: 10px; background: #ffffff; cursor: pointer;
}
.cfg-info__thumbs button:hover { border-color: #8e8e96; }
.cfg-info__thumbs button[aria-current="true"] { border-color: #111111; box-shadow: inset 0 0 0 1px #111111; }
.cfg-info__thumbs img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; }
.cfg-info__specs { margin: 0; padding: 0; }
.cfg-info__specs > div {
    display: grid; grid-template-columns: minmax(96px, 32%) minmax(0, 1fr); gap: 12px;
    padding: 12px 0; border-bottom: 1px solid var(--pc-line);
}
.cfg-info__specs dt { margin: 0; font-size: 14px; font-weight: 500; line-height: 20px; color: var(--pc-muted); }
.cfg-info__specs dd { margin: 0; font-size: 15px; font-weight: 600; line-height: 20px; color: var(--pc-ink); overflow-wrap: anywhere; }
.cfg-info__specs > div:last-child { border-bottom: 0; }
html.cfg-part-open { overflow: hidden; }

.cfg-sum { position: sticky; top: calc(var(--cfg-head) + var(--cfg-bar-h) + 16px); min-width: 0; }
.cfg-sum__card {
    display: flex; flex-direction: column; box-sizing: border-box; max-height: calc(100vh - var(--cfg-head) - var(--cfg-bar-h) - 32px);
    padding: 24px; border: 1px solid var(--pc-line); border-radius: 16px; background: #ffffff;
    box-shadow: 0 1px 2px rgba(17, 17, 17, .04), 0 16px 32px -20px rgba(17, 17, 17, .25);
}
.cfg-sum__card > * { flex: none; }
.cfg-sum__card > .cfg-sum__stage { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.cfg-sum__panel { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #c4c4c9 transparent; }
@media (min-width: 1024px) {
    .cfg-sum__panel { margin: 0 -24px; padding: 0 24px; }
}
.cfg-sum__panel > .cfg-sum__list { min-height: 0; margin: 0; padding: 6px 0; overflow: visible; border-bottom: 0; }
.cfg-sum__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 16px; }
.cfg-sum__title { margin: 0; font: 700 19px/1.25 var(--pc-font); letter-spacing: -.01em; color: var(--pc-ink); }
.cfg-sum__title:focus:not(:focus-visible) { outline: none; }
.cfg-sum__close { display: none; place-items: center; width: 44px; height: 44px; min-width: 0; margin: -10px -10px -10px 0; padding: 0; border: 0; border-radius: 10px; background: transparent; color: var(--pc-ink); cursor: pointer; }
.cfg-sum__close:hover { background: var(--pc-plate); }
.cfg-sum__product { display: grid; justify-items: stretch; gap: 12px; padding-bottom: 16px; border-bottom: 1px solid var(--pc-line); }
.cfg-sum__product .cfg-preview { margin: 0 auto; }
.cfg-sum__product strong { display: block; font-size: 15px; font-weight: 700; line-height: 1.3; color: var(--pc-ink); }
.cfg-sum__product span span { display: block; margin-top: 2px; font-size: 14px; line-height: 1.4; color: var(--pc-muted); }
.cfg-preview {
    position: relative; box-sizing: border-box; width: 216px; height: 152px; margin: 0;
    overflow: hidden; border-radius: 12px;
}
.cfg-preview__layer {
    position: absolute; top: 0; display: block; box-sizing: border-box; width: 152px; height: 152px;
    object-fit: contain; pointer-events: none;
}
.cfg-preview__layer[hidden] { display: none; }
.cfg-preview__case { left: 0; z-index: 2; }
.cfg-preview__monitor { left: 64px; z-index: 1; }
.cfg-preview:not(:has(.cfg-preview__monitor:not([hidden]))) .cfg-preview__case,
.cfg-preview:not(:has(.cfg-preview__case:not([hidden]))) .cfg-preview__monitor {
    left: 50%; right: auto; transform: translateX(-50%);
}
.cfg-preview--bar { flex: none; width: 92px; height: 56px; border-radius: 8px; }
.cfg-preview--bar .cfg-preview__layer { width: 56px; height: 56px; }
.cfg-preview--bar .cfg-preview__monitor { left: 36px; }
.cfg-sum__card > .cfg-sum__list {
    flex: 1 1 auto; min-height: 120px; margin: 0 -24px; padding: 6px 24px; overflow-y: auto; overscroll-behavior: contain;
    border-bottom: 1px solid var(--pc-line); list-style: none; scrollbar-width: thin; scrollbar-color: #c4c4c9 transparent;
}
.cfg-sum__row { margin: 0; padding: 2px 0; }
.cfg-sum__row + .cfg-sum__row { border-top: 1px solid #f0f0f2; }
.pc-listing a.cfg-sum__link {
    display: grid; grid-template-columns: 32px minmax(0, 1fr) auto 16px; align-items: center; column-gap: 12px;
    margin: 0 -10px; padding: 6px 10px; border-radius: 10px; color: var(--pc-ink); text-decoration: none;
    transition: background-color 160ms ease;
}
.pc-listing a.cfg-sum__link:hover { background: var(--pc-plate); color: var(--pc-ink); text-decoration: none; }
.pc-listing a.cfg-sum__link:focus-visible { outline-offset: -2px; }
.cfg-sum__go { grid-column: 4; color: #8e8e96; transition: transform 200ms var(--pc-ease), color 160ms ease; }
.cfg-sum__link:hover .cfg-sum__go,
.cfg-sum__link:focus-visible .cfg-sum__go { color: var(--pc-ink); transform: translateX(2px); }
.cfg-sum__icon { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 8px; background: var(--pc-plate); color: var(--pc-ink-2); transition: background-color 200ms ease, color 200ms ease; }
.cfg-sum__text { display: grid; gap: 1px; min-width: 0; }
.cfg-sum__label { font-size: 12px; font-weight: 600; line-height: 16px; color: var(--pc-muted); }
.cfg-sum__part { font-size: 14px; font-weight: 600; line-height: 1.3; color: var(--pc-ink); overflow-wrap: anywhere; }
.cfg-sum__delta { font-size: 13px; font-weight: 700; line-height: 1.3; color: var(--pc-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cfg-sum__row.is-changed .cfg-sum__icon { background: var(--pc-buy-tint); color: var(--pc-buy); }
.cfg-sum__row.is-changed .cfg-sum__label { color: var(--pc-buy); }
.cfg-sum__lines { display: grid; gap: 6px; margin: 0; padding: 14px 0 0; }
.cfg-sum__lines > div { display: flex; justify-content: space-between; gap: 12px; }
.cfg-sum__lines dt { margin: 0; font-size: 14px; font-weight: 500; line-height: 20px; color: var(--pc-muted); }
.cfg-sum__lines dd { margin: 0; font-size: 14px; font-weight: 600; line-height: 20px; color: var(--pc-ink); font-variant-numeric: tabular-nums; }
.cfg-sum__total { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; margin: 16px 0 18px; padding-top: 16px; border-top: 1px solid var(--pc-line); }
.cfg-sum__total > span:first-child { font-size: 15px; font-weight: 600; color: var(--pc-ink-2); }
.cfg-sum__value { font-size: 16px; line-height: 1; }
.cfg-sum__value b { font-size: 30px; font-weight: 800; letter-spacing: -.02em; color: var(--pc-ink); }
.cfg-sum__add { width: 100%; min-height: 54px; font-size: 17px; }
.cfg-sum .cfg-sum__reset:not([hidden]), .cfg-sum a.cfg-edit__cancel { display: flex; width: 100%; min-height: 46px; margin: 8px 0 0; font-size: 15px; }
.cfg-sum__trust { display: grid; gap: 10px; margin: 20px 0 0; padding: 16px 0 0; border-top: 1px solid var(--pc-line); list-style: none; }
.cfg-sum__trust li { display: flex; align-items: center; gap: 12px; margin: 0; font-size: 14px; line-height: 1.4; color: var(--pc-muted); }
.cfg-sum__trust img { flex: none; width: 22px; height: 22px; opacity: .8; }
.cfg-sum__trust strong { color: var(--pc-ink); }
.cfg-sum__tools { display: none; }
.cfg-scrim { display: none; }
@media (min-width: 1024px) and (max-height: 1000px) {
    .cfg-sum__trust { display: none; }
}

/* Sticky bar: the same group chips plus price, tools and the buy button, fixed under the site header. */
.cfg-topbar {
    position: fixed; top: var(--cfg-head); left: 0; right: 0; z-index: 50;
    border-bottom: 1px solid var(--pc-line); background: #ffffff;
    box-shadow: 0 12px 24px -20px rgba(17, 17, 17, .45);
    opacity: 0; visibility: hidden;
    transition: opacity 140ms ease, visibility 0s linear 140ms;
}
.cfg-topbar.is-shown { opacity: 1; visibility: visible; transition: opacity 140ms ease, visibility 0s; }
.cfg-topbar__in { display: flex; align-items: center; gap: 20px; }
.cfg-topbar .cfg-nav { flex: 1 1 auto; min-width: 0; margin: 0; }
.cfg-topbar__end { flex: none; display: flex; align-items: center; gap: 16px; }
.cfg-topbar__price { display: grid; justify-items: end; gap: 3px; margin: 0; }
.cfg-topbar__label { font-size: 12px; font-weight: 500; line-height: 1; color: var(--pc-muted); }
.cfg-topbar__value { display: inline-block; font-size: 14px; font-weight: 600; line-height: 1; color: var(--pc-ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cfg-topbar__value b { font-size: 21px; font-weight: 800; letter-spacing: -.02em; color: var(--pc-ink); }
.cfg-topbar__add { min-height: 44px; padding: 0 20px; font-size: 15px; }
.cfg-topbar__progress { position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; overflow: hidden; pointer-events: none; }
.cfg-topbar__progress span { display: block; height: 100%; background: var(--pc-red); transform: scaleX(0); transform-origin: left center; }

.cfg-tools { display: flex; gap: 6px; }
.cfg-help { position: relative; }
.cfg-tool {
    position: relative; display: grid; place-items: center; box-sizing: border-box; width: 44px; height: 44px; min-width: 0; margin: 0; padding: 0;
    border: 1px solid var(--pc-line-strong); border-radius: 10px; background: #ffffff; color: var(--pc-ink); cursor: pointer;
    transition: border-color 160ms ease, background-color 160ms ease;
}
.cfg-tool:hover { border-color: #111111; }
.cfg-tool:active { transform: scale(.96); }
.cfg-tool[aria-expanded="true"] { border-color: #111111; background: var(--pc-plate); }
.cfg-tool__tip {
    position: absolute; top: calc(100% + 8px); left: 50%; z-index: 3; padding: 6px 10px; border-radius: 8px;
    background: #111111; color: #ffffff; font-size: 13px; font-weight: 600; line-height: 1.2; white-space: nowrap; pointer-events: none;
    opacity: 0; transform: translate(-50%, -4px); transition: opacity 140ms ease, transform 180ms var(--pc-ease);
}
.cfg-tool:hover .cfg-tool__tip,
.cfg-tool:focus-visible .cfg-tool__tip { opacity: 1; transform: translate(-50%, 0); }
.cfg-tool[aria-expanded="true"] .cfg-tool__tip { opacity: 0; }
.cfg-pop {
    position: absolute; top: calc(100% + 10px); right: -50px; z-index: 4; box-sizing: border-box; width: 300px; padding: 18px;
    border: 1px solid var(--pc-line); border-radius: 14px; background: #ffffff;
    box-shadow: 0 2px 4px rgba(17, 17, 17, .05), 0 24px 48px -20px rgba(17, 17, 17, .35);
    animation: cfg-pop-in 200ms var(--pc-ease) both;
}
@keyframes cfg-pop-in { from { opacity: 0; transform: translateY(-6px); } }
.cfg-pop__title { margin: 0 0 6px; font-size: 16px; font-weight: 700; line-height: 1.3; color: var(--pc-ink); }
.cfg-pop__text { margin: 0 0 14px; font-size: 14px; line-height: 1.5; color: var(--pc-muted); }
.cfg-pop__btn { width: 100%; min-height: 44px; font-size: 15px; }
.pc-listing a.cfg-pop__link { display: inline-block; margin-top: 12px; font-size: 14px; font-weight: 600; color: var(--pc-ink); text-decoration: underline; text-decoration-color: #b4b4bb; text-underline-offset: 4px; }
.pc-listing a.cfg-pop__link:hover { color: var(--pc-ink); text-decoration-color: currentColor; }

/* Bottom bar: same moment as the top sticky. Body padding keeps it off content. */
.cfg-bar {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 61; box-sizing: border-box;
    padding: 10px 0 calc(10px + env(safe-area-inset-bottom));
    border-top: 1px solid var(--pc-line); background: #ffffff;
    box-shadow: 0 -12px 28px -18px rgba(17, 17, 17, .35);
    transform: translateY(110%); visibility: hidden;
    transition: transform 280ms var(--pc-ease), visibility 0s linear 280ms;
}
.cfg-bar.is-shown { transform: none; visibility: visible; transition: transform 280ms var(--pc-ease), visibility 0s; }
.cfg-bar__in { display: flex; align-items: center; gap: 24px; }
.cfg-bar__assistant { flex: none; }
.cfg-bar__assistant:empty { display: none; }
.cfg-bar__assistant .engagement-launcher { position: static; margin: 0; }
.cfg-sum__assistant { margin-top: 12px; }
.cfg-sum__assistant:empty { display: none; }
.cfg-sum__assistant .engagement-launcher { position: static; justify-content: center; width: 100%; margin: 0; }
html.cfg-sheet-open .engagement-launcher,
html.cfg-sheet-open .engagement-social { visibility: hidden; }
.cfg-hero__image-note { margin: 12px auto 0; max-width: 42ch; font-size: 13px; line-height: 1.45; color: var(--pc-muted); text-align: center; }
.cfg-hero__basic-note { margin: 16px 0; max-width: 62ch; font-size: 14px; line-height: 1.5; color: var(--pc-ink-2); }
.cfg-bar__product { flex: 1 1 auto; display: flex; align-items: center; gap: 14px; min-width: 0; }
.cfg-bar__info { display: grid; gap: 4px; min-width: 0; }
.cfg-bar__name { overflow: hidden; font-size: 16px; font-weight: 700; line-height: 1.25; color: var(--pc-ink); white-space: nowrap; text-overflow: ellipsis; }
.cfg-bar__usps { display: flex; flex-wrap: wrap; gap: 4px 18px; font-size: 13px; font-weight: 500; line-height: 18px; color: var(--pc-ink-2); }
.cfg-bar__usps span { display: inline-flex; align-items: center; gap: 6px; }
.cfg-bar__usps svg { flex: none; color: var(--pc-buy); }
.cfg-bar__price { flex: none; display: grid; justify-items: end; gap: 5px; margin: 0; }
.cfg-bar__label { font-size: 13px; font-weight: 500; line-height: 1.2; color: var(--pc-muted); }
.cfg-bar__total { display: inline-block; font-size: 15px; font-weight: 600; line-height: 1; color: var(--pc-ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cfg-bar__total b { font-size: 24px; font-weight: 800; letter-spacing: -.02em; color: var(--pc-ink); }
.cfg-bar__toggle { display: none; }
.cfg-bar__add { flex: none; min-height: 50px; padding: 0 26px; }
body:has(.cfg-bar) { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }

.cfg-toast {
    position: fixed; left: 50%; bottom: calc(96px + env(safe-area-inset-bottom)); z-index: 70; box-sizing: border-box;
    width: max-content; max-width: min(460px, calc(100vw - 32px)); margin: 0; padding: 12px 18px;
    border-radius: 12px; background: #111111; color: #ffffff; font-size: 14px; font-weight: 600; line-height: 1.45;
    box-shadow: 0 18px 36px -18px rgba(0, 0, 0, .55);
    opacity: 0; transform: translate(-50%, 12px); pointer-events: none;
    transition: opacity 200ms ease, transform 260ms var(--pc-ease);
}
.cfg-toast:empty { display: none; }
.cfg-toast.is-shown { opacity: 1; transform: translate(-50%, 0); }

@media (max-width: 1100px) {
    .cfg-body__grid { grid-template-columns: minmax(0, 1fr) 320px; gap: 32px; }
    .cfg-hero__grid { gap: 32px 40px; }
}
@media (max-width: 1023px) {
    .cfg-bar__assistant { display: none; }
    .cfg-body { padding: 40px 0 56px; }
    .cfg-body__grid { grid-template-columns: minmax(0, 1fr); }
    .cfg-nav ul { margin: -4px -15px; padding: 4px 15px; scroll-padding-inline: 15px; }
    .cfg-topbar__price,
    .cfg-topbar__add { display: none; }
    .cfg-sum {
        position: fixed; top: auto; left: 0; right: 0; bottom: 0; z-index: 60;
        max-height: calc(100dvh - var(--cfg-head) - 12px); overflow-y: auto; overscroll-behavior: contain;
        padding-bottom: calc(72px + env(safe-area-inset-bottom));
        transform: translateY(100%); visibility: hidden;
        transition: transform 320ms cubic-bezier(.32, .72, 0, 1), visibility 0s linear 320ms;
    }
    .cfg-sum.is-open { transform: none; visibility: visible; transition: transform 320ms cubic-bezier(.32, .72, 0, 1), visibility 0s; }
    .cfg-sum__card { display: block; max-width: 640px; max-height: none; margin: 0 auto; padding: 20px 20px 16px; border-bottom: 0; border-radius: 20px 20px 0 0; box-shadow: 0 -24px 48px -24px rgba(0, 0, 0, .35); }
    .cfg-sum__card > .cfg-sum__list { min-height: 0; margin: 0; padding: 6px 0; overflow: visible; }
    .cfg-sum__card > .cfg-sum__stage,
    .cfg-sum__panel { display: block; max-height: none; margin: 0; padding: 0; overflow: visible; }
    .cfg-sum__close { display: grid; }
    .cfg-sum__add { display: none; }
    .cfg-scrim { display: block; position: fixed; inset: 0; z-index: 59; background: rgba(17, 17, 17, .5); animation: cfg-fade 240ms ease both; }
    @keyframes cfg-fade { from { opacity: 0; } }
    html.cfg-sheet-open,
    html.cfg-part-open { overflow: hidden; }
    .cfg-bar__usps,
    .cfg-bar__price { display: none; }
    .cfg-bar__in { gap: 16px; }
    .cfg-bar__product { flex: 0 1 auto; }
    .cfg-bar__name { font-size: 15px; }
    .cfg-bar__toggle {
        flex: 1 1 auto; display: grid; justify-items: start; gap: 3px; min-width: 0; min-height: 48px; margin: 0; padding: 2px 0;
        border: 0; border-radius: 8px; background: none; color: var(--pc-ink); font: inherit; text-align: left; cursor: pointer;
    }
    .cfg-bar__value { display: inline-flex; align-items: center; gap: 8px; }
    .cfg-bar__value .cfg-bar__total b { font-size: 22px; }
    .cfg-bar__value svg { color: var(--pc-ink); transition: transform 220ms var(--pc-ease); }
    .cfg-bar__toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
    .cfg-bar__add { padding: 0 22px; }
}
@media (max-width: 767px) {
    .cfg-hero > .pc-wrap { padding-bottom: 32px; }
    .cfg-hero__grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
    .cfg-hero__media img { max-height: 320px; }
    .cfg-topbar__end { display: none; }
    .cfg-bar__product { display: flex; flex: none; }
    .cfg-bar__info { display: none; }
    .cfg-preview--bar { width: 68px; height: 44px; }
    .cfg-preview--bar .cfg-preview__layer { width: 44px; height: 44px; }
    .cfg-preview--bar .cfg-preview__monitor { left: 24px; }
    .cfg-sum__tools { display: grid; gap: 8px; margin-top: 16px; }
    .cfg-sum__tools .pc-btn { min-height: 46px; font-size: 15px; }
    .cfg-toast { bottom: calc(84px + env(safe-area-inset-bottom)); }
}
@media (max-width: 640px) {
    .cfg-hero > .pc-wrap { padding-top: 16px; }
    .cfg-hero .pc-crumbs ol { margin-bottom: 12px; font-size: 13px; }
    .cfg-hero__media img { max-height: 260px; }
    .cfg-badge { margin-bottom: 12px; }
    .cfg-hero__lines { font-size: 15px; }
    .cfg-specs { margin-top: 18px; padding: 0 14px; }
    .cfg-specs > div { grid-template-columns: 84px minmax(0, 1fr); padding: 9px 0; }
    .cfg-specs dd { font-size: 14px; }
    .cfg-buy { margin-top: 22px; }
    .cfg-price__value b { font-size: 34px; }
    .cfg-buy__actions { width: 100%; }
    .cfg-buy__actions .pc-btn { flex: 1 1 100%; }
    .cfg-body { padding-top: 32px; }
    .cfg-main__title { font-size: 21px; }
    .cfg-nav ul { margin: -4px -16px; padding: 4px 16px; scroll-padding-inline: 16px; }
    .cfg-slot__head {
        grid-template-columns: 48px minmax(0, 1fr) 20px; grid-template-areas: "thumb text more" "thumb delta more";
        column-gap: 12px; row-gap: 4px; min-height: 72px; padding: 12px 14px 12px 10px;
    }
    .cfg-slot--fixed .cfg-slot__head { grid-template-columns: 48px minmax(0, 1fr); grid-template-areas: "thumb text" "thumb delta"; }
    .cfg-slot__head > .cfg-thumb { width: 48px; height: 48px; align-self: start; }
    .cfg-slot__part { font-size: 15px; }
    .cfg-slot__delta { font-size: 14px; }
    .cfg-slot__count { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
    .cfg-slot__more { min-width: 0; }
    .cfg-slot__panel { padding: 2px 10px 14px; }
    .cfg-opt { padding: 9px 4px 9px 12px; }
    .cfg-opt:not(:has(.cfg-opt__info)) { padding-right: 12px; }
    .cfg-opt__pick {
        grid-template-columns: 20px 40px minmax(0, 1fr); grid-template-areas: "radio thumb text" "radio thumb delta";
        column-gap: 10px; row-gap: 2px;
    }
    .cfg-opt .cfg-thumb { width: 40px; height: 40px; }
    .cfg-opt__title { font-size: 14px; }
    .cfg-opt__meta { justify-content: flex-start; }
    .cfg-opt__delta { font-size: 13px; }
    body:has(.cfg-slot__panel:not([hidden])) .engagement-launcher { visibility: hidden; }
    .cfg-bar__add { padding: 0 18px; }
    .cfg-info {
        width: 100%; height: 100dvh; max-height: 100dvh; max-width: none;
        margin: 0; border-radius: 0; border: 0;
        box-shadow: none;
    }
    .cfg-info[open] { animation-name: cfg-info-up; }
    @keyframes cfg-info-up { from { opacity: 0; transform: translateY(16px); } }
    .cfg-info__chrome { padding: 12px 8px 8px 20px; }
    .cfg-info__title { font-size: 17px; padding-top: 10px; }
    .cfg-info__tabs { margin: 0 20px; overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
    .cfg-info__tab { white-space: nowrap; }
    .cfg-info__body { padding: 18px 20px calc(20px + env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) {
    .cfg-slot.is-open .cfg-slot__panel,
    .cfg-pop,
    .cfg-scrim,
    .cfg-info[open],
    .cfg-info[open]::backdrop,
    .cfg-info__pulse { animation: none; }
}
.pc-price { display: flex; align-items: flex-start; gap: 3px; margin: 6px 0 10px; line-height: 1; }
.pc-price__whole { font-size: 28px; font-weight: 700; letter-spacing: -.5px; color: #111111; }
.pc-price__rest { display: flex; flex-direction: column; padding-top: 3px; }
.pc-price__rest > :first-child { font-size: 13px; font-weight: 700; color: #333333; }
.pc-price__rest > :last-child { font-size: 11px; font-weight: 600; color: #6b6b6b; }
.shop-home img,
.shop-hero {
    max-width: 100%;
    height: auto;
}
.shop-add {
    display: inline-block;
    margin-top: 16px;
    padding: 12px 22px;
    background: #111;
    color: #fff;
    border: 0;
    cursor: pointer;
    text-decoration: none;
    font-weight: 700;
}
.shop-summary {
    position: sticky;
    top: 24px;
    padding: 16px;
}
.shop-note {
    margin-top: 12px;
}
.cart-line {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    padding: 16px 0;
    border-bottom: 1px solid #ddd;
}
.cart-line ul {
    margin: 8px 0 0;
    padding-left: 18px;
}
.cart-total {
    font-size: 1.3rem;
    margin-top: 16px;
}
.checkout-field,
.choice {
    display: flex;
    gap: 12px;
    align-items: center;
    margin: 10px 0;
}
.checkout-field {
    flex-direction: column;
    align-items: stretch;
}
.checkout-field input {
    padding: 8px 10px;
    border: 1px solid #ccc;
}
.choice {
    padding: 8px 0;
    border-bottom: 1px solid #eee;
}
.field-error {
    color: #9b1c1c;
    margin: 0 0 8px;
}
.dept-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 28px 0;
}
.dept-list a {
    padding: 8px 12px;
    border: 1px solid #ddd;
    color: inherit;
    text-decoration: none;
}
.shop-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}
.shop-card {
    border: 1px solid #eee;
    padding: 12px;
    background: #fff;
}
.shop-card a {
    color: inherit;
    text-decoration: none;
}
.shop-card img {
    width: 100%;
    height: 160px;
    object-fit: contain;
}
.shop-card h2 {
    font-size: 16px;
    margin: 10px 0;
}
.shop-pages {
    display: flex;
    gap: 16px;
    margin: 16px 0 32px;
}

.gr-xbg {
    overflow: hidden;
    background: radial-gradient(120% 100% at 70% 40%, #161617 0%, #101011 55%, #0b0b0c 100%);
    pointer-events: none;
}
.gr-xbg i {
    position: absolute;
    display: block;
    border-radius: 50%;
    filter: blur(90px);
    will-change: transform;
    animation: 22s ease-in-out infinite alternate;
}
.gr-xbg .b1 {
    left: -14%;
    top: -45%;
    width: 60vw;
    height: 60vw;
    max-width: 900px;
    max-height: 900px;
    background: #55555c;
    opacity: .4;
    animation-name: gr-drift-a;
}
.gr-xbg .b2 {
    right: -16%;
    bottom: -70%;
    width: 66vw;
    height: 66vw;
    max-width: 1000px;
    max-height: 1000px;
    background: #3a3a3f;
    opacity: .6;
    animation-name: gr-drift-b;
    animation-duration: 26s;
}
.gr-xbg .b3 {
    left: 42%;
    top: 10%;
    width: 30vw;
    height: 30vw;
    max-width: 460px;
    max-height: 460px;
    background: #4a2c2e;
    opacity: .35;
    animation-name: gr-drift-c;
    animation-duration: 18s;
}
.banner-slide:not(.active) .gr-xbg i { animation-play-state: paused; }
@keyframes gr-drift-a { to { transform: translate(18%, 22%) scale(1.15); } }
@keyframes gr-drift-b { to { transform: translate(-22%, -14%) scale(.9); } }
@keyframes gr-drift-c {
    50% { transform: translate(-30%, 25%) scale(1.25); }
    to { transform: translate(20%, -10%) scale(.85); }
}
@media (max-width: 767px) {
    .gr-xbg .b1 { width: 120vw; height: 120vw; top: -30%; }
    .gr-xbg .b2 { width: 130vw; height: 130vw; bottom: -40%; }
    .gr-xbg .b3 { width: 70vw; height: 70vw; left: 30%; top: 30%; }
}
@media (prefers-reduced-motion: reduce) {
    .gr-xbg i { animation: none; }
}

@media(max-width:1199px){.gr-header.is-search-hidden .gr-bar__inner{grid-template-rows:56px 0}.gr-header.is-search-hidden form.gr-search{height:0;min-height:0;padding-top:0;padding-bottom:0;overflow:hidden;visibility:hidden;pointer-events:none}.gr-header{overflow-anchor:none}}

.cfg-opts__price-note { margin: 0 0 12px; color: var(--pc-muted); font-size: 13px; line-height: 1.5; }
.cfg-opt.is-incompatible { background: var(--pc-plate); border-style: dashed; }
.cfg-opt.is-incompatible .cfg-opt__pick { cursor: not-allowed; }
.cfg-opt__compatibility { display: block; margin-top: 4px; color: #8a3b14; font-size: 12px; line-height: 1.5; }

/* Price and availability share a row; long availability labels wrap safely. */
.cat-tile__foot { display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"old old" "price stock" "shipping shipping" "cart cart" "compare compare"; gap:10px 12px; align-items:center; }
.cat-tile__foot .catalog-old-price { grid-area:old; }
.cat-tile__foot .cat-tile__price { grid-area:price; }
.cat-tile__foot .cat-tile__stock { grid-area:stock; margin:0; justify-self:end; max-width:140px; }
.cat-tile__foot .free-shipping-label { grid-area:shipping; margin:0; }
.cat-tile__foot .cat-tile__cart { grid-area:cart; }
.cat-tile__foot .compare-toggle { grid-area:compare; }

.cat-tile__labels { min-width: 0; }
.cat-tile__title { min-width: 0; min-height: calc(2 * 1.3em); max-height: calc(2 * 1.3em); overflow: hidden; }
.cat-tile__title a { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
.cat-tile__chips { flex-wrap: nowrap; height: 28px; overflow: hidden; }
.cat-tile__chips li { flex: none; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cat-tile__was { grid-area: old; height: 28px; overflow: hidden; }
.cat-tile__ship { grid-area: shipping; height: 24px; overflow: hidden; }
.cat-tile__was .catalog-old-price,
.cat-tile__ship .free-shipping-label { margin: 0; }
.cat-tile__price { min-height: 28px; }
.cat-row__title { overflow: hidden; }
.cat-row__title a { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
.pc-tile__title span { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
.pdp-combo__copy strong { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
@media (max-width: 700px) {
    .cat-tile__title { min-height: calc(3 * 1.3em); max-height: calc(3 * 1.3em); }
    .cat-tile__title a,
    .cat-row__title a,
    .pc-tile__title span,
    .pdp-combo__copy strong { -webkit-line-clamp: 3; line-clamp: 3; }
}

.cfg-edit { display: grid; gap: 8px; margin: 0 0 16px; padding: 14px 16px; border: 1px solid var(--pc-line); border-radius: 12px; background: var(--pc-plate); }
.cfg-edit p { margin: 0; font-size: 15px; line-height: 1.45; color: var(--pc-ink); }
.cfg-edit a,
a.cfg-edit__cancel { display: inline-flex; align-items: center; min-height: 44px; font-size: 15px; font-weight: 600; color: var(--pc-ink); }
.cfg-promotions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:20px; border:1px solid #d8e2d9; border-radius:12px; background:#f1f8f2; }
.cfg-wardogs-note { min-width:0; margin:0; padding:12px 14px; color:#173d26; font-size:14px; line-height:1.35; overflow-wrap:anywhere; }
.cfg-wardogs-note:only-child { grid-column:1 / -1; }
.cfg-wardogs-note + .cfg-wardogs-note { border-left:1px solid #d8e2d9; }
.cfg-wardogs-note strong { display:block; font-weight:700; }
.cfg-wardogs-note small { display:block; margin-top:5px; color:#365741; font-size:13px; line-height:1.4; }
@media (max-width:340px) {
    .cfg-promotions { grid-template-columns:minmax(0,1fr); }
    .cfg-wardogs-note + .cfg-wardogs-note { border-top:1px solid #d8e2d9; border-left:0; }
}
.cfg-specs__gift dd { color:#13773a; }