:root {
    --bg: #0b0c0f;
    --bg-2: #131116;
    --surface: #18191d;
    --surface-2: #222329;
    --line: rgba(255, 255, 255, 0.14);
    --line-strong: rgba(255, 255, 255, 0.22);
    --text: #f5f5f6;
    --muted: #a7abb4;
    --muted-2: #747986;
    --red: #e9122a;
    --red-2: #8d0717;
    --red-soft: rgba(233, 18, 42, 0.18);
    --accent: #ff314c;
    --accent-2: #f4f6f8;
    --accent-soft: rgba(233, 18, 42, 0.14);
    --steel: #8fa1b2;
    --max: 1500px;
    --wide-max: 1500px;
    --radius: 8px;
    --shadow: 0 24px 70px rgba(0, 0, 0, 0.36);
    --header-h: 76px;
    --discount-h: 0px;
    --ticker-h: 30px;
    --section-line: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.09) 10%, rgba(233, 18, 42, 0.62) 46%, rgba(255, 255, 255, 0.28) 50%, rgba(233, 18, 42, 0.52) 54%, rgba(255, 255, 255, 0.09) 90%, transparent 100%);
    --shared-dots: radial-gradient(circle at center, rgba(255, 255, 255, 0.115) 0 1px, transparent 1.7px);
    --shared-columns: repeating-linear-gradient(90deg, transparent 0 83px, rgba(255, 255, 255, 0.007) 83px 84px, transparent 84px 168px);
    --shared-rows: repeating-linear-gradient(0deg, transparent 0 83px, rgba(255, 255, 255, 0.012) 83px 84px, transparent 84px 168px);
    --shared-grid: var(--shared-dots), var(--shared-rows);
    --shared-grid-full: var(--shared-dots), var(--shared-columns), var(--shared-rows);
    --shared-grid-size: 34px 34px, 168px 168px;
    --shared-grid-full-size: 34px 34px, 168px 168px, 168px 168px;
    --tebex-footer-height: 35px;
    --tebex-legal-footer-max-width: min(var(--max), calc(100vw - 40px));
    --tebex-legal-footer-background-color: rgba(16, 17, 21, 0.94);
    --tebex-legal-footer-border-color: rgba(255, 255, 255, 0.08);
    --tebex-legal-footer-text-color: rgba(245, 245, 246, 0.62);
}

@media (max-width: 900px) {
    :root {
        --tebex-footer-height: 70px;
    }
}

@media (max-width: 600px) {
    :root {
        --tebex-footer-height: 80px;
    }
}

html {
    scrollbar-width: auto;
    scrollbar-color: rgba(255, 49, 76, 0.72) rgba(9, 10, 14, 0.94);
}

::-webkit-scrollbar {
    width: 16px;
    height: 16px;
}

::-webkit-scrollbar-track {
    background:
        linear-gradient(180deg, rgba(255, 49, 76, 0.08), transparent 28%, rgba(255, 49, 76, 0.055)),
        rgba(7, 8, 12, 0.96);
    border-left: 1px solid rgba(255, 255, 255, 0.055);
}

::-webkit-scrollbar-thumb {
    border: 4px solid rgba(7, 8, 12, 0.96);
    border-radius: 999px;
    background:
        linear-gradient(180deg, rgba(255, 92, 111, 0.92), rgba(233, 18, 42, 0.74) 52%, rgba(141, 7, 23, 0.86));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.22),
        0 0 16px rgba(255, 49, 76, 0.12);
}

::-webkit-scrollbar-thumb:hover {
    background:
        linear-gradient(180deg, rgba(255, 125, 140, 0.98), rgba(255, 49, 76, 0.92) 52%, rgba(173, 11, 29, 0.94));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.28),
        0 0 22px rgba(255, 49, 76, 0.24);
}

::-webkit-scrollbar-corner {
    background: rgba(7, 8, 12, 0.96);
}

.redactor-notice {
    position: fixed;
    right: max(24px, calc((100vw - var(--max)) / 2));
    bottom: 34px;
    z-index: 120;
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 134px;
    max-width: min(280px, calc(100vw - 40px));
    padding: 11px 14px;
    border: 1px solid rgba(255, 49, 76, 0.5);
    border-radius: 12px;
    color: var(--text);
    font-size: 12px;
    line-height: 1;
    font-weight: 900;
    text-transform: uppercase;
    background:
        radial-gradient(circle at 12% 0%, rgba(255, 49, 76, 0.24), transparent 48%),
        linear-gradient(135deg, rgba(42, 42, 49, 0.98), rgba(12, 13, 18, 0.98) 58%, rgba(33, 8, 14, 0.98));
    box-shadow:
        0 16px 40px rgba(0, 0, 0, 0.44),
        0 0 26px rgba(255, 49, 76, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px) scale(0.96);
    transition:
        opacity 150ms ease,
        transform 150ms ease,
        border-color 180ms ease,
        box-shadow 180ms ease;
}

.redactor-notice::before {
    content: "";
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
    border-radius: 999px;
    background: var(--accent);
    box-shadow:
        0 0 0 4px rgba(255, 49, 76, 0.08),
        0 0 16px rgba(255, 49, 76, 0.78);
}

.redactor-notice.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.redactor-notice.is-near-pointer {
    transform: translate(8px, 8px) scale(0.96);
}

.redactor-notice.is-near-pointer.is-visible {
    transform: translate(0, 0) scale(1);
}

.redactor-notice.is-error {
    border-color: rgba(255, 125, 140, 0.7);
    box-shadow:
        0 16px 40px rgba(0, 0, 0, 0.44),
        0 0 34px rgba(255, 49, 76, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

@media (max-width: 680px) {
    .redactor-notice {
        right: 18px;
        bottom: 24px;
        left: 18px;
        max-width: none;
    }
}

::-webkit-scrollbar-button,
::-webkit-scrollbar-button:single-button,
::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
    background: transparent !important;
}

[data-copy-server].is-copied {
    border-color: rgba(255, 49, 76, 0.64) !important;
    color: var(--text) !important;
    background:
        linear-gradient(135deg, rgba(255, 49, 76, 0.24), rgba(141, 7, 23, 0.24)),
        rgba(22, 23, 28, 0.96) !important;
    box-shadow:
        0 0 24px rgba(255, 49, 76, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    overflow-x: hidden;
}

body {
    margin: 0;
    overflow-x: hidden;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, transparent 20%, rgba(233, 18, 42, 0.06) 100%),
        linear-gradient(118deg, rgba(233, 18, 42, 0.2), transparent 28%, transparent 64%, rgba(255, 255, 255, 0.07)),
        linear-gradient(135deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 18px),
        linear-gradient(45deg, rgba(233, 18, 42, 0.065) 0 1px, transparent 1px 42px),
        var(--bg);
    background-attachment: fixed;
    color: var(--text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    letter-spacing: 0;
}

body::before,
body::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
}

body::before {
    z-index: -10;
    background: var(--shared-grid);
    background-size: var(--shared-grid-size);
    background-attachment: fixed;
    opacity: 0.3;
    animation: redactor-grid-drift 72s linear infinite;
}

body::after {
    z-index: -9;
    background:
        linear-gradient(105deg, transparent 0 18%, rgba(255, 255, 255, 0.08) 18.2%, transparent 19% 56%, rgba(233, 18, 42, 0.13) 56.2%, transparent 57.4%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent 38%, rgba(255, 255, 255, 0.045));
    mix-blend-mode: screen;
    opacity: 0.78;
}

body::selection {
    background: var(--red);
    color: #fff;
}

@keyframes redactor-grid-drift {
    from {
        background-position: 0 0, 0 0;
    }

    to {
        background-position: 34px 34px, 0 168px;
    }
}

@keyframes redactor-grid-drift-full {
    from {
        background-position: 0 0, 0 0, 0 0;
    }

    to {
        background-position: 34px 34px, 168px 0, 0 168px;
    }
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    display: block;
    max-width: 100%;
}

button,
input {
    font: inherit;
}

.site-header {
    position: fixed;
    inset: var(--discount-h) 0 auto;
    z-index: 30;
    height: var(--header-h);
    min-height: var(--header-h);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 10px max(22px, calc((100vw - var(--max)) / 2));
    border-bottom: 1px solid transparent;
    background:
        linear-gradient(90deg, rgba(233, 18, 42, 0.28), transparent 22%, transparent 70%, rgba(255, 255, 255, 0.08)),
        linear-gradient(180deg, rgba(15, 14, 17, 0.9), rgba(11, 11, 14, 0.66));
    backdrop-filter: blur(16px);
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
    transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.site-header::after {
    content: "";
    position: absolute;
    inset: auto 0 -1px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(233, 18, 42, 0.78), rgba(255, 255, 255, 0.52), rgba(233, 18, 42, 0.78), transparent);
    opacity: 0.65;
}

.site-header.is-scrolled {
    border-color: var(--line);
    background:
        linear-gradient(90deg, rgba(233, 18, 42, 0.18), transparent 30%, rgba(255, 255, 255, 0.04)),
        rgba(13, 13, 16, 0.9);
}

.brand {
    display: inline-flex;
    align-items: center;
    width: 220px;
    min-width: 184px;
}

.brand img {
    width: auto;
    height: 54px;
    max-width: 220px;
    object-fit: contain;
    filter: drop-shadow(0 0 18px rgba(233, 18, 42, 0.22));
}

.nav {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
}

.nav a,
.nav-dropdown-toggle {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-radius: var(--radius);
    padding: 0 14px;
    color: var(--muted);
    position: relative;
    transition: color 160ms ease, background 160ms ease;
}

.nav-icon {
    width: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 16px;
    color: rgba(255, 255, 255, 0.7);
    opacity: 0.88;
    transition: color 160ms ease, opacity 160ms ease, transform 160ms ease;
}

.nav-icon svg,
svg.nav-icon {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.nav a:hover .nav-icon,
.nav-dropdown-toggle:hover .nav-icon,
.nav-dropdown.is-active .nav-icon,
.nav-dropdown.is-open .nav-icon {
    color: rgba(255, 255, 255, 0.96);
    opacity: 1;
    transform: translateY(-1px);
}

.nav a::after,
.nav-dropdown-toggle::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 5px;
    height: 1px;
    background: var(--red);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 180ms ease;
}

.nav a:hover,
.nav-dropdown-toggle:hover,
.nav-dropdown.is-active .nav-dropdown-toggle,
.nav-dropdown.is-open .nav-dropdown-toggle {
    color: var(--text);
    background: rgba(255, 255, 255, 0.06);
}

.nav a:hover::after,
.nav-dropdown-toggle:hover::after,
.nav-dropdown.is-active .nav-dropdown-toggle::after,
.nav-dropdown.is-open .nav-dropdown-toggle::after {
    transform: scaleX(1);
}

.nav-dropdown {
    position: relative;
    z-index: 6;
}

.nav-dropdown-toggle {
    gap: 9px;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.nav-dropdown-toggle span {
    font-weight: 800;
}

.nav-dropdown-toggle i {
    width: 7px;
    height: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    opacity: 0.78;
    transition: transform 160ms ease;
}

.nav-dropdown.is-open .nav-dropdown-toggle i {
    transform: rotate(225deg) translate(-2px, -1px);
}

.nav-dropdown-menu {
    position: absolute;
    top: calc(100% + 9px);
    left: 0;
    width: 240px;
    max-height: min(420px, calc(100vh - 118px));
    display: grid;
    gap: 6px;
    padding: 8px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 16px;
    background:
        radial-gradient(circle at 18% 0%, rgba(233, 18, 42, 0.18), transparent 48%),
        linear-gradient(145deg, rgba(42, 43, 50, 0.98), rgba(11, 12, 16, 0.98));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 24px 60px rgba(0, 0, 0, 0.42);
    opacity: 0;
    pointer-events: none;
    transform: translateY(-6px) scale(0.98);
    transform-origin: top left;
    transition: opacity 160ms ease, transform 160ms ease;
}

.nav-dropdown.is-open .nav-dropdown-menu {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0) scale(1);
}

.nav-dropdown-menu::-webkit-scrollbar {
    width: 8px;
}

.nav-dropdown-menu::-webkit-scrollbar-track {
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.035);
}

.nav-dropdown-menu::-webkit-scrollbar-thumb {
    border: 2px solid rgba(17, 18, 22, 0.96);
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(255, 75, 96, 0.72), rgba(117, 21, 35, 0.82));
}

.nav-dropdown-menu a {
    min-height: 40px;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid transparent;
    border-radius: 12px;
    padding: 0 12px;
    color: rgba(238, 241, 247, 0.76);
    background: transparent;
    font-size: 13px;
    font-weight: 800;
}

.nav-dropdown-menu a::after {
    content: "";
    position: static;
    width: 7px;
    height: 7px;
    flex: 0 0 auto;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    background: transparent;
    transform: rotate(45deg);
    opacity: 0.62;
}

.nav-dropdown-menu a:hover {
    border-color: rgba(255, 54, 78, 0.34);
    background:
        linear-gradient(135deg, rgba(233, 18, 42, 0.2), rgba(255, 255, 255, 0.035)),
        rgba(255, 255, 255, 0.045);
    color: #fff;
}

.nav-dropdown-menu a:hover::after {
    opacity: 1;
    transform: rotate(45deg) translateX(1px);
}

.nav-dropdown-menu.nav-mega-menu {
    left: 50%;
    width: min(1180px, calc(100vw - 40px));
    max-height: min(620px, calc(100vh - 116px));
    gap: 16px;
    padding: 18px;
    overflow-y: auto;
    transform: translate(-50%, -8px) scale(0.985);
    background:
        radial-gradient(560px 220px at 0% 0%, rgba(233, 18, 42, 0.24), transparent 70%),
        radial-gradient(460px 220px at 100% 0%, rgba(255, 255, 255, 0.08), transparent 72%),
        linear-gradient(145deg, rgba(35, 36, 43, 0.98), rgba(10, 11, 15, 0.98));
}

.nav-dropdown.is-open .nav-dropdown-menu.nav-mega-menu {
    transform: translate(-50%, 0) scale(1);
}

.nav-mega-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding: 2px 2px 4px;
}

.nav-mega-head strong {
    display: block;
    margin-top: 5px;
    color: #fff;
    font-size: clamp(28px, 2.4vw, 38px);
    line-height: 0.95;
    letter-spacing: 0;
}

.nav-mega-eyebrow {
    display: block;
    color: var(--accent);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.nav-mega-menu a::after {
    content: none;
}

.nav-mega-full,
.nav-mega-card-link,
.nav-mega-chip,
.nav-mega-product-slide,
.nav-mega-title {
    min-height: auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: inherit;
}

.nav-mega-full {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 40px;
    flex: 0 0 auto;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    padding: 0 16px;
    color: #fff;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.025)),
        rgba(19, 20, 25, 0.88);
    font-size: 13px;
    font-weight: 900;
}

.nav-mega-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 12px;
}

.nav-mega-card {
    position: relative;
    min-height: 344px;
    display: flex;
    flex-direction: column;
    padding: 18px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 18px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.018)),
        rgba(16, 17, 22, 0.86);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 18px 42px rgba(0, 0, 0, 0.28);
}

.nav-mega-card::before {
    content: attr(data-title);
    position: absolute;
    top: 18px;
    right: 14px;
    max-width: 82%;
    color: rgba(255, 255, 255, 0.035);
    font-size: 58px;
    font-weight: 1000;
    line-height: 0.82;
    text-align: right;
    text-transform: uppercase;
    pointer-events: none;
}

.nav-mega-card::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: radial-gradient(320px 150px at 0% 0%, rgba(233, 18, 42, 0.18), transparent 68%);
    opacity: 0;
    pointer-events: none;
    transition: opacity 180ms ease;
}

.nav-mega-card:hover,
.nav-mega-card.is-active {
    border-color: rgba(255, 54, 78, 0.38);
}

.nav-mega-card:hover::after,
.nav-mega-card.is-active::after {
    opacity: 1;
}

.nav-mega-card > * {
    position: relative;
    z-index: 1;
}

.nav-mega-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.nav-mega-card-top > span {
    color: rgba(255, 255, 255, 0.58);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.nav-mega-card-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 30px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    padding: 0 11px;
    color: rgba(255, 255, 255, 0.84);
    background: rgba(255, 255, 255, 0.045);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.nav-mega-title {
    display: inline-flex;
    max-width: 86%;
    color: #fff;
    font-size: 27px;
    font-weight: 1000;
    line-height: 0.96;
}

.nav-mega-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.nav-mega-chip {
    display: inline-flex;
    align-items: center;
    min-height: 31px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    padding: 0 12px;
    color: rgba(255, 255, 255, 0.78);
    background: rgba(255, 255, 255, 0.055);
    font-size: 12px;
    font-weight: 900;
}

.nav-mega-preview {
    position: relative;
    margin-top: auto;
    padding-top: 14px;
}

.nav-mega-slides {
    position: relative;
}

.nav-mega-product-slide {
    min-height: 122px;
    display: none;
    grid-template-columns: 112px minmax(0, 1fr);
    gap: 12px;
    align-items: stretch;
    overflow: hidden;
    border: 1px solid rgba(255, 54, 78, 0.28);
    border-radius: 16px;
    padding: 10px;
    color: #fff;
    background:
        radial-gradient(260px 120px at 0% 0%, rgba(233, 18, 42, 0.19), transparent 72%),
        linear-gradient(135deg, rgba(233, 18, 42, 0.1), rgba(255, 255, 255, 0.02)),
        rgba(9, 10, 14, 0.72);
    box-shadow:
        inset 3px 0 0 rgba(255, 49, 76, 0.78),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.nav-mega-product-slide.is-active {
    display: grid;
}

.nav-mega-product-slide:hover {
    border-color: rgba(255, 68, 91, 0.5);
    background:
        radial-gradient(260px 120px at 0% 0%, rgba(233, 18, 42, 0.25), transparent 72%),
        linear-gradient(135deg, rgba(233, 18, 42, 0.16), rgba(255, 255, 255, 0.035)),
        rgba(12, 13, 18, 0.82);
}

.nav-mega-product-media {
    min-width: 0;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 13px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.01)),
        rgba(2, 3, 7, 0.62);
}

.nav-mega-product-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.nav-mega-product-media > span {
    padding: 10px;
    color: rgba(255, 255, 255, 0.42);
    font-size: 10px;
    font-weight: 900;
    text-align: center;
    text-transform: uppercase;
}

.nav-mega-product-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.nav-mega-product-badge {
    width: max-content;
    max-width: 100%;
    min-height: 21px;
    display: inline-flex;
    align-items: center;
    margin-bottom: 6px;
    border-radius: 999px;
    padding: 0 9px;
    color: #fff;
    background: linear-gradient(180deg, #ff2944, #d50922);
    font-size: 10px;
    font-weight: 1000;
    line-height: 1;
    text-transform: uppercase;
}

.nav-mega-product-copy strong {
    display: -webkit-box;
    overflow: hidden;
    color: #fff;
    font-size: 18px;
    font-weight: 1000;
    line-height: 0.96;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.nav-mega-product-description {
    display: -webkit-box;
    overflow: hidden;
    margin-top: 5px;
    color: rgba(235, 238, 245, 0.68);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.22;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.nav-mega-product-description :is(p, ul, ol, li) {
    display: inline;
    margin: 0;
    padding: 0;
}

.nav-mega-product-copy b {
    width: max-content;
    margin-top: 8px;
    border-radius: 999px;
    padding: 4px 9px;
    color: #fff;
    background: rgba(255, 255, 255, 0.12);
    font-size: 13px;
    font-weight: 1000;
}

.nav-mega-empty {
    min-height: 122px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 16px;
    padding: 18px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.012)),
        rgba(7, 8, 12, 0.58);
}

.nav-mega-empty strong {
    color: #fff;
    font-size: 16px;
    font-weight: 1000;
}

.nav-mega-empty span {
    margin-top: 6px;
    color: rgba(235, 238, 245, 0.6);
    font-size: 12px;
    font-weight: 750;
    line-height: 1.35;
}

.nav-mega-preview.has-products .nav-mega-empty {
    display: none;
}

.nav-mega-slider-controls {
    display: none;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
}

.nav-mega-preview.has-products .nav-mega-slider-controls {
    display: flex;
}

.nav-mega-slider-controls button {
    width: 32px;
    height: 32px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    color: #fff;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.025)),
        rgba(18, 19, 24, 0.9);
    cursor: pointer;
    transition: transform 160ms ease, border-color 160ms ease, background 160ms ease;
}

.nav-mega-slider-controls button span {
    width: 8px;
    height: 8px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(-135deg);
}

.nav-mega-slider-controls button[data-nav-mega-next] span {
    transform: rotate(45deg);
}

.nav-mega-slider-controls button:hover {
    transform: translateY(-1px);
    border-color: rgba(255, 54, 78, 0.42);
    background:
        linear-gradient(135deg, rgba(233, 18, 42, 0.22), rgba(255, 255, 255, 0.035)),
        rgba(20, 21, 27, 0.96);
}

.nav-mega-slider-controls button:disabled {
    opacity: 0.42;
    cursor: default;
    transform: none;
}

.nav-mega-slider-controls strong {
    min-width: 0;
    height: 32px;
    flex: 1 1 auto;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 999px;
    color: rgba(255, 255, 255, 0.82);
    background: rgba(255, 255, 255, 0.045);
    font-size: 13px;
    font-weight: 1000;
}

.nav-mega-full:hover,
.nav-mega-card-link:hover,
.nav-mega-chip:hover,
.nav-mega-title:hover {
    border-color: rgba(255, 54, 78, 0.4);
    color: #fff;
    background:
        linear-gradient(135deg, rgba(233, 18, 42, 0.22), rgba(255, 255, 255, 0.035)),
        rgba(255, 255, 255, 0.055);
}

.nav-mega-arrow {
    width: 7px;
    height: 7px;
    flex: 0 0 auto;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
    opacity: 0.72;
}

.nav-cart {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    gap: 7px;
    margin-left: 8px;
    color: var(--text) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.02)),
        linear-gradient(135deg, rgba(233, 18, 42, 0.26), rgba(76, 5, 13, 0.28));
    border: 1px solid rgba(255, 54, 78, 0.34);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 14px 28px rgba(0, 0, 0, 0.18);
}

.nav-cart .nav-icon {
    color: rgba(255, 92, 111, 0.92);
}

.nav-cart::before,
.header-cta::before,
.social-link::before,
.cfx-auth::before,
.ticker-close::before,
.btn::before,
.chip::before {
    content: none;
}

.nav-cart:hover::before,
.header-cta:hover::before,
.social-link:hover::before,
.cfx-auth:hover::before,
.ticker-close:hover::before,
.btn:hover::before,
.chip:hover::before {
    transform: none;
}

.nav-cart span {
    display: inline-grid;
    place-items: center;
    min-width: 20px;
    height: 20px;
    margin-left: 1px;
    border-radius: 999px;
    background: linear-gradient(180deg, #ff2842, #d10b22);
    color: #fff;
    font-size: 12px;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.28),
        0 0 18px rgba(233, 18, 42, 0.42);
}

.header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cfx-auth {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: var(--radius);
    padding: 0 12px;
    color: rgba(255, 255, 255, 0.94);
    background:
        radial-gradient(circle at 22% 0%, rgba(255, 255, 255, 0.15), transparent 42%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.075), rgba(233, 18, 42, 0.11)),
        rgba(16, 17, 21, 0.82);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 14px 28px rgba(0, 0, 0, 0.2);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0;
    white-space: nowrap;
    transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.cfx-auth svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    color: #ff4058;
}

.cfx-auth span {
    max-width: 126px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cfx-auth.is-login span {
    max-width: none;
}

.cfx-auth:hover {
    transform: translateY(-2px);
    border-color: rgba(255, 65, 88, 0.58);
    background:
        radial-gradient(circle at 22% 0%, rgba(255, 255, 255, 0.18), transparent 46%),
        linear-gradient(135deg, rgba(233, 18, 42, 0.24), rgba(255, 255, 255, 0.055)),
        rgba(18, 18, 23, 0.92);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.15),
        0 18px 34px rgba(233, 18, 42, 0.18);
}

.cfx-auth-nav {
    display: none;
}

.social-links {
    display: flex;
    align-items: center;
    gap: 6px;
}

.social-link,
.ticker-close {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: inline-grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)),
        rgba(255, 255, 255, 0.035);
    color: #fff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 12px 24px rgba(0, 0, 0, 0.18);
    transition: border-color 180ms ease, background 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

.social-link {
    width: 38px;
    height: 38px;
}

.social-link:hover,
.ticker-close:hover {
    transform: translateY(-2px);
    border-color: rgba(255, 62, 84, 0.58);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.1), rgba(233, 18, 42, 0.08)),
        rgba(233, 18, 42, 0.16);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        0 16px 30px rgba(233, 18, 42, 0.16);
}

.social-link svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.social-link-discord svg {
    width: 22px;
    height: 22px;
    stroke-width: 2.15;
}

.header-cta {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    border: 1px solid rgba(255, 52, 76, 0.58);
    border-radius: var(--radius);
    padding: 0 14px;
    background:
        linear-gradient(135deg, #ff1b36, #b7071d 56%, #4e040c),
        var(--red);
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.22),
        0 16px 34px rgba(233, 18, 42, 0.24);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.header-cta .nav-icon {
    color: rgba(255, 255, 255, 0.96);
    opacity: 1;
}

.header-cta::after {
    content: "";
    width: 7px;
    height: 7px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
    opacity: 0.75;
    transition: transform 180ms ease, opacity 180ms ease;
}

.header-cta:hover {
    transform: translateY(-2px);
    border-color: rgba(255, 110, 126, 0.72);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.26),
        0 20px 42px rgba(233, 18, 42, 0.32);
}

.header-cta:hover::after {
    transform: translateX(3px) rotate(45deg);
    opacity: 1;
}

.nav-toggle {
    display: none;
    width: 42px;
    height: 42px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.05);
    color: var(--text);
}

.nav-toggle span {
    display: block;
    width: 18px;
    height: 2px;
    margin: 5px auto;
    background: currentColor;
}

.promo-ticker {
    position: fixed;
    inset: calc(var(--discount-h) + var(--header-h)) 0 auto;
    z-index: 31;
    height: var(--ticker-h);
    display: flex;
    align-items: center;
    overflow: hidden;
    border-block: 1px solid rgba(233, 18, 42, 0.22);
    background:
        radial-gradient(circle at 18px 50%, rgba(255, 255, 255, 0.5) 0 2px, transparent 3px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.08) 0 1px, transparent 1px 96px),
        linear-gradient(90deg, rgba(34, 5, 10, 0.94), rgba(140, 8, 25, 0.88) 48%, rgba(16, 28, 13, 0.9));
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.2);
}

.ticker-track {
    display: flex;
    align-items: center;
    gap: 0;
    width: max-content;
    min-width: 200vw;
    will-change: transform;
    animation: ticker-scroll 30s linear infinite;
}

.ticker-group {
    flex: 0 0 auto;
    min-width: 100vw;
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 28px;
    padding-right: 28px;
}

.ticker-track span {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #f8ffe9;
    font-size: 12px;
    font-weight: 820;
    letter-spacing: 0;
    text-transform: uppercase;
    white-space: nowrap;
}

.ticker-track span::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 2px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.56);
}

.ticker-close {
    position: absolute;
    right: 10px;
    width: 24px;
    height: 24px;
    border-color: rgba(255, 255, 255, 0.18);
    background: rgba(0, 0, 0, 0.24);
    cursor: pointer;
}

.ticker-close svg {
    width: 14px;
    height: 14px;
}

body.ticker-closed .promo-ticker {
    display: none;
}

@keyframes ticker-scroll {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

.hero {
    position: relative;
    min-height: clamp(620px, 70svh, 720px);
    overflow: hidden;
    padding: calc(var(--header-h) + var(--ticker-h) + 32px) 22px 24px;
    isolation: isolate;
}

.hero::before,
.hero::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.hero::before {
    inset: 0;
    z-index: -1;
    background: var(--shared-grid-full);
    background-size: var(--shared-grid-full-size);
    background-attachment: fixed;
    mix-blend-mode: screen;
    opacity: 0.5;
    animation: redactor-grid-drift-full 72s linear infinite;
}

.hero::after {
    inset: auto 0 0;
    z-index: 4;
    height: 58px;
    background:
        radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.9) 0 1.5px, transparent 2.5px),
        radial-gradient(circle at calc(50% - 158px) 50%, rgba(233, 18, 42, 0.86) 0 2px, transparent 3px),
        radial-gradient(circle at calc(50% + 158px) 50%, rgba(233, 18, 42, 0.86) 0 2px, transparent 3px),
        linear-gradient(90deg, transparent 0 7%, rgba(255, 255, 255, 0.1) 8% 22%, transparent 23% 28%, rgba(233, 18, 42, 0.46) 35%, rgba(255, 255, 255, 0.56) 50%, rgba(233, 18, 42, 0.46) 65%, transparent 72% 77%, rgba(255, 255, 255, 0.1) 78% 92%, transparent 93%),
        linear-gradient(180deg, transparent 0 47%, rgba(0, 0, 0, 0.55) 47.5%, rgba(233, 18, 42, 0.72) 49.5% 50.5%, rgba(0, 0, 0, 0.55) 52.5%, transparent 53%);
    background-position: center;
    background-size: min(100%, var(--max)) 58px, min(100%, var(--max)) 58px, min(100%, var(--max)) 58px, min(100%, var(--max)) 58px, 100% 58px;
    box-shadow:
        inset 0 -1px 0 rgba(255, 255, 255, 0.055),
        0 0 28px rgba(233, 18, 42, 0.14);
    opacity: 0.95;
}

body.ticker-closed .hero {
    padding-top: calc(var(--header-h) + 32px);
}

.hero-bg,
.hero-shade,
.hero-depth-lines {
    position: absolute;
    inset: 0;
    z-index: -2;
}

.hero-bg {
    background-image: var(--hero-image, none);
    background-position: center;
    background-size: cover;
    filter: saturate(1.04) contrast(1.02) brightness(1.06);
}

.home-hero .hero-bg,
.home-hero .hero-shade {
    inset: 0 0 -150px;
    -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 76%, rgba(0, 0, 0, 0.86) 88%, transparent 100%);
    mask-image: linear-gradient(180deg, #000 0%, #000 76%, rgba(0, 0, 0, 0.86) 88%, transparent 100%);
}

.hero-shade {
    z-index: -1;
    background:
        linear-gradient(90deg, rgba(8, 8, 10, 0.78) 0%, rgba(9, 9, 12, 0.52) 34%, rgba(9, 9, 12, 0.08) 78%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, rgba(9, 9, 12, 0.24) 78%, rgba(11, 12, 15, 0.68) 100%),
        linear-gradient(128deg, rgba(233, 18, 42, 0.18), transparent 34%, rgba(255, 255, 255, 0.065));
}

.home-hero .hero-shade {
    background:
        linear-gradient(90deg, rgba(8, 8, 10, 0.78) 0%, rgba(9, 9, 12, 0.52) 34%, rgba(9, 9, 12, 0.08) 78%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.035) 0%, rgba(9, 9, 12, 0.2) 64%, rgba(8, 8, 10, 0.54) 100%),
        linear-gradient(128deg, rgba(233, 18, 42, 0.18), transparent 34%, rgba(255, 255, 255, 0.065));
}

.hero-depth-lines {
    z-index: -1;
    background:
        linear-gradient(90deg, transparent 0 52%, rgba(233, 18, 42, 0.11) 52.1%, transparent 52.45%),
        linear-gradient(114deg, transparent 0 58%, rgba(255, 255, 255, 0.09) 58.1%, transparent 58.45%);
    opacity: 0.42;
}

.hero-inner {
    position: relative;
    z-index: 1;
    width: min(100%, var(--max));
    min-height: 500px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 0.72fr) minmax(390px, 0.82fr);
    gap: 54px;
    align-items: center;
}

.hero-copy {
    max-width: 590px;
    padding-bottom: 0;
}

.eyebrow {
    margin: 0 0 12px;
    color: var(--accent-2);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: uppercase;
}

h1,
h2,
h3,
p {
    margin-top: 0;
}

h1 {
    margin-bottom: 18px;
    color: #fff;
    font-size: 72px;
    line-height: 0.95;
    font-weight: 850;
    letter-spacing: 0;
    text-shadow:
        0 2px 0 rgba(0, 0, 0, 0.34),
        0 16px 34px rgba(0, 0, 0, 0.62),
        0 0 28px rgba(233, 18, 42, 0.2);
}

h2 {
    margin-bottom: 14px;
    font-size: 40px;
    line-height: 1.05;
    font-weight: 800;
    letter-spacing: 0;
}

h3 {
    margin-bottom: 10px;
    font-size: 20px;
    line-height: 1.18;
    font-weight: 760;
    letter-spacing: 0;
}

.lead {
    max-width: 560px;
    margin-bottom: 22px;
    color: #f0f2f4;
    font-size: 18px;
    line-height: 1.48;
    text-shadow: 0 12px 30px rgba(0, 0, 0, 0.68);
}

.hero-intel {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: -8px 0 22px;
}

.hero-intel span {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(233, 18, 42, 0.28);
    border-radius: var(--radius);
    padding: 0 10px;
    background: rgba(255, 255, 255, 0.055);
    color: #dce1e8;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

.hero-actions,
.product-bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}

.hero-signals {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.hero-signals span {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: var(--radius);
    padding: 0 10px;
    background: rgba(255, 255, 255, 0.045);
    color: #e6ffd8;
    font-size: 12px;
    font-weight: 760;
    text-transform: uppercase;
}

.redactor-showcase {
    position: relative;
    min-height: 430px;
    overflow: hidden;
    isolation: isolate;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: var(--radius);
    background:
        linear-gradient(120deg, rgba(233, 18, 42, 0.22), rgba(13, 14, 18, 0.18) 44%, rgba(255, 255, 255, 0.07)),
        linear-gradient(180deg, rgba(10, 10, 13, 0.04), rgba(5, 5, 7, 0.78)),
        var(--hero-image, none);
    background-size: 26px 26px, auto, auto, cover;
    background-position: center, center, center, 72% 46%;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 28px 68px rgba(0, 0, 0, 0.34),
        0 0 0 1px rgba(255, 255, 255, 0.08);
    clip-path: polygon(9% 0, 100% 0, 100% 80%, 90% 100%, 0 100%, 0 19%);
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

.redactor-showcase::before,
.redactor-showcase::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.redactor-showcase::before {
    z-index: -1;
    background:
        linear-gradient(104deg, transparent 0 22%, rgba(233, 18, 42, 0.3) 22.2%, transparent 23.2% 62%, rgba(255, 255, 255, 0.16) 62.2%, transparent 63%),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 72px);
    opacity: 0.72;
}

.redactor-showcase::after {
    z-index: 1;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.86), rgba(233, 18, 42, 0.82), transparent 48%) 0 22% / 58% 1px no-repeat,
        linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5), transparent) 100% 68% / 74% 1px no-repeat,
        linear-gradient(128deg, transparent 0 48%, rgba(233, 18, 42, 0.24) 48.3%, transparent 49%),
        linear-gradient(52deg, transparent 0 30%, rgba(255, 255, 255, 0.13) 30.2%, transparent 31%);
    mix-blend-mode: screen;
    opacity: 0.9;
}

.redactor-showcase:hover {
    border-color: rgba(255, 255, 255, 0.38);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        0 32px 76px rgba(0, 0, 0, 0.38),
        0 0 0 1px rgba(255, 255, 255, 0.16);
}

.redactor-emblem {
    position: absolute;
    left: 34px;
    top: 50%;
    z-index: 2;
    width: 196px;
    min-height: 252px;
    display: grid;
    place-items: center;
    transform: translateY(-50%);
}

.redactor-emblem::before,
.redactor-emblem::after {
    content: "";
    position: absolute;
    width: 118px;
    height: 252px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(233, 18, 42, 0.16) 54%, transparent 72%);
}

.redactor-emblem::before {
    left: 10px;
    transform: skewX(-17deg);
}

.redactor-emblem::after {
    right: 10px;
    transform: skewX(17deg);
}

.redactor-emblem img {
    position: relative;
    z-index: 1;
    width: 172px;
    filter: drop-shadow(0 18px 34px rgba(233, 18, 42, 0.28));
}

.redactor-emblem span {
    position: absolute;
    left: 22px;
    bottom: 10px;
    z-index: 2;
    color: rgba(255, 255, 255, 0.72);
    font-size: 12px;
    font-weight: 840;
    text-transform: uppercase;
}

.showcase-stack {
    position: absolute;
    top: 52px;
    right: 22px;
    z-index: 3;
    width: min(58%, 366px);
    display: grid;
    gap: 10px;
}

.showcase-item {
    --showcase-x: 0px;
    position: relative;
    min-height: 86px;
    display: grid;
    align-content: center;
    gap: 4px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: var(--radius);
    padding: 14px 16px 14px 18px;
    background:
        linear-gradient(90deg, rgba(233, 18, 42, 0.22), rgba(255, 255, 255, 0.055) 48%, rgba(12, 12, 15, 0.72)),
        rgba(18, 18, 22, 0.74);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    clip-path: polygon(5% 0, 100% 0, 100% 78%, 94% 100%, 0 100%, 0 18%);
    backdrop-filter: blur(12px);
    color: inherit;
    text-decoration: none;
    transform: translateX(var(--showcase-x));
    transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.showcase-item:nth-child(2) {
    --showcase-x: 6px;
}

.showcase-item:nth-child(3) {
    --showcase-x: -4px;
}

.showcase-item::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: linear-gradient(180deg, var(--accent), #ff2c47, rgba(233, 18, 42, 0.1));
}

.showcase-item span {
    color: #ffccd2;
    font-size: 12px;
    font-weight: 820;
    text-transform: uppercase;
}

.showcase-item strong {
    color: #fff;
    font-size: 23px;
    line-height: 1.05;
}

.showcase-item small {
    color: var(--muted);
    font-size: 13px;
}

.showcase-item.is-primary {
    --showcase-x: -8px;
    border-color: rgba(255, 255, 255, 0.42);
    background:
        linear-gradient(90deg, rgba(233, 18, 42, 0.36), rgba(255, 255, 255, 0.08) 48%, rgba(12, 12, 15, 0.72)),
        rgba(22, 16, 20, 0.8);
}

.showcase-item:hover {
    transform: translateX(calc(var(--showcase-x) - 7px));
    border-color: rgba(255, 255, 255, 0.46);
    background:
        linear-gradient(90deg, rgba(233, 18, 42, 0.3), rgba(255, 255, 255, 0.08) 54%, rgba(12, 12, 15, 0.76)),
        rgba(22, 16, 20, 0.82);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 16px 36px rgba(0, 0, 0, 0.25);
}

.showcase-footer {
    position: absolute;
    left: 24px;
    right: 58px;
    bottom: 18px;
    z-index: 3;
    display: flex;
    justify-content: space-between;
    gap: 18px;
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    padding-top: 12px;
    color: rgba(255, 255, 255, 0.72);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

.showcase-footer a {
    min-width: 0;
    color: inherit;
    text-decoration: none;
    white-space: nowrap;
    transition: color 160ms ease, transform 160ms ease;
}

.showcase-footer a:last-child {
    flex: 0 1 auto;
    text-align: right;
}

.showcase-footer a:hover {
    color: #fff;
    transform: translateX(-5px);
}

.btn {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border-radius: var(--radius);
    padding: 0 19px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: var(--text);
    font-weight: 740;
    cursor: pointer;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.025)),
        rgba(255, 255, 255, 0.04);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 16px 34px rgba(0, 0, 0, 0.24);
    transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease, color 160ms ease;
}

.btn::after {
    content: "";
    width: 8px;
    height: 8px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
    opacity: 0.65;
    transition: opacity 160ms ease;
}

.btn:hover {
    border-color: rgba(255, 255, 255, 0.36);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        0 20px 40px rgba(0, 0, 0, 0.3);
}

.btn:hover::after {
    opacity: 1;
}

.btn:active,
.header-cta:active,
.social-link:active,
.ticker-close:active,
.nav-cart:active,
.chip:active {
    transform: translateY(0);
}

.btn-primary {
    border-color: rgba(255, 72, 94, 0.78);
    background:
        linear-gradient(135deg, #ff1f3a 0%, #e9122a 38%, #a30619 72%, #47040b 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.26),
        inset 0 -12px 28px rgba(49, 0, 7, 0.24),
        0 18px 44px rgba(233, 18, 42, 0.34),
        0 0 0 1px rgba(233, 18, 42, 0.08);
}

.btn-primary:hover {
    border-color: rgba(255, 128, 142, 0.86);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.3),
        inset 0 -12px 28px rgba(49, 0, 7, 0.18),
        0 24px 52px rgba(233, 18, 42, 0.42),
        0 0 0 1px rgba(255, 76, 96, 0.14);
}

.btn-ghost {
    border-color: rgba(255, 255, 255, 0.18);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)),
        rgba(14, 15, 18, 0.72);
    color: #f5f6f8;
}

.btn-ghost:hover {
    border-color: rgba(233, 18, 42, 0.54);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(233, 18, 42, 0.08)),
        rgba(20, 14, 16, 0.82);
}

.btn-small {
    min-height: 38px;
    padding: 0 15px;
    font-size: 13px;
    background:
        linear-gradient(135deg, rgba(255, 36, 60, 0.26), rgba(95, 4, 14, 0.32)),
        rgba(233, 18, 42, 0.12);
    border-color: rgba(255, 57, 81, 0.46);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        0 12px 26px rgba(233, 18, 42, 0.18);
}

.btn-small::after {
    width: 6px;
    height: 6px;
    border-width: 1.5px;
}

.btn[aria-disabled="true"] {
    cursor: not-allowed;
    opacity: 0.58;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.018)),
        rgba(255, 255, 255, 0.03);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.btn[aria-disabled="true"]:hover {
    transform: none;
    border-color: rgba(255, 255, 255, 0.2);
}

.btn[aria-disabled="true"]::before,
.btn[aria-disabled="true"]::after {
    opacity: 0.25;
}

.hero-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    max-width: 760px;
    margin: 28px 0 0;
}

.hero-metrics div,
.quick-card,
.product-card,
.support-grid article,
.faq-list details {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.105), rgba(255, 255, 255, 0.045)),
        linear-gradient(135deg, rgba(233, 18, 42, 0.075), transparent 58%),
        var(--surface);
}

.hero-metrics div {
    padding: 14px;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 14px 28px rgba(0, 0, 0, 0.18);
}

.hero-metrics dt {
    color: #fff;
    font-size: 20px;
    font-weight: 850;
}

.hero-metrics dd {
    margin: 4px 0 0;
    color: var(--muted-2);
    font-size: 13px;
}

.hero-panel {
    display: grid;
    gap: 12px;
    margin-bottom: 34px;
}

.quick-card {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 5px;
    padding: 18px;
    min-height: 102px;
    background:
        linear-gradient(120deg, rgba(233, 18, 42, 0.24), rgba(255, 255, 255, 0.075) 46%, rgba(255, 255, 255, 0.035)),
        rgba(23, 22, 26, 0.82);
    box-shadow: var(--shadow);
    backdrop-filter: blur(14px);
    transition: border-color 160ms ease, background 160ms ease;
}

.quick-card::before,
.product-card::before {
    content: none;
}

.quick-card:hover {
    border-color: rgba(233, 18, 42, 0.38);
}

.quick-card:hover::before,
.product-card:hover::before {
    transform: none;
}

.quick-card span,
.product-meta span {
    color: var(--steel);
    font-size: 12px;
    font-weight: 760;
    text-transform: uppercase;
}

.quick-card strong {
    font-size: 24px;
}

.quick-card small {
    color: var(--muted);
    font-size: 14px;
}

.section {
    padding: 86px 22px;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.section::before {
    content: "";
    position: absolute;
    inset: -28px 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(760px 260px at 18% 0%, rgba(233, 18, 42, 0.1), transparent 64%),
        radial-gradient(780px 300px at 86% 100%, rgba(255, 255, 255, 0.045), transparent 62%),
        var(--shared-grid);
    background-size: auto, auto, var(--shared-grid-size);
    background-attachment: fixed;
    opacity: 0.28;
    animation: redactor-grid-drift 72s linear infinite;
    -webkit-mask-image: linear-gradient(180deg, transparent, #000 12%, #000 88%, transparent);
    mask-image: linear-gradient(180deg, transparent, #000 12%, #000 88%, transparent);
}

.section::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    z-index: 2;
    height: 58px;
    pointer-events: none;
    background:
        radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.9) 0 1.5px, transparent 2.5px),
        radial-gradient(circle at calc(50% - 158px) 50%, rgba(233, 18, 42, 0.86) 0 2px, transparent 3px),
        radial-gradient(circle at calc(50% + 158px) 50%, rgba(233, 18, 42, 0.86) 0 2px, transparent 3px),
        linear-gradient(90deg, transparent 0 7%, rgba(255, 255, 255, 0.1) 8% 22%, transparent 23% 28%, rgba(233, 18, 42, 0.46) 35%, rgba(255, 255, 255, 0.56) 50%, rgba(233, 18, 42, 0.46) 65%, transparent 72% 77%, rgba(255, 255, 255, 0.1) 78% 92%, transparent 93%),
        linear-gradient(180deg, transparent 0 47%, rgba(0, 0, 0, 0.55) 47.5%, rgba(233, 18, 42, 0.72) 49.5% 50.5%, rgba(0, 0, 0, 0.55) 52.5%, transparent 53%);
    background-position: center;
    background-size: min(100%, var(--max)) 58px, min(100%, var(--max)) 58px, min(100%, var(--max)) 58px, min(100%, var(--max)) 58px, 100% 58px;
    box-shadow:
        inset 0 -1px 0 rgba(255, 255, 255, 0.055),
        0 0 28px rgba(233, 18, 42, 0.14);
    opacity: 0.94;
}

.section>* {
    position: relative;
    z-index: 1;
}

.category-nav-section {
    position: relative;
    z-index: 2;
    padding: 46px 22px 82px;
    background:
        radial-gradient(780px 260px at 16% -6%, rgba(233, 18, 42, 0.2), transparent 66%),
        radial-gradient(820px 320px at 88% 100%, rgba(255, 255, 255, 0.055), transparent 64%),
        linear-gradient(112deg, transparent 0 32%, rgba(255, 255, 255, 0.055) 32.15% 32.45%, transparent 32.8% 64%, rgba(233, 18, 42, 0.13) 64.15% 64.75%, transparent 65.1%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.015), rgba(233, 18, 42, 0.022));
    overflow: hidden;
}

.category-nav-section::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, transparent, rgba(233, 18, 42, 0.18), rgba(255, 255, 255, 0.14), rgba(233, 18, 42, 0.18), transparent) 50% 14px / min(100%, var(--max)) 1px no-repeat,
        linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.12), transparent) 50% calc(100% - 30px) / min(100%, var(--max)) 1px no-repeat,
        linear-gradient(124deg, transparent 0 11%, rgba(255, 255, 255, 0.08) 11.1% 11.34%, transparent 11.6% 48%, rgba(233, 18, 42, 0.16) 48.1% 48.7%, transparent 49% 83%, rgba(255, 255, 255, 0.07) 83.1% 83.34%, transparent 83.6%),
        var(--shared-grid);
    background-size: min(100%, var(--max)) 1px, min(100%, var(--max)) 1px, auto, var(--shared-grid-size);
    background-attachment: fixed;
    opacity: 0.36;
    animation: redactor-grid-drift 72s linear infinite;
}

.category-nav-section::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    z-index: 2;
    height: 58px;
    pointer-events: none;
    background:
        radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.9) 0 1.5px, transparent 2.5px),
        radial-gradient(circle at calc(50% - 158px) 50%, rgba(233, 18, 42, 0.86) 0 2px, transparent 3px),
        radial-gradient(circle at calc(50% + 158px) 50%, rgba(233, 18, 42, 0.86) 0 2px, transparent 3px),
        linear-gradient(90deg, transparent 0 7%, rgba(255, 255, 255, 0.1) 8% 22%, transparent 23% 28%, rgba(233, 18, 42, 0.46) 35%, rgba(255, 255, 255, 0.56) 50%, rgba(233, 18, 42, 0.46) 65%, transparent 72% 77%, rgba(255, 255, 255, 0.1) 78% 92%, transparent 93%),
        linear-gradient(180deg, transparent 0 47%, rgba(0, 0, 0, 0.55) 47.5%, rgba(233, 18, 42, 0.72) 49.5% 50.5%, rgba(0, 0, 0, 0.55) 52.5%, transparent 53%);
    background-position: center;
    background-size: min(100%, var(--max)) 58px, min(100%, var(--max)) 58px, min(100%, var(--max)) 58px, min(100%, var(--max)) 58px, 100% 58px;
    box-shadow:
        inset 0 -1px 0 rgba(255, 255, 255, 0.055),
        0 0 28px rgba(233, 18, 42, 0.14);
    opacity: 0.94;
}

.category-nav-head {
    width: min(100%, var(--max));
    margin: 0 auto 18px;
    position: relative;
    z-index: 1;
}

.category-nav-head h2 {
    margin-bottom: 0;
}

.category-nav {
    width: min(100%, var(--max));
    margin: 0 auto;
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.category-card {
    position: relative;
    min-height: 148px;
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: var(--radius);
    padding: 20px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.035) 42%, rgba(233, 18, 42, 0.08)),
        linear-gradient(130deg, rgba(233, 18, 42, 0.2), transparent 54%),
        rgba(15, 16, 20, 0.62);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.09),
        0 20px 44px rgba(0, 0, 0, 0.24);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    clip-path: polygon(14px 0, 100% 0, calc(100% - 14px) 100%, 0 100%);
    transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.category-card::after {
    content: "";
    position: absolute;
    inset: auto 16px 14px;
    height: 1px;
    background: linear-gradient(90deg, rgba(233, 18, 42, 0.72), rgba(255, 255, 255, 0.22), transparent);
}

.category-card:hover {
    border-color: rgba(255, 72, 94, 0.58);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.045) 42%, rgba(233, 18, 42, 0.11)),
        linear-gradient(130deg, rgba(233, 18, 42, 0.24), transparent 56%),
        rgba(20, 19, 22, 0.68);
}

.category-icon {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: var(--radius);
    color: #fff;
    background:
        linear-gradient(135deg, rgba(255, 49, 76, 0.34), rgba(255, 255, 255, 0.06)),
        rgba(255, 255, 255, 0.035);
}

.category-icon svg {
    width: 29px;
    height: 29px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.category-copy {
    min-width: 0;
    display: grid;
    gap: 6px;
}

.category-copy small {
    color: #cfd6df;
    font-size: 12px;
    font-weight: 820;
    text-transform: uppercase;
}

.category-copy strong {
    color: #fff;
    font-size: 24px;
    line-height: 1.05;
}

.category-copy em {
    color: var(--muted);
    font-size: 14px;
    font-style: normal;
    line-height: 1.45;
}

.section+.section {
    margin-top: 0;
}

.catalog-section {
    background:
        radial-gradient(900px 360px at 50% -8%, rgba(233, 18, 42, 0.18), transparent 64%),
        radial-gradient(760px 320px at 9% 88%, rgba(255, 255, 255, 0.055), transparent 62%),
        linear-gradient(124deg, transparent 0 49%, rgba(233, 18, 42, 0.12) 49.15% 49.65%, transparent 49.95%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.016), rgba(255, 255, 255, 0.004) 52%, rgba(233, 18, 42, 0.026));
}

.catalog-section::before {
    background: var(--shared-grid-full);
    background-size: var(--shared-grid-full-size);
    background-attachment: fixed;
    opacity: 0.18;
    animation: redactor-grid-drift-full 72s linear infinite;
}

.section-head,
.split-section,
.store-controls,
.product-grid,
.faq-list,
.footer {
    width: min(100%, var(--max));
    margin-inline: auto;
}

.section-head {
    display: grid;
    gap: 0;
    margin-bottom: 28px;
    position: relative;
    z-index: 1;
}

.section-head p:last-child,
.split-section>div:first-child p:last-child {
    max-width: 740px;
    color: var(--muted);
    font-size: 17px;
    line-height: 1.55;
}

.store-controls {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 22px;
}

.search-wrap {
    width: min(100%, 410px);
    display: grid;
    gap: 8px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
}

.search-wrap input {
    height: 48px;
    width: 100%;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0 15px;
    outline: none;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.025)),
        var(--surface);
    color: var(--text);
}

.search-wrap input:focus {
    border-color: rgba(233, 18, 42, 0.72);
}

.chip-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.chip {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    height: 42px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0 15px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.02)),
        rgba(255, 255, 255, 0.035);
    color: var(--muted);
    cursor: pointer;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
    transition: color 160ms ease, border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.chip:hover {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.24);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 14px 28px rgba(0, 0, 0, 0.2);
}

.chip.is-active {
    border-color: rgba(255, 71, 94, 0.68);
    background:
        linear-gradient(135deg, rgba(255, 36, 60, 0.32), rgba(92, 4, 14, 0.32)),
        rgba(233, 18, 42, 0.16);
    color: #fff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        0 16px 34px rgba(233, 18, 42, 0.16);
}

.product-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.product-card {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.085), rgba(255, 255, 255, 0.028)),
        linear-gradient(135deg, rgba(233, 18, 42, 0.09), transparent 54%, rgba(255, 255, 255, 0.04)),
        var(--surface);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 18px 42px rgba(0, 0, 0, 0.22);
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

.product-card:hover {
    border-color: rgba(255, 255, 255, 0.38);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 18px 42px rgba(0, 0, 0, 0.28),
        0 0 0 1px rgba(255, 255, 255, 0.12);
}

.product-card::after {
    content: none;
}

.product-card:hover::after {
    transform: none;
}

.product-card.is-hidden {
    display: none;
}

.product-link {
    display: block;
}

.product-media {
    position: relative;
    min-height: 188px;
    overflow: hidden;
    isolation: isolate;
    background: #17181d;
}

.product-card-featured .product-media {
    min-height: 218px;
}

.product-visual {
    position: absolute;
    inset: 0;
    min-height: 100%;
    background-image:
        linear-gradient(180deg, rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.52)),
        var(--hero-image, none);
    background-size: cover;
    transition: opacity 160ms ease, filter 160ms ease;
}

.product-visual img,
.product-visual video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.media-main {
    z-index: 1;
}

.media-hover {
    z-index: 2;
    opacity: 0;
}

.product-card:hover .media-main {
    filter: saturate(0.98) brightness(0.9);
}

.product-card:hover .media-hover {
    opacity: 1;
}

.product-badge,
.media-hint {
    position: absolute;
    z-index: 4;
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    border-radius: var(--radius);
    padding: 0 10px;
    font-size: 12px;
    font-weight: 800;
    color: #fff;
}

.product-badge {
    top: 12px;
    left: 12px;
    background: linear-gradient(180deg, #ff1832, #9a0718);
    box-shadow: 0 10px 24px rgba(233, 18, 42, 0.28), 0 0 18px rgba(255, 255, 255, 0.16);
}

.media-hint {
    right: 12px;
    bottom: 12px;
    background: rgba(5, 5, 6, 0.72);
    border: 1px solid var(--line-strong);
    color: #e6ffd8;
}

.visual-a {
    background-position: 76% 40%;
}

.visual-a-alt {
    background-image:
        linear-gradient(180deg, rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.72)),
        var(--hero-image, none);
    background-position: 92% 54%;
}

.visual-b {
    background-position: 60% 54%;
}

.visual-b-alt {
    background-image:
        linear-gradient(180deg, rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.72)),
        var(--hero-image, none);
    background-position: 68% 34%;
}

.visual-c,
.visual-d {
    background-image:
        linear-gradient(135deg, rgba(233, 18, 42, 0.2), rgba(8, 9, 11, 0.92)),
        linear-gradient(90deg, rgba(255, 255, 255, 0.16) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 255, 255, 0.12) 1px, transparent 1px);
    background-size: auto, 36px 36px, 36px 36px;
    position: relative;
}

.visual-c::before,
.visual-d::before {
    content: "";
    position: absolute;
    inset: 28px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: var(--radius);
    background:
        linear-gradient(90deg, var(--red) 0 34%, transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.16) 0 16%, transparent 16%),
        rgba(255, 255, 255, 0.045);
}

.visual-video {
    background-image:
        radial-gradient(circle at 74% 34%, rgba(255, 255, 255, 0.28), transparent 22%),
        radial-gradient(circle at 42% 70%, rgba(233, 18, 42, 0.38), transparent 24%),
        linear-gradient(135deg, rgba(233, 18, 42, 0.26), rgba(8, 9, 11, 0.94)),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.14) 0 1px, transparent 1px 34px),
        repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0 1px, transparent 1px 34px);
    background-size: auto;
}

.visual-video::before {
    content: "";
    position: absolute;
    inset: 30px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: var(--radius);
    background:
        linear-gradient(90deg, transparent 0 18%, rgba(233, 18, 42, 0.86) 18% 20%, transparent 20% 100%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.14) 0 17%, transparent 17% 100%),
        rgba(255, 255, 255, 0.045);
}

@keyframes ui-scan {
    0% {
        background-position: -60px 0, 0 0, 0 0;
    }

    100% {
        background-position: 280px 0, 0 0, 0 0;
    }
}

.visual-e {
    background-position: 48% 48%;
}

.visual-e-alt {
    background-image:
        linear-gradient(180deg, rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.74)),
        var(--hero-image, none);
    background-position: 36% 48%;
}

.visual-f {
    background-position: 22% 62%;
    filter: grayscale(0.28);
}

.product-body {
    padding: 18px;
}

.product-meta,
.product-bottom {
    justify-content: space-between;
}

.product-meta {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
}

.product-body p {
    min-height: 72px;
    margin-bottom: 18px;
    color: var(--muted);
    line-height: 1.5;
}

.product-bottom strong {
    font-size: 22px;
}

.split-section {
    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: 48px;
    align-items: start;
    padding-top: 76px;
    background:
        radial-gradient(760px 300px at 82% 24%, rgba(233, 18, 42, 0.17), transparent 64%),
        radial-gradient(680px 260px at 14% 94%, rgba(255, 255, 255, 0.05), transparent 62%),
        linear-gradient(104deg, transparent 0 20%, rgba(255, 255, 255, 0.05) 20.12% 20.34%, transparent 20.65% 70%, rgba(233, 18, 42, 0.14) 70.12% 70.62%, transparent 70.95%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.014), rgba(233, 18, 42, 0.022));
}

.section.split-section {
    width: 100%;
    max-width: none;
    margin-inline: 0;
    padding-right: max(22px, calc((100vw - var(--max)) / 2));
    padding-left: max(22px, calc((100vw - var(--max)) / 2));
}

.support-grid {
    counter-reset: support-step;
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.support-grid::before {
    content: "";
    position: absolute;
    top: 35px;
    right: 24px;
    left: 24px;
    height: 1px;
    background: linear-gradient(90deg, rgba(233, 18, 42, 0.72), rgba(255, 255, 255, 0.28), rgba(233, 18, 42, 0.72));
    box-shadow: 0 0 24px rgba(233, 18, 42, 0.16);
    opacity: 0.58;
}

.support-grid article {
    counter-increment: support-step;
    position: relative;
    min-height: 174px;
    overflow: hidden;
    padding: 58px 20px 20px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: var(--radius);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.035) 48%, rgba(233, 18, 42, 0.08)),
        rgba(18, 19, 23, 0.62);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 22px 44px rgba(0, 0, 0, 0.2);
    -webkit-backdrop-filter: blur(9px);
    backdrop-filter: blur(9px);
}

.support-grid article::before {
    content: "0" counter(support-step);
    position: absolute;
    top: 16px;
    left: 20px;
    min-width: 38px;
    height: 24px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(233, 18, 42, 0.46);
    border-radius: 999px;
    color: #fff;
    background: rgba(233, 18, 42, 0.18);
    font-size: 12px;
    font-weight: 860;
}

.support-grid article::after {
    content: "";
    position: absolute;
    top: 27px;
    right: 20px;
    left: 72px;
    height: 1px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.24), transparent);
}

.support-grid p {
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.product-page {
    min-height: 100svh;
    padding: calc(var(--header-h) + var(--ticker-h) + 40px) 22px 74px;
    background:
        linear-gradient(180deg, rgba(233, 18, 42, 0.13), transparent 380px),
        linear-gradient(115deg, rgba(255, 255, 255, 0.05), transparent 32%, rgba(233, 18, 42, 0.065)),
        var(--bg);
}

body.ticker-closed .product-page {
    padding-top: calc(var(--header-h) + 40px);
}

.product-detail {
    width: min(100%, var(--max));
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 0.46fr);
    gap: 22px;
    align-items: start;
}

.product-gallery,
.product-summary,
.product-info-card {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.095), rgba(255, 255, 255, 0.035)),
        var(--surface);
}

.product-gallery {
    overflow: hidden;
}

.product-media-large {
    min-height: 520px;
}

.gallery-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    border-top: 1px solid var(--line);
    background: var(--line);
}

.gallery-strip .product-media {
    min-height: 138px;
}

.gallery-thumb {
    display: block;
    width: 100%;
    border: 0;
    padding: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
}

.gallery-thumb .product-media {
    border: 2px solid transparent;
    transition: border-color 160ms ease, filter 160ms ease;
}

.gallery-thumb:hover .product-media,
.gallery-thumb.is-active .product-media {
    border-color: rgba(233, 18, 42, 0.78);
    filter: brightness(1.14);
}

.product-summary {
    position: sticky;
    top: 96px;
    padding: 24px;
}

.product-summary .lead {
    margin-bottom: 18px;
    font-size: 16px;
    color: var(--muted);
}

.price-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin: 20px 0;
}

.price-row strong {
    font-size: 34px;
}

.pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 18px 0 0;
}

.pill {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0 10px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
}

.product-info-grid {
    width: min(100%, var(--max));
    margin: 22px auto 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.product-info-card {
    padding: 20px;
}

.product-info-card ul {
    margin: 0;
    padding-left: 18px;
    color: var(--muted);
    line-height: 1.7;
}

.product-info-card p {
    color: var(--muted);
    line-height: 1.6;
}

.product-long-description {
    width: min(100%, var(--max));
    margin: 22px auto 0;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 28px;
    background:
        linear-gradient(135deg, rgba(233, 18, 42, 0.13), transparent 48%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent),
        var(--surface);
}

.product-long-description p:not(.eyebrow) {
    max-width: 880px;
    color: var(--muted);
    font-size: 16px;
    line-height: 1.72;
}

.faq-section {
    padding-top: 42px;
    background:
        radial-gradient(720px 260px at 18% 8%, rgba(255, 255, 255, 0.055), transparent 64%),
        radial-gradient(720px 300px at 84% 84%, rgba(233, 18, 42, 0.12), transparent 66%),
        linear-gradient(116deg, transparent 0 32%, rgba(233, 18, 42, 0.08) 32.2% 32.8%, transparent 33.1% 76%, rgba(255, 255, 255, 0.045) 76.2% 76.5%, transparent 76.8%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.012), rgba(233, 18, 42, 0.018));
}

.faq-section::before {
    background: var(--shared-dots);
    background-size: 34px 34px;
    opacity: 0.16;
}

.faq-list {
    display: grid;
    gap: 10px;
}

.faq-list details {
    padding: 18px 20px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: var(--radius);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.035)),
        rgba(18, 19, 23, 0.58);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

.faq-list summary {
    cursor: pointer;
    color: #fff;
    font-weight: 760;
}

.faq-list p {
    margin: 14px 0 0;
    max-width: 820px;
    color: var(--muted);
    line-height: 1.6;
}

.footer {
    width: 100%;
    max-width: none;
    margin: 0;
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 22px;
    padding: 48px max(22px, calc((100vw - var(--max)) / 2)) 52px;
    border-top: 0;
    background:
        radial-gradient(720px 260px at 82% 0%, rgba(233, 18, 42, 0.16), transparent 64%),
        radial-gradient(680px 220px at 16% 100%, rgba(255, 255, 255, 0.045), transparent 62%),
        linear-gradient(104deg, transparent 0 28%, rgba(255, 255, 255, 0.045) 28.1% 28.45%, transparent 28.7% 70%, rgba(233, 18, 42, 0.12) 70.1% 70.65%, transparent 70.95%),
        linear-gradient(180deg, rgba(5, 6, 8, 0.88), rgba(9, 8, 11, 0.94));
    color: var(--muted);
}

.footer>* {
    position: relative;
    z-index: 1;
}

.footer::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: var(--shared-grid);
    background-size: var(--shared-grid-size);
    background-attachment: fixed;
    opacity: 0.12;
    animation: redactor-grid-drift 72s linear infinite;
}

.footer::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    z-index: 2;
    height: 58px;
    pointer-events: none;
    background:
        radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.9) 0 1.5px, transparent 2.5px),
        radial-gradient(circle at calc(50% - 158px) 50%, rgba(233, 18, 42, 0.86) 0 2px, transparent 3px),
        radial-gradient(circle at calc(50% + 158px) 50%, rgba(233, 18, 42, 0.86) 0 2px, transparent 3px),
        linear-gradient(90deg, transparent 0 7%, rgba(255, 255, 255, 0.1) 8% 22%, transparent 23% 28%, rgba(233, 18, 42, 0.46) 35%, rgba(255, 255, 255, 0.56) 50%, rgba(233, 18, 42, 0.46) 65%, transparent 72% 77%, rgba(255, 255, 255, 0.1) 78% 92%, transparent 93%),
        linear-gradient(180deg, transparent 0 47%, rgba(0, 0, 0, 0.55) 47.5%, rgba(233, 18, 42, 0.72) 49.5% 50.5%, rgba(0, 0, 0, 0.55) 52.5%, transparent 53%);
    background-position: center;
    background-size: min(100%, var(--max)) 58px, min(100%, var(--max)) 58px, min(100%, var(--max)) 58px, min(100%, var(--max)) 58px, 100% 58px;
    box-shadow:
        inset 0 -1px 0 rgba(255, 255, 255, 0.055),
        0 0 28px rgba(233, 18, 42, 0.14);
}

.section::before {
    background:
        radial-gradient(760px 260px at 18% 0%, rgba(233, 18, 42, 0.055), transparent 66%),
        radial-gradient(780px 300px at 86% 100%, rgba(255, 255, 255, 0.03), transparent 64%),
        var(--shared-grid);
    background-size: auto, auto, var(--shared-grid-size);
    opacity: 0.17;
}

.section::after,
.category-nav-section::after,
.footer::before {
    height: 34px;
    background:
        linear-gradient(90deg, transparent 0 9%, rgba(255, 255, 255, 0.075) 18%, rgba(233, 18, 42, 0.22) 42%, rgba(255, 255, 255, 0.2) 50%, rgba(233, 18, 42, 0.22) 58%, rgba(255, 255, 255, 0.075) 82%, transparent 91%),
        linear-gradient(180deg, transparent 0 48%, rgba(233, 18, 42, 0.32) 49.5% 50.5%, transparent 52%);
    background-position: center;
    background-size: min(100%, var(--max)) 34px, 100% 34px;
    box-shadow: 0 0 18px rgba(233, 18, 42, 0.08);
    opacity: 0.48;
}

.hero::after {
    height: 44px;
    background:
        radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.72) 0 1px, transparent 2px),
        radial-gradient(circle at calc(50% - 142px) 50%, rgba(233, 18, 42, 0.64) 0 1.5px, transparent 2.8px),
        radial-gradient(circle at calc(50% + 142px) 50%, rgba(233, 18, 42, 0.64) 0 1.5px, transparent 2.8px),
        linear-gradient(90deg, transparent 0 9%, rgba(255, 255, 255, 0.085) 18%, rgba(233, 18, 42, 0.34) 42%, rgba(255, 255, 255, 0.34) 50%, rgba(233, 18, 42, 0.34) 58%, rgba(255, 255, 255, 0.085) 82%, transparent 91%),
        linear-gradient(180deg, transparent 0 48%, rgba(233, 18, 42, 0.5) 49.5% 50.5%, transparent 52%);
    background-size: min(100%, var(--max)) 44px, min(100%, var(--max)) 44px, min(100%, var(--max)) 44px, min(100%, var(--max)) 44px, 100% 44px;
    box-shadow: 0 0 22px rgba(233, 18, 42, 0.1);
    opacity: 0.78;
}

.category-nav-section {
    background:
        radial-gradient(760px 260px at 16% -6%, rgba(233, 18, 42, 0.105), transparent 68%),
        radial-gradient(820px 320px at 88% 100%, rgba(255, 255, 255, 0.032), transparent 66%),
        linear-gradient(112deg, transparent 0 32%, rgba(255, 255, 255, 0.028) 32.15% 32.38%, transparent 32.72% 64%, rgba(233, 18, 42, 0.07) 64.15% 64.58%, transparent 64.9%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.008), rgba(233, 18, 42, 0.012));
}

.category-nav-section::before {
    opacity: 0.18;
}

.catalog-section {
    background:
        radial-gradient(900px 360px at 50% -8%, rgba(233, 18, 42, 0.105), transparent 66%),
        radial-gradient(760px 320px at 9% 88%, rgba(255, 255, 255, 0.032), transparent 64%),
        linear-gradient(124deg, transparent 0 49%, rgba(233, 18, 42, 0.065) 49.15% 49.52%, transparent 49.86%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.008), rgba(255, 255, 255, 0.002) 52%, rgba(233, 18, 42, 0.012));
}

.split-section,
.faq-section,
.footer {
    background:
        radial-gradient(760px 300px at 82% 24%, rgba(233, 18, 42, 0.085), transparent 66%),
        radial-gradient(680px 260px at 14% 94%, rgba(255, 255, 255, 0.03), transparent 64%),
        linear-gradient(104deg, transparent 0 20%, rgba(255, 255, 255, 0.026) 20.12% 20.3%, transparent 20.65% 70%, rgba(233, 18, 42, 0.07) 70.12% 70.48%, transparent 70.9%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.006), rgba(233, 18, 42, 0.01));
}

.product-card {
    border-color: rgba(255, 255, 255, 0.2);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.035)),
        linear-gradient(135deg, rgba(233, 18, 42, 0.13), transparent 50%, rgba(255, 255, 255, 0.055)),
        #191a20;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.11),
        0 22px 48px rgba(0, 0, 0, 0.28);
}

.product-card:hover {
    border-color: rgba(255, 76, 96, 0.52);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        0 24px 54px rgba(0, 0, 0, 0.36),
        0 0 0 1px rgba(255, 58, 82, 0.16),
        0 0 34px rgba(233, 18, 42, 0.16);
}

.product-media {
    min-height: 210px;
    background: #07080b;
}

.product-visual {
    background-image:
        linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.34)),
        var(--hero-image, none);
    filter: saturate(1.16) contrast(1.08) brightness(1.08);
}

.visual-a-alt,
.visual-b-alt,
.visual-e-alt {
    background-image:
        linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.48)),
        var(--hero-image, none);
}

.visual-c,
.visual-d,
.visual-video {
    filter: saturate(1.22) contrast(1.08) brightness(1.12);
}

.visual-f {
    filter: grayscale(0.08) saturate(1.08) brightness(1.08);
}

.product-card:hover .media-main {
    filter: saturate(1.08) contrast(1.06) brightness(1.0);
}

.product-card:hover .media-hover {
    opacity: 1;
    filter: saturate(1.2) contrast(1.08) brightness(1.1);
}

.product-badge {
    background: linear-gradient(180deg, #ff2842, #c4071f);
    box-shadow:
        0 12px 28px rgba(233, 18, 42, 0.42),
        0 0 20px rgba(255, 255, 255, 0.16);
}

.product-bottom strong {
    color: #fff;
    text-shadow: 0 0 18px rgba(233, 18, 42, 0.28);
}

@keyframes redactor-separator-flow {
    from {
        background-position: -80px 54%, 24% 44%, 78% 56%, 0 0;
    }

    to {
        background-position: 80px 48%, 34% 58%, 68% 42%, 100% 0;
    }
}

.category-nav-section,
.catalog-section,
.split-section,
.faq-section,
.footer {
    background:
        radial-gradient(820px 340px at 15% 8%, rgba(233, 18, 42, 0.08), transparent 68%),
        radial-gradient(880px 360px at 86% 88%, rgba(255, 255, 255, 0.028), transparent 66%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.008), rgba(233, 18, 42, 0.012));
}

.section::before,
.category-nav-section::before {
    background: var(--shared-grid);
    background-size: var(--shared-grid-size);
    opacity: 0.22;
}

.catalog-section::before {
    background: var(--shared-grid-full);
    background-size: var(--shared-grid-full-size);
    opacity: 0.16;
}

.section::after,
.category-nav-section::after,
.footer::before {
    inset: auto -10% -74px;
    height: 154px;
    background:
        radial-gradient(ellipse at center, rgba(233, 18, 42, 0.26) 0 18%, rgba(233, 18, 42, 0.12) 32%, transparent 68%),
        radial-gradient(ellipse at center, rgba(255, 255, 255, 0.1) 0 14%, rgba(255, 255, 255, 0.045) 30%, transparent 70%),
        radial-gradient(ellipse at center, rgba(120, 7, 18, 0.34) 0 22%, rgba(233, 18, 42, 0.1) 42%, transparent 72%),
        radial-gradient(ellipse at center, rgba(233, 18, 42, 0.12) 0 22%, transparent 72%);
    background-repeat: repeat-x, no-repeat, no-repeat, repeat-x;
    background-size: 520px 118px, 620px 96px, 760px 128px, 360px 84px;
    box-shadow: none;
    opacity: 0.78;
    filter: blur(8px);
    mix-blend-mode: screen;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 24%, #000 74%, transparent 100%);
    mask-image: linear-gradient(180deg, transparent 0%, #000 24%, #000 74%, transparent 100%);
    animation: redactor-separator-flow 16s ease-in-out infinite alternate;
}

.hero::after {
    inset: auto -10% -84px;
    height: 176px;
    background:
        radial-gradient(ellipse at center, rgba(233, 18, 42, 0.34) 0 20%, rgba(233, 18, 42, 0.15) 38%, transparent 72%),
        radial-gradient(ellipse at center, rgba(255, 255, 255, 0.14) 0 15%, rgba(255, 255, 255, 0.055) 32%, transparent 74%),
        radial-gradient(ellipse at center, rgba(120, 7, 18, 0.42) 0 22%, rgba(233, 18, 42, 0.12) 44%, transparent 74%),
        radial-gradient(ellipse at center, rgba(233, 18, 42, 0.16) 0 22%, transparent 72%);
    background-repeat: repeat-x, no-repeat, no-repeat, repeat-x;
    background-size: 600px 136px, 720px 108px, 860px 150px, 420px 92px;
    box-shadow: none;
    opacity: 0.92;
    filter: blur(9px);
    mix-blend-mode: screen;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 22%, #000 76%, transparent 100%);
    mask-image: linear-gradient(180deg, transparent 0%, #000 22%, #000 76%, transparent 100%);
    animation: redactor-separator-flow 14s ease-in-out infinite alternate;
}

.footer::before {
    inset: -76px -10% auto;
}

.category-nav-head {
    max-width: 760px;
    display: grid;
    justify-items: center;
    text-align: center;
}

.category-nav {
    gap: 18px;
}

.category-card {
    min-height: 176px;
    grid-template-columns: 1fr;
    justify-items: center;
    align-content: center;
    text-align: center;
    padding: 24px 22px;
    clip-path: polygon(9% 0, 91% 0, 100% 18%, 94% 100%, 6% 100%, 0 18%);
}

.category-card::before {
    content: "";
    position: absolute;
    inset: 12px 18px auto;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(233, 18, 42, 0.48), rgba(255, 255, 255, 0.2), rgba(233, 18, 42, 0.48), transparent);
}

.category-card::after {
    inset: auto 18px 14px;
    background: linear-gradient(90deg, transparent, rgba(233, 18, 42, 0.62), rgba(255, 255, 255, 0.2), transparent);
}

.category-icon {
    width: 64px;
    height: 64px;
}

.category-copy {
    justify-items: center;
}

.category-copy strong {
    font-size: 25px;
}

@keyframes redactor-line-scan {
    from {
        background-position: center, center, -360px 0, 0 0;
    }

    to {
        background-position: center, center, 360px 0, 0 0;
    }
}

body {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.022) 0%, transparent 22%, rgba(233, 18, 42, 0.026) 100%),
        linear-gradient(118deg, rgba(233, 18, 42, 0.08), transparent 30%, transparent 70%, rgba(255, 255, 255, 0.024)),
        var(--bg);
    background-attachment: fixed;
}

.category-nav-section,
.catalog-section,
.split-section,
.faq-section,
.footer {
    background:
        radial-gradient(760px 300px at 14% 10%, rgba(233, 18, 42, 0.045), transparent 70%),
        radial-gradient(820px 340px at 88% 88%, rgba(255, 255, 255, 0.018), transparent 68%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.004), rgba(233, 18, 42, 0.006));
}

.section::before,
.category-nav-section::before {
    opacity: 0.14;
}

.catalog-section::before {
    opacity: 0.12;
}

.section::after,
.category-nav-section::after,
.footer::before {
    inset: auto 0 -22px;
    height: 64px;
    background:
        radial-gradient(520px 36px at 50% 50%, rgba(233, 18, 42, 0.16), transparent 70%),
        linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.045) 18%, rgba(233, 18, 42, 0.28) 42%, rgba(255, 255, 255, 0.22) 50%, rgba(233, 18, 42, 0.28) 58%, rgba(255, 255, 255, 0.045) 82%, transparent),
        linear-gradient(90deg, transparent 0 42%, rgba(255, 255, 255, 0.32) 48%, rgba(233, 18, 42, 0.38) 50%, rgba(255, 255, 255, 0.32) 52%, transparent 58%),
        linear-gradient(180deg, transparent 0 48%, rgba(255, 255, 255, 0.08) 49%, rgba(233, 18, 42, 0.34) 50%, rgba(255, 255, 255, 0.08) 51%, transparent 52%);
    background-repeat: no-repeat;
    background-size: min(100%, var(--max)) 64px, min(100%, var(--max)) 64px, 360px 64px, 100% 64px;
    filter: none;
    mix-blend-mode: normal;
    opacity: 0.58;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 34%, #000 66%, transparent 100%);
    mask-image: linear-gradient(180deg, transparent 0%, #000 34%, #000 66%, transparent 100%);
    animation: redactor-line-scan 7s linear infinite;
}

.hero::after {
    inset: auto 0 -28px;
    height: 78px;
    background:
        radial-gradient(620px 46px at 50% 50%, rgba(233, 18, 42, 0.2), transparent 70%),
        linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.06) 18%, rgba(233, 18, 42, 0.36) 42%, rgba(255, 255, 255, 0.28) 50%, rgba(233, 18, 42, 0.36) 58%, rgba(255, 255, 255, 0.06) 82%, transparent),
        linear-gradient(90deg, transparent 0 42%, rgba(255, 255, 255, 0.42) 48%, rgba(233, 18, 42, 0.48) 50%, rgba(255, 255, 255, 0.42) 52%, transparent 58%),
        linear-gradient(180deg, transparent 0 48%, rgba(255, 255, 255, 0.1) 49%, rgba(233, 18, 42, 0.44) 50%, rgba(255, 255, 255, 0.1) 51%, transparent 52%);
    background-repeat: no-repeat;
    background-size: min(100%, var(--max)) 78px, min(100%, var(--max)) 78px, 420px 78px, 100% 78px;
    filter: none;
    mix-blend-mode: normal;
    opacity: 0.72;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 32%, #000 68%, transparent 100%);
    mask-image: linear-gradient(180deg, transparent 0%, #000 32%, #000 68%, transparent 100%);
    animation: redactor-line-scan 6.5s linear infinite;
}

.footer::before {
    inset: -28px 0 auto;
}

@media (prefers-reduced-motion: reduce) {

    body::before,
    .hero::before,
    .section::before,
    .category-nav-section::before,
    .footer::after,
    .hero::after,
    .section::after,
    .category-nav-section::after,
    .footer::before {
        animation: none;
    }
}

.footer img {
    width: 170px;
    margin-bottom: 12px;
}

.footer p {
    margin-bottom: 0;
    line-height: 1.55;
}

.footer nav {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    justify-content: flex-end;
}

.footer a:hover {
    color: #fff;
}

.legal {
    grid-column: 1 / -1;
    max-width: 760px;
    color: var(--muted-2);
    font-size: 13px;
}

@media (max-width: 980px) {
    h1 {
        font-size: 58px;
    }

    h2 {
        font-size: 34px;
    }

    .hero-inner,
    .split-section,
    .product-detail {
        grid-template-columns: 1fr;
    }

    .hero-panel {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        margin-bottom: 0;
    }

    .redactor-showcase {
        min-height: 390px;
    }

    .redactor-emblem {
        left: 20px;
        width: 210px;
    }

    .showcase-stack {
        width: min(66%, 360px);
    }

    .category-nav,
    .product-grid,
    .support-grid,
    .product-info-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .header-cta {
        display: none;
    }

    .product-summary {
        position: static;
    }
}

@media (max-width: 760px) {
    .site-header {
        padding: 14px 16px;
        gap: 12px;
    }

    .brand {
        width: 168px;
        min-width: 150px;
    }

    .brand img {
        height: 44px;
        max-width: 168px;
    }

    .social-links .social-link:nth-child(n + 2) {
        display: none;
    }

    .header-actions {
        display: none;
    }

    .nav-toggle {
        display: block;
        flex: 0 0 auto;
        order: 4;
    }

    .nav {
        position: fixed;
        inset: calc(var(--header-h) + var(--ticker-h) + 10px) 14px auto;
        display: none;
        flex-direction: column;
        align-items: stretch;
        padding: 10px;
        border: 1px solid var(--line);
        border-radius: var(--radius);
        background: rgba(8, 8, 9, 0.96);
        box-shadow: var(--shadow);
    }

    .nav.is-open {
        display: flex;
    }

    .nav a {
        justify-content: space-between;
    }

    .nav .nav-dropdown {
        width: 100%;
    }

    .nav .nav-dropdown-toggle {
        width: 100%;
        justify-content: space-between;
        padding: 0 14px;
    }

    .nav .nav-dropdown-menu {
        position: static;
        width: 100%;
        max-height: min(340px, calc(100vh - 220px));
        display: none;
        margin-top: 8px;
        opacity: 1;
        pointer-events: auto;
        transform: none;
    }

    .nav .nav-dropdown.is-open .nav-dropdown-menu {
        display: grid;
    }

    .nav .nav-dropdown-menu.nav-mega-menu {
        width: 100%;
        max-height: min(520px, calc(100vh - 220px));
        padding: 14px;
        transform: none;
    }

    .nav .nav-dropdown.is-open .nav-dropdown-menu.nav-mega-menu {
        transform: none;
    }

    .nav-mega-head {
        flex-direction: column;
        gap: 12px;
    }

    .nav-mega-head strong {
        font-size: 28px;
    }

    .nav-mega-full {
        width: 100%;
        justify-content: space-between;
    }

    .nav-mega-grid {
        grid-template-columns: 1fr;
    }

    .nav-mega-card {
        min-height: 0;
        padding: 16px;
    }

    .nav-mega-card::before {
        font-size: 44px;
    }

    .nav-mega-title {
        font-size: 24px;
    }

    .nav-mega-product-slide {
        grid-template-columns: 92px minmax(0, 1fr);
        min-height: 112px;
    }

    .nav-mega-product-copy strong {
        font-size: 16px;
    }

    .nav-mega-product-description {
        -webkit-line-clamp: 2;
    }

    .nav .cfx-auth-nav {
        display: flex;
        justify-content: space-between;
        padding: 0 14px;
    }

    .nav-cart {
        margin-left: 0;
    }

    .hero {
        min-height: auto;
        padding: calc(var(--header-h) + var(--ticker-h) + 28px) 16px 34px;
    }

    body.ticker-closed .hero {
        padding-top: calc(var(--header-h) + 28px);
    }

    .hero-inner {
        min-height: auto;
        align-items: start;
        gap: 24px;
    }

    .hero-copy,
    .lead {
        width: min(100%, calc(100vw - 32px));
        max-width: calc(100vw - 32px);
    }

    .lead {
        overflow-wrap: break-word;
    }

    .hero-shade {
        background:
            linear-gradient(90deg, rgba(8, 8, 10, 0.82), rgba(9, 9, 12, 0.48)),
            linear-gradient(180deg, rgba(255, 255, 255, 0.035), var(--bg) 94%),
            linear-gradient(128deg, rgba(233, 18, 42, 0.15), transparent 48%);
    }

    h1 {
        font-size: 40px;
        text-shadow:
            0 2px 0 rgba(0, 0, 0, 0.42),
            0 14px 30px rgba(0, 0, 0, 0.76),
            0 0 22px rgba(255, 255, 255, 0.18);
    }

    h2 {
        font-size: 30px;
    }

    .lead {
        font-size: 17px;
    }

    .hero-signals {
        margin-top: 14px;
    }

    .hero-actions .btn {
        width: 100%;
    }

    .redactor-showcase {
        min-height: 390px;
        clip-path: polygon(6% 0, 100% 0, 100% 86%, 92% 100%, 0 100%, 0 12%);
    }

    .redactor-emblem {
        top: 16px;
        left: 16px;
        width: 150px;
        min-height: 126px;
        place-items: start;
        transform: none;
    }

    .redactor-emblem::before,
    .redactor-emblem::after {
        width: 82px;
        height: 132px;
    }

    .redactor-emblem::before {
        left: 6px;
    }

    .redactor-emblem::after {
        right: 6px;
    }

    .redactor-emblem img {
        width: 126px;
    }

    .redactor-emblem span {
        left: 4px;
        bottom: 0;
        font-size: 11px;
    }

    .showcase-stack {
        top: 132px;
        left: 12px;
        right: 12px;
        width: auto;
        gap: 8px;
    }

    .showcase-item,
    .showcase-item.is-primary,
    .showcase-item:nth-child(2),
    .showcase-item:nth-child(3),
    .showcase-item:hover {
        transform: none;
    }

    .showcase-item {
        min-height: 64px;
        padding: 11px 13px 11px 15px;
    }

    .showcase-item strong {
        font-size: 18px;
    }

    .showcase-footer {
        display: none;
    }

    .hero-metrics,
    .hero-panel,
    .category-nav,
    .product-grid,
    .support-grid,
    .product-info-grid,
    .gallery-strip {
        grid-template-columns: 1fr;
    }

    .hero-panel {
        gap: 10px;
    }

    .quick-card {
        min-height: auto;
    }

    .category-nav-section {
        padding: 34px 16px 56px;
    }

    .category-nav-head {
        margin-bottom: 14px;
        justify-items: center;
        text-align: center;
    }

    .category-card {
        min-height: 150px;
        grid-template-columns: 1fr;
        padding: 20px 16px;
        justify-items: center;
        text-align: center;
    }

    .category-icon {
        width: 56px;
        height: 56px;
    }

    .category-copy {
        justify-items: center;
    }

    .category-copy strong {
        font-size: 21px;
    }

    .section {
        padding: 64px 16px;
    }

    .hero+.section {
        margin-top: 0;
        padding-top: 64px;
    }

    .section+.section {
        margin-top: 0;
        padding-top: 64px;
    }

    .split-section {
        padding-top: 64px;
    }

    .product-page {
        padding: calc(var(--header-h) + var(--ticker-h) + 28px) 16px 58px;
    }

    body.ticker-closed .product-page {
        padding-top: calc(var(--header-h) + 28px);
    }

    .product-media-large {
        min-height: 360px;
    }

    .store-controls {
        align-items: stretch;
        flex-direction: column;
    }

    .chip-row {
        justify-content: flex-start;
    }

    .product-body p {
        min-height: auto;
    }

    .footer {
        grid-template-columns: 1fr;
        padding-inline: 16px;
    }

    .footer nav {
        justify-content: flex-start;
    }
}

@media (max-width: 420px) {

    .hero-actions .btn,
    .product-bottom .btn {
        width: 100%;
    }

    .hero-metrics {
        gap: 8px;
    }

    .hero-metrics dt {
        font-size: 18px;
    }

    h1 {
        font-size: 40px;
    }

    .social-links .social-link:nth-child(n + 2) {
        display: none;
    }
}

/* Final clean storefront composition: no decorative block dividers. */
.hero::after,
.section::after,
.category-nav-section::after,
.footer::before {
    content: none !important;
    animation: none !important;
}

.hero {
    padding-bottom: 72px;
}

.category-nav-section {
    padding-top: 72px;
    padding-bottom: 82px;
}

.section {
    padding-top: 92px;
    padding-bottom: 92px;
}

.hero-copy,
.section-head,
.category-nav-head,
.split-section>div:first-child,
.product-body,
.support-grid article,
.faq-list details,
.footer {
    text-align: center;
}

.hero-copy,
.section-head,
.category-nav-head,
.split-section>div:first-child {
    justify-items: center;
}

.hero-actions,
.hero-signals,
.product-meta,
.product-bottom,
.chip-row,
.footer nav {
    justify-content: center;
}

.section-head p:last-child,
.split-section>div:first-child p:last-child,
.product-body p,
.faq-list p,
.footer p,
.legal {
    margin-right: auto;
    margin-left: auto;
}

.split-section {
    grid-template-columns: 1fr;
    gap: 32px;
}

.store-controls {
    align-items: center;
    flex-direction: column;
    margin-bottom: 30px;
}

.search-wrap {
    text-align: center;
}

.product-body {
    display: grid;
    justify-items: center;
}

.product-meta {
    flex-wrap: wrap;
}

.product-bottom {
    width: 100%;
    flex-wrap: wrap;
    gap: 14px;
}

.support-grid::before,
.support-grid article::after {
    content: none;
}

.support-grid article {
    padding-top: 54px;
}

.footer {
    grid-template-columns: 1fr;
    justify-items: center;
}

.footer img {
    margin-right: auto;
    margin-left: auto;
}

/* Balanced composition: hero and cards stay readable, section titles stay polished. */
.hero-copy {
    text-align: left;
    justify-items: start;
}

.hero-actions,
.hero-signals {
    justify-content: flex-start;
}

.section-head,
.category-nav-head {
    max-width: 820px;
    text-align: center;
    justify-items: center;
}

.section-head h2,
.category-nav-head h2 {
    max-width: 820px;
}

.section-head p:last-child {
    max-width: 700px;
}

.product-body,
.support-grid article,
.faq-list details {
    text-align: left;
    justify-items: stretch;
}

.product-body p,
.faq-list p {
    margin-left: 0;
    margin-right: 0;
}

.product-meta,
.product-bottom {
    justify-content: space-between;
}

.product-bottom {
    align-items: center;
}

.split-section {
    grid-template-columns: 0.82fr 1.18fr;
    align-items: center;
    gap: 56px;
}

.split-section>div:first-child {
    text-align: left;
    justify-items: start;
}

.split-section>div:first-child p:last-child {
    margin-left: 0;
    margin-right: 0;
}

.support-grid {
    align-items: stretch;
}

.support-grid article {
    padding-top: 58px;
}

.support-grid article::before {
    left: 20px;
    margin: 0;
}

.category-nav-head {
    margin-bottom: 28px;
}

.category-card {
    text-align: center;
}

@media (max-width: 980px) {
    .split-section {
        grid-template-columns: 1fr;
    }

    .split-section>div:first-child {
        text-align: center;
        justify-items: center;
    }

    .split-section>div:first-child p:last-child {
        margin-left: auto;
        margin-right: auto;
    }
}

/* Storefront rhythm pass: centered headings, readable cards, less dead space. */
.category-nav-section {
    padding-top: 54px;
    padding-bottom: 46px;
}

.category-nav-head {
    margin-bottom: 22px;
}

.category-nav {
    gap: 16px;
}

.category-card {
    min-height: 132px;
    grid-template-columns: 56px minmax(0, 1fr);
    justify-items: stretch;
    align-content: center;
    text-align: left;
    gap: 16px;
    padding: 18px 20px;
    clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 16px 100%, 0 calc(100% - 16px));
}

.category-card::before {
    inset: 0 18px auto;
    opacity: 0.55;
}

.category-card::after {
    inset: auto 20px 14px 92px;
}

.category-icon {
    width: 54px;
    height: 54px;
    align-self: center;
}

.category-copy {
    justify-items: start;
    gap: 5px;
}

.category-copy small {
    color: #eef3f7;
}

.category-copy strong {
    font-size: 23px;
}

.catalog-section {
    padding-top: 64px;
}

.section-head {
    margin-bottom: 24px;
}

.category-nav-head p,
.section-head p,
.split-section>div:first-child p {
    max-width: 760px;
    margin: 10px auto 0;
    color: var(--muted);
    font-size: 17px;
    line-height: 1.55;
    text-align: center;
}

.split-section>div:first-child p {
    margin-left: 0;
    margin-right: 0;
    text-align: left;
}

.store-controls {
    align-items: end;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 24px;
}

.search-wrap {
    text-align: left;
}

.chip-row {
    justify-content: flex-end;
}

.product-body {
    justify-items: stretch;
}

.product-bottom {
    justify-content: space-between;
}

@media (max-width: 760px) {
    .category-nav-section {
        padding-top: 44px;
        padding-bottom: 36px;
    }

    .category-card {
        min-height: 118px;
        grid-template-columns: 52px minmax(0, 1fr);
        text-align: left;
        justify-items: stretch;
    }

    .category-copy {
        justify-items: start;
    }

    .store-controls {
        align-items: stretch;
        flex-direction: column;
    }

    .search-wrap {
        text-align: left;
    }

    .chip-row {
        justify-content: flex-start;
    }
}

@media (max-width: 980px) {
    .split-section>div:first-child p {
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }
}

/* Decision confidence panel: compact proof before the buyer commits. */
.section.split-section {
    align-items: center;
    grid-template-columns: 0.74fr 1.26fr;
    gap: 64px;
    padding-top: 88px;
    padding-bottom: 88px;
}

.decision-copy {
    display: grid;
    gap: 16px;
}

.decision-copy h2 {
    max-width: 620px;
}

.decision-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.decision-badges span {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 999px;
    padding: 0 12px;
    color: #fff;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.025)),
        rgba(255, 255, 255, 0.035);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.decision-badges span:first-child {
    border-color: rgba(255, 49, 76, 0.46);
    background: rgba(233, 18, 42, 0.16);
}

.decision-score {
    position: relative;
    max-width: 520px;
    display: grid;
    gap: 6px;
    margin-top: 4px;
    padding: 18px 20px 18px 24px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.13);
    background:
        linear-gradient(90deg, rgba(233, 18, 42, 0.16), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.022)),
        rgba(12, 13, 16, 0.82);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 20px 46px rgba(0, 0, 0, 0.22);
    clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 16px 100%, 0 calc(100% - 16px));
}

.decision-score::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: linear-gradient(180deg, #ff314c, rgba(255, 255, 255, 0.66), #ff314c);
}

.decision-score strong {
    color: #fff;
    font-size: 15px;
    text-transform: uppercase;
}

.decision-score span {
    color: var(--muted);
    line-height: 1.5;
}

.support-grid {
    grid-template-columns: 1fr;
    gap: 12px;
}

.support-grid::before {
    top: 24px;
    bottom: 24px;
    left: 31px;
    right: auto;
    width: 1px;
    height: auto;
    background: linear-gradient(180deg, rgba(233, 18, 42, 0.72), rgba(255, 255, 255, 0.28), rgba(233, 18, 42, 0.72));
    opacity: 0.64;
}

.support-grid article {
    min-height: 130px;
    display: grid;
    align-content: center;
    padding: 22px 24px 22px 92px;
    border-radius: 0;
    background:
        radial-gradient(240px 120px at 0% 50%, rgba(233, 18, 42, 0.16), transparent 64%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.095), rgba(255, 255, 255, 0.028) 48%, rgba(233, 18, 42, 0.075)),
        rgba(15, 16, 20, 0.82);
    clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 18px 100%, 0 calc(100% - 18px));
}

.support-grid article::before {
    top: 18px;
    left: 18px;
    z-index: 2;
    min-width: 34px;
    height: 24px;
    border-radius: 999px;
}

.support-grid article::after {
    content: attr(data-status);
    top: 18px;
    right: 18px;
    left: auto;
    width: auto;
    height: 24px;
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(255, 49, 76, 0.34);
    border-radius: 999px;
    padding: 0 10px;
    color: #fff;
    background: rgba(233, 18, 42, 0.12);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.support-icon {
    position: absolute;
    top: 55px;
    left: 18px;
    z-index: 2;
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 8px;
    color: #fff;
    background:
        linear-gradient(135deg, rgba(255, 49, 76, 0.34), rgba(255, 255, 255, 0.06)),
        rgba(255, 255, 255, 0.035);
}

.support-icon svg {
    width: 23px;
    height: 23px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.support-grid h3 {
    margin-bottom: 8px;
}

@media (max-width: 980px) {
    .section.split-section {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .decision-copy {
        justify-items: center;
        text-align: center;
    }

    .decision-badges {
        justify-content: center;
    }

    .decision-score {
        margin-right: auto;
        margin-left: auto;
        text-align: left;
    }
}

@media (max-width: 560px) {
    .support-grid article {
        min-height: 150px;
        padding: 76px 18px 20px;
    }

    .support-icon {
        top: 22px;
        left: 18px;
    }

    .support-grid article::before {
        top: 31px;
        left: 70px;
    }

    .support-grid::before {
        content: none;
    }
}

/* Pre-checkout briefing: FAQ becomes a buyer confidence tool. */
.faq-section {
    padding-top: 88px;
    padding-bottom: 88px;
    background:
        radial-gradient(760px 300px at 18% 12%, rgba(233, 18, 42, 0.1), transparent 66%),
        radial-gradient(780px 320px at 88% 88%, rgba(255, 255, 255, 0.034), transparent 64%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.006), rgba(10, 11, 14, 0.96));
}

.faq-layout {
    width: min(100%, var(--max));
    margin: 0 auto;
    display: grid;
    grid-template-columns: 0.78fr 1.22fr;
    gap: 18px;
    align-items: stretch;
}

.faq-brief {
    position: relative;
    overflow: hidden;
    min-height: 328px;
    display: grid;
    align-content: end;
    gap: 18px;
    padding: 26px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    background:
        radial-gradient(320px 210px at 18% 6%, rgba(233, 18, 42, 0.28), transparent 68%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.105), rgba(255, 255, 255, 0.025) 48%, rgba(233, 18, 42, 0.08)),
        rgba(13, 14, 18, 0.86);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 24px 54px rgba(0, 0, 0, 0.3);
    clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 22px 100%, 0 calc(100% - 22px));
}

.faq-brief::before {
    content: "";
    position: absolute;
    top: -12px;
    right: 18px;
    color: rgba(255, 255, 255, 0.055);
    font-size: 112px;
    font-weight: 950;
    line-height: 1;
}

.faq-brief::after {
    content: "";
    position: absolute;
    inset: auto 24px 20px;
    height: 1px;
    background: linear-gradient(90deg, rgba(255, 49, 76, 0.9), rgba(255, 255, 255, 0.34), transparent);
}

.faq-brief>* {
    position: relative;
    z-index: 1;
}

.faq-brief-kicker {
    width: max-content;
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(255, 49, 76, 0.44);
    border-radius: 999px;
    padding: 0 11px;
    color: #fff;
    background: rgba(233, 18, 42, 0.14);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.faq-brief h3 {
    max-width: 360px;
    color: #fff;
    font-size: clamp(28px, 3vw, 42px);
    line-height: 0.98;
}

.faq-checklist {
    display: grid;
    gap: 8px;
}

.faq-checklist span {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--muted);
    line-height: 1.45;
}

.faq-checklist b {
    min-width: 34px;
    height: 24px;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    color: #fff;
    background: rgba(255, 255, 255, 0.045);
    font-size: 11px;
}

.faq-list {
    gap: 12px;
}

.faq-list details {
    position: relative;
    overflow: hidden;
    padding: 0;
    border-color: rgba(255, 255, 255, 0.13);
    border-radius: 0;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.085), rgba(255, 255, 255, 0.025) 52%, rgba(233, 18, 42, 0.062)),
        rgba(15, 16, 20, 0.82);
    clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 16px 100%, 0 calc(100% - 16px));
}

.faq-list details[open] {
    border-color: rgba(255, 49, 76, 0.38);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 18px 44px rgba(0, 0, 0, 0.22);
}

.faq-list details::before {
    content: attr(data-label);
    position: absolute;
    top: 17px;
    right: 54px;
    z-index: 2;
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(255, 49, 76, 0.32);
    border-radius: 999px;
    padding: 0 10px;
    color: #fff;
    background: rgba(233, 18, 42, 0.12);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.faq-list summary {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 62px;
    padding: 18px 190px 18px 22px;
    list-style: none;
}

.faq-list summary::-webkit-details-marker {
    display: none;
}

.faq-list summary::after {
    content: "";
    position: absolute;
    top: 24px;
    right: 22px;
    width: 11px;
    height: 11px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform 160ms ease;
}

.faq-list details[open] summary::after {
    transform: translateY(4px) rotate(225deg);
}

.faq-list p {
    max-width: 760px;
    margin: 0;
    padding: 0 22px 20px;
}

@media (max-width: 980px) {
    .faq-layout {
        grid-template-columns: 1fr;
    }

    .faq-brief {
        min-height: 260px;
    }
}

@media (max-width: 620px) {
    .faq-list details::before {
        position: static;
        width: max-content;
        margin: 16px 18px 0;
    }

    .faq-list summary {
        padding: 12px 48px 16px 18px;
    }

    .faq-list p {
        padding-right: 18px;
        padding-left: 18px;
    }
}

/* Category deck: the asset choice should feel like a product decision. */
.category-nav-section {
    padding-top: 72px;
    padding-bottom: 76px;
    background:
        radial-gradient(720px 280px at 50% 0%, rgba(233, 18, 42, 0.11), transparent 66%),
        linear-gradient(100deg, rgba(255, 255, 255, 0.026), transparent 24%, transparent 76%, rgba(233, 18, 42, 0.055)),
        linear-gradient(180deg, rgba(255, 255, 255, 0.006), rgba(10, 11, 14, 0.96));
}

.category-nav-head {
    max-width: 900px;
    margin-bottom: 30px;
}

.category-nav-head h2 {
    text-wrap: balance;
}

.category-nav {
    gap: 18px;
    align-items: stretch;
}

.category-card {
    --card-accent: 255, 49, 76;
    min-height: 248px;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto 1fr;
    justify-items: start;
    align-content: start;
    gap: 15px;
    padding: 24px;
    overflow: hidden;
    text-align: left;
    border-color: rgba(255, 255, 255, 0.14);
    background:
        radial-gradient(260px 170px at 18% 0%, rgba(var(--card-accent), 0.22), transparent 64%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.105), rgba(255, 255, 255, 0.028) 44%, rgba(var(--card-accent), 0.09)),
        rgba(13, 14, 18, 0.82);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 24px 54px rgba(0, 0, 0, 0.3);
    clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 20px 100%, 0 calc(100% - 20px));
}

.category-card>* {
    position: relative;
    z-index: 1;
}

.category-card::before {
    content: attr(data-step);
    position: absolute;
    top: -10px;
    right: 14px;
    z-index: 0;
    height: auto;
    background: none;
    color: rgba(255, 255, 255, 0.055);
    font-size: 102px;
    font-weight: 950;
    line-height: 1;
    letter-spacing: 0;
    opacity: 1;
}

.category-card::after {
    content: "";
    position: absolute;
    inset: auto 20px 18px;
    height: 1px;
    background: linear-gradient(90deg, rgba(var(--card-accent), 0.9), rgba(255, 255, 255, 0.34), transparent);
}

.category-card:hover {
    border-color: rgba(var(--card-accent), 0.64);
    background:
        radial-gradient(300px 190px at 18% 0%, rgba(var(--card-accent), 0.28), transparent 66%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.036) 44%, rgba(var(--card-accent), 0.12)),
        rgba(15, 16, 20, 0.9);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.13),
        0 28px 60px rgba(0, 0, 0, 0.36),
        0 0 0 1px rgba(var(--card-accent), 0.16);
}

.category-card-nui {
    --card-accent: 255, 255, 255;
}

.category-card-rp {
    --card-accent: 233, 18, 42;
}

.category-icon {
    width: 60px;
    height: 60px;
    align-self: start;
    border-radius: 8px;
    color: #fff;
    border-color: rgba(255, 255, 255, 0.2);
    background:
        linear-gradient(135deg, rgba(var(--card-accent), 0.36), rgba(255, 255, 255, 0.06)),
        rgba(255, 255, 255, 0.035);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 16px 34px rgba(0, 0, 0, 0.24);
}

.category-copy {
    justify-items: start;
    gap: 8px;
}

.category-copy small {
    color: rgba(255, 255, 255, 0.86);
    font-size: 12px;
}

.category-copy strong {
    font-size: clamp(28px, 2.4vw, 36px);
    line-height: 0.96;
}

.category-copy em {
    max-width: 280px;
    color: var(--muted);
    font-size: 15px;
}

.category-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.category-tags b {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 999px;
    padding: 0 10px;
    color: #fff;
    background: rgba(255, 255, 255, 0.046);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.category-tags b:first-child {
    border-color: rgba(var(--card-accent), 0.42);
    background: rgba(var(--card-accent), 0.14);
}

.category-cta {
    align-self: end;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-top: auto;
    color: #fff;
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
}

.category-cta::after {
    content: "";
    width: 8px;
    height: 8px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
}

@media (max-width: 980px) {
    .category-nav {
        grid-template-columns: 1fr;
    }

    .category-card {
        min-height: 210px;
    }
}

@media (max-width: 760px) {
    .category-nav-section {
        padding-top: 48px;
        padding-bottom: 46px;
    }

    .category-card {
        min-height: 198px;
        grid-template-columns: 1fr;
        padding: 20px;
    }

    .category-card::before {
        font-size: 82px;
    }
}

/* Premium catalog hub: trust signals, filters, then product cards. */
.catalog-command {
    position: relative;
    z-index: 1;
    width: min(100%, var(--max));
    margin: 0 auto 28px;
    padding: 14px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background:
        linear-gradient(90deg, rgba(233, 18, 42, 0.1), transparent 22%, transparent 78%, rgba(255, 255, 255, 0.04)),
        linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.025)),
        rgba(11, 12, 15, 0.82);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.09),
        0 22px 54px rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(14px);
    clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 18px 100%, 0 calc(100% - 18px));
}

.catalog-command::before {
    content: "";
    position: absolute;
    inset: 0 16px auto;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255, 57, 80, 0.84), rgba(255, 255, 255, 0.5), transparent);
    opacity: 0.82;
}

.catalog-command::after {
    content: "";
    position: absolute;
    right: -60px;
    bottom: -84px;
    width: 300px;
    height: 180px;
    background: radial-gradient(ellipse at center, rgba(233, 18, 42, 0.2), transparent 68%);
    pointer-events: none;
}

.catalog-proof {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
}

.catalog-drop-line {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.drop-badge,
.drop-action {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    padding: 0 13px;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    color: #fff;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.105), rgba(255, 255, 255, 0.035)),
        rgba(255, 255, 255, 0.035);
    border: 1px solid rgba(255, 255, 255, 0.13);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    clip-path: polygon(0 0, calc(100% - 9px) 0, 100% 9px, 100% 100%, 9px 100%, 0 calc(100% - 9px));
}

.drop-badge.is-live {
    gap: 8px;
    color: #fff;
    background:
        linear-gradient(135deg, rgba(255, 32, 58, 0.68), rgba(124, 4, 17, 0.5)),
        rgba(233, 18, 42, 0.2);
    border-color: rgba(255, 71, 94, 0.64);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.17),
        0 12px 28px rgba(233, 18, 42, 0.22);
}

.drop-badge.is-live::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 0 14px rgba(255, 255, 255, 0.8);
}

.drop-action {
    margin-left: auto;
    min-width: 144px;
    color: #fff;
    text-decoration: none;
    background:
        linear-gradient(135deg, #ff213d, #b3061a),
        rgba(233, 18, 42, 0.24);
    border-color: rgba(255, 73, 96, 0.78);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.2),
        0 16px 34px rgba(233, 18, 42, 0.24);
}

.catalog-proof span {
    position: relative;
    min-width: 0;
    min-height: 66px;
    overflow: hidden;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 10px;
    align-content: center;
    padding: 11px 12px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.018)),
        rgba(255, 255, 255, 0.026);
    clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}

.catalog-proof span::after {
    content: "";
    position: absolute;
    right: 12px;
    bottom: 9px;
    left: 56px;
    height: 2px;
    background: linear-gradient(90deg, rgba(255, 49, 76, 0.85), transparent);
    opacity: 0.62;
}

.catalog-proof svg {
    grid-row: 1 / 3;
    align-self: center;
    width: 25px;
    height: 25px;
    color: var(--accent);
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    filter: drop-shadow(0 0 12px rgba(233, 18, 42, 0.32));
}

.catalog-proof strong {
    min-width: 0;
    overflow: hidden;
    color: #fff;
    font-size: 14px;
    line-height: 1.1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.catalog-proof small {
    min-width: 0;
    overflow: hidden;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.catalog-command .store-controls {
    width: 100%;
    margin: 14px 0 0;
    padding-top: 14px;
    border-top: 1px solid rgba(255, 255, 255, 0.09);
}

.catalog-command .search-wrap input {
    height: 52px;
    border-radius: 6px;
}

.catalog-command .chip {
    height: 46px;
    border-radius: 6px;
}

.product-badge {
    max-width: calc(100% - 24px);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 6px;
    text-transform: uppercase;
    letter-spacing: 0;
    white-space: nowrap;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        0 14px 30px rgba(0, 0, 0, 0.28);
    clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 8px 100%, 0 calc(100% - 8px));
}

.badge-best,
.badge-premium {
    background:
        linear-gradient(135deg, #ff243f, #a70417),
        rgba(233, 18, 42, 0.22);
    border-color: rgba(255, 72, 96, 0.72);
}

.badge-new {
    color: #111217;
    background:
        linear-gradient(135deg, #fff, #ffbdc6 48%, #ff314c),
        #fff;
    border-color: rgba(255, 255, 255, 0.78);
}

.badge-stack,
.badge-nui {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.22), rgba(233, 18, 42, 0.28)),
        rgba(10, 11, 14, 0.78);
    border-color: rgba(255, 255, 255, 0.28);
}

.badge-preview {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(177, 188, 199, 0.72)),
        #dce3ea;
    color: #121319;
    border-color: rgba(255, 255, 255, 0.68);
}

.product-meta span {
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 0 9px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.045);
    color: #dfe6ee;
}

.product-meta span:last-child {
    color: #fff;
    border-color: rgba(255, 49, 76, 0.34);
    background: rgba(233, 18, 42, 0.12);
}

@media (max-width: 980px) {
    .catalog-proof {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .catalog-proof span:last-child {
        grid-column: 1 / -1;
    }

    .drop-action {
        margin-left: 0;
    }
}

@media (max-width: 560px) {
    .catalog-command {
        padding: 10px;
        clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));
    }

    .catalog-proof {
        grid-template-columns: 1fr;
    }

    .catalog-proof span:last-child {
        grid-column: auto;
    }
}

/* Brand footer: final trust layer, not just navigation leftovers. */
.footer {
    width: 100%;
    max-width: none;
    display: block;
    padding: 0;
    text-align: left;
    background:
        radial-gradient(860px 300px at 84% 0%, rgba(233, 18, 42, 0.18), transparent 66%),
        radial-gradient(760px 260px at 12% 100%, rgba(255, 255, 255, 0.045), transparent 64%),
        linear-gradient(118deg, rgba(233, 18, 42, 0.055), transparent 28%, transparent 72%, rgba(255, 255, 255, 0.026)),
        linear-gradient(180deg, rgba(5, 6, 8, 0.94), rgba(9, 8, 11, 0.98));
    color: var(--muted);
}

.footer::after {
    opacity: 0.16;
}

.footer-shell {
    position: relative;
    z-index: 1;
    width: min(100%, var(--max));
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(320px, 1.35fr) repeat(3, minmax(180px, 0.55fr));
    gap: 18px;
    padding: 58px 22px 28px;
}

.footer-shell::before {
    content: "";
    position: absolute;
    top: 28px;
    right: 22px;
    left: 22px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255, 49, 76, 0.78), rgba(255, 255, 255, 0.34), transparent);
}

.footer-brand,
.footer-status,
.footer-links {
    position: relative;
    overflow: hidden;
    min-width: 0;
    border: 1px solid rgba(255, 255, 255, 0.11);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02) 50%, rgba(233, 18, 42, 0.055)),
        rgba(14, 15, 18, 0.78);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
    clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 16px 100%, 0 calc(100% - 16px));
}

.footer-brand {
    display: grid;
    align-content: start;
    gap: 16px;
    padding: 24px;
}

.footer-brand img {
    width: 232px;
    max-width: 100%;
    margin: 0;
}

.footer-brand p {
    max-width: 430px;
    margin: 0;
    color: var(--muted);
    line-height: 1.62;
}

.footer-socials {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.footer-socials a,
.footer-pills span,
.footer-links a {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    padding: 0 11px;
    color: #fff;
    background: rgba(255, 255, 255, 0.04);
    font-size: 12px;
    font-weight: 850;
    text-decoration: none;
}

.footer-socials a:first-child,
.footer-pills span:first-child {
    border-color: rgba(255, 49, 76, 0.44);
    background: rgba(233, 18, 42, 0.15);
}

.footer-status {
    display: grid;
    align-content: space-between;
    gap: 18px;
    padding: 24px;
    background:
        radial-gradient(260px 180px at 20% 0%, rgba(233, 18, 42, 0.22), transparent 68%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.095), rgba(255, 255, 255, 0.022) 50%, rgba(233, 18, 42, 0.08)),
        rgba(14, 15, 18, 0.82);
}

.footer-status::before {
    content: "";
    position: absolute;
    top: -12px;
    right: 16px;
    color: rgba(255, 255, 255, 0.055);
    font-size: 88px;
    font-weight: 950;
    line-height: 1;
}

.footer-status>* {
    position: relative;
    z-index: 1;
}

.footer-kicker,
.footer-links span {
    color: #fff;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.footer-status strong {
    max-width: 280px;
    color: #fff;
    font-size: clamp(24px, 2.1vw, 34px);
    line-height: 0.98;
}

.footer-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.footer-links {
    display: grid;
    align-content: start;
    gap: 9px;
    padding: 22px;
}

.footer-links a {
    width: 100%;
    justify-content: space-between;
    min-height: 38px;
    border-radius: 10px;
    padding: 0 12px;
    color: rgba(226, 231, 240, 0.72);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.016)),
        rgba(255, 255, 255, 0.024);
}

.footer-links a::after {
    content: "";
    width: 7px;
    height: 7px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
    opacity: 0.75;
}

.footer a:hover {
    color: #fff;
    border-color: rgba(255, 49, 76, 0.42);
}

.footer-bottom {
    position: relative;
    z-index: 1;
    width: min(100%, var(--max));
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 22px 34px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.footer-bottom .legal {
    max-width: 760px;
    margin: 0;
    color: rgba(184, 191, 202, 0.72);
    font-size: 12px;
    line-height: 1.55;
}

.footer-bottom>span {
    flex: 0 0 auto;
    color: #fff;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

@media (max-width: 1120px) {
    .footer-shell {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 720px) {
    .footer-shell {
        grid-template-columns: 1fr;
        padding-top: 48px;
    }

    .footer-bottom {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Shared interaction: clickable controls and cards nudge left, matching the hero blocks. */
.btn,
.category-card,
.product-card,
.footer-links a,
.drop-action,
.chip,
.header-cta {
    transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, box-shadow 160ms ease, color 160ms ease;
}

.product-card {
    cursor: pointer;
}

.btn:hover,
.category-card:hover,
.product-card:hover,
.footer-links a:hover,
.drop-action:hover,
.chip:hover,
.header-cta:hover {
    transform: translateX(-4px);
}

.btn:active,
.category-card:active,
.product-card:active,
.footer-links a:active,
.drop-action:active,
.chip:active,
.header-cta:active {
    transform: translateX(-1px);
}

.btn[aria-disabled="true"],
.btn[aria-disabled="true"]:hover,
.btn[aria-disabled="true"]:active {
    transform: none;
}

@media (max-width: 760px) {

    .btn:hover,
    .category-card:hover,
    .product-card:hover,
    .footer-links a:hover,
    .drop-action:hover,
    .chip:hover,
    .header-cta:hover {
        transform: none;
    }
}

/* Premium cleanup: less repeated text, calmer layers, more room for product media. */
.hero-depth-lines {
    opacity: 0.42;
}

.redactor-showcase::before {
    opacity: 0.48;
}

.redactor-showcase::after {
    opacity: 0.58;
}

.section::before,
.category-nav-section::before,
.catalog-section::before,
.split-section::before,
.faq-section::before {
    opacity: 0.16;
}

.category-nav-section {
    padding-bottom: 76px;
}

.category-nav-head {
    margin-bottom: 32px;
}

.category-card {
    min-height: 236px;
    gap: 14px;
}

.category-copy em {
    max-width: 240px;
}

.catalog-section {
    padding-top: 72px;
}

.catalog-command {
    margin-bottom: 30px;
    padding: 14px;
}

.catalog-command .store-controls {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

.split-section {
    gap: 44px;
}

.decision-copy {
    align-content: center;
}

.support-grid article {
    min-height: 190px;
}

.support-grid::before,
.support-grid article::after {
    opacity: 0.5;
}

.faq-layout {
    grid-template-columns: minmax(0, 980px);
    justify-content: center;
}

.faq-list {
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
}

@media (max-width: 980px) {
    .category-card {
        min-height: 220px;
    }
}

@media (max-width: 620px) {
    .category-card {
        min-height: 196px;
    }
}

/* Functional hero showcase: VIP entry plus real product shortcuts. */
.redactor-showcase {
    padding: 18px;
}

.showcase-grid {
    position: relative;
    z-index: 3;
    min-height: 394px;
    display: grid;
    grid-template-columns: minmax(190px, 0.92fr) minmax(280px, 1.08fr);
    gap: 12px;
}

.showcase-feature,
.showcase-item {
    color: inherit;
    text-decoration: none;
}

.showcase-feature {
    position: relative;
    min-height: 100%;
    overflow: hidden;
    display: grid;
    align-content: end;
    gap: 10px;
    padding: 26px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    clip-path: polygon(0 0, 88% 0, 100% 13%, 100% 100%, 10% 100%, 0 88%);
    background:
        linear-gradient(145deg, rgba(233, 18, 42, 0.34), rgba(19, 15, 19, 0.8) 54%, rgba(7, 8, 11, 0.92)),
        radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.16), transparent 34%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
    transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.showcase-feature::before {
    content: "";
    position: absolute;
    left: 18px;
    top: 18px;
    color: rgba(255, 255, 255, 0.08);
    font-size: 112px;
    font-weight: 950;
    line-height: 0.8;
    letter-spacing: 0;
    pointer-events: none;
}

.showcase-feature::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(110deg, transparent 0 42%, rgba(255, 255, 255, 0.18) 42.2%, transparent 44%),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.04) 0 1px, transparent 1px 44px);
    opacity: 0.62;
    pointer-events: none;
}

.showcase-feature>* {
    position: relative;
    z-index: 1;
}

.showcase-feature span,
.showcase-item span {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(255, 72, 94, 0.42);
    border-radius: 999px;
    background: rgba(233, 18, 42, 0.18);
    color: #ffd8dd;
    font-size: 11px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
}

.showcase-feature span {
    padding: 8px 11px;
}

.showcase-feature strong {
    max-width: 220px;
    color: #fff;
    font-size: 38px;
    line-height: 0.95;
}

.showcase-feature small {
    max-width: 260px;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.45;
}

.showcase-feature em {
    width: fit-content;
    color: #fff;
    font-size: 12px;
    font-style: normal;
    font-weight: 900;
    text-transform: uppercase;
}

.showcase-feature:hover {
    transform: translateX(-7px);
    border-color: rgba(255, 255, 255, 0.42);
    background:
        linear-gradient(145deg, rgba(255, 49, 76, 0.42), rgba(25, 16, 20, 0.78) 52%, rgba(7, 8, 11, 0.92)),
        radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.2), transparent 34%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        0 18px 44px rgba(0, 0, 0, 0.32);
}

.showcase-stack {
    position: relative;
    inset: auto;
    width: auto;
    display: grid;
    gap: 12px;
}

.showcase-item,
.showcase-item.is-primary,
.showcase-item:nth-child(2),
.showcase-item:nth-child(3) {
    --showcase-x: 0px;
    transform: none;
}

.showcase-item {
    min-height: 122px;
    align-content: center;
    padding: 20px 22px;
    clip-path: polygon(0 0, calc(100% - 28px) 0, 100% 28px, 100% 100%, 0 100%);
}

.showcase-item span {
    padding: 7px 10px;
}

.showcase-item strong {
    font-size: 25px;
}

.showcase-item small {
    max-width: 310px;
    line-height: 1.4;
}

.showcase-item:hover {
    transform: translateX(-7px);
}

@media (max-width: 980px) {
    .showcase-grid {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .showcase-feature {
        min-height: 220px;
    }
}

@media (max-width: 760px) {
    .redactor-showcase {
        min-height: auto;
        padding: 12px;
    }

    .showcase-stack {
        position: relative;
        inset: auto;
        width: auto;
    }

    .showcase-feature,
    .showcase-feature:hover,
    .showcase-item,
    .showcase-item.is-primary,
    .showcase-item:nth-child(2),
    .showcase-item:nth-child(3),
    .showcase-item:hover {
        transform: none;
    }

    .showcase-feature {
        min-height: 190px;
        padding: 22px;
    }

    .showcase-feature::before {
        font-size: 86px;
    }

    .showcase-feature strong {
        font-size: 31px;
    }

    .showcase-item {
        min-height: 92px;
        padding: 16px;
    }
}

/* Redactor brand pass: no grey hover edges, sharper RED accent, clearer badges. */
h1 .title-red {
    color: var(--accent);
    text-shadow:
        0 0 20px rgba(233, 18, 42, 0.34),
        0 2px 0 rgba(0, 0, 0, 0.45);
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    clip-path: inset(50%);
}

.hero-logo-title {
    position: relative;
    width: min(100%, 540px);
    margin: 0 0 22px;
    line-height: 1;
}

.hero-logo-frame {
    position: relative;
    width: min(100%, 512px);
    min-height: 142px;
    display: grid;
    align-items: center;
    overflow: hidden;
    padding: 24px 30px 22px;
    border: 1px solid rgba(255, 49, 76, 0.34);
    clip-path: polygon(0 0, calc(100% - 28px) 0, 100% 28px, 100% 100%, 28px 100%, 0 calc(100% - 28px));
    background:
        linear-gradient(110deg, rgba(233, 18, 42, 0.18), rgba(8, 9, 12, 0.6) 38%, transparent 78%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(8, 9, 12, 0.14)),
        rgba(6, 7, 10, 0.18);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 26px 70px rgba(0, 0, 0, 0.26);
}

.hero-logo-frame::before {
    content: "";
    position: absolute;
    inset: 16px 20px auto;
    height: 1px;
    background: linear-gradient(90deg, var(--accent), rgba(255, 255, 255, 0.5), transparent);
    opacity: 0.9;
}

.hero-logo-frame::after {
    content: "";
    position: absolute;
    right: 24px;
    bottom: 13px;
    color: rgba(255, 255, 255, 0.56);
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
}

.hero-logo-frame img {
    position: relative;
    z-index: 1;
    width: min(100%, 430px);
    height: auto;
    filter:
        drop-shadow(0 12px 24px rgba(0, 0, 0, 0.42)) drop-shadow(0 0 18px rgba(233, 18, 42, 0.18));
}

.btn-ghost:hover,
.social-link:hover,
.ticker-close:hover {
    border-color: rgba(233, 18, 42, 0.62);
    background:
        linear-gradient(180deg, rgba(233, 18, 42, 0.18), rgba(9, 10, 13, 0.88)),
        rgba(10, 10, 13, 0.94);
    box-shadow:
        inset 0 1px 0 rgba(255, 49, 76, 0.18),
        0 12px 28px rgba(0, 0, 0, 0.24);
}

.showcase-feature {
    border-color: rgba(233, 18, 42, 0.28);
    background:
        linear-gradient(145deg, rgba(112, 8, 22, 0.46), rgba(14, 13, 16, 0.88) 52%, rgba(5, 6, 9, 0.96)),
        radial-gradient(circle at 18% 12%, rgba(233, 18, 42, 0.22), transparent 36%);
}

.showcase-feature::after {
    background:
        linear-gradient(110deg, transparent 0 42%, rgba(233, 18, 42, 0.22) 42.2%, transparent 44%),
        repeating-linear-gradient(90deg, rgba(233, 18, 42, 0.08) 0 1px, transparent 1px 44px);
    opacity: 0.48;
}

.showcase-feature:hover {
    border-color: rgba(255, 49, 76, 0.64);
    background:
        linear-gradient(145deg, rgba(145, 10, 28, 0.52), rgba(13, 12, 15, 0.9) 52%, rgba(5, 6, 9, 0.96)),
        radial-gradient(circle at 18% 12%, rgba(233, 18, 42, 0.3), transparent 36%);
    box-shadow:
        inset 0 1px 0 rgba(255, 49, 76, 0.22),
        0 18px 44px rgba(0, 0, 0, 0.32);
}

.showcase-item {
    border-color: rgba(233, 18, 42, 0.2);
    background:
        linear-gradient(90deg, rgba(65, 10, 18, 0.32), rgba(10, 10, 13, 0.92) 46%, rgba(5, 6, 9, 0.96)),
        rgba(10, 10, 13, 0.94);
}

.showcase-item.is-primary {
    border-color: rgba(255, 49, 76, 0.5);
    background:
        linear-gradient(90deg, rgba(118, 10, 26, 0.42), rgba(11, 10, 13, 0.9) 50%, rgba(5, 6, 9, 0.96)),
        rgba(10, 10, 13, 0.94);
}

.showcase-item:hover,
.showcase-item.is-primary:hover {
    border-color: rgba(255, 49, 76, 0.68);
    background:
        linear-gradient(90deg, rgba(126, 10, 27, 0.5), rgba(10, 10, 13, 0.92) 52%, rgba(5, 6, 9, 0.98)),
        rgba(10, 10, 13, 0.96);
    box-shadow:
        inset 0 1px 0 rgba(255, 49, 76, 0.18),
        0 16px 36px rgba(0, 0, 0, 0.3);
}

.showcase-badge,
.showcase-feature .showcase-badge,
.showcase-item .showcase-badge {
    min-height: 28px;
    padding: 0 11px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 950;
    letter-spacing: 0;
    box-shadow: none;
}

.showcase-feature .badge-vip {
    border-color: rgba(255, 255, 255, 0.7);
    background: #f4f4f5;
    color: #111216;
}

.showcase-item .badge-latest {
    border-color: rgba(255, 49, 76, 0.78);
    background: var(--accent);
    color: #fff;
}

.showcase-item .badge-best {
    border-color: rgba(255, 255, 255, 0.54);
    background: rgba(255, 255, 255, 0.92);
    color: #16171b;
}

.showcase-item .badge-premium {
    border-color: rgba(255, 49, 76, 0.64);
    background: rgba(7, 8, 11, 0.86);
    color: #fff;
}

.hero-brand-lockup {
    display: none;
    align-items: center;
    gap: 12px;
    margin: 0 0 12px;
}

.hero-brand-lockup .eyebrow {
    margin: 0;
}

.hero-brand-mark {
    position: relative;
    width: 58px;
    height: 44px;
    flex: 0 0 58px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(255, 49, 76, 0.42);
    clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));
    background:
        linear-gradient(145deg, rgba(233, 18, 42, 0.34), rgba(8, 9, 12, 0.92) 58%, rgba(255, 255, 255, 0.08)),
        rgba(9, 10, 13, 0.9);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        0 12px 28px rgba(233, 18, 42, 0.16);
}

.hero-brand-mark::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(110deg, transparent 0 44%, rgba(255, 255, 255, 0.22) 44.2%, transparent 46%),
        radial-gradient(circle at 25% 12%, rgba(255, 255, 255, 0.2), transparent 38%);
    opacity: 0.7;
}

.hero-brand-mark img {
    position: relative;
    z-index: 1;
    width: 42px;
    height: auto;
    filter: drop-shadow(0 8px 18px rgba(233, 18, 42, 0.3));
}

@media (max-width: 760px) {

    .hero-logo-title,
    .hero-logo-frame {
        width: min(100%, 430px);
    }

    .hero-logo-frame {
        min-height: 116px;
        padding: 20px 22px 18px;
    }

    .hero-logo-frame img {
        width: min(100%, 350px);
    }

    .hero-logo-frame::after {
        right: 20px;
        bottom: 11px;
    }

    .hero-brand-lockup {
        justify-content: center;
    }
}

/* Final hero command panel: keeps the left block branded as one system. */
.hero-logo-title {
    margin-bottom: 12px;
}

.hero-command-panel {
    position: relative;
    width: min(100%, 512px);
    display: grid;
    gap: 13px;
    overflow: hidden;
    padding: 18px;
    border: 1px solid rgba(255, 49, 76, 0.22);
    clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 22px 100%, 0 calc(100% - 22px));
    background:
        linear-gradient(135deg, rgba(5, 6, 9, 0.76), rgba(17, 10, 14, 0.64) 54%, rgba(5, 6, 9, 0.82)),
        linear-gradient(90deg, rgba(233, 18, 42, 0.12), transparent 38%, rgba(255, 255, 255, 0.035));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        inset 3px 0 0 rgba(233, 18, 42, 0.78),
        0 18px 46px rgba(0, 0, 0, 0.24);
}

.hero-command-panel::before {
    content: "";
    position: absolute;
    inset: 0 18px auto;
    height: 1px;
    background: linear-gradient(90deg, rgba(255, 49, 76, 0.92), rgba(255, 255, 255, 0.3), transparent);
    opacity: 0.74;
}

.hero-command-panel .hero-lead {
    max-width: 470px;
    margin: 0;
    color: rgba(246, 247, 250, 0.92);
    font-size: 17px;
    line-height: 1.42;
    text-shadow: 0 12px 26px rgba(0, 0, 0, 0.5);
}

.hero-proof-row {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.hero-proof-row span {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    overflow: hidden;
    padding: 0 10px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    color: rgba(255, 255, 255, 0.84);
    font-size: 11px;
    font-weight: 900;
    line-height: 1.1;
    text-transform: uppercase;
    white-space: nowrap;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.018)),
        rgba(6, 7, 10, 0.68);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.hero-proof-row b {
    color: #ff334d;
    font-size: 10px;
    font-weight: 950;
}

.hero-command-panel .hero-actions {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.95fr);
    gap: 10px;
    margin-top: 2px;
}

.hero-command-panel .btn {
    min-height: 48px;
    width: 100%;
    justify-content: space-between;
    border-radius: 0;
    padding: 0 18px;
    clip-path: polygon(0 0, calc(100% - 13px) 0, 100% 13px, 100% 100%, 13px 100%, 0 calc(100% - 13px));
    transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease, color 160ms ease, transform 160ms ease;
}

.hero-command-panel .btn-primary {
    background:
        linear-gradient(135deg, #ff2743 0%, #e9122a 42%, #7d0715 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.25),
        inset 0 -14px 30px rgba(41, 0, 7, 0.26),
        0 16px 34px rgba(233, 18, 42, 0.28);
}

.hero-command-panel .btn-ghost {
    border-color: rgba(255, 255, 255, 0.18);
    background:
        linear-gradient(135deg, rgba(35, 36, 40, 0.82), rgba(7, 8, 11, 0.9)),
        rgba(10, 10, 13, 0.88);
}

.hero-command-panel .btn:hover {
    transform: translateX(-3px);
}

.hero-command-panel .btn-ghost:hover {
    border-color: rgba(255, 49, 76, 0.54);
    background:
        linear-gradient(135deg, rgba(95, 10, 22, 0.42), rgba(7, 8, 11, 0.93)),
        rgba(10, 10, 13, 0.92);
}

.hero-signals {
    display: none;
}

@media (max-width: 760px) {
    .hero-command-panel {
        width: min(100%, 430px);
        padding: 16px;
    }

    .hero-command-panel .hero-lead {
        font-size: 15px;
    }

    .hero-proof-row,
    .hero-command-panel .hero-actions {
        grid-template-columns: 1fr;
    }

    .hero-proof-row span {
        justify-content: center;
    }

}

/* Soft premium pass: less cyberpunk, closer to the rounded product cards. */
.hero-logo-frame,
.hero-command-panel,
.redactor-showcase,
.showcase-feature,
.showcase-item,
.category-card {
    clip-path: none;
    border-radius: 10px;
}

.hero-logo-frame {
    border-radius: 8px;
}

.hero-command-panel {
    border-radius: 8px;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        inset 0 0 0 1px rgba(255, 49, 76, 0.05),
        0 18px 46px rgba(0, 0, 0, 0.24);
}

.hero-command-panel .btn,
.btn,
.btn-small,
.header-cta,
.nav-cart,
.social-link {
    clip-path: none;
    border-radius: 8px;
}

.hero-command-panel .btn:hover {
    transform: translateY(-1px);
}

.hero-proof-row span,
.product-badge,
.showcase-badge,
.showcase-feature .showcase-badge,
.showcase-item .showcase-badge,
.chip,
.filter-pill,
.hero-intel span,
.hero-signals span,
.product-meta span,
.category-card .category-chip {
    clip-path: none;
    border-radius: 999px;
}

.product-badge {
    min-height: 28px;
    padding: 0 12px;
}

.category-card {
    border-radius: 8px;
}

.category-card::before,
.category-card::after {
    border-radius: inherit;
}

/* Redactor soft-geometry system: rounded, premium, still sharp enough for the brand. */
:root {
    --soft-card-radius: 10px;
    --soft-panel-radius: 12px;
    --soft-control-radius: 8px;
}

.hero-logo-frame,
.hero-command-panel,
.redactor-showcase,
.showcase-feature,
.showcase-item,
.category-card,
.catalog-command,
.decision-score,
.support-grid article,
.footer-shell,
.product-card,
.product-page,
.product-media,
.gallery-thumb,
.faq-list details,
.quick-card {
    clip-path: none !important;
}

.hero-logo-frame,
.redactor-showcase,
.catalog-command,
.footer-shell,
.product-page {
    border-radius: var(--soft-panel-radius) !important;
}

.hero-command-panel,
.showcase-feature,
.showcase-item,
.category-card,
.decision-score,
.support-grid article,
.product-card,
.quick-card,
.faq-list details {
    border-radius: var(--soft-card-radius) !important;
}

.product-media,
.product-visual,
.media-main,
.media-hover,
.gallery-thumb,
.product-hero-media,
.product-visual.media-main,
.product-visual.media-hover {
    border-radius: var(--soft-control-radius) !important;
}

.btn,
.btn-small,
.header-cta,
.nav-cart,
.social-link,
.ticker-close,
.drop-action,
.search-wrap input,
.catalog-command .search-wrap input,
.chip,
.catalog-command .chip {
    clip-path: none !important;
    border-radius: var(--soft-control-radius) !important;
}

.product-badge,
.showcase-badge,
.drop-badge,
.catalog-proof span,
.hero-proof-row span,
.product-meta span,
.category-tags b,
.decision-badges span,
.trust-pill,
.footer-pill,
.chip,
.hero-intel span,
.hero-signals span {
    clip-path: none !important;
    border-radius: 999px !important;
}

.catalog-proof span {
    min-height: 56px;
    grid-template-columns: 30px minmax(0, 1fr);
    padding: 10px 12px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.018)),
        rgba(8, 9, 12, 0.58);
}

.catalog-proof span::after {
    left: 52px;
    border-radius: 999px;
}

.product-badge,
.drop-badge,
.showcase-badge {
    min-height: 28px;
    padding: 0 12px;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        0 10px 22px rgba(0, 0, 0, 0.2);
}

.hero-logo-frame,
.hero-command-panel,
.catalog-command,
.decision-score,
.support-grid article {
    border-color: rgba(255, 49, 76, 0.22);
    background-blend-mode: normal;
}

.hero-command-panel::before,
.catalog-command::before {
    inset-inline: 18px;
    border-radius: 999px;
}

.support-grid article {
    padding-left: 88px;
}

.hero-command-panel .btn,
.product-bottom .btn,
.drop-action {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        0 14px 30px rgba(0, 0, 0, 0.22);
}

/* Cinematic background pass: one continuous dark canvas, red only where it matters. */
body {
    background:
        radial-gradient(900px 460px at 78% 12%, rgba(233, 18, 42, 0.18), transparent 62%),
        radial-gradient(720px 380px at 12% 42%, rgba(255, 49, 76, 0.08), transparent 66%),
        linear-gradient(180deg, #08090c 0%, #0c0d11 38%, #07080b 100%) !important;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(112deg, transparent 0 36%, rgba(255, 255, 255, 0.035) 36.15% 36.35%, transparent 36.7% 62%, rgba(233, 18, 42, 0.11) 62.1% 62.45%, transparent 62.8%),
        radial-gradient(780px 260px at 82% 18%, rgba(233, 18, 42, 0.12), transparent 64%),
        radial-gradient(740px 300px at 18% 78%, rgba(255, 255, 255, 0.035), transparent 70%),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.018) 0 1px, transparent 1px 96px),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.012) 0 1px, transparent 1px 82px);
    opacity: 0.58;
    mix-blend-mode: screen;
}

body::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.14), transparent 18%, transparent 72%, rgba(0, 0, 0, 0.34)),
        radial-gradient(900px 440px at 50% 102%, rgba(233, 18, 42, 0.08), transparent 66%);
}

.hero,
.category-nav-section,
.catalog-section,
.split-section,
.faq-section,
.section,
.footer {
    background: transparent !important;
}

.category-nav-section::before,
.category-nav-section::after,
.catalog-section::before,
.section::before,
.section::after,
.faq-section::before,
.footer::before,
.footer::after {
    content: none !important;
}

.category-nav-section,
.catalog-section,
.split-section,
.faq-section {
    position: relative;
}

.category-nav-section::marker,
.catalog-section::marker,
.split-section::marker,
.faq-section::marker {
    content: "";
}

.category-nav-section {
    padding-top: 74px;
}

.category-nav-section::selection,
.catalog-section::selection,
.split-section::selection,
.faq-section::selection {
    background: rgba(233, 18, 42, 0.34);
}

.category-nav-section>*,
.catalog-section>*,
.split-section>*,
.faq-section>*,
.footer>* {
    position: relative;
    z-index: 1;
}

.category-nav-section,
.catalog-section,
.split-section,
.faq-section {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.035),
        inset 0 -1px 0 rgba(255, 255, 255, 0.025);
}

.category-nav-section::after,
.catalog-section::after,
.split-section::after,
.faq-section::after {
    content: "" !important;
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(640px 220px at 50% 0%, rgba(233, 18, 42, 0.08), transparent 72%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.018), transparent 18%, rgba(0, 0, 0, 0.12) 100%);
    opacity: 0.72;
}

.catalog-section::after,
.faq-section::after {
    background:
        radial-gradient(760px 260px at 50% 0%, rgba(255, 255, 255, 0.035), transparent 72%),
        linear-gradient(180deg, rgba(0, 0, 0, 0.1), transparent 24%, rgba(233, 18, 42, 0.035) 100%);
}

.section-head h2,
.category-nav-head h2,
.decision-copy h2 {
    text-shadow:
        0 18px 46px rgba(0, 0, 0, 0.58),
        0 0 28px rgba(233, 18, 42, 0.14);
}

.category-card,
.product-card,
.catalog-command,
.decision-score,
.support-grid article,
.faq-list details,
.footer-brand,
.footer-status,
.footer-links {
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.024) 42%, rgba(233, 18, 42, 0.055)),
        rgba(10, 11, 15, 0.72) !important;
    border-color: rgba(255, 255, 255, 0.13);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
}

.category-card:hover,
.product-card:hover,
.support-grid article:hover,
.faq-list details[open] {
    border-color: rgba(255, 49, 76, 0.3);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.11),
        0 20px 52px rgba(0, 0, 0, 0.28),
        0 0 0 1px rgba(233, 18, 42, 0.035);
}

/* Footer: soft full-width brand finish instead of a boxed afterthought. */
.footer {
    position: relative;
    padding-top: 92px;
    padding-bottom: 34px;
    overflow: hidden;
}

.footer .footer-shell {
    position: relative;
    overflow: hidden;
    border-radius: 16px !important;
    border: 1px solid rgba(255, 255, 255, 0.13);
    background:
        radial-gradient(640px 260px at 8% 0%, rgba(233, 18, 42, 0.22), transparent 70%),
        radial-gradient(520px 220px at 96% 18%, rgba(255, 255, 255, 0.055), transparent 66%),
        linear-gradient(135deg, rgba(18, 19, 24, 0.88), rgba(7, 8, 11, 0.94)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 28px 76px rgba(0, 0, 0, 0.34);
}

.footer .footer-shell::before {
    content: "";
    position: absolute;
    inset: 0 26px auto;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255, 49, 76, 0.78), rgba(255, 255, 255, 0.34), transparent);
}

.footer .footer-shell::after {
    content: "";
    position: absolute;
    right: 28px;
    bottom: -13px;
    color: rgba(255, 255, 255, 0.035);
    font-size: clamp(54px, 9vw, 132px);
    font-weight: 950;
    line-height: 0.8;
    letter-spacing: 0;
    pointer-events: none;
}

.footer-brand,
.footer-status,
.footer-links {
    border-radius: 12px !important;
}

.footer-brand img {
    filter:
        drop-shadow(0 16px 28px rgba(0, 0, 0, 0.34)) drop-shadow(0 0 22px rgba(233, 18, 42, 0.22));
}

.footer-bottom {
    width: min(100%, var(--max));
    margin: 18px auto 0;
    padding-inline: 4px;
}

/* Showcase stages: separation without returning to blocky section backgrounds. */
.category-nav,
.product-grid,
.support-grid,
.faq-layout {
    position: relative;
    isolation: isolate;
}

.category-nav::before,
.product-grid::before,
.support-grid::before,
.faq-layout::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: -28px -24px;
    border: 1px solid rgba(255, 255, 255, 0.075);
    border-radius: 22px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.012)),
        radial-gradient(680px 180px at 50% 0%, rgba(233, 18, 42, 0.12), transparent 72%),
        rgba(3, 4, 7, 0.34);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.055),
        inset 0 -1px 0 rgba(233, 18, 42, 0.065),
        0 34px 90px rgba(0, 0, 0, 0.28);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

.category-nav::after,
.product-grid::after,
.support-grid::after,
.faq-layout::after {
    content: "";
    position: absolute;
    z-index: -1;
    top: -28px;
    left: 42px;
    right: 42px;
    height: 1px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, rgba(255, 49, 76, 0.72), rgba(255, 255, 255, 0.22), transparent);
    box-shadow: 0 0 28px rgba(233, 18, 42, 0.18);
}

.category-card,
.product-card,
.support-grid article,
.faq-list details {
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.095), rgba(255, 255, 255, 0.028) 44%, rgba(233, 18, 42, 0.07)),
        rgba(7, 8, 12, 0.86) !important;
    border-color: rgba(255, 255, 255, 0.17) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 22px 58px rgba(0, 0, 0, 0.32),
        0 0 0 1px rgba(233, 18, 42, 0.02);
}

.category-card::after,
.product-card::after,
.support-grid article::after,
.faq-list details::after {
    opacity: 0.5;
}

.category-card:hover,
.product-card:hover,
.support-grid article:hover,
.faq-list details[open] {
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.032) 42%, rgba(233, 18, 42, 0.095)),
        rgba(8, 9, 13, 0.92) !important;
    border-color: rgba(255, 49, 76, 0.36) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.13),
        0 28px 72px rgba(0, 0, 0, 0.36),
        0 0 0 1px rgba(233, 18, 42, 0.08),
        0 0 34px rgba(233, 18, 42, 0.08);
}

.category-nav-head,
.section-head,
.decision-copy {
    position: relative;
    z-index: 2;
}

.category-nav-head p,
.section-head p,
.decision-copy p {
    color: rgba(218, 223, 232, 0.82);
}

.footer .footer-shell {
    border-color: rgba(255, 255, 255, 0.18);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 34px 100px rgba(0, 0, 0, 0.42),
        0 0 0 1px rgba(233, 18, 42, 0.045);
}

@media (max-width: 760px) {

    .category-nav::before,
    .product-grid::before,
    .support-grid::before,
    .faq-layout::before {
        inset: -18px -12px;
        border-radius: 16px;
    }

    .category-nav::after,
    .product-grid::after,
    .support-grid::after,
    .faq-layout::after {
        left: 24px;
        right: 24px;
        top: -18px;
    }
}

/* Graphite red surfaces: quieter, clearer cards across the whole storefront. */
:root {
    --graphite-surface:
        linear-gradient(135deg, rgba(255, 255, 255, 0.095), rgba(255, 255, 255, 0.042) 38%, rgba(255, 255, 255, 0.02) 66%),
        radial-gradient(520px 220px at 0% 0%, rgba(233, 18, 42, 0.14), transparent 70%),
        linear-gradient(145deg, rgba(49, 51, 57, 0.9), rgba(23, 24, 29, 0.94) 48%, rgba(12, 13, 17, 0.96));
    --graphite-surface-strong:
        linear-gradient(135deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.048) 36%, rgba(255, 255, 255, 0.022) 68%),
        radial-gradient(640px 260px at 0% 0%, rgba(233, 18, 42, 0.17), transparent 72%),
        linear-gradient(145deg, rgba(58, 60, 67, 0.92), rgba(25, 26, 31, 0.95) 50%, rgba(11, 12, 16, 0.97));
    --graphite-border: rgba(255, 255, 255, 0.17);
    --graphite-border-red: rgba(255, 49, 76, 0.28);
}

.hero-command-panel,
.redactor-showcase,
.showcase-feature,
.showcase-item,
.category-card,
.product-card,
.catalog-command,
.decision-score,
.support-grid article,
.faq-list details,
.product-summary,
.product-info-card,
.product-long-description,
.footer-brand,
.footer-status,
.footer-links {
    background: var(--graphite-surface) !important;
    border-color: var(--graphite-border) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        inset 0 0 0 1px rgba(255, 255, 255, 0.018),
        0 24px 64px rgba(0, 0, 0, 0.34);
}

.hero-command-panel::before,
.catalog-command::before,
.footer .footer-shell::before {
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.42), rgba(255, 49, 76, 0.62), transparent);
    opacity: 0.78;
}

.category-nav::before,
.product-grid::before,
.support-grid::before,
.faq-layout::before,
.product-info-grid::before {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.032), rgba(255, 255, 255, 0.012)),
        radial-gradient(720px 220px at 18% 0%, rgba(255, 49, 76, 0.1), transparent 74%),
        rgba(5, 6, 9, 0.26);
    border-color: rgba(255, 255, 255, 0.065);
}

.category-card:hover,
.product-card:hover,
.support-grid article:hover,
.faq-list details[open],
.showcase-item:hover,
.showcase-feature:hover {
    background: var(--graphite-surface-strong) !important;
    border-color: var(--graphite-border-red) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 28px 74px rgba(0, 0, 0, 0.38),
        0 0 0 1px rgba(233, 18, 42, 0.08),
        0 0 34px rgba(233, 18, 42, 0.075);
}

.product-info-grid {
    position: relative;
    isolation: isolate;
}

.product-info-grid::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: -26px -22px;
    border: 1px solid rgba(255, 255, 255, 0.065);
    border-radius: 22px;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.055),
        0 34px 90px rgba(0, 0, 0, 0.28);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

.product-long-description {
    border-color: rgba(255, 255, 255, 0.16) !important;
}

.product-summary .pill,
.pill,
.product-meta span,
.category-tags b,
.decision-badges span {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.095), rgba(255, 255, 255, 0.035)),
        rgba(32, 34, 39, 0.72) !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
    color: rgba(245, 247, 250, 0.88);
}

.product-summary .pill:first-child,
.category-tags b:first-child,
.decision-badges span:first-child {
    border-color: rgba(255, 49, 76, 0.36) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.085), rgba(255, 255, 255, 0.03)),
        rgba(80, 18, 28, 0.5) !important;
}

.footer .footer-shell {
    background:
        radial-gradient(740px 260px at 8% 0%, rgba(233, 18, 42, 0.16), transparent 70%),
        radial-gradient(560px 220px at 100% 18%, rgba(255, 255, 255, 0.06), transparent 66%),
        linear-gradient(135deg, rgba(48, 50, 56, 0.86), rgba(20, 21, 26, 0.96) 48%, rgba(8, 9, 12, 0.98)) !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
}

/* Mixed surfaces: not every block gets the same gradient. */
:root {
    --surface-dark-red:
        linear-gradient(135deg, rgba(5, 6, 9, 0.8), rgba(17, 10, 14, 0.66) 54%, rgba(5, 6, 9, 0.86)),
        linear-gradient(90deg, rgba(233, 18, 42, 0.11), transparent 38%, rgba(255, 255, 255, 0.035));
    --surface-product:
        linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.018)),
        linear-gradient(135deg, rgba(233, 18, 42, 0.045), transparent 58%),
        rgba(14, 15, 19, 0.92);
    --surface-neutral:
        linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.024)),
        rgba(34, 36, 42, 0.84);
    --surface-neutral-hover:
        linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.03)),
        rgba(41, 43, 50, 0.9);
    --surface-red-wash:
        linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.032) 44%, rgba(233, 18, 42, 0.075)),
        radial-gradient(520px 220px at 0% 0%, rgba(233, 18, 42, 0.13), transparent 70%),
        rgba(24, 25, 30, 0.88);
}

.hero-command-panel {
    background: var(--surface-dark-red) !important;
    border-color: rgba(255, 49, 76, 0.22) !important;
}

.hero-command-panel::before {
    background: linear-gradient(90deg, rgba(255, 49, 76, 0.92), rgba(255, 255, 255, 0.3), transparent);
}

.product-card {
    background: var(--surface-product) !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 22px 56px rgba(0, 0, 0, 0.34);
}

.product-card:hover {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.022)),
        linear-gradient(135deg, rgba(233, 18, 42, 0.065), transparent 58%),
        rgba(17, 18, 22, 0.95) !important;
    border-color: rgba(255, 49, 76, 0.26) !important;
}

.category-card,
.catalog-command,
.decision-score,
.support-grid article,
.faq-list details {
    background: var(--surface-neutral) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}

.category-card:hover,
.support-grid article:hover,
.faq-list details[open] {
    background: var(--surface-neutral-hover) !important;
    border-color: rgba(255, 49, 76, 0.24) !important;
}

.catalog-command,
.decision-score {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.022)),
        rgba(30, 32, 38, 0.82) !important;
}

.product-summary,
.product-info-card,
.product-long-description {
    background: var(--surface-red-wash) !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
}

.footer-brand,
.footer-status,
.footer-links {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.022)),
        rgba(27, 29, 34, 0.76) !important;
}

.showcase-feature,
.showcase-item {
    background:
        linear-gradient(90deg, rgba(65, 10, 18, 0.28), rgba(10, 10, 13, 0.9) 46%, rgba(5, 6, 9, 0.96)),
        rgba(10, 10, 13, 0.92) !important;
}

.showcase-feature:hover,
.showcase-item:hover {
    background:
        linear-gradient(90deg, rgba(105, 12, 25, 0.36), rgba(10, 10, 13, 0.92) 52%, rgba(5, 6, 9, 0.98)),
        rgba(10, 10, 13, 0.96) !important;
}

/* Clean media previews: no fake red blocks, just product/video surfaces. */
.visual-video {
    background:
        radial-gradient(circle at 68% 34%, rgba(255, 255, 255, 0.16), transparent 24%),
        radial-gradient(circle at 42% 72%, rgba(233, 18, 42, 0.18), transparent 28%),
        linear-gradient(135deg, rgba(42, 44, 52, 0.82), rgba(7, 8, 11, 0.96)) !important;
}

.visual-video::before {
    content: none !important;
}

.visual-video::after {
    content: "";
    position: absolute;
    inset: 50% auto auto 50%;
    width: 54px;
    height: 54px;
    border-radius: 999px;
    transform: translate(-50%, -50%);
    background:
        linear-gradient(90deg, transparent 0 38%, #fff 38% 64%, transparent 64%),
        rgba(233, 18, 42, 0.88);
    clip-path: polygon(0 0, 100% 50%, 0 100%);
    box-shadow: 0 0 34px rgba(233, 18, 42, 0.32);
    opacity: 0.9;
}

/* Product gallery fit: every image/video fills the frame, video preview opens first via JS. */
.product-gallery {
    display: grid;
    gap: 12px;
    overflow: visible;
    background: transparent !important;
    border-color: transparent !important;
}

.product-media,
.product-media-large,
.gallery-thumb .product-media {
    background: #08090c;
}

.product-media-large {
    min-height: 520px;
    aspect-ratio: 16 / 10;
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 24px 72px rgba(0, 0, 0, 0.36);
}

.product-visual,
.product-placeholder,
.product-visual img,
.product-visual video,
.product-video,
.product-media img,
.product-media video {
    width: 100% !important;
    height: 100% !important;
}

.product-visual {
    background-size: cover !important;
    background-position: center !important;
}

.product-visual img,
.product-visual video,
.product-video,
.product-media img,
.product-media video {
    display: block;
    object-fit: cover !important;
    object-position: center !important;
}

.gallery-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(156px, 1fr));
    gap: 10px;
    border: 0;
    background: transparent;
}

.gallery-thumb {
    overflow: visible;
}

.gallery-thumb .product-media {
    min-height: 104px !important;
    aspect-ratio: 16 / 9;
    border: 1px solid rgba(255, 255, 255, 0.12);
    opacity: 0.72;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 12px 28px rgba(0, 0, 0, 0.22);
}

.gallery-thumb:hover .product-media,
.gallery-thumb.is-active .product-media {
    border-color: rgba(255, 49, 76, 0.78);
    opacity: 1;
    filter: brightness(1.08) saturate(1.06);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.13),
        0 16px 36px rgba(0, 0, 0, 0.28),
        0 0 0 1px rgba(233, 18, 42, 0.16);
}

@media (max-width: 760px) {
    .product-media-large {
        min-height: 320px;
        aspect-ratio: 16 / 11;
    }

    .gallery-strip {
        grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
        gap: 8px;
    }

    .gallery-thumb .product-media {
        min-height: 78px !important;
    }
}

/* Product gallery layout repair: no overlap, visible thumbnail previews. */
.product-detail {
    grid-template-columns: minmax(0, 0.68fr) minmax(340px, 0.32fr);
    align-items: start;
}

.product-gallery,
.package-media {
    min-width: 0;
    max-width: 100%;
    overflow: hidden !important;
}

.product-media-large {
    width: 100%;
    max-width: 100%;
    min-height: clamp(360px, 42vw, 560px);
}

.product-summary {
    position: relative !important;
    top: auto !important;
    z-index: 1;
    align-self: start;
}

.product-info-grid {
    margin-top: 34px;
}

.gallery-strip {
    width: 100%;
    max-width: 100%;
    display: grid !important;
    grid-auto-flow: column;
    grid-auto-columns: minmax(178px, 220px);
    grid-template-columns: none;
    gap: 10px;
    padding: 0;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x proximity;
    scrollbar-color: rgba(255, 49, 76, 0.75) rgba(255, 255, 255, 0.08);
    scrollbar-width: thin;
    padding-bottom: 4px;
}

.gallery-strip::-webkit-scrollbar {
    height: 8px;
}

.gallery-strip::-webkit-scrollbar-track {
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
}

.gallery-strip::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(255, 49, 76, 0.9), rgba(255, 255, 255, 0.36));
}

.gallery-thumb {
    min-width: 0;
    display: block;
    border-radius: 8px;
    scroll-snap-align: start;
}

.gallery-thumb .product-media {
    display: block !important;
    position: relative;
    width: 100%;
    max-width: 100%;
    min-height: 112px !important;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

.gallery-thumb .product-visual {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.gallery-thumb .product-visual::before {
    inset: 14px;
}

.media-main,
.media-hover {
    overflow: hidden;
}

@media (max-width: 980px) {
    .product-detail {
        grid-template-columns: 1fr;
    }

    .product-summary {
        width: 100%;
    }
}

@media (max-width: 760px) {
    .gallery-strip {
        grid-auto-columns: minmax(128px, 52vw);
    }

    .gallery-thumb .product-media {
        min-height: 78px !important;
    }
}

/* Long-form product description: Quasar-style feature blocks, Redactor tone. */
.product-features {
    width: min(100%, var(--max));
    margin: 26px auto 0;
    display: grid;
    gap: 18px;
}

.product-features-head {
    display: grid;
    justify-items: center;
    gap: 8px;
    text-align: center;
}

.product-features-head h2 {
    margin: 0;
    font-size: clamp(34px, 5vw, 54px);
    line-height: 0.95;
}

.product-features-head p {
    max-width: 780px;
    margin: 0;
    color: rgba(218, 223, 232, 0.82);
    line-height: 1.65;
}

.feature-row {
    min-height: 260px;
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1fr);
    gap: 26px;
    align-items: center;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 14px;
    padding: 18px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.018)),
        rgba(10, 11, 15, 0.72);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 24px 70px rgba(0, 0, 0, 0.28);
}

.feature-row:nth-child(even) .feature-media {
    order: 2;
}

.feature-media {
    position: relative;
    min-height: 226px;
    overflow: hidden;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.11);
    background: #08090c;
}

.feature-media .product-visual {
    position: absolute;
    inset: 0;
}

.feature-copy {
    padding: 12px clamp(8px, 2vw, 28px);
}

.feature-copy h3 {
    margin: 0 0 12px;
    color: #fff;
    font-size: clamp(24px, 3vw, 36px);
    line-height: 1.04;
}

.feature-copy p {
    margin: 0;
    color: rgba(208, 214, 224, 0.78);
    font-size: 16px;
    line-height: 1.65;
}

@media (max-width: 820px) {

    .feature-row,
    .feature-row:nth-child(even) {
        grid-template-columns: 1fr;
    }

    .feature-row:nth-child(even) .feature-media {
        order: 0;
    }
}

/* Final video poster: no fake player UI and no red placeholder lines. */
.visual-c,
.visual-d,
.visual-video {
    background-image:
        linear-gradient(180deg, rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0.62)),
        var(--hero-image, none) !important;
    background-size: cover !important;
    background-position: 72% 46% !important;
}

.visual-c::before,
.visual-d::before,
.gallery-thumb .product-visual::before,
.feature-media .product-visual::before {
    content: none !important;
}

.visual-video::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 50% 48%, rgba(255, 255, 255, 0.16), transparent 18%),
        radial-gradient(circle at 50% 50%, rgba(233, 18, 42, 0.22), transparent 28%),
        linear-gradient(180deg, rgba(0, 0, 0, 0.18), rgba(0, 0, 0, 0.48));
    pointer-events: none;
}

.visual-video::after {
    content: "";
    position: absolute;
    inset: 50% auto auto 50%;
    width: 64px;
    height: 64px;
    border-radius: 999px;
    transform: translate(-50%, -50%);
    background:
        linear-gradient(135deg, #ff2743, #c60720);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.32),
        0 18px 44px rgba(233, 18, 42, 0.28);
}

.visual-video>* {
    position: relative;
    z-index: 2;
}

.visual-video .play-triangle {
    display: none;
}

.visual-video {
    overflow: hidden;
}

.visual-video .fake {
    display: none;
}

.visual-video::marker {
    content: "";
}

.visual-video {
    --play-triangle: polygon(40% 31%, 40% 69%, 72% 50%);
}

.visual-video+.media-hint {
    background: rgba(8, 9, 12, 0.78);
}

.visual-video::selection {
    background: transparent;
}

.visual-video:has(*)::after {
    display: none;
}

.product-gallery .visual-video::after,
.feature-media .visual-video::after,
.gallery-thumb .visual-video::after {
    width: 58px;
    height: 58px;
    border-radius: 999px;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 6.5v11l9-5.5z'/%3E%3C/svg%3E") 54% 50% / 24px 24px no-repeat,
        linear-gradient(135deg, #ff2743, #c60720);
    -webkit-mask: none;
    mask: none;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.32),
        0 18px 44px rgba(233, 18, 42, 0.28);
}

/* Final spacing pass: consistent headline rhythm and cleaner section handoffs. */
.section-head,
.category-nav-head,
.product-features-head {
    display: grid;
    justify-items: center;
    gap: 14px;
    margin-bottom: clamp(28px, 4vw, 48px);
    text-align: center;
}

.section-head h2,
.category-nav-head h2,
.product-features-head h2 {
    margin: 0;
}

.section-head p,
.category-nav-head p,
.product-features-head p,
.decision-copy p {
    margin: 0;
    max-width: 720px;
}

.section-actions,
.catalog-more {
    display: flex;
    justify-content: center;
}

.btn-section {
    min-height: 44px;
    padding-inline: 22px;
}

.catalog-section .section-head {
    margin-bottom: 38px;
}

.catalog-command {
    margin-top: 0;
}

.catalog-more {
    margin-top: clamp(28px, 4vw, 44px);
}

.faq-section .section-head {
    margin-bottom: 42px;
}

.faq-layout {
    margin-top: 0;
}

@media (max-width: 720px) {

    .section-head,
    .category-nav-head,
    .product-features-head {
        gap: 12px;
        margin-bottom: 30px;
    }

    .faq-section .section-head {
        margin-bottom: 34px;
    }
}

/* Home rhythm lock: the catalog should follow categories without dead space. */
.category-nav-section {
    padding-top: clamp(58px, 7vw, 84px) !important;
    padding-bottom: clamp(50px, 6vw, 76px) !important;
}

.category-nav {
    margin-top: 0 !important;
}

.category-nav-section+.catalog-section,
.catalog-section {
    padding-top: clamp(56px, 6vw, 82px) !important;
}

.catalog-section .section-head {
    gap: 12px;
    margin-bottom: 34px !important;
}

.catalog-command {
    margin-bottom: 24px !important;
}

.product-grid {
    margin-top: 0 !important;
}

.catalog-more {
    margin-top: clamp(32px, 4vw, 48px) !important;
}

@media (max-width: 900px) {
    .category-nav-section {
        padding-bottom: 46px !important;
    }

    .category-nav-section+.catalog-section,
    .catalog-section {
        padding-top: 48px !important;
    }
}

/* Catalog spacing fix: remove the heavy filter glow and give cards breathing room. */
.catalog-command {
    padding: 16px !important;
    margin-bottom: 34px !important;
    overflow: visible !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 14px 34px rgba(0, 0, 0, 0.22) !important;
}

.catalog-command::after {
    content: none !important;
}

.catalog-command::before {
    opacity: 0.38 !important;
}

.catalog-command .store-controls {
    gap: 18px !important;
}

.product-grid {
    gap: clamp(18px, 2vw, 22px) !important;
}

.catalog-section .section-head {
    margin-bottom: 40px !important;
}

/* Hero hover preview: product cards open a compact media drawer with selectable stills. */
.showcase-feature,
.showcase-item {
    isolation: isolate;
    overflow: visible !important;
}

.showcase-preview {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 16px;
    z-index: 8;
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 10px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background:
        linear-gradient(145deg, rgba(45, 47, 54, 0.94), rgba(14, 15, 19, 0.94) 58%, rgba(72, 17, 27, 0.78)),
        rgba(13, 14, 18, 0.96);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 24px 54px rgba(0, 0, 0, 0.42);
    opacity: 0;
    transform: translateY(12px) scale(0.98);
    pointer-events: none;
    transition: opacity 160ms ease, transform 160ms ease;
}

.showcase-feature:hover .showcase-preview,
.showcase-feature:focus-within .showcase-preview,
.showcase-item:hover .showcase-preview,
.showcase-item:focus-within .showcase-preview {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

.showcase-preview-screen {
    position: relative;
    display: block;
    min-height: 116px;
    overflow: hidden;
    border-radius: 9px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background-size: cover;
    background-position: center;
}

.showcase-preview-screen::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 46%, rgba(0, 0, 0, 0.44));
}

.showcase-preview-thumbs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 7px;
}

.showcase-preview-thumbs span {
    display: block;
    min-height: 42px;
    cursor: pointer;
    overflow: hidden;
    border-radius: 7px !important;
    border: 1px solid rgba(255, 255, 255, 0.11);
    background-size: cover;
    background-position: center;
    opacity: 0.72;
    transition: border-color 150ms ease, opacity 150ms ease, transform 150ms ease;
}

.showcase-preview-thumbs span:hover,
.showcase-preview-thumbs span.is-active {
    opacity: 1;
    border-color: rgba(255, 49, 76, 0.72);
    transform: translateY(-1px);
}

.showcase-feature .showcase-preview {
    bottom: 58px;
}

.showcase-item {
    min-height: 132px;
}

.showcase-item:hover,
.showcase-feature:hover {
    z-index: 20;
}

@media (max-width: 900px) {
    .showcase-preview {
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        margin-top: 12px;
        opacity: 1;
        transform: none;
        pointer-events: auto;
    }

    .showcase-item {
        min-height: auto;
    }
}

/* Redactor access matrix: VIP is a system, product cards expose purchase logic. */
.showcase-preview {
    display: none !important;
}

.showcase-system {
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 14px;
    z-index: 9;
    display: grid;
    gap: 7px;
    padding: 12px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    background:
        linear-gradient(145deg, rgba(48, 50, 57, 0.94), rgba(13, 14, 18, 0.96) 58%, rgba(55, 16, 24, 0.84)),
        rgba(13, 14, 18, 0.96);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.11),
        0 20px 44px rgba(0, 0, 0, 0.36);
    opacity: 0;
    transform: translateY(8px);
    pointer-events: none;
    transition: opacity 160ms ease, transform 160ms ease;
}

.showcase-feature:hover .showcase-system,
.showcase-feature:focus-visible .showcase-system,
.showcase-item:hover .showcase-system,
.showcase-item:focus-visible .showcase-system {
    opacity: 1;
    transform: translateY(0);
}

.showcase-system span {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 30px;
    padding: 0 10px;
    border-radius: 999px;
    color: rgba(235, 238, 244, 0.82);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    background: rgba(255, 255, 255, 0.045);
    border: 1px solid rgba(255, 255, 255, 0.09);
}

.showcase-system b {
    color: #fff;
}

.showcase-system i {
    display: block;
    margin-top: 3px;
    color: rgba(255, 49, 76, 0.92);
    font-style: normal;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.showcase-access {
    bottom: 64px;
}

.showcase-access::before {
    content: "";
    color: rgba(255, 255, 255, 0.46);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.showcase-item,
.showcase-feature {
    padding-bottom: 24px !important;
}

.showcase-item:hover,
.showcase-feature:hover {
    border-color: rgba(255, 49, 76, 0.34) !important;
}

@media (max-width: 900px) {
    .showcase-system {
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        margin-top: 12px;
        opacity: 1;
        transform: none;
    }
}

/* Final hero showcase behavior: cards expand into compact product sheets on hover. */
.redactor-showcase,
.showcase-grid,
.showcase-stack {
    overflow: visible !important;
}

.showcase-feature,
.showcase-item {
    position: relative;
    overflow: hidden !important;
    transition:
        min-height 210ms ease,
        padding 210ms ease,
        transform 180ms ease,
        border-color 180ms ease,
        box-shadow 180ms ease !important;
}

.showcase-item {
    min-height: 126px !important;
    padding: 22px 24px !important;
}

.showcase-item::after {
    content: "";
    position: absolute;
    inset: 14px 14px auto;
    height: 108px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.58)),
        var(--hero-image, none);
    background-size: cover;
    background-position: 76% 42%;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
    opacity: 0;
    transform: translateY(-8px) scale(0.985);
    pointer-events: none;
    transition: opacity 180ms ease, transform 180ms ease;
}

.showcase-item:nth-child(2)::after {
    background-position: 56% 48%;
}

.showcase-item:nth-child(3)::after {
    background-position: 38% 52%;
}

.showcase-item:hover,
.showcase-item:focus-visible {
    min-height: 292px !important;
    padding-top: 138px !important;
    transform: translateX(-8px) translateY(-2px) !important;
    border-color: rgba(255, 49, 76, 0.42) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 24px 58px rgba(0, 0, 0, 0.42),
        0 0 0 1px rgba(233, 18, 42, 0.08) !important;
}

.showcase-item:hover::after,
.showcase-item:focus-visible::after {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.showcase-item:hover .showcase-badge,
.showcase-item:focus-visible .showcase-badge {
    position: absolute;
    top: 26px;
    left: 26px;
    z-index: 2;
}

.showcase-system {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    z-index: 2;
    margin-top: 14px;
    padding: 0 !important;
    max-height: 0;
    overflow: hidden;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    opacity: 0 !important;
    transform: none !important;
    pointer-events: none;
    transition: max-height 210ms ease, opacity 160ms ease !important;
}

.showcase-feature:hover .showcase-system,
.showcase-feature:focus-visible .showcase-system,
.showcase-item:hover .showcase-system,
.showcase-item:focus-visible .showcase-system {
    max-height: 180px;
    opacity: 1 !important;
}

.showcase-system span {
    min-height: 28px;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.025)),
        rgba(255, 255, 255, 0.035) !important;
}

.showcase-feature {
    padding: 34px 26px 24px !important;
}

.showcase-feature::after {
    border-radius: 14px !important;
    opacity: 0.16 !important;
}

.showcase-feature:hover,
.showcase-feature:focus-visible {
    transform: translateY(-2px) !important;
}

.showcase-feature:hover::after,
.showcase-feature:focus-visible::after {
    opacity: 0.28 !important;
}

.showcase-feature:hover .showcase-access,
.showcase-feature:focus-visible .showcase-access {
    margin-top: 18px;
}

@media (max-width: 900px) {

    .showcase-item,
    .showcase-item:hover,
    .showcase-item:focus-visible {
        min-height: auto !important;
        padding: 20px !important;
        transform: none !important;
    }

    .showcase-item::after {
        position: relative;
        inset: auto;
        display: block;
        width: 100%;
        margin-bottom: 14px;
        opacity: 1;
        transform: none;
    }

    .showcase-system {
        max-height: none;
        opacity: 1 !important;
    }
}

/* Clean hero cards: compact block, full-card image on hover, no text clutter. */
.redactor-showcase {
    max-width: 600px;
    padding: 18px !important;
}

.showcase-grid {
    min-height: 0 !important;
    grid-template-columns: 0.82fr 1.18fr !important;
    gap: 12px !important;
}

.showcase-feature {
    min-height: 344px !important;
    padding: 28px 22px 22px !important;
}

.showcase-feature .showcase-system {
    display: none !important;
}

.showcase-stack {
    gap: 10px !important;
    padding-bottom: 0 !important;
}

.showcase-item,
.showcase-item:hover,
.showcase-item:focus-visible {
    min-height: 108px !important;
    padding: 18px 20px !important;
    transform: none !important;
}

.showcase-item::after {
    inset: 0 !important;
    width: auto !important;
    height: auto !important;
    border-radius: inherit !important;
    opacity: 0;
    transform: scale(1.04) !important;
    transform-origin: center;
    border: 0 !important;
    transition: opacity 170ms ease, transform 220ms ease !important;
}

.showcase-item:hover::after,
.showcase-item:focus-visible::after {
    opacity: 1 !important;
    transform: scale(1) !important;
}

.showcase-item:hover> :not(.showcase-system),
.showcase-item:focus-visible> :not(.showcase-system),
.showcase-item:hover .showcase-system,
.showcase-item:focus-visible .showcase-system {
    opacity: 0 !important;
}

.showcase-item:hover,
.showcase-item:focus-visible {
    border-color: rgba(255, 49, 76, 0.46) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 18px 42px rgba(0, 0, 0, 0.34) !important;
}

@media (max-width: 980px) {
    .showcase-grid {
        grid-template-columns: 1fr !important;
    }

    .showcase-feature {
        min-height: 220px !important;
    }
}

/* Final compact showcase: 20% shorter, hover becomes pure image. */
.redactor-showcase {
    max-width: 560px !important;
    padding: 14px !important;
}

.showcase-grid {
    grid-template-columns: 0.78fr 1.22fr !important;
    gap: 10px !important;
}

.showcase-feature {
    min-height: 274px !important;
    padding: 24px 20px 20px !important;
}

.showcase-stack {
    gap: 9px !important;
}

.showcase-item,
.showcase-item:hover,
.showcase-item:focus-visible {
    min-height: 84px !important;
    padding: 14px 18px !important;
}

.showcase-item strong {
    font-size: 22px !important;
    line-height: 1.02 !important;
}

.showcase-item small {
    font-size: 12px !important;
    line-height: 1.25 !important;
}

.showcase-item::after {
    z-index: 8 !important;
    inset: 0 !important;
    width: auto !important;
    height: auto !important;
    display: block !important;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.34)),
        var(--hero-image, none) !important;
    background-size: cover !important;
    background-position: 72% 44% !important;
    opacity: 0 !important;
    transform: scale(1.035) !important;
}

.showcase-item:nth-child(2)::after {
    background-position: 54% 48% !important;
}

.showcase-item:nth-child(3)::after {
    background-position: 38% 50% !important;
}

.showcase-item:hover::after,
.showcase-item:focus-visible::after {
    opacity: 1 !important;
    transform: scale(1) !important;
}

.showcase-item:hover>*,
.showcase-item:focus-visible>* {
    opacity: 0 !important;
    visibility: hidden !important;
}

.showcase-item:hover .showcase-system,
.showcase-item:focus-visible .showcase-system {
    display: none !important;
}

@media (max-width: 980px) {
    .showcase-feature {
        min-height: 210px !important;
    }
}

/* Hard geometry lock: 20% smaller showcase, no hover resizing. */
.redactor-showcase {
    width: min(100%, 500px) !important;
    max-width: 500px !important;
    padding: 12px !important;
}

.showcase-grid {
    grid-template-columns: 0.76fr 1.24fr !important;
    gap: 10px !important;
    align-items: stretch !important;
}

.showcase-feature {
    height: 278px !important;
    min-height: 278px !important;
    max-height: 278px !important;
    padding: 22px 18px !important;
    box-sizing: border-box;
}

.showcase-feature strong {
    font-size: 30px !important;
    line-height: 1.02 !important;
}

.showcase-feature small {
    max-width: 160px !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
}

.showcase-stack {
    gap: 8px !important;
    padding-bottom: 0 !important;
}

.showcase-item,
.showcase-item:hover,
.showcase-item:focus-visible {
    position: relative;
    isolation: isolate;
    height: 87px !important;
    min-height: 87px !important;
    max-height: 87px !important;
    padding: 13px 16px !important;
    box-sizing: border-box;
    overflow: hidden !important;
    transform: none !important;
}

.showcase-item strong {
    display: block;
    max-width: 190px;
    font-size: 21px !important;
    line-height: 1.02 !important;
}

.showcase-item small {
    display: -webkit-box;
    max-width: 210px;
    overflow: hidden;
    color: rgba(235, 238, 244, 0.72);
    font-size: 11px !important;
    line-height: 1.25 !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.showcase-item .showcase-badge {
    min-height: 24px !important;
    padding: 0 10px !important;
    font-size: 10px !important;
}

.showcase-item::after {
    content: "" !important;
    position: absolute !important;
    z-index: 30 !important;
    inset: 0 !important;
    width: auto !important;
    height: auto !important;
    display: block !important;
    border: 0 !important;
    border-radius: inherit !important;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.26)),
        var(--hero-image, none) !important;
    background-size: cover !important;
    background-position: 72% 44% !important;
    opacity: 0 !important;
    transform: scale(1.035) !important;
    pointer-events: none;
    transition: opacity 160ms ease, transform 200ms ease !important;
}

.showcase-item:nth-child(2)::after {
    background-position: 54% 48% !important;
}

.showcase-item:nth-child(3)::after {
    background-position: 38% 50% !important;
}

.showcase-item:hover::after,
.showcase-item:focus-visible::after {
    opacity: 1 !important;
    transform: scale(1) !important;
}

.showcase-item:hover>*,
.showcase-item:focus-visible>* {
    opacity: 0 !important;
    visibility: hidden !important;
}

.showcase-item:hover,
.showcase-item:focus-visible {
    border-color: rgba(255, 49, 76, 0.44) !important;
}

@media (max-width: 980px) {
    .redactor-showcase {
        width: 100% !important;
        max-width: 100% !important;
    }

    .showcase-grid {
        grid-template-columns: 1fr !important;
    }

    .showcase-feature {
        height: auto !important;
        min-height: 210px !important;
        max-height: none !important;
    }
}

/* Sales showcase rebuild: clean hero merchandising, no experimental hover leftovers. */
.sales-showcase {
    position: relative;
    width: min(100%, 580px) !important;
    max-width: 580px !important;
    min-height: 0 !important;
    padding: 16px !important;
    display: grid !important;
    grid-template-columns: 1.35fr 0.95fr;
    grid-template-areas:
        "main side";
    gap: 12px;
    overflow: hidden !important;
    border-radius: 14px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025) 48%, rgba(233, 18, 42, 0.075)),
        rgba(10, 11, 15, 0.78) !important;
}

.sales-showcase::before,
.sales-showcase::after {
    content: "" !important;
    position: absolute;
    pointer-events: none;
}

.sales-showcase::before {
    inset: 14px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 10px;
}

.hero-logo-frame::after {
    content: none !important;
}

.sales-showcase::after {
    right: -80px;
    top: -90px;
    width: 210px;
    height: 210px;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(255, 49, 76, 0.22), transparent 66%);
}

.sales-ornament {
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.48;
    background:
        linear-gradient(120deg, transparent 0 48%, rgba(255, 49, 76, 0.18) 49%, transparent 50%),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 32px);
    mask-image: linear-gradient(90deg, transparent, #000 20%, #000 80%, transparent);
}

.sales-main,
.sales-mini {
    position: relative;
    z-index: 1;
    color: #fff;
    text-decoration: none;
    overflow: hidden;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(8, 9, 12, 0.72);
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.sales-main:hover,
.sales-mini:hover {
    transform: translateY(-2px);
    border-color: rgba(255, 49, 76, 0.42);
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.32);
}

.sales-main {
    grid-area: main;
    min-height: 286px;
    display: grid;
    align-content: end;
}

.sales-media,
.sales-mini-media {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(180deg, rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.78)),
        var(--hero-image, none);
    background-size: cover;
    background-position: 70% 45%;
    transition: transform 240ms ease, filter 240ms ease;
}

.sales-main:hover .sales-media,
.sales-mini:hover .sales-mini-media {
    transform: scale(1.045);
    filter: saturate(1.08);
}

.sales-copy {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 8px;
    padding: 22px;
}

.sales-kicker,
.sales-price,
.sales-trust span {
    width: fit-content;
    border-radius: 999px;
    border: 1px solid rgba(255, 49, 76, 0.42);
    background: rgba(233, 18, 42, 0.16);
    color: #fff;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.sales-kicker {
    padding: 7px 10px;
}

.sales-main strong {
    max-width: 280px;
    font-size: clamp(34px, 4vw, 48px);
    line-height: 0.95;
}

.sales-main small,
.sales-mini small {
    color: rgba(235, 238, 244, 0.76);
    line-height: 1.35;
}

.sales-price {
    position: absolute;
    top: 16px;
    right: 16px;
    z-index: 2;
    padding: 8px 11px;
    background: rgba(8, 9, 12, 0.72);
}

.sales-side {
    grid-area: side;
    position: relative;
    z-index: 1;
    display: grid;
    gap: 12px;
}

.sales-mini {
    min-height: 137px;
    display: grid;
    align-content: end;
}

.sales-mini span:last-child {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 4px;
    padding: 16px;
}

.sales-mini b {
    max-width: 170px;
    font-size: 22px;
    line-height: 1.02;
}

.sales-mini:nth-child(2) .sales-mini-media {
    background-position: 42% 48%;
}

.sales-trust {
    grid-area: trust;
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sales-trust span {
    padding: 8px 10px;
    color: rgba(255, 255, 255, 0.9);
    background: rgba(255, 255, 255, 0.055);
    border-color: rgba(255, 255, 255, 0.12);
}

@media (max-width: 980px) {
    .sales-showcase {
        grid-template-columns: 1fr;
        grid-template-areas:
            "main"
            "side";
    }

    .sales-main {
        min-height: 240px;
    }
}

/* 3D reveal pass: remove crowded badges and make product cards flip into detail mode. */
.redactor-showcase {
    perspective: 1200px;
}

.showcase-stack {
    transform-style: preserve-3d;
}

.showcase-item {
    transform-style: preserve-3d;
    backface-visibility: hidden;
}

.showcase-item:hover,
.showcase-item:focus-visible {
    transform: translateX(-8px) translateY(-2px) !important;
}

.showcase-item:hover::after,
.showcase-item:focus-visible::after {
    transform: rotateY(0deg) translateY(0) scale(1);
}

.showcase-item:hover .showcase-badge,
.showcase-item:focus-visible .showcase-badge {
    display: none !important;
}

.showcase-item:hover strong,
.showcase-item:hover small,
.showcase-item:hover .showcase-system,
.showcase-item:focus-visible strong,
.showcase-item:focus-visible small,
.showcase-item:focus-visible .showcase-system {
    position: relative;
    z-index: 3;
}

@media (max-width: 900px) {

    .showcase-item:hover,
    .showcase-item:focus-visible,
    .showcase-item:hover::after,
    .showcase-item:focus-visible::after {
        transform: none !important;
    }
}

/* Stable flip fix: only the media panel flips, so hover cannot enter an infinite loop. */
.showcase-item::after {
    transform: rotateY(-82deg) translateY(-8px) scale(0.96);
    transform-origin: left center;
    backface-visibility: hidden;
}

.showcase-item:hover::after,
.showcase-item:focus-visible::after {
    transform: rotateY(0deg) translateY(0) scale(1) !important;
}

/* Fixed hover tray: cards keep their size, details open below the card. */
.showcase-stack {
    gap: 14px !important;
    padding-bottom: 132px;
}

.showcase-item,
.showcase-item:hover,
.showcase-item:focus-visible {
    min-height: 128px !important;
    padding: 20px 22px !important;
}

.showcase-item:hover,
.showcase-item:focus-visible {
    transform: translateX(-6px) translateY(-2px) !important;
}

.showcase-item::after {
    inset: auto 14px -126px !important;
    height: 112px !important;
    opacity: 0;
    transform: rotateX(-74deg) translateY(-8px) scale(0.98) !important;
    transform-origin: top center;
}

.showcase-item:hover::after,
.showcase-item:focus-visible::after {
    opacity: 1;
    transform: rotateX(0deg) translateY(0) scale(1) !important;
}

.showcase-item:hover .showcase-badge,
.showcase-item:focus-visible .showcase-badge {
    display: none !important;
}

.showcase-system {
    position: absolute !important;
    left: 14px !important;
    right: 14px !important;
    top: calc(100% + 8px) !important;
    z-index: 12;
    display: grid !important;
    gap: 5px;
    padding: 66px 12px 10px !important;
    max-height: none !important;
    min-height: 126px;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 12px !important;
    background:
        linear-gradient(145deg, rgba(43, 45, 51, 0.96), rgba(12, 13, 17, 0.98) 60%, rgba(52, 15, 23, 0.88)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 20px 46px rgba(0, 0, 0, 0.38) !important;
    opacity: 0 !important;
    transform: translateY(-6px) scale(0.985) !important;
    pointer-events: none;
}

.showcase-item:hover .showcase-system,
.showcase-item:focus-visible .showcase-system {
    opacity: 1 !important;
    transform: translateY(0) scale(1) !important;
}

.showcase-system span {
    min-height: 0 !important;
    justify-content: flex-start !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: rgba(235, 238, 244, 0.78);
    font-size: 12px;
    line-height: 1.35;
    text-transform: none;
}

.showcase-system span::before {
    content: "";
    width: 6px;
    height: 6px;
    margin-right: 8px;
    flex: 0 0 auto;
    border-radius: 999px;
    background: #ff314c;
    box-shadow: 0 0 14px rgba(255, 49, 76, 0.55);
}

.showcase-system b {
    display: none !important;
}

.showcase-feature .showcase-system,
.showcase-feature:hover .showcase-system,
.showcase-feature:focus-visible .showcase-system {
    position: relative !important;
    inset: auto !important;
    margin-top: 16px;
    padding: 12px !important;
    min-height: auto;
}

.showcase-feature .showcase-system::before {
    content: none !important;
}

/* Compact hero cards: keep original height, show a small image and short details inside. */
.showcase-stack {
    padding-bottom: 0 !important;
}

.showcase-item,
.showcase-item:hover,
.showcase-item:focus-visible {
    min-height: 132px !important;
    padding: 18px 20px 18px 150px !important;
    transform: translateX(-4px) translateY(-1px) !important;
}

.showcase-item::after {
    inset: 16px auto 16px 16px !important;
    width: 112px;
    height: auto !important;
    border-radius: 10px;
    opacity: 0;
    transform: rotateY(-72deg) scale(0.96) !important;
    transform-origin: left center;
}

.showcase-item:hover::after,
.showcase-item:focus-visible::after {
    opacity: 1;
    transform: rotateY(0deg) scale(1) !important;
}

.showcase-item .showcase-badge {
    transition: opacity 140ms ease;
}

.showcase-item:hover .showcase-badge,
.showcase-item:focus-visible .showcase-badge {
    display: inline-flex !important;
    opacity: 0;
}

.showcase-item strong {
    font-size: 24px !important;
}

.showcase-item small {
    font-size: 13px;
    line-height: 1.35;
}

.showcase-item .showcase-system {
    position: relative !important;
    inset: auto !important;
    margin-top: 8px;
    padding: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    opacity: 0 !important;
    transform: none !important;
    overflow: hidden;
}

.showcase-item:hover .showcase-system,
.showcase-item:focus-visible .showcase-system {
    max-height: 44px !important;
    opacity: 1 !important;
}

.showcase-item .showcase-system span {
    display: none !important;
}

.showcase-item .showcase-system span:first-child,
.showcase-item .showcase-system span:nth-child(2) {
    display: flex !important;
    color: rgba(235, 238, 244, 0.72);
    font-size: 11px;
    line-height: 1.25;
}

.showcase-feature,
.showcase-feature:hover,
.showcase-feature:focus-visible {
    transform: none !important;
}

.showcase-feature .showcase-system {
    opacity: 0 !important;
    max-height: 0 !important;
    overflow: hidden;
}

.showcase-feature:hover .showcase-system,
.showcase-feature:focus-visible .showcase-system {
    opacity: 1 !important;
    max-height: 148px !important;
}

@media (max-width: 900px) {

    .showcase-item,
    .showcase-item:hover,
    .showcase-item:focus-visible {
        padding: 18px 20px !important;
    }

    .showcase-item::after {
        display: none;
    }
}

/* Final promo-code header system: Redactor branded, fixed without covering nav. */
body {
    padding-top: calc(var(--discount-h) + var(--header-h) + var(--ticker-h));
}

.discount-bar {
    height: var(--discount-h) !important;
    transition: transform 220ms ease, opacity 180ms ease;
}

.site-header {
    top: var(--discount-h) !important;
    transition: top 220ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.promo-ticker {
    top: calc(var(--discount-h) + var(--header-h)) !important;
    transition: top 220ms ease;
}

.hero,
.product-page,
.tebex-page {
    padding-top: clamp(34px, 4vw, 52px) !important;
}

body.ticker-closed {
    padding-top: calc(var(--discount-h) + var(--header-h));
}

body.ticker-closed .hero,
body.ticker-closed .product-page,
body.ticker-closed .tebex-page {
    padding-top: clamp(34px, 4vw, 52px) !important;
}

body.promo-hidden .discount-bar {
    opacity: 0;
    transform: translateY(-105%);
    pointer-events: none;
}

body.promo-hidden .site-header {
    top: 0 !important;
}

body.promo-hidden .promo-ticker {
    top: var(--header-h) !important;
}

body.promo-hidden.ticker-closed .site-header {
    top: 0 !important;
}

@media (max-width: 820px) {
    :root {
        --discount-h: 0px;
    }

    .discount-inner {
        grid-template-columns: 1fr auto;
        align-items: center;
    }

    .discount-copy {
        grid-column: 1 / -1;
    }

    .discount-countdown {
        grid-template-columns: repeat(4, minmax(34px, 42px));
    }

    .nav {
        top: calc(var(--discount-h) + var(--header-h) + var(--ticker-h) + 10px) !important;
    }

    body.ticker-closed .nav {
        top: calc(var(--discount-h) + var(--header-h) + 10px) !important;
    }

    body.promo-hidden .nav {
        top: calc(var(--header-h) + var(--ticker-h) + 10px) !important;
    }

    body.promo-hidden.ticker-closed .nav {
        top: calc(var(--header-h) + 10px) !important;
    }
}

/* Ticker removed: keep the top system clean and promo-only. */
:root {
    --ticker-h: 0px;
}

.promo-ticker {
    display: none !important;
}

body,
body.ticker-closed {
    padding-top: var(--header-h) !important;
}

.discount-bar {
    opacity: 0 !important;
    transform: translateY(-105%) !important;
    pointer-events: none !important;
}

.site-header {
    top: 0 !important;
}

.promo-ticker,
body.promo-hidden .promo-ticker {
    top: auto !important;
}

@media (max-width: 820px) {

    .nav,
    body.ticker-closed .nav {
        top: calc(var(--header-h) + 10px) !important;
    }

    body.promo-hidden .nav,
    body.promo-hidden.ticker-closed .nav {
        top: calc(var(--header-h) + 10px) !important;
    }
}

/* Product sales page */
.rl-product-page {
    background:
        radial-gradient(820px 340px at 82% 8%, rgba(233, 18, 42, 0.18), transparent 64%),
        radial-gradient(680px 260px at 12% 26%, rgba(255, 255, 255, 0.045), transparent 62%),
        linear-gradient(118deg, rgba(255, 255, 255, 0.025), transparent 30%, rgba(233, 18, 42, 0.04) 72%, transparent),
        #07080c !important;
}

.rl-product-page .product-detail,
.rl-trust,
.rl-section,
.rl-final-cta {
    width: min(100%, var(--max));
    margin-inline: auto;
}

.rl-hero-product {
    gap: clamp(18px, 2.4vw, 30px);
}

.rl-hero-product .product-summary {
    border-radius: 22px;
    border-color: rgba(255, 255, 255, 0.16);
    background:
        radial-gradient(360px 220px at 100% 0%, rgba(233, 18, 42, 0.14), transparent 68%),
        linear-gradient(145deg, rgba(54, 56, 64, 0.76), rgba(16, 17, 22, 0.92) 54%, rgba(51, 16, 24, 0.68));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 28px 80px rgba(0, 0, 0, 0.34);
}

.rl-hero-product .product-summary h1 {
    margin-bottom: 14px;
    font-size: clamp(46px, 6vw, 78px);
    line-height: 0.92;
}

.rl-summary-note {
    margin: -4px 0 20px;
    color: rgba(224, 229, 238, 0.74);
    font-size: 15px;
    line-height: 1.58;
}

.btn-outline {
    color: #fff;
    border: 1px solid rgba(255, 49, 76, 0.58);
    background:
        linear-gradient(135deg, rgba(233, 18, 42, 0.22), rgba(255, 255, 255, 0.035)),
        rgba(14, 15, 19, 0.6);
}

.btn-outline:hover {
    border-color: rgba(255, 90, 110, 0.78);
    background:
        linear-gradient(135deg, rgba(233, 18, 42, 0.32), rgba(255, 255, 255, 0.05)),
        rgba(14, 15, 19, 0.82);
    transform: translateY(-2px);
}

.rl-trust {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    margin-top: 24px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.08);
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.22);
}

.rl-trust span {
    min-height: 58px;
    display: grid;
    place-items: center;
    padding: 0 14px;
    color: rgba(246, 247, 250, 0.9);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.025)),
        rgba(13, 14, 18, 0.76);
    font-size: 12px;
    font-weight: 900;
    text-align: center;
    text-transform: uppercase;
}

.rl-trust span::before {
    content: "";
    width: 7px;
    height: 7px;
    margin-bottom: 8px;
    border-radius: 999px;
    background: var(--red);
    box-shadow: 0 0 16px rgba(233, 18, 42, 0.72);
}

.rl-section {
    position: relative;
    margin-top: clamp(38px, 5vw, 70px);
    padding: clamp(28px, 4vw, 44px);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 24px;
    background:
        radial-gradient(580px 220px at 100% 0%, rgba(233, 18, 42, 0.11), transparent 68%),
        linear-gradient(145deg, rgba(48, 50, 57, 0.58), rgba(11, 12, 16, 0.86) 58%, rgba(34, 10, 16, 0.46));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 26px 80px rgba(0, 0, 0, 0.28);
}

.rl-section-head {
    display: grid;
    justify-items: center;
    gap: 12px;
    margin-bottom: clamp(22px, 3vw, 34px);
    text-align: center;
}

.rl-section-head h2,
.rl-performance h2,
.rl-final-cta h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(34px, 5vw, 58px);
    line-height: 0.96;
}

.rl-section-head p,
.rl-performance p,
.rl-final-cta p {
    max-width: 820px;
    margin: 0;
    color: rgba(213, 219, 229, 0.78);
    font-size: 16px;
    line-height: 1.65;
}

.rl-proof-line {
    max-width: 920px;
    margin: -8px auto 24px;
    color: rgba(246, 247, 250, 0.88);
    text-align: center;
    line-height: 1.65;
}

.rl-card-grid,
.rl-feature-mini,
.rl-mistakes,
.rl-pricing {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.rl-problem-card,
.rl-bonus-card,
.rl-feature-mini article,
.rl-pricing article,
.rl-flow article,
.rl-list-card,
.rl-matrix span,
.rl-mistakes article {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 18px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.085), rgba(255, 255, 255, 0.025)),
        rgba(14, 15, 20, 0.76);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.09),
        0 20px 50px rgba(0, 0, 0, 0.22);
}

.rl-problem-card,
.rl-bonus-card,
.rl-feature-mini article,
.rl-pricing article,
.rl-list-card,
.rl-mistakes article {
    padding: 22px;
}

.rl-problem-card::before,
.rl-pricing .is-featured::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 3px;
    background: linear-gradient(90deg, var(--red), rgba(255, 255, 255, 0.35), transparent);
}

.rl-problem-card span,
.rl-bonus-card span,
.rl-mistakes span,
.rl-flow span,
.rl-badge {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    border: 1px solid rgba(255, 49, 76, 0.5);
    border-radius: 999px;
    padding: 0 11px;
    color: #fff;
    background: rgba(233, 18, 42, 0.2);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.rl-problem-card h3,
.rl-bonus-card h3,
.rl-feature-mini h3,
.rl-pricing h3,
.rl-list-card h3,
.rl-flow h3 {
    margin: 14px 0 10px;
    color: #fff;
    font-size: 22px;
    line-height: 1.12;
}

.rl-problem-card strong {
    display: block;
    margin: 18px 0 8px;
    color: #ff6175;
    font-size: 12px;
    text-transform: uppercase;
}

.rl-problem-card p,
.rl-bonus-card p,
.rl-feature-mini p,
.rl-pricing p,
.rl-flow p,
.rl-mistakes p {
    margin: 0;
    color: rgba(212, 218, 228, 0.76);
    line-height: 1.58;
}

.rl-flow {
    display: grid;
    grid-template-columns: repeat(7, minmax(190px, 1fr));
    gap: 12px;
    overflow-x: auto;
    padding-bottom: 4px;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 49, 76, 0.7) rgba(255, 255, 255, 0.08);
}

.rl-flow article {
    min-height: 188px;
    padding: 18px;
}

.rl-flow article:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 28px;
    right: -10px;
    width: 20px;
    height: 2px;
    background: rgba(233, 18, 42, 0.78);
}

.rl-media-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.rl-media-grid article {
    position: relative;
    min-height: 220px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 18px;
    background: #08090c;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.rl-media-grid article:hover {
    transform: translateY(-3px);
    border-color: rgba(255, 49, 76, 0.55);
    box-shadow: 0 22px 58px rgba(233, 18, 42, 0.14);
}

.rl-media-grid .product-visual {
    position: absolute;
    inset: 0;
    transition: transform 220ms ease, filter 220ms ease;
}

.rl-media-grid article:hover .product-visual {
    transform: scale(1.04);
    filter: saturate(1.08) brightness(1.04);
}

.rl-media-grid span {
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 14px;
    z-index: 3;
    color: #fff;
    font-size: 16px;
    font-weight: 900;
}

.rl-feature-mini {
    margin-top: 8px;
}

.rl-two-col {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.rl-list-card ul,
.rl-pricing ul {
    display: grid;
    gap: 9px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.rl-list-card li,
.rl-pricing li {
    position: relative;
    padding-left: 24px;
    color: rgba(214, 220, 230, 0.78);
    line-height: 1.45;
}

.rl-list-card li::before,
.rl-pricing li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.52em;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.55);
}

.rl-list-card.is-included li::before {
    background: #fff;
    box-shadow: 0 0 12px rgba(233, 18, 42, 0.5);
}

.rl-list-card.is-muted {
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.018)),
        rgba(15, 16, 20, 0.68);
}

.rl-list-card.is-muted li::before {
    background: rgba(233, 18, 42, 0.5);
}

.rl-matrix {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.rl-matrix span {
    min-height: 92px;
    display: grid;
    align-content: center;
    gap: 8px;
    padding: 18px;
    color: rgba(213, 219, 229, 0.72);
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
}

.rl-matrix strong {
    display: block;
    color: #fff;
    font-size: 17px;
    text-transform: none;
}

.rl-performance {
    display: grid;
    grid-template-columns: minmax(0, 0.82fr) minmax(0, 1fr);
    gap: 24px;
    align-items: center;
}

.rl-chip-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.rl-chip-grid span {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    padding: 0 14px;
    color: rgba(246, 247, 250, 0.88);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)),
        rgba(12, 13, 17, 0.72);
    font-size: 13px;
    font-weight: 800;
}

.rl-mistakes {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.rl-mistakes article {
    min-height: 156px;
}

.rl-bonus-card {
    min-height: 180px;
}

.rl-pricing article {
    display: grid;
    align-content: start;
    gap: 14px;
}

.rl-pricing .is-featured {
    border-color: rgba(255, 49, 76, 0.5);
    background:
        radial-gradient(280px 160px at 100% 0%, rgba(233, 18, 42, 0.18), transparent 70%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.03)),
        rgba(16, 17, 22, 0.8);
}

.rl-faq .faq-list {
    width: min(980px, 100%);
    margin-inline: auto;
}

.rl-final-cta {
    display: grid;
    justify-items: center;
    gap: 18px;
    margin-top: clamp(44px, 6vw, 80px);
    margin-bottom: 26px;
    padding: clamp(34px, 6vw, 68px);
    border: 1px solid rgba(255, 49, 76, 0.35);
    border-radius: 28px;
    text-align: center;
    background:
        radial-gradient(520px 220px at 50% 0%, rgba(233, 18, 42, 0.25), transparent 70%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.025)),
        rgba(13, 14, 18, 0.82);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 34px 90px rgba(0, 0, 0, 0.36);
}

.rl-final-cta small {
    color: rgba(212, 218, 228, 0.72);
    font-weight: 800;
}

@media (max-width: 980px) {

    .rl-trust,
    .rl-card-grid,
    .rl-feature-mini,
    .rl-pricing,
    .rl-matrix,
    .rl-media-grid,
    .rl-performance,
    .rl-two-col {
        grid-template-columns: 1fr 1fr;
    }

    .rl-mistakes {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .rl-section {
        padding: 22px;
        border-radius: 20px;
    }

    .rl-trust,
    .rl-card-grid,
    .rl-feature-mini,
    .rl-pricing,
    .rl-matrix,
    .rl-media-grid,
    .rl-performance,
    .rl-two-col {
        grid-template-columns: 1fr;
    }

    .rl-hero-product .product-summary h1 {
        font-size: clamp(38px, 13vw, 56px);
    }

    .rl-flow {
        grid-template-columns: 1fr;
        overflow: visible;
    }

    .rl-flow article:not(:last-child)::after {
        top: auto;
        right: auto;
        left: 32px;
        bottom: -8px;
        width: 2px;
        height: 16px;
    }

    .rl-media-grid article {
        min-height: 190px;
    }

    .rl-final-cta .hero-actions,
    .rl-hero-product .hero-actions {
        width: 100%;
    }

    .rl-final-cta .btn,
    .rl-hero-product .btn {
        width: 100%;
        justify-content: center;
    }
}

/* Redactor home sales page: focused funnel, restrained dark/red premium layer. */
.home-hero {
    min-height: calc(100vh - var(--header-h));
    min-height: max(720px, calc(100svh - var(--header-h)));
    overflow: visible;
    padding: clamp(48px, 6vw, 76px) 22px 78px !important;
}

.home-hero .hero-inner {
    width: min(100%, var(--max));
    grid-template-columns: minmax(0, 760px);
    justify-content: start;
    gap: 0;
}

@media (min-width: 1181px) {
    .site-header {
        padding-right: max(22px, calc((100vw - var(--wide-max)) / 2));
        padding-left: max(22px, calc((100vw - var(--wide-max)) / 2));
    }

    .home-hero .hero-inner {
        width: min(100%, var(--wide-max));
        grid-template-columns: minmax(0, 780px);
        gap: 0;
    }
}

.home-hero-copy {
    display: grid;
    gap: 18px;
    align-content: center;
    max-width: 720px;
}

.hero-brand-slab {
    width: min(430px, 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px 20px;
    border: 1px solid rgba(255, 49, 76, 0.34);
    border-radius: 18px;
    cursor: pointer;
    text-decoration: none;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.018)),
        rgba(12, 13, 17, 0.58);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 26px 80px rgba(0, 0, 0, 0.3);
}

.hero-brand-slab:hover {
    border-color: rgba(255, 49, 76, 0.58);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 28px 90px rgba(0, 0, 0, 0.36),
        0 0 30px rgba(255, 49, 76, 0.12);
}

.hero-brand-slab img {
    width: min(330px, 100%);
    height: auto;
    display: block;
    margin: 0 auto;
    object-fit: contain;
    object-position: center center;
}

.home-hero h1 {
    margin: 8px 0 0;
    max-width: 700px;
    color: #fff;
    font-size: clamp(42px, 4.8vw, 66px);
    line-height: 0.98;
    letter-spacing: 0;
    text-wrap: balance;
}

.home-hero .hero-lead {
    max-width: 640px;
    margin: 0;
    color: rgba(247, 248, 251, 0.92);
    font-size: clamp(17px, 1.25vw, 20px);
    line-height: 1.42;
}

.hero-note {
    max-width: 620px;
    margin: 0;
    color: rgba(209, 214, 224, 0.76);
    font-size: 14px;
    line-height: 1.5;
}

.home-hero .hero-proof-row {
    margin: 2px 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.home-hero .hero-proof-row span,
.trust-bar span,
.home-kicker,
.roadmap-grid span {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    padding: 0 12px;
    color: rgba(255, 255, 255, 0.88);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.025)),
        rgba(18, 19, 24, 0.72);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.home-hero .hero-actions,
.final-cta .hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.trust-bar {
    width: min(100% - 44px, var(--max));
    margin: clamp(-92px, -6vw, -54px) auto 0;
    position: relative;
    z-index: 4;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    padding: 16px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 20px;
    background:
        radial-gradient(360px 120px at 50% 0%, rgba(233, 18, 42, 0.2), transparent 70%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02)),
        rgba(12, 13, 18, 0.84);
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.3);
}

.trust-bar span::before {
    content: "";
    width: 6px;
    height: 6px;
    margin-right: 9px;
    border-radius: 999px;
    background: var(--accent);
    box-shadow: 0 0 14px rgba(233, 18, 42, 0.7);
}

.home-section,
.final-cta {
    position: relative;
    width: min(100% - 44px, var(--max));
    margin: 0 auto;
    padding: clamp(54px, 7vw, 92px) 0;
}

.home-section::before,
.catalog-section::before,
.split-section::before,
.faq-section::before,
.final-cta::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.13), rgba(233, 18, 42, 0.36), transparent);
    opacity: 0.7;
}

.home-card-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.home-card,
.preview-card,
.roadmap-grid article,
.roadmap-card {
    position: relative;
    min-height: 220px;
    padding: 24px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 20px;
    background:
        radial-gradient(280px 150px at 0% 0%, rgba(233, 18, 42, 0.12), transparent 70%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.025)),
        rgba(17, 18, 23, 0.78);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 22px 58px rgba(0, 0, 0, 0.22);
    overflow: hidden;
}

.home-card h3,
.preview-card h3 {
    margin: 18px 0 8px;
    color: #fff;
    font-size: 22px;
    line-height: 1.08;
}

.home-card p,
.preview-card p,
.roadmap-grid p,
.final-cta p {
    margin: 0;
    color: rgba(210, 216, 226, 0.76);
    line-height: 1.58;
}

.home-icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(135deg, var(--red), rgba(255, 255, 255, 0.08));
    font-size: 12px;
    font-weight: 900;
}

.category-nav-section {
    padding-top: clamp(58px, 7vw, 92px);
    padding-bottom: clamp(58px, 7vw, 92px);
}

.category-nav {
    align-items: stretch;
}

.category-card {
    min-height: 300px;
}

.final-cta h2 {
    margin: 14px 0 12px;
    color: #fff;
    font-size: clamp(36px, 5vw, 62px);
    line-height: 0.98;
    text-wrap: balance;
}

.catalog-section {
    padding-top: clamp(58px, 8vw, 96px);
}

.catalog-section .section-head {
    margin-bottom: 24px;
}

.catalog-command {
    margin-bottom: 22px;
}

.catalog-more {
    display: flex;
    justify-content: center;
    margin-top: 28px;
}

.problem-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.problem-grid .home-card {
    min-height: 190px;
}

.preview-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.preview-card {
    min-height: 310px;
    display: grid;
    align-content: end;
}

.preview-art {
    position: absolute;
    inset: 16px 16px auto;
    height: 150px;
    border-radius: 16px;
    background-size: cover;
    background-position: center;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
}

.section.split-section {
    width: auto;
    max-width: none;
    display: grid !important;
    grid-template-columns: minmax(340px, 0.72fr) minmax(0, 1fr) !important;
    gap: clamp(32px, 6vw, 74px) !important;
    align-items: start !important;
    padding-top: clamp(58px, 7vw, 92px);
    padding-bottom: clamp(58px, 7vw, 92px);
    overflow: visible !important;
}

.decision-copy {
    min-width: 0 !important;
}

.decision-copy h2 {
    max-width: 420px;
    font-size: clamp(34px, 4vw, 58px) !important;
    line-height: 1.02 !important;
}

.decision-copy p {
    max-width: 420px;
}

.decision-badges {
    max-width: 430px;
}

.support-grid {
    min-width: 0 !important;
    grid-template-columns: repeat(2, minmax(240px, 1fr)) !important;
    gap: 16px !important;
}

.support-grid article {
    min-width: 0 !important;
    transform: none !important;
}

.roadmap-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.roadmap-grid article,
.roadmap-card {
    min-height: 190px;
}

.roadmap-grid strong,
.roadmap-card strong {
    display: block;
    margin: 20px 0 8px;
    color: #fff;
    font-size: 20px;
    line-height: 1.08;
}

.roadmap-grid-sales {
    grid-template-columns: minmax(0, 1.15fr) repeat(2, minmax(0, 1fr));
}

.roadmap-card {
    display: flex;
    flex-direction: column;
    color: inherit;
    text-decoration: none;
}

.roadmap-card::after {
    content: "";
    position: absolute;
    inset: auto 22px 18px;
    height: 1px;
    background: linear-gradient(90deg, var(--red), rgba(255, 255, 255, 0.14), transparent);
    opacity: 0.65;
}

.roadmap-card-featured {
    border-color: rgba(239, 18, 61, 0.42);
    background:
        radial-gradient(360px 180px at 0% 0%, rgba(239, 18, 61, 0.22), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.028)),
        rgba(22, 17, 22, 0.84);
}

.roadmap-card small,
.roadmap-actions {
    margin-top: auto;
}

.roadmap-card small {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    color: #fff;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.roadmap-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin-top: 18px;
}

.final-cta {
    display: grid;
    justify-items: center;
    gap: 16px;
    margin-bottom: 26px;
    padding-inline: clamp(24px, 6vw, 72px);
    text-align: center;
    border: 1px solid rgba(255, 49, 76, 0.34);
    border-radius: 30px;
    background:
        radial-gradient(520px 230px at 50% 0%, rgba(233, 18, 42, 0.22), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.025)),
        rgba(13, 14, 18, 0.84);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 34px 90px rgba(0, 0, 0, 0.36);
}

.final-cta p {
    max-width: 690px;
}

.final-cta small {
    color: rgba(213, 219, 229, 0.72);
    font-weight: 900;
}

@media (max-width: 1180px) {

    .home-hero .hero-inner,
    .section.split-section {
        grid-template-columns: 1fr !important;
    }

    .home-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .section.split-section {
        gap: 28px !important;
    }

    .decision-copy h2,
    .decision-copy p,
    .decision-badges {
        max-width: 760px;
    }
}

@media (max-width: 760px) {
    .home-hero {
        padding: 30px 16px 44px !important;
    }

    .hero-brand-slab {
        padding: 18px;
    }

    .home-hero h1 {
        font-size: clamp(42px, 13vw, 66px);
    }

    .home-card-grid,
    .problem-grid,
    .preview-grid,
    .support-grid,
    .roadmap-grid {
        grid-template-columns: 1fr !important;
    }

    .trust-bar,
    .home-section,
    .section.split-section,
    .final-cta {
        width: min(100% - 28px, var(--max));
    }

    .home-card,
    .preview-card,
    .roadmap-grid article {
        min-height: auto;
    }

    .preview-card {
        min-height: 300px;
    }

    .home-hero .hero-actions .btn,
    .final-cta .btn {
        width: 100%;
        justify-content: center;
    }
}

/* Product page refinement: calmer brand copy and full-width room-flow slider. */
.rl-product-page .rl-hero-product .product-summary h1 {
    font-size: clamp(42px, 5.3vw, 68px);
    letter-spacing: 0;
}

.rl-product-page .rl-hero-product .product-summary .lead {
    max-width: 540px;
    font-size: clamp(18px, 1.45vw, 22px);
    line-height: 1.42;
}

.rl-product-page .rl-section-head h2,
.rl-product-page .rl-performance h2,
.rl-product-page .rl-final-cta h2 {
    font-size: clamp(30px, 4vw, 50px);
    line-height: 1.02;
}

.rl-flow-section {
    width: min(100% - 44px, var(--max)) !important;
    max-width: var(--max) !important;
    padding: clamp(30px, 4.4vw, 56px) clamp(20px, 4vw, 48px) !important;
}

.rl-flow-head {
    position: relative;
    display: grid;
    justify-items: center;
    gap: 16px;
    margin-bottom: clamp(20px, 3vw, 30px);
}

.rl-flow-head .rl-section-head {
    max-width: 860px;
    margin-bottom: 0;
}

.rl-slider-actions {
    position: absolute;
    right: 0;
    bottom: 2px;
    display: flex;
    gap: 10px;
}

.rl-slider-btn {
    min-width: 74px;
    min-height: 40px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    color: rgba(255, 255, 255, 0.9);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.025)),
        rgba(14, 15, 20, 0.74);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
    font: inherit;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    cursor: pointer;
    transition: border-color 180ms ease, background 180ms ease, transform 180ms ease, opacity 180ms ease;
}

.rl-slider-btn:hover {
    border-color: rgba(255, 49, 76, 0.58);
    background:
        linear-gradient(145deg, rgba(233, 18, 42, 0.22), rgba(255, 255, 255, 0.05)),
        rgba(14, 15, 20, 0.86);
    transform: translateY(-1px);
}

.rl-slider-btn:disabled {
    opacity: 0.36;
    cursor: default;
    transform: none;
}

.rl-flow-slider {
    overflow: hidden;
    margin-inline: calc(clamp(20px, 4vw, 48px) * -1);
    padding-inline: clamp(20px, 4vw, 48px);
}

.rl-flow-section .rl-flow {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(252px, 304px);
    grid-template-columns: none;
    gap: 16px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-padding-inline: clamp(20px, 4vw, 48px);
    scroll-snap-type: x mandatory;
    padding: 2px 0 14px;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 49, 76, 0.78) rgba(255, 255, 255, 0.08);
}

.rl-flow-section .rl-flow::-webkit-scrollbar {
    height: 8px;
}

.rl-flow-section .rl-flow::-webkit-scrollbar-track {
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
}

.rl-flow-section .rl-flow::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: linear-gradient(90deg, #ff183d, #8d0717);
}

.rl-flow-section .rl-flow article {
    min-height: 230px;
    display: grid;
    align-content: start;
    gap: 13px;
    padding: 22px;
    border-radius: 22px;
    scroll-snap-align: start;
}

.rl-flow-section .rl-flow article:not(:last-child)::after {
    display: none;
}

.rl-flow-section .rl-flow h3 {
    margin: 2px 0 0;
    font-size: 23px;
}

.rl-flow-section .rl-flow p {
    line-height: 1.55;
}

@media (max-width: 900px) {
    .rl-slider-actions {
        position: static;
    }
}

@media (max-width: 680px) {
    .rl-flow-section {
        width: min(100% - 28px, var(--max)) !important;
        padding: 26px 18px !important;
    }

    .rl-flow-head {
        justify-items: stretch;
        text-align: left;
    }

    .rl-flow-head .rl-section-head {
        justify-items: start;
        text-align: left;
    }

    .rl-slider-actions {
        width: 100%;
    }

    .rl-slider-btn {
        flex: 1;
    }

    .rl-flow-section .rl-flow {
        grid-auto-columns: minmax(232px, 82vw);
        overflow-x: auto;
    }
}

.rl-checkout-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 370px);
    gap: 18px;
    align-items: start;
}

.rl-offer-grid {
    grid-template-columns: 1fr !important;
    gap: 14px;
}

.rl-offer-grid article {
    min-height: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 12px 22px;
    padding: 24px;
}

.rl-offer-grid .rl-badge,
.rl-offer-grid h3,
.rl-offer-grid p,
.rl-offer-grid ul,
.rl-offer-grid .btn {
    grid-column: 1;
}

.rl-offer-grid .rl-badge {
    width: max-content;
}

.rl-offer-grid h3 {
    margin: 0;
    font-size: clamp(24px, 2.8vw, 34px);
}

.rl-offer-grid p {
    max-width: 620px;
}

.rl-offer-price {
    grid-column: 2;
    grid-row: 2 / span 2;
    justify-self: end;
    color: #fff;
    font-size: clamp(24px, 3vw, 34px);
    line-height: 1;
    text-align: right;
    text-shadow: 0 0 22px rgba(233, 18, 42, 0.22);
}

.rl-offer-grid ul {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 18px;
    margin-top: 2px;
}

.rl-offer-grid .btn {
    width: max-content;
    margin-top: 2px;
}

.rl-assortment {
    display: grid;
    gap: 12px;
    padding: 22px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 22px;
    background:
        radial-gradient(320px 170px at 100% 0%, rgba(233, 18, 42, 0.13), transparent 72%),
        linear-gradient(145deg, rgba(60, 62, 70, 0.56), rgba(15, 16, 21, 0.88) 58%, rgba(44, 13, 20, 0.42));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 24px 70px rgba(0, 0, 0, 0.26);
}

.rl-assortment h3 {
    margin: 12px 0 8px;
    color: #fff;
    font-size: 24px;
    line-height: 1.06;
}

.rl-assortment p {
    margin: 0 0 4px;
    color: rgba(214, 220, 230, 0.72);
    line-height: 1.5;
}

.rl-assortment-item {
    position: relative;
    min-height: 172px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-content: end;
    gap: 5px 14px;
    overflow: hidden;
    padding: 16px;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 18px;
    color: inherit;
    text-decoration: none;
    background: rgba(8, 9, 12, 0.64);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.09);
    isolation: isolate;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.rl-assortment-item.is-ems {
    --asset-visual: var(--hero-image, none);
    --asset-position: 62% 54%;
}

.rl-assortment-item.is-pack {
    --asset-visual: var(--hero-image, none);
    --asset-position: 78% 42%;
}

.rl-assortment-item.is-catalog {
    --asset-visual: var(--hero-image, none);
    --asset-position: 92% 56%;
}

.rl-assortment-item::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background-image:
        linear-gradient(180deg, rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.68)),
        var(--asset-visual);
    background-position: var(--asset-position, center);
    background-size: cover;
    filter: saturate(1.04) brightness(0.72);
    transition: transform 220ms ease, filter 220ms ease;
}

.rl-assortment-item::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        radial-gradient(220px 140px at 14% 18%, rgba(233, 18, 42, 0.3), transparent 68%),
        linear-gradient(90deg, rgba(5, 6, 9, 0.84), rgba(5, 6, 9, 0.32) 56%, rgba(5, 6, 9, 0.72));
    opacity: 0.92;
    transition: opacity 180ms ease;
}

.rl-assortment-item:hover {
    transform: translateY(-3px);
    border-color: rgba(255, 49, 76, 0.48);
    box-shadow: 0 20px 52px rgba(233, 18, 42, 0.13), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.rl-assortment-item:hover::before {
    transform: scale(1.06);
    filter: saturate(1.12) brightness(0.86);
}

.rl-assortment-item:hover::after {
    opacity: 0.78;
}

.rl-assortment-item .asset-shot {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 78px;
    aspect-ratio: 1;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 16px;
    background-image:
        linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.35)),
        var(--asset-visual);
    background-position: var(--asset-position, center);
    background-size: cover;
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.36);
}

.rl-assortment-item .asset-meta {
    grid-column: 1 / -1;
    color: #ff6175;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.rl-assortment-item strong {
    color: #fff;
    font-size: 22px;
    line-height: 1.04;
    text-shadow: 0 12px 28px rgba(0, 0, 0, 0.42);
}

.rl-assortment-item small {
    align-self: end;
    color: rgba(246, 247, 250, 0.82);
    font-weight: 900;
}

.rl-assortment-item em {
    grid-column: 1 / -1;
    color: rgba(255, 255, 255, 0.92);
    font-size: 12px;
    font-style: normal;
    font-weight: 900;
    text-transform: uppercase;
}

.rl-assortment-link {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 49, 76, 0.46);
    border-radius: 999px;
    color: #fff;
    background: rgba(233, 18, 42, 0.18);
    text-decoration: none;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

@media (max-width: 1080px) {
    .rl-checkout-shell {
        grid-template-columns: 1fr;
    }

    .rl-assortment {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .rl-assortment>div,
    .rl-assortment-link {
        grid-column: 1 / -1;
    }
}

@media (max-width: 720px) {
    .rl-offer-grid article {
        grid-template-columns: 1fr;
    }

    .rl-offer-price {
        grid-column: 1;
        grid-row: auto;
        justify-self: start;
        text-align: left;
    }

    .rl-offer-grid ul,
    .rl-assortment {
        grid-template-columns: 1fr;
    }

    .rl-offer-grid .btn {
        width: 100%;
        justify-content: center;
    }
}

/* Final support layout: keep copy left, give the buyer-info cards the wide right side. */
.section.split-section {
    width: auto !important;
    max-width: none !important;
    margin-inline: clamp(20px, 6vw, 86px) !important;
    grid-template-columns: minmax(390px, 0.82fr) minmax(640px, 1.18fr) !important;
    gap: clamp(30px, 3.4vw, 52px) !important;
    align-items: center !important;
}

.section.split-section .decision-copy {
    width: 100% !important;
    max-width: none !important;
}

.section.split-section .decision-copy h2,
.section.split-section .decision-copy p,
.section.split-section .decision-badges {
    max-width: 480px !important;
}

.section.split-section .decision-score {
    max-width: 480px;
}

.section.split-section .support-grid {
    width: 100% !important;
    max-width: none !important;
    grid-column: auto !important;
    grid-template-columns: repeat(2, minmax(260px, 1fr)) !important;
    gap: 18px !important;
}

.section.split-section .support-grid article {
    min-height: 210px;
    padding: clamp(22px, 3vw, 30px) !important;
}

@media (max-width: 1180px) {
    .section.split-section {
        grid-template-columns: 1fr !important;
        align-items: start !important;
    }

    .section.split-section .decision-copy h2,
    .section.split-section .decision-copy p,
    .section.split-section .decision-badges,
    .section.split-section .decision-score {
        max-width: 720px !important;
    }

    .section.split-section .support-grid {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 760px) {
    .section.split-section .support-grid {
        grid-template-columns: 1fr !important;
    }

    .section.split-section .support-grid article {
        min-height: auto;
    }
}

/* Bugfix: keep support icons out of text and keep flow numbers compact. */
.section.split-section .support-grid article {
    position: relative !important;
    align-content: center !important;
    padding: 56px 24px 26px 92px !important;
}

.section.split-section .support-icon {
    position: absolute !important;
    top: 64px !important;
    left: 24px !important;
    width: 44px !important;
    height: 44px !important;
}

.section.split-section .support-grid h3 {
    margin: 0 0 8px !important;
}

.rl-flow-section .rl-flow span {
    width: auto !important;
    min-width: 34px;
    max-width: max-content;
    justify-self: start !important;
    align-self: start !important;
}

@media (max-width: 760px) {
    .section.split-section .support-grid article {
        padding: 58px 22px 24px 84px !important;
    }

    .section.split-section .support-icon {
        top: 62px !important;
        left: 22px !important;
    }
}

.product-placeholder {
    position: absolute;
    inset: 0;
    min-height: 100%;
    display: grid;
    place-items: center;
    padding: 22px;
    color: #fff;
    font-size: 0;
    font-weight: 950;
    isolation: isolate;
    background:
        radial-gradient(190px 130px at 70% 32%, rgba(255, 255, 255, 0.1), transparent 64%),
        radial-gradient(260px 170px at 12% 12%, rgba(239, 18, 61, 0.24), transparent 64%),
        linear-gradient(145deg, rgba(47, 50, 58, 0.88), rgba(12, 13, 18, 0.98)),
        #101116;
    overflow: hidden;
}

.product-placeholder::before {
    content: "";
    width: min(120px, 42%);
    aspect-ratio: 1.22;
    display: block;
    background-image:
        var(--store-mark, none),
        var(--store-mark, none);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 0.9;
    filter:
        drop-shadow(0 18px 28px rgba(0, 0, 0, 0.42)) drop-shadow(0 0 24px rgba(239, 18, 61, 0.22));
}

.product-placeholder::after {
    content: attr(data-placeholder-label);
    position: absolute;
    right: 14px;
    bottom: 14px;
    min-height: 26px;
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    padding: 0 10px;
    color: rgba(255, 255, 255, 0.76);
    background: rgba(255, 255, 255, 0.07);
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
}

/* SEO category pages. */
.nav a.is-active {
    color: #fff;
}

.seo-main {
    position: relative;
    min-height: 100vh;
    padding-top: 132px;
    color: #fff;
    background:
        linear-gradient(90deg, rgba(4, 6, 10, 0.98), rgba(10, 12, 17, 0.9) 48%, rgba(48, 5, 13, 0.42)),
        radial-gradient(700px 420px at 78% 4%, rgba(239, 18, 61, 0.16), transparent 68%),
        #07080d;
    overflow: hidden;
}

.seo-main::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -2;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px),
        var(--hero-image, none) center / cover fixed;
    background-size: 72px 72px, 72px 72px, cover;
    opacity: 0.32;
}

.seo-main::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(115deg, transparent 20%, rgba(255, 255, 255, 0.06) 20.4%, transparent 20.8%),
        linear-gradient(105deg, transparent 62%, rgba(239, 18, 61, 0.15) 62.4%, transparent 62.8%);
    pointer-events: none;
}

.seo-hero,
.seo-section {
    width: min(100% - 44px, var(--max));
    margin-inline: auto;
}

.seo-hero {
    padding: 52px 0 28px;
}

.seo-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    margin-bottom: 28px;
    color: rgba(226, 231, 240, 0.62);
    font-size: 13px;
    font-weight: 800;
}

.seo-breadcrumb a {
    color: rgba(226, 231, 240, 0.72);
}

.seo-breadcrumb strong {
    color: #fff;
}

.seo-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.36fr);
    gap: 24px;
    align-items: stretch;
}

.seo-hero h1 {
    max-width: 820px;
    margin: 0;
    color: #fff;
    font-size: clamp(48px, 7vw, 92px);
    line-height: 0.9;
}

.seo-hero p:not(.eyebrow) {
    max-width: 760px;
    margin: 18px 0 0;
    color: rgba(226, 231, 240, 0.78);
    font-size: clamp(17px, 2vw, 21px);
    line-height: 1.55;
}

.seo-intent {
    width: max-content;
    max-width: 100%;
    display: grid;
    gap: 5px;
    margin-top: 26px;
    padding: 14px 18px;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(239, 18, 61, 0.2), rgba(255, 255, 255, 0.045));
}

.seo-intent span,
.seo-card span {
    color: rgba(226, 231, 240, 0.58);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.seo-intent strong {
    color: #fff;
    font-size: 15px;
}

.seo-card {
    display: grid;
    gap: 18px;
    align-content: end;
    min-height: 280px;
    padding: 26px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 24px;
    background:
        radial-gradient(300px 180px at 100% 0%, rgba(239, 18, 61, 0.24), transparent 70%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)),
        rgba(20, 22, 30, 0.78);
    box-shadow: 0 28px 90px rgba(0, 0, 0, 0.34);
}

.seo-card strong {
    color: #fff;
    font-size: 24px;
    line-height: 1.16;
}

.seo-section {
    padding: 52px 0;
}

.section-head.compact {
    max-width: 760px;
    margin: 0 auto 24px;
    text-align: center;
}

.section-head.compact h2 {
    font-size: clamp(34px, 5vw, 58px);
}

.seo-subnav {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.seo-subnav a {
    min-height: 128px;
    display: grid;
    align-content: end;
    gap: 8px;
    padding: 20px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 20px;
    color: #fff;
    background:
        linear-gradient(135deg, rgba(239, 18, 61, 0.15), transparent 54%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.025)),
        rgba(18, 20, 27, 0.84);
    transition: transform 180ms ease, border-color 180ms ease, background 180ms ease;
}

.seo-subnav a:hover {
    transform: translateY(-3px);
    border-color: rgba(239, 18, 61, 0.55);
    background:
        linear-gradient(135deg, rgba(239, 18, 61, 0.24), transparent 58%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.095), rgba(255, 255, 255, 0.03)),
        rgba(22, 24, 31, 0.9);
}

.seo-subnav span {
    color: rgba(226, 231, 240, 0.58);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.seo-subnav strong {
    font-size: 22px;
    line-height: 1.1;
}

.seo-command {
    margin-bottom: 22px;
}

.seo-product-grid {
    margin-top: 0;
}

.seo-copy-block {
    margin-bottom: 54px;
    padding: 34px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 24px;
    background:
        linear-gradient(135deg, rgba(239, 18, 61, 0.13), transparent 52%),
        rgba(18, 20, 27, 0.76);
}

.seo-copy-block h2 {
    margin: 0 0 12px;
    color: #fff;
    font-size: clamp(28px, 4vw, 42px);
}

.seo-copy-block p {
    max-width: 940px;
    margin: 0;
    color: rgba(226, 231, 240, 0.78);
    line-height: 1.65;
}

.seo-copy-block p+p {
    margin-top: 12px;
}

@media (max-width: 920px) {

    .seo-hero-grid,
    .seo-subnav {
        grid-template-columns: 1fr;
    }

    .seo-main {
        padding-top: 106px;
    }
}

@media (max-width: 620px) {

    .seo-hero,
    .seo-section {
        width: min(100% - 28px, var(--max));
    }

    .seo-hero {
        padding-top: 36px;
    }

    .seo-card {
        min-height: 220px;
    }
}

/* Minimal SEO category/shop pages. */
.seo-minimal-main {
    padding-top: 118px;
    overflow: visible;
}

.seo-shop {
    width: min(100% - 44px, var(--max));
    margin-inline: auto;
    padding: 34px 0 58px;
}

.seo-shop .seo-breadcrumb {
    margin-bottom: 16px;
}

.seo-shop-head {
    display: flex;
    gap: 22px;
    align-items: end;
    justify-content: space-between;
    margin-bottom: 18px;
}

.seo-shop-head h1 {
    max-width: 760px;
    margin: 0;
    color: #fff;
    font-size: clamp(34px, 5vw, 58px);
    line-height: 0.96;
}

.seo-shop-head p {
    max-width: 760px;
    margin: 10px 0 0;
    color: rgba(226, 231, 240, 0.72);
    font-size: 16px;
    line-height: 1.55;
}

.seo-shop-action {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 18px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    color: #fff;
    font-size: 13px;
    font-weight: 900;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.025));
}

.seo-shop-action:hover {
    border-color: rgba(239, 18, 61, 0.62);
    background: rgba(239, 18, 61, 0.14);
}

.seo-command {
    position: sticky;
    top: 84px;
    z-index: 8;
    margin: 0 0 18px;
    padding: 14px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 22px;
    background:
        linear-gradient(135deg, rgba(239, 18, 61, 0.11), transparent 46%),
        rgba(16, 18, 25, 0.88);
    backdrop-filter: blur(18px);
    box-shadow: 0 18px 60px rgba(0, 0, 0, 0.28);
}

.promo-hidden .seo-command {
    top: 78px;
}

.seo-category-switch {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 10px;
    scrollbar-width: thin;
}

.seo-category-switch a {
    flex: 0 0 auto;
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 15px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    color: rgba(226, 231, 240, 0.76);
    font-size: 13px;
    font-weight: 900;
    background: rgba(255, 255, 255, 0.045);
}

.seo-category-switch a:hover,
.seo-category-switch a.is-active {
    color: #fff;
    border-color: rgba(239, 18, 61, 0.72);
    background: linear-gradient(135deg, rgba(239, 18, 61, 0.84), rgba(112, 18, 35, 0.72));
    box-shadow: 0 14px 34px rgba(239, 18, 61, 0.18);
}

.seo-filter-line {
    display: grid;
    grid-template-columns: minmax(240px, 0.52fr) 1fr;
    gap: 12px;
    align-items: center;
}

.seo-filter-line .search-wrap {
    width: 100%;
}

.seo-filter-line .search-wrap input {
    min-height: 48px;
}

.seo-filter-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.seo-filter-meta span,
.seo-filter-meta strong {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    color: rgba(226, 231, 240, 0.72);
    font-size: 12px;
    font-weight: 900;
    background: rgba(255, 255, 255, 0.045);
}

.seo-filter-meta strong {
    color: #fff;
}

.seo-shop .seo-product-grid {
    margin-top: 0;
}

.seo-shop .seo-copy-block {
    margin-top: 24px;
    margin-bottom: 0;
    padding: 22px;
    border-radius: 22px;
}

.seo-shop .seo-copy-block h2 {
    font-size: 24px;
}

.seo-shop .seo-copy-block p {
    max-width: 1000px;
    font-size: 14px;
}

@media (max-width: 760px) {
    .seo-minimal-main {
        padding-top: 106px;
    }

    .seo-shop {
        width: min(100% - 28px, var(--max));
        padding-top: 24px;
    }

    .seo-shop-head {
        display: grid;
    }

    .seo-shop-action {
        width: 100%;
    }

    .seo-filter-line {
        grid-template-columns: 1fr;
    }

    .seo-filter-meta {
        justify-content: flex-start;
    }
}

/* Grouped category pages */
.seo-minimal-main {
    padding-top: 92px;
    background:
        radial-gradient(900px 360px at 76% 0%, rgba(239, 18, 61, 0.18), transparent 68%),
        radial-gradient(560px 260px at 8% 18%, rgba(255, 255, 255, 0.055), transparent 66%),
        linear-gradient(110deg, rgba(6, 8, 12, 0.96), rgba(12, 14, 20, 0.88) 48%, rgba(62, 5, 18, 0.38)),
        #07080d;
}

.seo-minimal-main::before {
    opacity: 0.52;
    background-position: center top;
}

.seo-minimal-main::after {
    background:
        linear-gradient(115deg, transparent 16%, rgba(255, 255, 255, 0.055) 16.35%, transparent 16.8%),
        linear-gradient(103deg, transparent 68%, rgba(239, 18, 61, 0.15) 68.35%, transparent 68.85%),
        radial-gradient(680px 260px at 58% 6%, rgba(239, 18, 61, 0.12), transparent 70%);
}

.seo-shop {
    padding-top: 24px;
}

.category-logic {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 22px 0 16px;
}

.category-logic article {
    position: relative;
    min-height: 144px;
    padding: 18px 18px 20px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 18px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.085), rgba(255, 255, 255, 0.028)),
        rgba(16, 18, 25, 0.78);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055), 0 18px 42px rgba(0, 0, 0, 0.22);
    overflow: hidden;
}

.category-logic article::before {
    content: "";
    position: absolute;
    inset: auto 18px 0;
    height: 2px;
    background: linear-gradient(90deg, var(--red), transparent);
    opacity: 0.72;
}

.category-logic-mlo article {
    background:
        radial-gradient(220px 110px at 12% 0%, rgba(239, 18, 61, 0.16), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.082), rgba(255, 255, 255, 0.028)),
        rgba(16, 18, 25, 0.78);
}

.category-logic-scripts article {
    background:
        radial-gradient(220px 110px at 95% 0%, rgba(255, 255, 255, 0.10), transparent 74%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.026)),
        rgba(17, 20, 28, 0.82);
}

.category-logic-clothing article {
    background:
        radial-gradient(240px 120px at 0% 100%, rgba(239, 18, 61, 0.13), transparent 74%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.078), rgba(255, 255, 255, 0.025)),
        rgba(18, 17, 24, 0.80);
}

.category-logic span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 28px;
    margin-bottom: 16px;
    border: 1px solid rgba(239, 18, 61, 0.58);
    border-radius: 999px;
    color: #fff;
    background: rgba(239, 18, 61, 0.24);
    font-size: 11px;
    font-weight: 950;
}

.category-logic strong {
    display: block;
    margin-bottom: 8px;
    color: #fff;
    font-size: 20px;
    line-height: 1.08;
}

.category-logic p {
    max-width: 34ch;
    margin: 0;
    color: rgba(226, 231, 240, 0.72);
    font-size: 14px;
    line-height: 1.55;
}

.seo-command {
    background:
        linear-gradient(135deg, rgba(239, 18, 61, 0.12), transparent 42%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.025)),
        rgba(14, 16, 23, 0.82);
}

.seo-category-hub {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 14px;
}

.seo-category-group {
    min-width: 0;
    padding: 14px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 18px;
    background:
        radial-gradient(240px 120px at 100% 0%, rgba(239, 18, 61, 0.14), transparent 72%),
        rgba(255, 255, 255, 0.035);
}

.seo-category-group.is-active {
    border-color: rgba(239, 18, 61, 0.62);
    box-shadow: inset 0 0 0 1px rgba(239, 18, 61, 0.18), 0 16px 34px rgba(239, 18, 61, 0.12);
}

.seo-category-group-main {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: baseline;
    margin-bottom: 10px;
    color: #fff;
}

.seo-category-group-main span {
    color: rgba(226, 231, 240, 0.58);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.seo-category-group-main strong {
    font-size: 22px;
    line-height: 1;
}

.seo-subcategory-list {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.seo-subcategory-list a {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    padding: 0 11px;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 999px;
    color: rgba(226, 231, 240, 0.76);
    font-size: 12px;
    font-weight: 900;
    background: rgba(255, 255, 255, 0.04);
}

.seo-subcategory-list a:hover,
.seo-subcategory-list a.is-active {
    color: #fff;
    border-color: rgba(239, 18, 61, 0.68);
    background: rgba(239, 18, 61, 0.24);
}

.seo-filter-line {
    grid-template-columns: minmax(220px, 0.48fr) minmax(180px, 0.24fr) 1fr;
}

.sort-wrap {
    display: grid;
    gap: 8px;
    color: rgba(226, 231, 240, 0.62);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.sort-wrap select {
    min-height: 48px;
    width: 100%;
    padding: 0 14px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    color: #fff;
    font: inherit;
    font-size: 14px;
    font-weight: 800;
    color-scheme: dark;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)), #161922;
}

.sort-wrap option {
    color: #f5f7fb;
    background: #171a22;
}

.sort-wrap option:checked {
    color: #fff;
    background: #ef123d;
}

.empty-state {
    grid-column: 1 / -1;
    padding: 42px 24px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 22px;
    color: rgba(226, 231, 240, 0.76);
    text-align: center;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.02)),
        rgba(13, 15, 21, 0.84);
}

.catalog-empty-state {
    grid-column: 1 / -1;
    position: relative;
    display: grid;
    gap: 8px;
    min-height: 150px;
    place-items: center;
    padding: 34px 24px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 22px;
    text-align: center;
    background:
        radial-gradient(440px 170px at 18% 0%, rgba(239, 18, 61, 0.16), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.018)),
        rgba(12, 14, 20, 0.82);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 24px 70px rgba(0, 0, 0, 0.24);
}

.catalog-empty-state[hidden] {
    display: none;
}

.catalog-empty-state strong {
    color: #fff;
    font-size: clamp(20px, 2vw, 28px);
    font-weight: 950;
}

.catalog-empty-state span {
    max-width: 560px;
    color: rgba(226, 231, 240, 0.68);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.55;
}

.section-kicker {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 11px;
    border: 1px solid rgba(239, 18, 61, 0.4);
    border-radius: 999px;
    color: rgba(255, 255, 255, 0.92);
    background: rgba(239, 18, 61, 0.14);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.sales-blueprint {
    position: relative;
    display: grid;
    grid-template-columns: minmax(260px, 0.72fr) minmax(0, 1fr);
    gap: 18px;
    margin-top: 24px;
    padding: 22px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 26px;
    background:
        radial-gradient(520px 220px at 0% 0%, rgba(239, 18, 61, 0.14), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)),
        rgba(13, 15, 22, 0.82);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.11), 0 22px 60px rgba(0, 0, 0, 0.24);
    overflow: hidden;
}

.sales-blueprint::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.06), transparent),
        linear-gradient(115deg, transparent 64%, rgba(239, 18, 61, 0.14) 64.4%, transparent 65%);
    opacity: 0.55;
}

.sales-blueprint>* {
    position: relative;
}

.sales-blueprint-copy {
    display: grid;
    align-content: center;
    gap: 14px;
}

.sales-blueprint h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(28px, 3vw, 42px);
    line-height: 0.98;
    text-wrap: balance;
}

.sales-blueprint p {
    margin: 0;
    color: rgba(216, 222, 232, 0.75);
    line-height: 1.58;
}

.blueprint-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.blueprint-pills span {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 11px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    color: rgba(255, 255, 255, 0.84);
    background: rgba(255, 255, 255, 0.045);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.blueprint-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.blueprint-grid article {
    min-height: 146px;
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 18px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.018)),
        rgba(8, 10, 15, 0.58);
}

.blueprint-grid span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 24px;
    margin-bottom: 16px;
    border: 1px solid rgba(239, 18, 61, 0.55);
    border-radius: 999px;
    color: #fff;
    background: rgba(239, 18, 61, 0.18);
    font-size: 11px;
    font-weight: 900;
}

.blueprint-grid strong {
    display: block;
    margin-bottom: 8px;
    color: #fff;
    font-size: 19px;
    line-height: 1.1;
}

.blueprint-grid p {
    color: rgba(216, 222, 232, 0.7);
    font-size: 14px;
}

.next-drop-strip {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    margin-top: 2px;
    padding: 14px 16px;
    border: 1px solid rgba(239, 18, 61, 0.28);
    border-radius: 18px;
    color: #fff;
    background:
        linear-gradient(90deg, rgba(239, 18, 61, 0.2), rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.02)),
        rgba(10, 11, 16, 0.72);
}

.next-drop-strip span,
.next-drop-strip small {
    color: rgba(226, 231, 240, 0.64);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.next-drop-strip strong {
    min-width: 0;
    font-size: 17px;
}

.sales-blueprint-scripts {
    background:
        radial-gradient(520px 220px at 78% 0%, rgba(239, 18, 61, 0.12), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.025)),
        rgba(16, 18, 24, 0.84);
}

.sales-blueprint-clothing {
    background:
        radial-gradient(520px 220px at 18% 0%, rgba(239, 18, 61, 0.12), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.082), rgba(255, 255, 255, 0.024)),
        rgba(17, 18, 23, 0.84);
}

.upcoming-main {
    min-height: 100vh;
    padding-top: 116px;
    background:
        radial-gradient(900px 340px at 82% 0%, rgba(239, 18, 61, 0.16), transparent 70%),
        linear-gradient(110deg, rgba(6, 8, 12, 0.96), rgba(13, 15, 22, 0.9) 48%, rgba(62, 5, 18, 0.34)),
        #07080d;
}

.upcoming-shell {
    width: min(100% - 44px, var(--max));
    margin-inline: auto;
    padding: 28px 0 78px;
}

.upcoming-hero {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(340px, 0.68fr);
    gap: 24px;
    align-items: stretch;
}

.upcoming-copy,
.upcoming-panel,
.next-drop-hub-card,
.release-board,
.waitlist-card {
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 26px;
    background:
        radial-gradient(520px 220px at 0% 0%, rgba(239, 18, 61, 0.13), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.085), rgba(255, 255, 255, 0.024)),
        rgba(14, 16, 22, 0.82);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.11), 0 24px 68px rgba(0, 0, 0, 0.28);
}

.upcoming-copy {
    display: grid;
    align-content: center;
    gap: 18px;
    padding: clamp(26px, 4vw, 48px);
}

.upcoming-copy h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(42px, 6vw, 76px);
    line-height: 0.94;
    text-wrap: balance;
}

.upcoming-copy p,
.next-drop-hub-card p,
.release-board p,
.waitlist-card p {
    margin: 0;
    color: rgba(220, 226, 236, 0.74);
    line-height: 1.62;
}

.upcoming-panel {
    display: grid;
    gap: 14px;
    padding: 20px;
}

.upcoming-visual {
    min-height: 260px;
    border-radius: 22px;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.44)),
        var(--hero-image, none) center / cover;
    border: 1px solid rgba(255, 255, 255, 0.12);
}

.upcoming-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.upcoming-stats span {
    min-height: 78px;
    display: grid;
    align-content: center;
    gap: 4px;
    padding: 12px;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.045);
    color: rgba(226, 231, 240, 0.66);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.upcoming-stats strong {
    color: #fff;
    font-size: 20px;
}

.release-board {
    margin-top: 24px;
    padding: 24px;
}

.release-board h2,
.waitlist-card h2 {
    margin: 0 0 16px;
    color: #fff;
    font-size: clamp(28px, 3.4vw, 46px);
    line-height: 1;
}

.release-board-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.release-board-grid article {
    min-height: 170px;
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.04);
}

.release-board-grid span {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 0 10px;
    margin-bottom: 14px;
    border: 1px solid rgba(239, 18, 61, 0.52);
    border-radius: 999px;
    color: #fff;
    background: rgba(239, 18, 61, 0.18);
    font-size: 11px;
    font-weight: 900;
}

.release-board-grid strong {
    display: block;
    margin-bottom: 8px;
    color: #fff;
    font-size: 19px;
    line-height: 1.12;
}

.waitlist-card {
    margin-top: 24px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
    padding: 24px;
}

.next-drop-hub {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-top: 24px;
}

.next-drop-hub-card {
    display: grid;
    gap: 14px;
    padding: 22px;
    color: inherit;
}

.next-drop-hub-card h2 {
    margin: 0;
    color: #fff;
    font-size: 28px;
    line-height: 1;
}

@media (max-width: 980px) {

    .upcoming-hero,
    .waitlist-card {
        grid-template-columns: 1fr;
    }

    .release-board-grid,
    .next-drop-hub {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .upcoming-main {
        padding-top: 104px;
    }

    .upcoming-shell {
        width: min(100% - 28px, var(--max));
    }

    .release-board-grid,
    .next-drop-hub,
    .upcoming-stats {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 980px) {
    .seo-category-hub {
        grid-template-columns: 1fr;
    }

    .seo-filter-line {
        grid-template-columns: 1fr;
    }

    .category-logic {
        grid-template-columns: 1fr;
    }

    .seo-filter-meta {
        justify-content: flex-start;
    }

    .sales-blueprint {
        grid-template-columns: 1fr;
    }

    .next-drop-strip {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .blueprint-grid {
        grid-template-columns: 1fr;
    }

    .sales-blueprint {
        padding: 16px;
        border-radius: 22px;
    }
}

/* Final rhythm guard: prevent section blocks from visually sticking together. */
.trust-bar {
    margin-bottom: clamp(34px, 5vw, 64px);
}

.trust-bar+.home-section,
.home-section+.home-section,
.home-section+.category-nav-section,
.category-nav-section+.home-section,
.category-nav-section+.section,
.section+.catalog-section,
.catalog-section+.section,
.catalog-section+.split-section,
.problems-section+.split-section,
.split-section+.faq-section,
.faq-section+.home-section,
.faq-section+.final-cta {
    margin-top: clamp(42px, 5.5vw, 82px) !important;
}

.section-head,
.category-nav-head,
.rl-section-head {
    margin-bottom: clamp(26px, 3vw, 42px) !important;
}

.catalog-section .section-head,
.faq-section .section-head,
.roadmap-section .section-head {
    margin-bottom: clamp(30px, 3.4vw, 48px) !important;
}

.seo-section+.seo-section,
.seo-shop+.seo-section,
.seo-copy-block+.seo-section {
    margin-top: clamp(42px, 5vw, 78px) !important;
}

.rl-product-page .rl-hero-product+.rl-section,
.rl-product-page .rl-section+.rl-section {
    margin-top: clamp(54px, 6vw, 96px) !important;
}

.rl-product-page .rl-section {
    scroll-margin-top: 150px;
}

@media (max-width: 760px) {

    .trust-bar+.home-section,
    .home-section+.home-section,
    .home-section+.category-nav-section,
    .category-nav-section+.home-section,
    .category-nav-section+.section,
    .section+.catalog-section,
    .catalog-section+.section,
    .catalog-section+.split-section,
    .problems-section+.split-section,
    .split-section+.faq-section,
    .faq-section+.home-section,
    .faq-section+.final-cta,
    .rl-product-page .rl-hero-product+.rl-section,
    .rl-product-page .rl-section+.rl-section {
        margin-top: 40px !important;
    }
}

/* Catalog layering: panel and cards overlap as one composed storefront block. */
.seo-shop .seo-command {
    position: relative !important;
    top: auto !important;
    z-index: 5 !important;
    margin-bottom: 18px !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
    background:
        linear-gradient(135deg, rgba(239, 18, 61, 0.15), transparent 42%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.025)),
        rgba(17, 19, 26, 0.9) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 22px 70px rgba(0, 0, 0, 0.34),
        0 0 0 1px rgba(239, 18, 61, 0.05) !important;
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
}

.promo-hidden .seo-shop .seo-command {
    top: auto !important;
}

.seo-shop .seo-product-grid {
    position: relative;
    z-index: 3;
    margin-top: 0 !important;
}

.seo-shop .seo-product-grid::before {
    inset: -30px -24px -28px !important;
    border-radius: 26px !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    background:
        radial-gradient(760px 230px at 50% 0%, rgba(239, 18, 61, 0.12), transparent 72%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)),
        rgba(4, 5, 9, 0.48) !important;
    -webkit-backdrop-filter: blur(7px);
    backdrop-filter: blur(7px);
}

.seo-shop .seo-product-grid::after {
    top: -30px !important;
    left: 34px !important;
    right: 34px !important;
    opacity: 0.7;
}

/* Home catalog: layered filter/card stack. */
#catalog.catalog-section {
    margin-top: clamp(18px, 2.6vw, 34px) !important;
    padding-top: clamp(28px, 4vw, 52px) !important;
}

#catalog.catalog-section .section-head {
    margin-bottom: clamp(22px, 2.6vw, 34px) !important;
}

#catalog.catalog-section .catalog-command {
    position: relative;
    z-index: 6;
    margin-bottom: 0 !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
    background:
        linear-gradient(135deg, rgba(239, 18, 61, 0.13), transparent 42%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.026)),
        rgba(18, 20, 27, 0.9) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 22px 68px rgba(0, 0, 0, 0.34) !important;
}

#catalog.catalog-section .product-grid {
    position: relative;
    z-index: 3;
    margin-top: -12px !important;
    padding-top: 28px;
}

#catalog.catalog-section .product-grid::before {
    inset: -22px -24px -28px !important;
    border-radius: 26px !important;
    background:
        radial-gradient(780px 220px at 48% 0%, rgba(239, 18, 61, 0.13), transparent 72%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.044), rgba(255, 255, 255, 0.014)),
        rgba(4, 5, 9, 0.54) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

#catalog.catalog-section .product-grid::after {
    top: -22px !important;
    left: 36px !important;
    right: 36px !important;
    opacity: 0.76;
}

body.is-async-loading main {
    opacity: 0.62;
    pointer-events: none;
    transition: opacity 180ms ease;
}

@media (max-width: 760px) {

    #catalog.catalog-section {
        margin-top: 26px !important;
        padding-top: 34px !important;
    }

    #catalog.catalog-section .product-grid {
        margin-top: -8px !important;
        padding-top: 22px;
    }
}

/* Home rhythm reset: keep sections close without turning the page into a flat stack. */
.trust-bar {
    margin-bottom: 0 !important;
}

.trust-bar+.home-section,
.home-section+.home-section,
.home-section+.category-nav-section,
.category-nav-section+.home-section,
.category-nav-section+.section,
.section+.catalog-section,
.catalog-section+.section,
.catalog-section+.split-section,
.problems-section+.split-section,
.split-section+.faq-section,
.faq-section+.home-section,
.faq-section+.final-cta {
    margin-top: 0 !important;
}

.section,
.home-section {
    padding-top: clamp(48px, 5vw, 70px) !important;
    padding-bottom: clamp(48px, 5vw, 70px) !important;
}

.category-nav-section {
    padding-top: clamp(38px, 4.2vw, 58px) !important;
    padding-bottom: clamp(42px, 4.6vw, 64px) !important;
}

#catalog.catalog-section {
    margin-top: 0 !important;
    padding-top: clamp(40px, 4.6vw, 62px) !important;
    padding-bottom: clamp(44px, 4.8vw, 66px) !important;
}

.catalog-section+.problems-section,
.problems-section+.split-section,
.split-section+.faq-section {
    margin-top: 0 !important;
}

.problems-section {
    padding-top: clamp(42px, 4.4vw, 62px) !important;
    padding-bottom: clamp(34px, 3.4vw, 48px) !important;
}

.preview-section {
    padding-top: clamp(34px, 3.4vw, 48px) !important;
    padding-bottom: clamp(44px, 4.4vw, 64px) !important;
}

.section-head,
.category-nav-head,
.rl-section-head {
    margin-bottom: clamp(20px, 2.2vw, 32px) !important;
}

.catalog-section .section-head,
.faq-section .section-head,
.roadmap-section .section-head {
    margin-bottom: clamp(22px, 2.4vw, 34px) !important;
}

@media (max-width: 760px) {

    .section,
    .home-section {
        padding-top: 42px !important;
        padding-bottom: 42px !important;
    }

    .category-nav-section,
    #catalog.catalog-section,
    .problems-section,
    .preview-section {
        padding-top: 36px !important;
        padding-bottom: 38px !important;
    }
}

/* Head-to-content spacing: compact sections still need breathing room before panels. */
.category-nav-head {
    margin-bottom: clamp(30px, 3.2vw, 46px) !important;
}

#catalog.catalog-section .section-head,
.problems-section .section-head,
.preview-section .section-head,
.faq-section .section-head {
    margin-bottom: clamp(30px, 3vw, 44px) !important;
}

.category-nav-head+.category-nav,
.section-head+.home-card-grid,
.section-head+.preview-grid,
.section-head+.faq-list,
#catalog.catalog-section .section-head+.catalog-command {
    margin-top: clamp(4px, 0.8vw, 12px) !important;
}

@media (max-width: 760px) {

    .category-nav-head,
    #catalog.catalog-section .section-head,
    .problems-section .section-head,
    .preview-section .section-head,
    .faq-section .section-head {
        margin-bottom: 26px !important;
    }
}

/* Header localization switcher */
.locale-switcher {
    position: relative;
    z-index: 4;
    flex: 0 0 auto;
}

.locale-current {
    height: 38px;
    min-width: 70px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: var(--radius);
    background:
        radial-gradient(circle at 20% 0%, rgba(255, 255, 255, 0.12), transparent 42%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.075), rgba(233, 18, 42, 0.09)),
        rgba(16, 17, 21, 0.78);
    color: #fff;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 14px 28px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    transition: transform 180ms ease, border-color 180ms ease, background 180ms ease;
}

.locale-current svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    opacity: 0.82;
}

.locale-current:hover,
.locale-switcher.is-open .locale-current {
    transform: translateY(-2px);
    border-color: rgba(255, 65, 88, 0.55);
    background:
        radial-gradient(circle at 20% 0%, rgba(255, 255, 255, 0.16), transparent 46%),
        linear-gradient(135deg, rgba(233, 18, 42, 0.22), rgba(255, 255, 255, 0.05)),
        rgba(18, 18, 23, 0.9);
}

.locale-menu {
    position: absolute;
    top: calc(100% + 9px);
    right: 0;
    width: 190px;
    max-height: min(520px, calc(100vh - 112px));
    display: grid;
    gap: 6px;
    padding: 8px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 16px;
    background:
        radial-gradient(circle at 20% 0%, rgba(233, 18, 42, 0.2), transparent 46%),
        linear-gradient(145deg, rgba(43, 44, 51, 0.98), rgba(11, 12, 16, 0.98));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 24px 60px rgba(0, 0, 0, 0.42);
    opacity: 0;
    pointer-events: none;
    transform: translateY(-6px) scale(0.98);
    transform-origin: top right;
    transition: opacity 160ms ease, transform 160ms ease;
}

.locale-menu::-webkit-scrollbar {
    width: 8px;
}

.locale-menu::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.035);
    border-radius: 999px;
}

.locale-menu::-webkit-scrollbar-thumb {
    border: 2px solid rgba(17, 18, 22, 0.96);
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(255, 75, 96, 0.72), rgba(117, 21, 35, 0.82));
}

.locale-menu::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, rgba(255, 104, 122, 0.9), rgba(150, 27, 44, 0.92));
}

.locale-switcher.is-open .locale-menu {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0) scale(1);
}

.locale-menu a,
.locale-menu button {
    min-height: 42px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid transparent;
    border-radius: 12px;
    padding: 0 10px;
    background: transparent;
    color: rgba(238, 241, 247, 0.74);
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

.locale-menu a::after {
    content: none;
}

.locale-menu a strong,
.locale-menu button strong {
    width: 34px;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    padding: 4px 0;
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    font-size: 11px;
    text-transform: uppercase;
}

.locale-menu a span,
.locale-menu button span {
    font-size: 13px;
    font-weight: 800;
}

.locale-menu a:hover,
.locale-menu a.is-active,
.locale-menu a[aria-current="true"],
.locale-menu button:hover,
.locale-menu button.is-active {
    border-color: rgba(255, 54, 78, 0.34);
    background:
        linear-gradient(135deg, rgba(233, 18, 42, 0.22), rgba(255, 255, 255, 0.035)),
        rgba(255, 255, 255, 0.045);
    color: #fff;
}

.locale-switcher-nav {
    display: none;
}

@media (max-width: 1260px) {
    .cfx-auth-header span {
        display: none;
    }

    .cfx-auth-header {
        width: 38px;
        padding: 0;
    }

    .social-links .social-link:nth-child(n + 3) {
        display: none;
    }
}

@media (max-width: 760px) {
    .nav .locale-switcher-nav {
        display: block;
    }

    .nav .locale-current {
        width: 100%;
        justify-content: space-between;
        padding: 0 14px;
    }

    .nav .locale-menu a {
        justify-content: flex-start;
    }

    .nav .locale-menu {
        position: static;
        width: 100%;
        max-height: min(360px, calc(100vh - 220px));
        display: none;
        margin-top: 8px;
        opacity: 1;
        pointer-events: auto;
        transform: none;
    }

    .nav .locale-switcher.is-open .locale-menu {
        display: grid;
    }
}

/* Support modal */
.support-modal {
    position: fixed;
    inset: 0;
    z-index: 120;
    display: grid;
    place-items: center;
    padding: 24px;
    background:
        radial-gradient(circle at 50% 28%, rgba(229, 18, 42, 0.16), transparent 36%),
        rgba(2, 3, 6, 0.72);
    backdrop-filter: blur(14px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 160ms ease;
}

.support-modal.is-open {
    opacity: 1;
    pointer-events: auto;
}

body.support-modal-open {
    overflow: hidden;
}

.scroll-top {
    position: fixed;
    right: clamp(28px, 3vw, 58px);
    bottom: 58px;
    z-index: 95;
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border: 0;
    color: rgba(255, 49, 76, 0.74);
    background: transparent;
    box-shadow: none;
    opacity: 0;
    pointer-events: none;
    transform: translateY(12px) scale(0.94);
    transition: opacity 160ms ease, transform 160ms ease, color 160ms ease, filter 160ms ease;
    cursor: pointer;
}

.scroll-top.is-visible {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0) scale(1);
}

.scroll-top:hover {
    color: #ff314c;
    transform: translateY(-2px) scale(1.05);
    filter:
        drop-shadow(0 0 12px rgba(255, 49, 76, 0.38))
        drop-shadow(0 12px 24px rgba(0, 0, 0, 0.3));
}

.scroll-top:active {
    transform: translateY(0) scale(0.98);
}

.scroll-top svg {
    width: 40px;
    height: 42px;
    fill: none;
    stroke: currentColor;
    stroke-width: 3.2;
    stroke-linecap: round;
    stroke-linejoin: miter;
    stroke-miterlimit: 10;
    filter: drop-shadow(0 0 8px rgba(255, 49, 76, 0.2));
}

.scroll-top.is-visible svg {
    animation: scrollTopFloat 2.4s ease-in-out infinite;
}

.scroll-top.is-launching {
    opacity: 1;
    pointer-events: none;
    animation: scrollTopLaunch 580ms cubic-bezier(0.72, 0, 1, 0.38) forwards;
}

.scroll-top.is-launching svg {
    animation: scrollTopArrowLaunch 580ms cubic-bezier(0.72, 0, 1, 0.38) forwards;
}

@keyframes scrollTopFloat {
    0%,
    100% {
        transform: translateY(0);
        filter: drop-shadow(0 0 8px rgba(255, 49, 76, 0.2));
    }

    50% {
        transform: translateY(-7px);
        filter:
            drop-shadow(0 0 13px rgba(255, 49, 76, 0.32))
            drop-shadow(0 10px 18px rgba(0, 0, 0, 0.26));
    }
}

@keyframes scrollTopLaunch {
    0% {
        opacity: 1;
        transform: translateY(0) scale(1);
        filter: drop-shadow(0 0 10px rgba(255, 49, 76, 0.22));
    }

    34% {
        opacity: 1;
        transform: translateY(-10px) scale(1.04);
        filter:
            drop-shadow(0 0 16px rgba(255, 49, 76, 0.36))
            drop-shadow(0 12px 22px rgba(0, 0, 0, 0.25));
    }

    66% {
        opacity: 1;
        transform: translateY(-62px) scale(1.1);
        filter:
            drop-shadow(0 0 18px rgba(255, 49, 76, 0.42))
            drop-shadow(0 16px 26px rgba(0, 0, 0, 0.28));
    }

    100% {
        opacity: 0;
        transform: translateY(calc(-100vh - 140px)) scale(0.7);
        filter: drop-shadow(0 0 6px rgba(255, 49, 76, 0.08));
    }
}

@keyframes scrollTopArrowLaunch {
    0% {
        transform: translateY(0);
    }

    34% {
        transform: translateY(-4px);
    }

    66% {
        transform: translateY(-18px);
    }

    100% {
        transform: translateY(-48px);
    }
}

body.cart-open .scroll-top,
body.support-modal-open .scroll-top {
    opacity: 0;
    pointer-events: none;
    transform: translateY(12px) scale(0.94);
}

@media (max-width: 760px) {
    .scroll-top {
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    .scroll-top svg {
        animation: none !important;
    }
}

.support-dialog {
    position: relative;
    width: min(860px, calc(100vw - 32px));
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 26px;
    padding: 24px;
    background:
        linear-gradient(135deg, rgba(45, 48, 55, 0.94), rgba(22, 23, 28, 0.96) 52%, rgba(52, 10, 18, 0.92)),
        rgba(12, 13, 16, 0.96);
    box-shadow:
        0 34px 90px rgba(0, 0, 0, 0.52),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    transform: translateY(10px) scale(0.985);
    transition: transform 180ms ease;
}

.support-modal.is-open .support-dialog {
    transform: translateY(0) scale(1);
}

.support-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 14px;
    color: #fff;
    background: rgba(255, 255, 255, 0.06);
    cursor: pointer;
}

.support-close span {
    position: absolute;
    width: 15px;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
    transform: rotate(45deg);
}

.support-close span+span {
    transform: rotate(-45deg);
}

.support-modal-head {
    max-width: 650px;
    margin: 0 48px 18px 0;
}

.support-modal-head small {
    display: inline-flex;
    margin-bottom: 8px;
    color: #ff3952;
    font-size: 12px;
    font-weight: 950;
    text-transform: uppercase;
}

.support-modal-head h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(30px, 4vw, 54px);
    line-height: 0.98;
    letter-spacing: 0;
}

.support-modal-head p {
    max-width: 620px;
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 16px;
    line-height: 1.6;
}

.support-options {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.support-option {
    min-height: 168px;
    display: grid;
    grid-template-columns: 52px 1fr;
    gap: 13px;
    align-items: start;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 20px;
    padding: 16px;
    color: #fff;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.02)),
        rgba(7, 8, 12, 0.72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    font: inherit;
    transition:
        transform 160ms ease,
        border-color 160ms ease,
        background 160ms ease;
}

.support-option:hover,
.support-option:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(255, 57, 82, 0.55);
    background:
        linear-gradient(145deg, rgba(255, 57, 82, 0.14), rgba(255, 255, 255, 0.035)),
        rgba(8, 9, 13, 0.84);
    outline: none;
}

.support-option-primary {
    border-color: rgba(255, 57, 82, 0.36);
}

.support-option-icon {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 16px;
    color: #fff;
    background: linear-gradient(180deg, rgba(255, 57, 82, 0.28), rgba(255, 255, 255, 0.06));
}

.support-option-icon svg {
    width: 25px;
    height: 25px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.support-option strong,
.support-option em,
.support-option b {
    display: block;
}

.support-option strong {
    color: #fff;
    font-size: 20px;
    line-height: 1.05;
}

.support-option em {
    margin-top: 8px;
    color: var(--muted);
    font-size: 13px;
    font-style: normal;
    line-height: 1.45;
}

.support-option b {
    margin-top: 12px;
    color: #fff;
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}

.nav-support-link {
    display: none;
    min-height: 38px;
    align-items: center;
    justify-content: space-between;
    border: 1px solid rgba(255, 57, 82, 0.28);
    border-radius: 12px;
    padding: 0 14px;
    color: #fff;
    background: linear-gradient(180deg, rgba(229, 18, 42, 0.26), rgba(255, 255, 255, 0.045));
    font: inherit;
    font-weight: 850;
    cursor: pointer;
}

@media (max-width: 760px) {
    .nav .nav-support-link {
        display: flex;
    }

    .support-modal {
        padding: 14px;
    }

    .support-dialog {
        width: min(100%, 440px);
        padding: 18px;
        border-radius: 22px;
    }

    .support-modal-head {
        margin-right: 42px;
    }

    .support-options {
        grid-template-columns: 1fr;
    }

    .support-option {
        min-height: 132px;
    }
}

/* Checkout drawer for static preview and the empty live basket state. */
body.cart-open {
    overflow: hidden;
}

.nav-cart.has-items {
    border-color: rgba(255, 49, 76, 0.72) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 0 26px rgba(255, 49, 76, 0.18);
}

.cart-drawer[hidden] {
    display: none;
}

.cart-drawer {
    position: fixed;
    inset: 0;
    z-index: 120;
    display: grid;
    justify-items: end;
    pointer-events: auto;
}

.cart-backdrop {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(720px 360px at 72% 18%, rgba(255, 49, 76, 0.16), transparent 70%),
        rgba(3, 4, 7, 0.62);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

.cart-panel {
    position: relative;
    width: min(460px, calc(100vw - 18px));
    height: 100dvh;
    min-height: 100dvh;
    max-height: 100dvh;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto auto auto auto auto;
    gap: 14px;
    padding: 24px;
    overflow: hidden;
    border-left: 1px solid rgba(255, 49, 76, 0.34);
    background:
        radial-gradient(320px 220px at 0% 8%, rgba(255, 49, 76, 0.16), transparent 70%),
        linear-gradient(145deg, rgba(40, 42, 49, 0.96), rgba(9, 10, 14, 0.98) 62%, rgba(28, 7, 12, 0.98));
    box-shadow:
        -28px 0 80px rgba(0, 0, 0, 0.46),
        inset 1px 0 0 rgba(255, 255, 255, 0.08);
    animation: cartPanelIn 220ms cubic-bezier(0.2, 0.7, 0.2, 1);
}

@keyframes cartPanelIn {
    from {
        transform: translateX(34px);
        opacity: 0;
    }
}

.cart-head {
    position: relative;
    padding-right: 44px;
}

.cart-kicker {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 12px;
    border: 1px solid rgba(255, 49, 76, 0.44);
    border-radius: 999px;
    color: #ff3a53;
    background: rgba(255, 49, 76, 0.1);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}

.cart-head h2 {
    margin: 14px 0 8px;
    color: #fff;
    font-size: clamp(34px, 6vw, 54px);
    line-height: 0.92;
}

.cart-head p,
.cart-note {
    margin: 0;
    color: rgba(213, 219, 229, 0.76);
    line-height: 1.55;
}

.cart-close {
    position: absolute;
    top: 0;
    right: 0;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 10px;
    color: #fff;
    background: rgba(255, 255, 255, 0.06);
    cursor: pointer;
}

.cart-close::before,
.cart-close::after,
.cart-remove::before,
.cart-remove::after {
    content: "";
    grid-area: 1 / 1;
    width: 14px;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
}

.cart-close::before,
.cart-remove::before {
    transform: rotate(45deg);
}

.cart-close::after,
.cart-remove::after {
    transform: rotate(-45deg);
}

.cart-items {
    display: grid;
    align-content: start;
    gap: 10px;
    min-height: 0;
    overflow: auto;
    padding-right: 4px;
    overscroll-behavior: contain;
}

.cart-items::-webkit-scrollbar {
    width: 6px;
}

.cart-items::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.04);
    border-radius: 999px;
}

.cart-items::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(255, 49, 76, 0.78), rgba(255, 255, 255, 0.2));
}

.cart-item,
.cart-empty,
.cart-summary,
.cart-trust {
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 14px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.018)),
        rgba(6, 7, 10, 0.48);
}

.cart-item {
    position: relative;
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 10px 40px 10px 10px;
}

.cart-item-media {
    width: 76px;
    height: 64px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.11);
    background-size: cover;
    background-position: center;
}

.cart-item-media.visual-a,
.cart-item-media.visual-b,
.cart-item-media.visual-e,
.cart-item-media.visual-f {
    background-image:
        linear-gradient(180deg, rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.54)),
        var(--hero-image, none);
}

.cart-item-media.visual-a {
    background-position: 76% 40%;
}

.cart-item-media.visual-b {
    background-position: 60% 54%;
}

.cart-item-media.visual-e {
    background-position: 36% 48%;
}

.cart-item-media.visual-f {
    background-position: 22% 62%;
}

.roadmap-card>span {
    width: fit-content !important;
    max-width: 100%;
    align-self: flex-start;
    min-height: 30px !important;
    padding: 0 13px !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.035)),
        rgba(255, 255, 255, 0.035) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
    white-space: nowrap;
}

.roadmap-card-featured>span {
    border-color: rgba(255, 49, 76, 0.34) !important;
    background:
        linear-gradient(180deg, rgba(255, 49, 76, 0.14), rgba(255, 255, 255, 0.035)),
        rgba(255, 255, 255, 0.035) !important;
}

.upcoming-copy>.section-kicker,
.next-drop-hub-card>.section-kicker,
.release-board-grid span {
    width: fit-content !important;
    max-width: 100%;
    justify-self: start;
    align-self: start;
    min-height: 28px !important;
    padding-inline: 12px !important;
    white-space: nowrap;
}

.cart-item-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.cart-item-copy small,
.cart-item-copy em {
    color: rgba(194, 203, 217, 0.72);
    font-size: 12px;
    font-style: normal;
}

.cart-item-copy small {
    color: #ff3a53;
    font-weight: 950;
    text-transform: uppercase;
}

.cart-item-copy strong {
    overflow: hidden;
    color: #fff;
    font-size: 16px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.cart-qty {
    display: inline-grid;
    grid-template-columns: 28px 28px 28px;
    align-items: center;
    justify-items: center;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.04);
    overflow: hidden;
}

.cart-qty button,
.cart-remove {
    border: 0;
    color: #fff;
    background: transparent;
    cursor: pointer;
}

.cart-qty button {
    width: 28px;
    height: 28px;
}

.cart-qty b {
    font-size: 12px;
}

.cart-remove {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.06);
}

.cart-empty {
    display: grid;
    gap: 10px;
    place-items: start;
    padding: 18px;
}

.cart-empty strong {
    color: #fff;
    font-size: 20px;
}

.cart-empty span {
    color: rgba(213, 219, 229, 0.74);
}

.cart-summary {
    display: grid;
    gap: 8px;
    padding: 14px;
}

.cart-summary span,
.cart-summary strong {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    color: rgba(213, 219, 229, 0.78);
}

.cart-summary strong {
    color: #fff;
    font-size: 22px;
}

.cart-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px;
}

.cart-trust span {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 999px;
    padding: 0 10px;
    color: rgba(238, 241, 247, 0.82);
    background: rgba(255, 255, 255, 0.045);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}

.cart-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

.cart-actions .btn {
    width: 100%;
    justify-content: center;
}

.product-bottom {
    gap: 10px !important;
    align-items: center !important;
}

.product-bottom strong {
    margin-right: auto;
}

.product-bottom .btn {
    position: relative;
    min-height: 38px !important;
    border-radius: 11px !important;
    padding: 0 13px !important;
    gap: 8px;
    overflow: hidden;
    font-size: 12px !important;
    letter-spacing: 0.01em;
    isolation: isolate;
}

.product-bottom .btn::before {
    content: "";
    position: absolute;
    inset: 1px;
    z-index: -1;
    border-radius: inherit;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.015)),
        rgba(12, 13, 18, 0.72);
    opacity: 1;
}

.product-bottom .btn::after {
    content: "";
    width: 7px;
    height: 7px;
    flex: 0 0 auto;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
    opacity: 0.82;
    transition: transform 160ms ease, opacity 160ms ease;
}

.product-bottom .btn:hover::after {
    transform: translateX(2px) rotate(45deg);
    opacity: 1;
}

.product-bottom .btn:not(.btn-cart-add) {
    min-width: 92px;
    border-color: rgba(255, 255, 255, 0.16) !important;
    color: rgba(255, 255, 255, 0.9) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.025)),
        rgba(255, 255, 255, 0.035) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 12px 26px rgba(0, 0, 0, 0.2) !important;
}

.product-bottom .btn:not(.btn-cart-add):hover {
    border-color: rgba(255, 255, 255, 0.28) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.105), rgba(255, 255, 255, 0.035)),
        rgba(255, 255, 255, 0.045) !important;
}

.product-bottom .btn-cart-add {
    min-width: 80px;
    border-color: rgba(255, 49, 76, 0.62) !important;
    color: #fff !important;
    background:
        radial-gradient(54px 32px at 28% 18%, rgba(255, 255, 255, 0.2), transparent 68%),
        linear-gradient(135deg, rgba(255, 49, 76, 0.95), rgba(137, 12, 27, 0.9)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.22),
        0 14px 28px rgba(255, 49, 76, 0.2) !important;
}

.product-bottom .btn-cart-add::before {
    content: "+";
    position: static;
    z-index: 0;
    width: 18px;
    height: 18px;
    display: inline-grid;
    place-items: center;
    border-radius: 6px;
    color: #fff;
    background: rgba(255, 255, 255, 0.13);
    font-size: 14px;
    line-height: 1;
    opacity: 1;
}

.product-bottom .btn-cart-add:hover {
    transform: translateY(-1px);
    border-color: rgba(255, 82, 103, 0.84) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.28),
        0 18px 36px rgba(255, 49, 76, 0.28) !important;
}

@media (max-width: 520px) {
    .product-bottom {
        grid-template-columns: 1fr 1fr;
    }

    .product-bottom strong {
        grid-column: 1 / -1;
    }

    .product-bottom .btn {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 560px) {
    .cart-panel {
        width: 100vw;
        padding: 18px;
    }

    .cart-item {
        grid-template-columns: 64px minmax(0, 1fr);
    }

    .cart-qty {
        grid-column: 2;
        justify-self: start;
    }

    .cart-item-media {
        width: 64px;
        height: 58px;
    }
}

/* Universal script product page */
.script-product-page {
    --script-max: var(--max);
    --script-surface: linear-gradient(135deg, rgba(42, 45, 54, 0.92), rgba(15, 16, 22, 0.94) 52%, rgba(46, 13, 23, 0.78));
    position: relative;
    isolation: isolate;
    padding: clamp(42px, 6vw, 78px) 22px 110px;
}

.script-product-page::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        radial-gradient(circle at 78% 18%, rgba(226, 18, 58, 0.2), transparent 34%),
        linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px);
    background-size: auto, 96px 96px, 96px 96px;
    opacity: 0.55;
}

.script-hero,
.script-section,
.script-trust-bar,
.script-statement,
.script-mechanism,
.script-final-cta {
    width: min(100%, var(--script-max));
    margin-inline: auto;
}

.script-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.18fr) minmax(360px, 0.82fr);
    gap: 24px;
    align-items: stretch;
}

.script-hero-media,
.script-offer,
.script-section,
.script-statement,
.script-mechanism,
.script-final-cta,
.sticky-purchase-bar {
    border: 1px solid rgba(255, 255, 255, 0.11);
    background: var(--script-surface);
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.38);
    border-radius: 24px;
}

.script-hero-media,
.script-offer {
    padding: clamp(18px, 2vw, 26px);
}

.script-screen {
    position: relative;
    overflow: hidden;
    min-height: 390px;
    border-radius: 20px;
    background: #05060a;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.script-screen .product-visual {
    width: 100%;
    height: 100%;
    min-height: inherit;
}

.script-play {
    position: absolute;
    left: 50%;
    top: 50%;
    translate: -50% -50%;
    border: 0;
    border-radius: 999px;
    padding: 14px 20px;
    color: #fff;
    background: linear-gradient(135deg, #e2123a, #ff3152);
    font: inherit;
    font-weight: 900;
    cursor: pointer;
    box-shadow: 0 16px 48px rgba(226, 18, 58, 0.38);
}

.script-media-rail {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-top: 14px;
}

.script-media-rail button {
    display: grid;
    gap: 8px;
    padding: 10px;
    color: #fff;
    text-align: left;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.045);
    cursor: pointer;
}

.script-media-rail button.is-active {
    border-color: rgba(255, 49, 82, 0.75);
    background: rgba(226, 18, 58, 0.16);
}

.script-media-rail .product-visual {
    height: 76px;
    border-radius: 12px;
}

.script-offer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 18px;
}

.script-offer h1,
.script-offer h2,
.script-section h2,
.script-statement h2,
.script-mechanism h2,
.script-final-cta h2 {
    margin: 0;
    color: #fff;
    letter-spacing: 0;
}

.script-offer h1 {
    font-size: clamp(44px, 6vw, 78px);
    line-height: 0.9;
}

.script-offer h2 {
    font-size: clamp(24px, 2.5vw, 36px);
    line-height: 1.04;
}

.script-offer p,
.script-section p,
.script-statement p,
.script-mechanism p,
.script-final-cta p {
    color: rgba(235, 238, 246, 0.72);
    line-height: 1.58;
}

.script-trust-mini,
.script-trust-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.script-trust-mini span,
.script-trust-bar span {
    border-radius: 999px;
    padding: 9px 12px;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    color: #f8f8fa;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.script-trust-bar {
    justify-content: center;
    margin-top: 16px;
    padding: 14px;
    border-radius: 18px;
    background: rgba(18, 20, 28, 0.72);
}

.script-section,
.script-statement,
.script-mechanism,
.script-final-cta {
    margin-top: clamp(28px, 4vw, 52px);
    padding: clamp(26px, 4vw, 48px);
}

.script-statement,
.script-mechanism,
.script-final-cta {
    text-align: center;
}

.section-head.compact {
    max-width: 760px;
    margin-inline: auto;
    text-align: center;
}

.script-card-grid {
    display: grid;
    gap: 16px;
    margin-top: 24px;
}

.script-card-grid.two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.script-card-grid.three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.script-card-grid.four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.script-card-grid article,
.script-loop article,
.script-pricing article,
.script-compare div,
.script-design-table div {
    border-radius: 18px;
    padding: 20px;
    background: linear-gradient(145deg, rgba(45, 48, 58, 0.9), rgba(13, 14, 20, 0.94));
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.script-card-grid article>span,
.script-loop article>span,
.script-pricing article>span {
    display: inline-flex;
    width: fit-content;
    max-width: 100%;
    margin-bottom: 12px;
    border-radius: 999px;
    padding: 7px 10px;
    color: #fff;
    background: rgba(226, 18, 58, 0.28);
    border: 1px solid rgba(255, 49, 82, 0.45);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.script-card-grid h3,
.script-loop h3,
.script-pricing h3 {
    margin: 0 0 8px;
    color: #fff;
    font-size: 21px;
}

.script-card-grid p,
.script-loop p,
.script-pricing p {
    margin: 0;
}

.script-compare,
.script-design-table {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 22px;
}

.script-compare div,
.script-design-table div {
    display: grid;
    gap: 8px;
}

.script-compare b,
.script-design-table b {
    color: #ff4968;
    text-transform: uppercase;
    font-size: 12px;
}

.script-compare span,
.script-design-table span {
    color: rgba(245, 246, 250, 0.82);
}

.script-loop {
    display: grid;
    grid-template-columns: repeat(5, minmax(190px, 1fr));
    gap: 14px;
    margin-top: 24px;
    overflow-x: auto;
    padding-bottom: 10px;
}

.script-loop article {
    position: relative;
    min-width: 190px;
}

.script-loop article:not(:last-child)::after {
    content: "";
    position: absolute;
    right: -14px;
    top: 36px;
    width: 14px;
    height: 2px;
    background: #e2123a;
}

.script-check-list {
    display: grid;
    gap: 10px;
    margin: 16px 0 0;
    padding: 0;
    list-style: none;
}

.script-check-list li {
    color: rgba(245, 246, 250, 0.78);
}

.script-check-list li::before {
    content: "";
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-right: 10px;
    border-radius: 999px;
    background: #ff3152;
}

.script-check-list.muted li::before {
    background: rgba(255, 255, 255, 0.32);
}

.custom-ui-upsell {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
    gap: 22px;
    align-items: center;
}

.script-pricing {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-top: 24px;
}

.script-pricing article {
    display: grid;
    align-content: start;
    gap: 14px;
}

.script-pricing article.is-featured {
    border-color: rgba(255, 49, 82, 0.7);
    box-shadow: 0 20px 58px rgba(226, 18, 58, 0.18);
}

.script-pricing strong {
    color: #fff;
    font-size: 36px;
}

.script-faq .section-head {
    text-align: center;
}

.script-final-cta {
    margin-bottom: 80px;
}

.sticky-purchase-bar {
    position: sticky;
    z-index: 20;
    bottom: 16px;
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr) auto auto;
    gap: 14px;
    align-items: center;
    max-width: 760px;
    margin: 32px auto 0;
    padding: 12px;
}

.sticky-purchase-bar .product-visual {
    width: 56px;
    height: 46px;
    border-radius: 12px;
}

.sticky-purchase-bar b,
.sticky-purchase-bar strong {
    color: #fff;
}

@media (max-width: 980px) {

    .script-hero,
    .custom-ui-upsell,
    .script-card-grid.two,
    .script-card-grid.three,
    .script-card-grid.four,
    .script-pricing,
    .script-compare,
    .script-design-table {
        grid-template-columns: 1fr;
    }

    .script-screen {
        min-height: 270px;
    }
}

@media (max-width: 640px) {
    .script-product-page {
        padding-inline: 14px;
    }

    .script-media-rail {
        grid-template-columns: 1fr;
    }

    .sticky-purchase-bar {
        grid-template-columns: 44px 1fr auto;
    }

    .sticky-purchase-bar strong {
        display: none;
    }
}

/* Universal clothing product page */
.clothing-product-page {
    --script-max: var(--max);
    position: relative;
    isolation: isolate;
    padding: clamp(34px, 5vw, 64px) 22px 110px;
}

.clothing-product-page::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        radial-gradient(circle at 18% 16%, rgba(255, 255, 255, 0.07), transparent 30%),
        radial-gradient(circle at 84% 22%, rgba(226, 18, 58, 0.18), transparent 34%),
        linear-gradient(90deg, rgba(255, 255, 255, 0.022) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px);
    background-size: auto, auto, 88px 88px, 88px 88px;
    opacity: 0.62;
}

.clothing-breadcrumb,
.clothing-hero,
.clothing-section {
    width: min(100%, var(--script-max));
    margin-inline: auto;
}

.clothing-breadcrumb {
    margin-bottom: 18px;
}

.clothing-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(360px, 0.95fr);
    gap: 24px;
    align-items: stretch;
}

.clothing-lookbook-hero,
.clothing-offer,
.clothing-section {
    border-radius: 24px;
    border: 1px solid rgba(255, 255, 255, 0.11);
    background: linear-gradient(135deg, rgba(44, 47, 57, 0.9), rgba(14, 15, 21, 0.94) 58%, rgba(48, 13, 24, 0.72));
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.38);
}

.clothing-lookbook-hero,
.clothing-offer,
.clothing-section {
    padding: clamp(22px, 3vw, 38px);
}

.clothing-offer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 18px;
}

.clothing-offer h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(38px, 5vw, 68px);
    line-height: 0.95;
    letter-spacing: 0;
}

.clothing-offer p,
.clothing-section p {
    color: rgba(235, 238, 246, 0.74);
    line-height: 1.58;
}

.lookbook-frame {
    position: relative;
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(0, 0, 0, 0.45);
}

.lookbook-frame.is-large {
    min-height: 440px;
}

.lookbook-frame .product-visual {
    width: 100%;
    height: 100%;
    min-height: inherit;
}

.lookbook-strip {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-top: 14px;
}

.lookbook-strip button {
    display: grid;
    gap: 8px;
    padding: 10px;
    text-align: left;
    color: #fff;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.045);
    cursor: pointer;
}

.lookbook-strip button.is-active {
    border-color: rgba(255, 49, 82, 0.75);
    background: rgba(226, 18, 58, 0.16);
}

.lookbook-strip .product-visual {
    height: 76px;
    border-radius: 12px;
}

.clothing-section {
    margin-top: clamp(28px, 4vw, 52px);
}

.collection-story {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(280px, 0.9fr);
    gap: 22px;
    align-items: center;
}

.lookbook-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-top: 24px;
}

.lookbook-grid article {
    overflow: hidden;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: linear-gradient(145deg, rgba(45, 48, 58, 0.9), rgba(13, 14, 20, 0.94));
}

.lookbook-grid .product-visual {
    height: 230px;
}

.lookbook-grid h3,
.lookbook-grid p {
    margin-left: 18px;
    margin-right: 18px;
}

.lookbook-grid h3 {
    color: #fff;
    margin-top: 18px;
    margin-bottom: 8px;
}

.lookbook-grid p {
    margin-bottom: 20px;
}

.collection-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-top: 24px;
}

.collection-stats span {
    display: grid;
    gap: 4px;
    padding: 18px;
    border-radius: 18px;
    color: rgba(245, 246, 250, 0.76);
    background: rgba(255, 255, 255, 0.055);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.collection-stats strong {
    color: #fff;
    font-size: 34px;
    line-height: 1;
}

.clothing-table {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 980px) {

    .clothing-hero,
    .collection-story,
    .lookbook-grid,
    .collection-stats,
    .clothing-table {
        grid-template-columns: 1fr;
    }

    .lookbook-frame.is-large {
        min-height: 300px;
    }
}

@media (max-width: 640px) {
    .clothing-product-page {
        padding-inline: 14px;
    }

    .lookbook-strip {
        grid-template-columns: 1fr;
    }
}

/* Product-type page repair: isolate script/clothing layouts from older global product visuals. */
.script-product-page .product-visual,
.clothing-product-page .product-visual {
    position: relative;
    inset: auto;
    display: block;
    width: 100%;
    min-height: 0;
    overflow: hidden;
    border-radius: inherit;
}

.script-product-page .script-screen .product-visual,
.clothing-product-page .lookbook-frame .product-visual {
    position: absolute;
    inset: 0;
    height: 100%;
    min-height: 0;
    border-radius: inherit;
}

.script-product-page .script-media-rail .product-visual,
.clothing-product-page .lookbook-strip .product-visual {
    position: relative !important;
    inset: auto !important;
    height: 76px !important;
    min-height: 76px !important;
    border-radius: 12px;
}

.clothing-product-page .lookbook-grid .product-visual {
    position: relative !important;
    inset: auto !important;
    height: 230px !important;
    min-height: 230px !important;
    border-radius: 0;
}

.script-product-page .sticky-purchase-bar .product-visual,
.clothing-product-page .sticky-purchase-bar .product-visual {
    position: relative !important;
    inset: auto !important;
    width: 56px !important;
    height: 46px !important;
    min-height: 46px !important;
    border-radius: 12px;
}

.script-product-page .script-hero,
.clothing-product-page .clothing-hero {
    align-items: start;
}

.script-product-page .script-screen {
    min-height: clamp(300px, 31vw, 390px);
}

.script-product-page .script-offer,
.clothing-product-page .clothing-offer {
    gap: 14px;
    justify-content: start;
}

.script-product-page .script-offer h1 {
    font-size: clamp(38px, 4.8vw, 58px);
    line-height: 0.94;
}

.script-product-page .script-offer h2 {
    font-size: clamp(22px, 2vw, 28px);
    line-height: 1.1;
}

.clothing-product-page .clothing-offer h1 {
    font-size: clamp(36px, 4.4vw, 56px);
    line-height: 0.98;
}

.script-product-page .script-offer p,
.clothing-product-page .clothing-offer p {
    margin: 0;
}

.script-product-page .hero-actions,
.clothing-product-page .hero-actions {
    gap: 10px;
}

.script-product-page .hero-actions .btn,
.clothing-product-page .hero-actions .btn {
    min-height: 46px;
}

.script-product-page .script-hero-media,
.script-product-page .script-offer,
.clothing-product-page .clothing-lookbook-hero,
.clothing-product-page .clothing-offer {
    min-height: 0;
    height: auto;
}

.script-product-page .section-head,
.clothing-product-page .section-head {
    width: auto;
    margin: 0;
    padding: 0;
    text-align: left;
}

.script-product-page .section-head.compact,
.clothing-product-page .section-head.compact {
    max-width: 760px;
    margin-inline: auto;
    text-align: center;
}

.script-product-page .section-head p,
.clothing-product-page .section-head p {
    max-width: 760px;
    margin: 10px auto 0;
}

.script-product-page .section-head:not(.compact) p,
.clothing-product-page .section-head:not(.compact) p {
    margin-inline: 0;
}

.script-product-page .script-trust-bar,
.clothing-product-page .script-trust-bar {
    width: min(100%, var(--script-max));
    margin: 16px auto 0;
}

.script-product-page .faq-section,
.clothing-product-page .faq-section {
    display: block !important;
    width: min(100%, var(--script-max)) !important;
    margin: clamp(28px, 4vw, 52px) auto 0 !important;
    padding: clamp(26px, 4vw, 48px) !important;
    border-radius: 24px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: linear-gradient(135deg, rgba(36, 39, 48, 0.9), rgba(11, 12, 17, 0.94) 58%, rgba(44, 10, 20, 0.68));
}

.script-product-page .faq-section .section-head,
.clothing-product-page .faq-section .section-head {
    display: grid !important;
    justify-items: center;
    text-align: center !important;
    margin: 0 auto 26px !important;
    max-width: 780px;
}

.script-product-page .faq-section .section-head h2,
.clothing-product-page .faq-section .section-head h2 {
    margin: 0;
}

.script-product-page .faq-section .section-head p,
.clothing-product-page .faq-section .section-head p {
    margin: 10px auto 0 !important;
}

.script-product-page .faq-section .faq-list,
.clothing-product-page .faq-section .faq-list {
    max-width: 860px;
    margin: 0 auto;
}

.script-product-page .script-final-cta,
.clothing-product-page .script-final-cta {
    display: grid;
    justify-items: center;
    gap: 14px;
    text-align: center;
    overflow: hidden;
}

.script-product-page .script-final-cta .hero-actions,
.clothing-product-page .script-final-cta .hero-actions {
    justify-content: center;
    margin-top: 8px;
}

.script-product-page .script-final-cta .btn,
.clothing-product-page .script-final-cta .btn {
    position: relative;
    z-index: 2;
}

.script-product-page .script-card-grid article,
.script-product-page .script-loop article,
.script-product-page .script-pricing article,
.script-product-page .script-compare div,
.script-product-page .script-design-table div,
.clothing-product-page .script-card-grid article,
.clothing-product-page .script-pricing article,
.clothing-product-page .script-compare div,
.clothing-product-page .script-design-table div {
    min-width: 0;
}

.script-product-page .script-loop {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: minmax(190px, 224px);
}

@media (max-width: 980px) {

    .script-product-page .script-hero,
    .clothing-product-page .clothing-hero {
        grid-template-columns: 1fr;
    }
}

/* Tebex required pages: checkout, username and package options. */
.tebex-page-inner,
.tebex-form-shell {
    width: min(100% - 44px, var(--max));
    margin: 0 auto;
}

.tebex-form-shell,
.basket-page {
    display: grid;
    gap: 22px;
    padding: clamp(24px, 4vw, 42px);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 22px;
    background:
        radial-gradient(460px 220px at 0% 0%, rgba(233, 18, 42, 0.18), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.024)),
        rgba(12, 13, 18, 0.88);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 28px 80px rgba(0, 0, 0, 0.34);
}

.tebex-form-shell .page-title,
.basket-page .basket-header {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
}

.tebex-form-shell .page-title {
    align-items: start;
    flex-direction: column;
}

.tebex-form-shell .page-title h1,
.basket-page .basket-title {
    margin: 0;
    color: #fff;
    font-size: clamp(34px, 6vw, 60px);
    line-height: 0.94;
}

.tebex-form-shell .page-title p:not(.eyebrow) {
    margin: 0;
    max-width: 680px;
    color: rgba(216, 222, 233, 0.76);
    line-height: 1.55;
}

.basket-summary-pill,
.basket-page .total {
    display: grid;
    gap: 4px;
    min-width: 170px;
    justify-items: end;
    color: rgba(218, 224, 235, 0.72);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.basket-summary-pill strong,
.basket-page .total strong {
    color: #fff;
    font-size: 22px;
    text-transform: none;
}

.basket-page .basket-items {
    display: grid;
    gap: 12px;
}

.basket-page .basket-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(96px, auto) auto;
    align-items: center;
    gap: 16px;
    padding: 16px;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 16px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.064), rgba(255, 255, 255, 0.018)),
        rgba(5, 6, 10, 0.44);
}

.basket-page .title {
    margin: 0 0 8px;
    color: #fff;
    font-size: 18px;
}

.basket-page .options {
    display: grid;
    gap: 4px;
    margin: 0 0 12px;
    padding: 0;
    list-style: none;
    color: rgba(213, 219, 229, 0.72);
    font-size: 13px;
}

.basket-page .price {
    color: rgba(255, 255, 255, 0.94);
    font-weight: 900;
}

.quantity-field,
.store-form label,
.store-form .field {
    display: grid;
    gap: 8px;
}

.quantity-field span,
.store-form label span,
.store-form .field>span {
    color: rgba(213, 219, 229, 0.72);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}

.quantity-field input,
.store-form input,
.store-form select {
    min-height: 48px;
    width: 100%;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 12px;
    padding: 0 14px;
    color: #fff;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.022)),
        rgba(5, 6, 10, 0.55);
    color-scheme: dark;
}

.quantity-field input {
    max-width: 96px;
}

.store-form {
    display: grid;
    gap: 16px;
}

.store-form .field-note {
    padding: 14px;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.04);
}

.store-form .field-note p {
    margin: 0;
    color: rgba(226, 231, 240, 0.78);
}

.field-inline {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
}

.basket-checkout,
.basket-actions,
.store-form .actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.basket-actions,
.store-form .actions {
    justify-content: flex-start;
}

.basket-page .remove {
    justify-content: center;
}

@media (max-width: 760px) {

    .tebex-form-shell .page-title,
    .basket-page .basket-header,
    .basket-checkout {
        align-items: start;
        flex-direction: column;
    }

    .basket-summary-pill,
    .basket-page .total {
        justify-items: start;
    }

    .basket-page .basket-item {
        grid-template-columns: 1fr;
    }

    .quantity-field input {
        max-width: none;
    }
}

/* Tebex modules restyled in the Redactor/Mantis visual language. */
.widget,
.redactor-widget {
    width: min(100% - 44px, var(--max));
    margin: clamp(28px, 4vw, 56px) auto;
    padding: clamp(22px, 4vw, 36px);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 22px;
    color: var(--text);
    background:
        radial-gradient(420px 220px at 0% 0%, rgba(233, 18, 42, 0.16), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.078), rgba(255, 255, 255, 0.022)),
        rgba(12, 13, 18, 0.86);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.11),
        0 26px 76px rgba(0, 0, 0, 0.3);
}

.widget-head,
.widget-title {
    margin: 0;
}

.widget-head {
    display: grid;
    gap: 8px;
    margin-bottom: 20px;
}

.widget-title {
    color: #fff;
    font-size: clamp(24px, 4vw, 42px);
    line-height: 1;
}

.widget-content,
.text-content {
    color: rgba(222, 227, 237, 0.78);
    line-height: 1.6;
}

.widget .progress {
    height: 12px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.06);
}

.widget .progress-bar {
    height: 100%;
    border-radius: inherit;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.22), transparent 22%),
        linear-gradient(135deg, var(--accent), var(--red-2));
    box-shadow: 0 0 24px rgba(233, 18, 42, 0.3);
}

.widget .badge,
.badge {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    margin-left: 10px;
    padding: 0 11px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    color: #fff;
    background: rgba(255, 255, 255, 0.07);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}

.badge-success {
    border-color: rgba(84, 255, 170, 0.28);
    color: #9fffc8;
    background: rgba(84, 255, 170, 0.1);
}

.badge-danger {
    border-color: rgba(255, 49, 76, 0.36);
    color: #ff9aaa;
    background: rgba(255, 49, 76, 0.12);
}

.purchases,
.widget .purchase {
    display: grid;
    gap: 12px;
}

.widget .purchase,
.widget-top-donator .widget-content,
.widget-server-status .widget-content {
    padding: 14px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.04);
}

.widget .avatar {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    object-fit: cover;
}

.widget .username,
.widget h6 {
    margin: 0;
    color: #fff;
    font-size: 16px;
}

.widget .empty {
    margin: 0;
    color: rgba(220, 226, 236, 0.68);
}

/* Final home category polish: softer depth and cleaner section lines. */
.category-nav-section {
    isolation: isolate;
    background:
        linear-gradient(180deg, rgba(8, 9, 12, 0.88), rgba(8, 9, 12, 0.72) 42%, rgba(8, 9, 12, 0.9)),
        radial-gradient(920px 360px at 50% 28%, rgba(233, 18, 42, 0.1), transparent 72%);
}

.category-nav-section::before {
    background:
        radial-gradient(820px 260px at 50% 0%, rgba(255, 255, 255, 0.055), transparent 72%),
        linear-gradient(90deg, transparent, rgba(255, 49, 76, 0.18) 34%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 49, 76, 0.16) 66%, transparent);
    background-size: auto;
    opacity: 0.42;
}

.category-nav-section::after {
    background:
        linear-gradient(90deg, transparent 8%, rgba(255, 255, 255, 0.075) 18%, rgba(255, 49, 76, 0.24) 48%, rgba(255, 255, 255, 0.075) 82%, transparent 92%);
    box-shadow: 0 0 24px rgba(233, 18, 42, 0.12);
    opacity: 0.72;
}

.category-nav::before {
    inset: -24px;
    border-color: rgba(255, 255, 255, 0.1);
    background:
        radial-gradient(680px 180px at 18% 0%, rgba(233, 18, 42, 0.12), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.018)),
        rgba(8, 9, 13, 0.58);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 18px 54px rgba(0, 0, 0, 0.28);
}

.category-nav::after {
    top: -24px;
    left: 56px;
    right: 56px;
    background: linear-gradient(90deg, transparent, rgba(255, 49, 76, 0.38), rgba(255, 255, 255, 0.16), rgba(255, 49, 76, 0.26), transparent);
    box-shadow: 0 0 18px rgba(233, 18, 42, 0.1);
    opacity: 0.75;
}

.category-card {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.11),
        0 16px 36px rgba(0, 0, 0, 0.24),
        0 0 0 1px rgba(233, 18, 42, 0.018) !important;
}

.category-card:hover {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 20px 46px rgba(0, 0, 0, 0.3),
        0 0 24px rgba(233, 18, 42, 0.075) !important;
}

/* Final homepage cleanup: remove noisy prototype lines and unify lower-page cards. */
body::before {
    opacity: 0.12 !important;
}

body::after {
    opacity: 0.34 !important;
}

#top .home-section,
#top .category-nav-section,
#top .catalog-section,
#top .split-section,
#top .faq-section,
#top .roadmap-section,
#top .final-cta {
    background: transparent !important;
}

#top .home-section::before,
#top .catalog-section::before,
#top .split-section::before,
#top .faq-section::before,
#top .final-cta::before {
    height: 1px !important;
    background: linear-gradient(90deg, transparent 7%, rgba(255, 255, 255, 0.055) 24%, rgba(255, 49, 76, 0.12) 50%, rgba(255, 255, 255, 0.055) 76%, transparent 93%) !important;
    box-shadow: none !important;
    opacity: 0.45 !important;
}

#top .category-nav-section::before,
#top .category-nav-section::after {
    display: none !important;
}

#top .category-nav::before,
#top .product-grid::before,
#top .support-grid::before,
#top .faq-layout::before,
#top .category-nav::after,
#top .product-grid::after,
#top .support-grid::after,
#top .faq-layout::after,
#top .catalog-command::before,
#top .catalog-command::after {
    content: none !important;
    display: none !important;
}

#top .category-nav,
#top .product-grid,
#top .support-grid,
#top .faq-layout {
    isolation: auto;
}

#top .catalog-command,
#top .final-cta,
#top .decision-score,
#top .home-card,
#top .category-card,
#top .preview-card,
#top .roadmap-grid article,
#top .support-grid article,
#top .faq-list details {
    clip-path: none !important;
    border-radius: 18px !important;
    border-color: rgba(255, 255, 255, 0.13) !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.072), rgba(255, 255, 255, 0.022) 56%, rgba(233, 18, 42, 0.045)),
        rgba(14, 15, 20, 0.74) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.085),
        0 16px 38px rgba(0, 0, 0, 0.24) !important;
}

#top .home-card:hover,
#top .category-card:hover,
#top .preview-card:hover,
#top .roadmap-grid article:hover,
#top .support-grid article:hover,
#top .faq-list details[open] {
    border-color: rgba(255, 49, 76, 0.26) !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.086), rgba(255, 255, 255, 0.026) 56%, rgba(233, 18, 42, 0.062)),
        rgba(15, 16, 21, 0.82) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 20px 46px rgba(0, 0, 0, 0.28) !important;
}

#top .catalog-command,
#top .final-cta {
    border-radius: 24px !important;
    border-color: rgba(255, 49, 76, 0.24) !important;
    background:
        radial-gradient(520px 220px at 10% 0%, rgba(233, 18, 42, 0.13), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.074), rgba(255, 255, 255, 0.02)),
        rgba(11, 12, 16, 0.78) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.09),
        0 18px 48px rgba(0, 0, 0, 0.26) !important;
}

#top .catalog-section .product-grid::before,
#top .catalog-section .product-grid::after {
    content: none !important;
    display: none !important;
}

#top .catalog-command {
    overflow: visible !important;
}

#top .catalog-command .store-controls {
    gap: 18px;
}

#top .section.split-section {
    width: min(100% - 44px, var(--max)) !important;
    max-width: var(--max) !important;
    margin-inline: auto !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

#top .section.split-section .support-grid::before {
    content: none !important;
    display: none !important;
}

#top .section.split-section .support-grid article {
    min-height: 150px;
    border-radius: 16px !important;
}

#top .section.split-section .decision-score {
    border-radius: 14px !important;
}

#top .faq-layout {
    width: min(100% - 44px, var(--max));
    margin-inline: auto;
}

#top .faq-list {
    gap: 12px;
}

#top .faq-list details {
    border-radius: 14px !important;
}

#top .faq-list details::after {
    content: none !important;
}

#top .faq-list summary {
    padding-right: 174px;
}

#top .roadmap-grid article {
    min-height: 176px;
}

#top .final-cta {
    width: min(100% - 44px, var(--max));
    padding: clamp(42px, 5.6vw, 74px) clamp(24px, 6vw, 72px) !important;
}

#top .final-cta h2 {
    max-width: 860px;
}

.footer {
    background:
        radial-gradient(760px 240px at 82% 0%, rgba(233, 18, 42, 0.12), transparent 70%),
        linear-gradient(180deg, rgba(7, 8, 11, 0.96), rgba(8, 9, 12, 0.98)) !important;
}

.footer::before,
.footer::after,
.footer-shell::before,
.footer-shell::after {
    content: none !important;
    display: none !important;
}

.footer-shell {
    padding: 26px !important;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 24px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.068), rgba(255, 255, 255, 0.018)),
        rgba(12, 13, 17, 0.72);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 18px 52px rgba(0, 0, 0, 0.24);
}

.footer-brand,
.footer-status,
.footer-links {
    clip-path: none !important;
    border-radius: 16px !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    background: rgba(255, 255, 255, 0.035) !important;
    box-shadow: none !important;
}

.footer-status {
    align-content: start;
}

.footer-links a {
    justify-content: flex-start;
    gap: 10px;
    border-radius: 10px;
}

.footer-links a::after {
    margin-left: auto;
}

.footer-bottom {
    border-top-color: rgba(255, 255, 255, 0.08);
    padding-top: 16px;
}

/* Ultra soft visual pass: calmer shadows and smoother section handoffs. */
body::before {
    opacity: 0.075 !important;
}

body::after {
    background:
        linear-gradient(105deg, transparent 0 24%, rgba(255, 255, 255, 0.035) 24.2%, transparent 24.8% 66%, rgba(233, 18, 42, 0.055) 66.2%, transparent 67%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.018), transparent 42%, rgba(255, 255, 255, 0.018)) !important;
    opacity: 0.24 !important;
}

#top .home-section::before,
#top .catalog-section::before,
#top .split-section::before,
#top .faq-section::before,
#top .final-cta::before {
    background: linear-gradient(90deg, transparent 12%, rgba(255, 255, 255, 0.04) 32%, rgba(255, 49, 76, 0.075) 50%, rgba(255, 255, 255, 0.04) 68%, transparent 88%) !important;
    opacity: 0.26 !important;
}

#top .catalog-command,
#top .final-cta,
.footer-shell {
    border-color: rgba(255, 255, 255, 0.105) !important;
    background:
        radial-gradient(560px 220px at 8% 0%, rgba(233, 18, 42, 0.07), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.058), rgba(255, 255, 255, 0.016)),
        rgba(11, 12, 16, 0.7) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.065),
        0 10px 28px rgba(0, 0, 0, 0.18) !important;
}

#top .home-card,
#top .category-card,
#top .preview-card,
#top .roadmap-grid article,
#top .support-grid article,
#top .faq-list details,
#top .decision-score,
.footer-brand,
.footer-status,
.footer-links {
    border-color: rgba(255, 255, 255, 0.105) !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.058), rgba(255, 255, 255, 0.018) 58%, rgba(233, 18, 42, 0.026)),
        rgba(14, 15, 20, 0.64) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.062),
        0 8px 20px rgba(0, 0, 0, 0.145) !important;
}

#top .home-card:hover,
#top .category-card:hover,
#top .preview-card:hover,
#top .roadmap-grid article:hover,
#top .support-grid article:hover,
#top .faq-list details[open] {
    border-color: rgba(255, 255, 255, 0.16) !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.066), rgba(255, 255, 255, 0.02) 58%, rgba(233, 18, 42, 0.034)),
        rgba(15, 16, 21, 0.72) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.075),
        0 10px 24px rgba(0, 0, 0, 0.18) !important;
}

#top .catalog-command .search-wrap input,
#top .catalog-command .chip,
.footer-socials a,
.footer-pills span,
.footer-links a {
    box-shadow: none !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    background: rgba(255, 255, 255, 0.035) !important;
}

#top .btn-primary,
#top .btn-ghost,
#top .btn-outline,
.footer a {
    box-shadow: none !important;
}

#top .btn-primary {
    box-shadow: 0 8px 22px rgba(233, 18, 42, 0.18) !important;
}

#top .final-cta {
    border-color: rgba(255, 49, 76, 0.16) !important;
    background:
        radial-gradient(620px 240px at 50% 0%, rgba(233, 18, 42, 0.08), transparent 74%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.014)),
        rgba(10, 11, 15, 0.66) !important;
}

.footer {
    background:
        linear-gradient(180deg, rgba(8, 9, 12, 0), rgba(8, 9, 12, 0.9) 120px, rgba(8, 9, 12, 0.98) 100%),
        radial-gradient(660px 220px at 72% 0%, rgba(233, 18, 42, 0.06), transparent 72%) !important;
}

.footer-shell {
    margin-top: 18px;
}

.footer-bottom {
    border-top-color: rgba(255, 255, 255, 0.055) !important;
}

/* Emergency alignment fix: keep lower homepage centered and remove broken footer gaps. */
html,
body {
    max-width: 100%;
    overflow-x: hidden !important;
}

main#top,
.footer {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}

#top .roadmap-section,
#top .roadmap-section .section-head,
#top .roadmap-grid,
#top .final-cta,
.footer-shell,
.footer-bottom {
    transform: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

#top .roadmap-section {
    width: min(100% - 44px, var(--max)) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#top .roadmap-section .section-head {
    width: 100% !important;
    max-width: 760px !important;
    display: grid;
    justify-items: center;
    text-align: center;
    overflow: visible !important;
}

#top .roadmap-section .section-head p {
    max-width: 680px !important;
    margin-inline: auto !important;
}

#top .roadmap-grid {
    width: 100%;
}

#top .final-cta {
    margin-top: clamp(34px, 4.6vw, 58px) !important;
    margin-bottom: clamp(34px, 4vw, 54px) !important;
}

.footer {
    margin-top: 0 !important;
    padding: clamp(34px, 4vw, 54px) 0 28px !important;
    background:
        linear-gradient(180deg, rgba(8, 9, 12, 0.94), rgba(7, 8, 11, 0.99)) !important;
}

.footer-shell {
    width: min(100% - 44px, var(--max)) !important;
    grid-template-columns: minmax(340px, 1.3fr) repeat(3, minmax(190px, 0.58fr)) !important;
    gap: 16px !important;
    padding: 22px !important;
}

.footer-brand {
    padding: 24px !important;
}

.footer-brand p {
    max-width: 520px !important;
}

.footer-links {
    gap: 10px !important;
    padding: 20px !important;
}

.footer-links span {
    margin-bottom: 4px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.075);
}

.footer-links a {
    width: 100%;
    min-height: 38px !important;
    justify-content: space-between !important;
    border-radius: 10px !important;
    padding: 0 12px !important;
    color: rgba(226, 231, 240, 0.72) !important;
}

.footer-brand,
.footer-links {
    min-height: 0 !important;
}

.footer-bottom {
    width: min(100% - 44px, var(--max)) !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
}

@media (max-width: 1180px) {
    .footer-shell {
        grid-template-columns: minmax(0, 1.25fr) repeat(3, minmax(150px, 0.58fr)) !important;
    }
}

@media (max-width: 980px) {
    .footer-shell {
        grid-template-columns: 1fr 1fr !important;
    }
}

@media (max-width: 640px) {
    .footer-shell {
        grid-template-columns: 1fr !important;
    }
}

/* Category page cleanup: calmer background and softer catalog panels. */
main.tebex-page.seo-main.seo-minimal-main {
    padding-top: clamp(108px, 7vw, 128px) !important;
    background:
        radial-gradient(780px 320px at 78% 0%, rgba(233, 18, 42, 0.08), transparent 72%),
        radial-gradient(560px 260px at 8% 12%, rgba(255, 255, 255, 0.035), transparent 68%),
        linear-gradient(112deg, rgba(5, 7, 11, 0.99) 0%, rgba(9, 11, 16, 0.96) 55%, rgba(22, 5, 10, 0.38) 100%),
        #07080d !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
}

main.tebex-page.seo-main.seo-minimal-main::before {
    opacity: 0.2 !important;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 255, 255, 0.014) 1px, transparent 1px),
        var(--hero-image, none) center top / cover fixed !important;
    background-size: 72px 72px, 72px 72px, cover !important;
}

main.tebex-page.seo-main.seo-minimal-main::after {
    background:
        linear-gradient(115deg, transparent 18%, rgba(255, 255, 255, 0.024) 18.25%, transparent 18.7%),
        linear-gradient(103deg, transparent 72%, rgba(239, 18, 61, 0.055) 72.35%, transparent 72.9%),
        radial-gradient(640px 240px at 60% 3%, rgba(239, 18, 61, 0.055), transparent 74%) !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-shop {
    padding-top: clamp(28px, 3.4vw, 46px) !important;
    padding-bottom: clamp(70px, 8vw, 110px) !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-shop-head {
    margin-bottom: 20px !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-shop-head h1 {
    text-shadow: 0 10px 34px rgba(0, 0, 0, 0.34);
}

main.tebex-page.seo-main.seo-minimal-main .seo-command {
    position: relative !important;
    top: auto !important;
    z-index: 5 !important;
    margin-bottom: 20px !important;
    padding: 15px !important;
    border-color: rgba(255, 255, 255, 0.105) !important;
    border-radius: 20px !important;
    background:
        radial-gradient(520px 180px at 8% 0%, rgba(233, 18, 42, 0.065), transparent 70%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.052), rgba(255, 255, 255, 0.016)),
        rgba(13, 15, 21, 0.76) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 10px 28px rgba(0, 0, 0, 0.18) !important;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

main.tebex-page.seo-main.seo-minimal-main .seo-category-hub {
    gap: 10px !important;
    margin-bottom: 16px !important;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
    align-items: stretch !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-category-group {
    display: grid !important;
    align-content: stretch !important;
    gap: 10px !important;
    min-height: 104px !important;
    padding: 14px !important;
    border-color: rgba(255, 255, 255, 0.105) !important;
    border-radius: 16px !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.014)),
        rgba(15, 17, 23, 0.58) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045) !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-category-group.is-active {
    border-color: rgba(255, 49, 76, 0.24) !important;
    background:
        linear-gradient(145deg, rgba(233, 18, 42, 0.075), rgba(255, 255, 255, 0.018)),
        rgba(15, 17, 23, 0.64) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055) !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-category-group:has(.seo-subcategory-list a.is-active) {
    border-color: rgba(255, 49, 76, 0.24) !important;
    background:
        linear-gradient(145deg, rgba(233, 18, 42, 0.075), rgba(255, 255, 255, 0.018)),
        rgba(15, 17, 23, 0.64) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055) !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-category-group.is-single {
    min-height: 82px !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-category-group-main {
    position: relative !important;
    display: grid !important;
    gap: 7px !important;
    margin-bottom: 0 !important;
    padding-right: 28px !important;
    align-items: start !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-category-group-main::after {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    right: 4px !important;
    width: 8px !important;
    height: 8px !important;
    border-right: 2px solid rgba(255, 255, 255, 0.52) !important;
    border-bottom: 2px solid rgba(255, 255, 255, 0.52) !important;
    transform: translateY(-50%) rotate(-45deg) !important;
    transition: border-color 160ms ease, transform 160ms ease !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-category-group:hover .seo-category-group-main::after {
    border-color: rgba(255, 49, 76, 0.92) !important;
    transform: translate(2px, -50%) rotate(-45deg) !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-category-group-main span {
    color: rgba(226, 231, 240, 0.58) !important;
    font-size: 10px !important;
    line-height: 1.1 !important;
    letter-spacing: 0 !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-category-group-main strong {
    max-width: 100% !important;
    text-align: left !important;
    font-size: clamp(18px, 1.6vw, 23px) !important;
    line-height: 1.06 !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-subcategory-list {
    margin-top: auto !important;
    padding-top: 10px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.075) !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-subcategory-list a,
main.tebex-page.seo-main.seo-minimal-main .seo-filter-meta span,
main.tebex-page.seo-main.seo-minimal-main .seo-filter-meta strong {
    border-color: rgba(255, 255, 255, 0.105) !important;
    background: rgba(255, 255, 255, 0.032) !important;
    box-shadow: none !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-subcategory-list a:hover,
main.tebex-page.seo-main.seo-minimal-main .seo-subcategory-list a.is-active {
    border-color: rgba(255, 49, 76, 0.42) !important;
    background: rgba(233, 18, 42, 0.16) !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-filter-line .search-wrap input,
main.tebex-page.seo-main.seo-minimal-main .sort-wrap select {
    border-color: rgba(255, 255, 255, 0.105) !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.048), rgba(255, 255, 255, 0.014)),
        rgba(11, 13, 18, 0.78) !important;
    box-shadow: none !important;
}

main.tebex-page.seo-main.seo-minimal-main .sort-wrap {
    position: relative !important;
}

main.tebex-page.seo-main.seo-minimal-main .sort-wrap span {
    color: rgba(226, 231, 240, 0.62) !important;
    background: transparent !important;
}

main.tebex-page.seo-main.seo-minimal-main .sort-wrap select {
    appearance: none !important;
    -webkit-appearance: none !important;
    cursor: pointer !important;
}

main.tebex-page.seo-main.seo-minimal-main .sort-wrap select.is-native-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

main.tebex-page.seo-main.seo-minimal-main .sort-select-button {
    position: relative !important;
    width: 100% !important;
    min-height: 48px !important;
    padding: 0 44px 0 14px !important;
    border: 1px solid rgba(255, 255, 255, 0.105) !important;
    border-radius: 12px !important;
    color: #fff !important;
    text-align: left !important;
    font: inherit !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.058), rgba(255, 255, 255, 0.014)),
        rgba(11, 13, 18, 0.84) !important;
    cursor: pointer !important;
}

main.tebex-page.seo-main.seo-minimal-main .sort-select-button::after {
    content: "" !important;
    position: absolute !important;
    right: 16px !important;
    top: 50% !important;
    width: 8px !important;
    height: 8px !important;
    border-right: 2px solid rgba(255, 255, 255, 0.58) !important;
    border-bottom: 2px solid rgba(255, 255, 255, 0.58) !important;
    transform: translateY(-65%) rotate(45deg) !important;
    transition: transform 160ms ease, border-color 160ms ease !important;
}

main.tebex-page.seo-main.seo-minimal-main .sort-wrap.is-open .sort-select-button {
    border-color: rgba(255, 49, 76, 0.46) !important;
    background:
        linear-gradient(145deg, rgba(233, 18, 42, 0.12), rgba(255, 255, 255, 0.018)),
        rgba(12, 14, 20, 0.94) !important;
}

main.tebex-page.seo-main.seo-minimal-main .sort-wrap.is-open .sort-select-button::after {
    border-color: rgba(255, 49, 76, 0.92) !important;
    transform: translateY(-35%) rotate(225deg) !important;
}

main.tebex-page.seo-main.seo-minimal-main .sort-select-menu {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: calc(100% + 8px) !important;
    z-index: 20 !important;
    display: none !important;
    padding: 7px !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 14px !important;
    background:
        radial-gradient(240px 110px at 0% 0%, rgba(239, 18, 61, 0.16), transparent 70%),
        rgba(12, 14, 20, 0.98) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 18px 44px rgba(0, 0, 0, 0.34) !important;
}

main.tebex-page.seo-main.seo-minimal-main .sort-wrap.is-open .sort-select-menu {
    display: grid !important;
    gap: 4px !important;
}

main.tebex-page.seo-main.seo-minimal-main .sort-select-option {
    min-height: 34px !important;
    padding: 0 10px !important;
    border: 0 !important;
    border-radius: 9px !important;
    color: rgba(226, 231, 240, 0.78) !important;
    text-align: left !important;
    font: inherit !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    background: transparent !important;
    cursor: pointer !important;
}

main.tebex-page.seo-main.seo-minimal-main .sort-select-option:hover,
main.tebex-page.seo-main.seo-minimal-main .sort-select-option.is-active {
    color: #fff !important;
    background: rgba(233, 18, 42, 0.18) !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid::before,
main.tebex-page.seo-main.seo-minimal-main .seo-product-grid::after {
    content: none !important;
    display: none !important;
}

main.tebex-page.seo-main.seo-minimal-main .empty-state {
    margin-top: 0 !important;
    padding: clamp(28px, 3vw, 38px) 22px !important;
    border-color: rgba(255, 255, 255, 0.105) !important;
    border-radius: 18px !important;
    color: rgba(226, 231, 240, 0.72) !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.044), rgba(255, 255, 255, 0.014)),
        rgba(12, 14, 20, 0.62) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        0 8px 20px rgba(0, 0, 0, 0.13) !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-empty-state {
    min-height: 126px !important;
    border-radius: 18px !important;
    background:
        radial-gradient(380px 150px at 18% 0%, rgba(239, 18, 61, 0.13), transparent 74%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.044), rgba(255, 255, 255, 0.014)),
        rgba(12, 14, 20, 0.62) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        0 8px 20px rgba(0, 0, 0, 0.13) !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-copy-block {
    margin-top: 18px !important;
    padding: 21px 22px !important;
    border-color: rgba(255, 255, 255, 0.105) !important;
    border-radius: 18px !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.042), rgba(255, 255, 255, 0.012)),
        rgba(12, 14, 20, 0.58) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.045),
        0 8px 20px rgba(0, 0, 0, 0.12) !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-copy-block h2 {
    font-size: clamp(22px, 2vw, 28px) !important;
}

@media (max-width: 920px) {
    main.tebex-page.seo-main.seo-minimal-main .seo-category-hub {
        grid-template-columns: 1fr !important;
    }

    main.tebex-page.seo-main.seo-minimal-main .seo-shop-head {
        display: grid !important;
        align-items: start !important;
    }
}

@media (max-width: 620px) {
    main.tebex-page.seo-main.seo-minimal-main {
        padding-top: 104px !important;
    }

    main.tebex-page.seo-main.seo-minimal-main .seo-shop {
        width: min(100% - 28px, var(--max)) !important;
    }

    main.tebex-page.seo-main.seo-minimal-main .seo-command {
        padding: 12px !important;
    }
}

/* Tebex CMS/legal pages: Terms, Privacy and custom Pages. */
main.tebex-page.cms-page {
    position: relative;
    min-height: calc(100vh - var(--header-h) - 260px);
    min-height: max(560px, calc(100svh - var(--header-h) - 260px));
    padding: clamp(116px, 8vw, 148px) 0 clamp(72px, 7vw, 110px) !important;
    color: #fff;
    background:
        radial-gradient(760px 320px at 78% 0%, rgba(233, 18, 42, 0.08), transparent 72%),
        radial-gradient(520px 240px at 10% 16%, rgba(255, 255, 255, 0.032), transparent 68%),
        linear-gradient(112deg, rgba(5, 7, 11, 0.99) 0%, rgba(9, 11, 16, 0.96) 55%, rgba(22, 5, 10, 0.34) 100%),
        #07080d !important;
    overflow: hidden;
}

main.tebex-page.cms-page::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -2;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 255, 255, 0.014) 1px, transparent 1px),
        var(--hero-image, none) center top / cover fixed;
    background-size: 72px 72px, 72px 72px, cover;
    opacity: 0.18;
}

main.tebex-page.cms-page::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        linear-gradient(115deg, transparent 18%, rgba(255, 255, 255, 0.022) 18.25%, transparent 18.7%),
        linear-gradient(103deg, transparent 72%, rgba(239, 18, 61, 0.052) 72.35%, transparent 72.9%);
}

.cms-shell {
    width: min(100% - 44px, var(--max));
    margin-inline: auto;
}

.cms-shell .seo-breadcrumb {
    margin: 0 auto 18px;
    max-width: var(--max);
}

.cms-card {
    width: min(100%, var(--max));
    margin-inline: auto;
    padding: clamp(24px, 3vw, 38px);
    border: 1px solid rgba(255, 255, 255, 0.105);
    border-radius: 20px;
    background:
        radial-gradient(560px 210px at 8% 0%, rgba(233, 18, 42, 0.065), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.052), rgba(255, 255, 255, 0.016)),
        rgba(13, 15, 21, 0.76);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 12px 30px rgba(0, 0, 0, 0.18);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.cms-card .eyebrow {
    margin-bottom: 12px;
    color: rgba(226, 231, 240, 0.58);
}

.cms-card h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(32px, 4.8vw, 58px);
    line-height: 0.98;
    text-shadow: 0 10px 34px rgba(0, 0, 0, 0.34);
}

.cms-content {
    margin-top: clamp(18px, 2vw, 26px);
    color: rgba(226, 231, 240, 0.76);
    font-size: 15px;
    line-height: 1.72;
}

.cms-content:empty {
    display: none;
}

.cms-content>*:first-child {
    margin-top: 0;
}

.cms-content>*:last-child {
    margin-bottom: 0;
}

.cms-content h1,
.cms-content h2,
.cms-content h3,
.cms-content h4 {
    margin: 28px 0 10px;
    color: #fff;
    line-height: 1.12;
}

.cms-content h1 {
    font-size: clamp(28px, 3vw, 40px);
}

.cms-content h2 {
    font-size: clamp(24px, 2.4vw, 32px);
}

.cms-content h3 {
    font-size: 20px;
}

.cms-content p,
.cms-content ul,
.cms-content ol,
.cms-content table {
    margin: 0 0 16px;
}

.cms-content ul,
.cms-content ol {
    padding-left: 1.2em;
}

.cms-content li+li {
    margin-top: 8px;
}

.cms-content a {
    color: #fff;
    text-decoration-color: rgba(255, 49, 76, 0.72);
    text-underline-offset: 3px;
}

.cms-content table {
    width: 100%;
    border-collapse: collapse;
    overflow: hidden;
    border-radius: 14px;
}

.cms-content th,
.cms-content td {
    padding: 12px;
    border: 1px solid rgba(255, 255, 255, 0.105);
    text-align: left;
}

.cms-content th {
    color: #fff;
    background: rgba(255, 255, 255, 0.052);
}

.cms-page+.footer {
    margin-top: 0 !important;
}

@media (max-width: 620px) {
    main.tebex-page.cms-page {
        padding-top: 104px !important;
    }

    .cms-shell {
        width: min(100% - 28px, var(--max));
    }
}

/* Preview server home block: visible entry point for testing store scripts in-game. */
.preview-server-section {
    position: relative;
    z-index: 6;
    width: min(100% - 44px, var(--max));
    margin: clamp(-72px, -4.8vw, -46px) auto clamp(28px, 4vw, 48px);
}

.preview-server-section+.trust-bar {
    margin-top: 0 !important;
}

.preview-server-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 0.48fr);
    gap: clamp(18px, 3vw, 34px);
    align-items: center;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 20px;
    padding: clamp(22px, 3vw, 34px);
    background:
        linear-gradient(135deg, rgba(233, 18, 42, 0.17), transparent 44%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.022)),
        rgba(13, 14, 19, 0.86);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 22px 70px rgba(0, 0, 0, 0.34);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
}

.preview-server-copy {
    display: grid;
    gap: 13px;
}

.preview-server-copy h2 {
    margin: 0;
    max-width: 620px;
    color: #fff;
    font-size: clamp(30px, 4vw, 54px);
    line-height: 1;
    letter-spacing: 0;
}

.preview-server-copy p {
    margin: 0;
    max-width: 680px;
    color: rgba(213, 218, 227, 0.78);
    font-size: clamp(15px, 1.4vw, 18px);
    line-height: 1.55;
}

.preview-server-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 4px;
}

.preview-server-tags span {
    display: inline-flex;
    align-items: center;
    min-height: 31px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    padding: 0 12px;
    color: rgba(255, 255, 255, 0.88);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.088), rgba(255, 255, 255, 0.025)),
        rgba(18, 19, 24, 0.72);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.preview-server-tags span::before {
    content: "";
    width: 6px;
    height: 6px;
    margin-right: 9px;
    border-radius: 999px;
    background: var(--accent);
    box-shadow: 0 0 14px rgba(233, 18, 42, 0.7);
}

.preview-server-panel {
    display: grid;
    gap: 12px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 16px;
    padding: 20px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)),
        rgba(8, 9, 13, 0.64);
}

.preview-server-panel small {
    color: rgba(255, 255, 255, 0.62);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.preview-server-panel strong {
    color: #fff;
    font-size: clamp(21px, 2vw, 28px);
    line-height: 1.05;
}

.preview-server-panel code {
    overflow-wrap: anywhere;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 10px;
    padding: 12px;
    background: rgba(0, 0, 0, 0.22);
    color: rgba(235, 238, 245, 0.86);
    font-size: 13px;
}

.preview-server-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.preview-server-actions .btn {
    flex: 1 1 170px;
    justify-content: center;
}

@media (max-width: 900px) {
    .preview-server-section {
        margin-top: -38px;
    }

    .preview-server-card {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .preview-server-section {
        width: min(100% - 28px, var(--max));
        margin-top: -24px;
    }

    .preview-server-card {
        padding: 18px;
    }
}

/* Refined preview server block. */
.preview-server-section {
    width: min(100% - 44px, var(--max));
    margin: clamp(-46px, -3vw, -28px) auto clamp(24px, 3vw, 38px);
}

.preview-server-card {
    grid-template-columns: minmax(0, 1fr) minmax(470px, 0.56fr);
    gap: clamp(22px, 3vw, 42px);
    align-items: start;
    border-radius: 16px;
    padding: clamp(22px, 3vw, 34px);
    background:
        linear-gradient(105deg, rgba(233, 18, 42, 0.13), transparent 31%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.018)),
        rgba(12, 13, 17, 0.88);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 18px 48px rgba(0, 0, 0, 0.28);
}

.preview-server-kicker,
.preview-server-status {
    display: inline-flex;
    align-items: center;
    width: max-content;
    min-height: 28px;
    border: 1px solid rgba(255, 54, 78, 0.26);
    border-radius: 999px;
    padding: 0 11px;
    color: rgba(255, 255, 255, 0.78);
    background: rgba(255, 255, 255, 0.045);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.preview-server-kicker::before,
.preview-server-status::before {
    content: "";
    width: 6px;
    height: 6px;
    margin-right: 8px;
    border-radius: 999px;
    background: var(--accent);
    box-shadow: 0 0 12px rgba(233, 18, 42, 0.58);
}

.preview-server-copy {
    gap: 10px;
    align-self: start;
    min-width: 0;
}

.preview-server-copy h2 {
    max-width: 650px;
    font-size: clamp(25px, 3vw, 38px);
    line-height: 1.04;
}

.preview-server-copy p {
    max-width: 760px;
    font-size: 15px;
    line-height: 1.55;
    hyphens: none;
    word-break: normal;
    overflow-wrap: normal;
}

.preview-server-panel {
    position: relative;
    align-self: stretch;
    align-content: start;
    min-width: 0;
    gap: 12px;
    border: 0;
    border-radius: 0;
    padding: 0 0 0 clamp(22px, 3vw, 36px);
    background: transparent;
}

.preview-server-panel::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 1px;
    background:
        linear-gradient(
            180deg,
            transparent,
            rgba(255, 255, 255, 0.14) 18%,
            rgba(255, 54, 78, 0.36) 52%,
            rgba(255, 255, 255, 0.12) 82%,
            transparent
        );
}

.preview-server-panel strong {
    max-width: 100%;
    font-size: clamp(18px, 1.35vw, 22px);
    line-height: 1.04;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.preview-server-panel code {
    width: 100%;
    padding: 11px 13px;
    font-family: inherit;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.018)),
        rgba(0, 0, 0, 0.18);
}

.preview-server-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.96fr);
    gap: 10px;
}

.preview-server-actions .btn {
    min-height: 44px;
    padding: 0 14px;
}

@media (max-width: 900px) {
    .preview-server-card {
        grid-template-columns: 1fr;
    }

    .preview-server-panel {
        padding: 18px 0 0;
    }

    .preview-server-panel strong {
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
    }

    .preview-server-panel::before {
        top: 0;
        bottom: auto;
        width: 100%;
        height: 1px;
        background:
            linear-gradient(
                90deg,
                transparent,
                rgba(255, 255, 255, 0.14) 18%,
                rgba(255, 54, 78, 0.36) 52%,
                rgba(255, 255, 255, 0.12) 82%,
                transparent
            );
    }

    .preview-server-actions {
        grid-template-columns: 1fr;
    }
}

/* Footer polish: calmer REDACTOR style after link cleanup. */
.footer {
    padding: clamp(38px, 4.6vw, 64px) 0 30px !important;
    background:
        linear-gradient(180deg, rgba(7, 8, 12, 0), rgba(7, 8, 12, 0.92) 112px, rgba(7, 8, 12, 0.99)),
        radial-gradient(720px 250px at 14% 0%, rgba(255, 48, 72, 0.08), transparent 72%),
        radial-gradient(680px 240px at 84% 0%, rgba(255, 48, 72, 0.045), transparent 72%) !important;
}

.footer .footer-shell {
    width: min(100% - 44px, var(--max)) !important;
    display: grid !important;
    grid-template-columns: minmax(360px, 1.15fr) minmax(180px, 0.55fr) minmax(260px, 0.75fr) minmax(220px, 0.62fr) !important;
    align-items: stretch !important;
    gap: 14px !important;
    padding: 18px !important;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 20px !important;
    background:
        radial-gradient(560px 210px at 0% 0%, rgba(255, 48, 72, 0.12), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.014) 64%, rgba(255, 48, 72, 0.018)),
        rgba(10, 11, 16, 0.82) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 18px 46px rgba(0, 0, 0, 0.24) !important;
}

.footer .footer-shell::before {
    content: "" !important;
    display: block !important;
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.055), transparent 34%, transparent 66%, rgba(255, 48, 72, 0.035)),
        radial-gradient(580px 180px at 24% 0%, rgba(255, 255, 255, 0.035), transparent 72%);
    opacity: 0.42;
}

.footer .footer-shell::after {
    content: "" !important;
    display: block !important;
    position: absolute;
    inset: 18px;
    z-index: 0;
    pointer-events: none;
    border-radius: 16px;
    background:
        linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.055), transparent),
        linear-gradient(180deg, transparent, rgba(255, 48, 72, 0.04), transparent);
    opacity: 0.22;
}

.footer .footer-brand,
.footer .footer-links {
    position: relative;
    z-index: 1;
    min-height: 214px !important;
    clip-path: none !important;
    border: 1px solid rgba(255, 255, 255, 0.105) !important;
    border-radius: 16px !important;
    background:
        radial-gradient(320px 140px at 0% 0%, rgba(255, 48, 72, 0.055), transparent 74%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.052), rgba(255, 255, 255, 0.015) 62%, rgba(255, 48, 72, 0.018)),
        rgba(14, 15, 21, 0.7) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.055),
        0 8px 22px rgba(0, 0, 0, 0.14) !important;
}

.footer .footer-brand {
    align-items: center !important;
    justify-content: center !important;
    gap: 24px !important;
    padding: clamp(28px, 3vw, 38px) !important;
    text-align: center !important;
}

.footer .footer-brand img {
    display: block !important;
    width: min(278px, 82%) !important;
    max-height: 82px !important;
    margin: 0 auto !important;
    object-fit: contain !important;
    object-position: center center !important;
}

.footer .footer-brand p {
    max-width: 430px !important;
    margin: 0 auto !important;
    text-align: center !important;
}

.footer .footer-brand p {
    max-width: 520px !important;
    font-size: 16px !important;
    line-height: 1.58 !important;
    color: rgba(226, 231, 240, 0.74) !important;
}

.footer .footer-links {
    justify-content: flex-start !important;
    gap: 10px !important;
    padding: 20px !important;
}

.footer .footer-links > span {
    margin: 0 0 6px !important;
    padding: 0 0 12px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;
    color: rgba(255, 255, 255, 0.92) !important;
    text-align: left !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 1000 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase !important;
}

.footer .footer-links a {
    min-height: 42px !important;
    padding: 0 12px !important;
    gap: 10px !important;
    border-radius: 10px !important;
    border-color: rgba(255, 255, 255, 0.11) !important;
    color: rgba(226, 231, 240, 0.75) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.046), rgba(255, 255, 255, 0.012)),
        rgba(255, 255, 255, 0.024) !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    text-transform: none !important;
}

.footer .footer-links a span {
    color: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    border: 0 !important;
}

.footer .footer-links a::before {
    content: none !important;
}

.footer .footer-links a::after {
    width: 8px !important;
    height: 8px !important;
    border-top: 2px solid currentColor !important;
    border-right: 2px solid currentColor !important;
    opacity: 0.52 !important;
}

.footer-link-icon {
    width: 25px !important;
    height: 25px !important;
    flex-basis: 25px !important;
    border-radius: 8px !important;
    color: rgba(255, 255, 255, 0.7) !important;
    border-color: rgba(255, 255, 255, 0.105) !important;
    background: rgba(255, 255, 255, 0.038) !important;
}

.footer-link-icon svg {
    width: 14px !important;
    height: 14px !important;
}

.footer .footer-links a:hover {
    color: #fff !important;
    border-color: rgba(255, 48, 72, 0.38) !important;
    background:
        linear-gradient(135deg, rgba(255, 48, 72, 0.13), rgba(255, 255, 255, 0.032)),
        rgba(255, 255, 255, 0.032) !important;
    transform: translateY(-1px);
}

.footer .footer-links a:hover .footer-link-icon {
    color: #fff !important;
    border-color: rgba(255, 48, 72, 0.4) !important;
    background: rgba(255, 48, 72, 0.14) !important;
}

.footer .footer-bottom {
    width: min(100% - 44px, var(--max)) !important;
    margin-top: 16px !important;
    padding-top: 15px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
}

@media (max-width: 1180px) {
    .footer .footer-shell {
        grid-template-columns: minmax(0, 1fr) minmax(190px, 0.62fr) minmax(220px, 0.68fr) !important;
    }

    .footer .footer-links:last-child {
        grid-column: 2 / -1;
    }
}

@media (max-width: 860px) {
    .footer .footer-shell {
        grid-template-columns: 1fr 1fr !important;
    }

    .footer .footer-brand {
        grid-column: 1 / -1;
    }
}

@media (max-width: 620px) {
    .footer .footer-shell {
        grid-template-columns: 1fr !important;
    }

    .footer .footer-links:last-child {
        grid-column: auto;
    }
}

/* Final polish: footer centering and framework clarity. */
.footer .footer-brand {
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    gap: 24px !important;
    padding: clamp(30px, 3vw, 42px) !important;
}

.footer .footer-brand img {
    display: block !important;
    width: min(278px, 82%) !important;
    max-height: 82px !important;
    margin: 0 auto !important;
    object-fit: contain !important;
    object-position: center center !important;
}

.footer .footer-brand p {
    max-width: 430px !important;
    margin: 0 auto !important;
    text-align: center !important;
}

.footer .footer-links {
    align-items: stretch !important;
}

.footer .footer-links > span {
    width: 100% !important;
    text-align: center !important;
}

.footer .footer-links a {
    align-items: center !important;
}

.footer .footer-links a span {
    display: block !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    line-height: 1.15 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.framework-support {
    margin-top: clamp(22px, 2.6vw, 34px) !important;
}

.framework-copy strong {
    max-width: 820px;
}

.framework-copy p {
    color: rgba(226, 231, 240, 0.76) !important;
}

.framework-list span {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 10px 24px rgba(255, 48, 72, 0.08);
}

/* Final footer alignment and framework support block. */
.footer .footer-brand {
    align-items: center !important;
    text-align: center !important;
}

.footer .footer-brand img {
    margin-left: auto !important;
    margin-right: auto !important;
    object-position: center center !important;
}

.footer .footer-brand p {
    max-width: 430px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.footer .footer-links > span {
    text-align: center !important;
}

.footer .footer-links a span {
    display: block !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    color: inherit !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.footer .footer-links a {
    line-height: 1.15 !important;
}

.framework-support {
    width: min(100% - 44px, var(--max));
    margin: clamp(18px, 2.2vw, 30px) auto clamp(46px, 5vw, 70px);
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 24px;
    padding: clamp(22px, 3vw, 34px);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 18px;
    background:
        radial-gradient(520px 160px at 0% 0%, rgba(255, 48, 72, 0.11), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.014)),
        rgba(12, 13, 18, 0.72);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.065),
        0 14px 34px rgba(0, 0, 0, 0.18);
}

.framework-copy {
    display: grid;
    gap: 8px;
}

.framework-copy > span {
    color: var(--red);
    font-size: 12px;
    font-weight: 1000;
    line-height: 1;
    text-transform: uppercase;
}

.framework-copy strong {
    color: var(--text);
    font-size: 34px;
    line-height: 1.02;
    letter-spacing: 0;
}

.framework-copy p {
    max-width: 780px;
    margin: 0;
    color: rgba(226, 231, 240, 0.72);
    font-size: 16px;
    line-height: 1.58;
}

.framework-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.framework-list span {
    min-width: 96px;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    border: 1px solid rgba(255, 48, 72, 0.3);
    border-radius: 999px;
    color: #fff;
    font-size: 13px;
    font-weight: 950;
    background:
        linear-gradient(135deg, rgba(255, 48, 72, 0.18), rgba(255, 255, 255, 0.035)),
        rgba(255, 255, 255, 0.035);
}

.framework-localizations {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(230px, 0.72fr) minmax(0, 1fr);
    align-items: center;
    gap: clamp(16px, 2vw, 24px);
    margin-top: 4px;
    padding-top: clamp(16px, 1.8vw, 22px);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.framework-localization-copy {
    display: grid;
    gap: 6px;
}

.framework-localization-copy > span {
    color: var(--red);
    font-size: 11px;
    font-weight: 1000;
    line-height: 1;
    text-transform: uppercase;
}

.framework-localization-copy p {
    max-width: 520px;
    margin: 0;
    color: rgba(226, 231, 240, 0.7);
    font-size: 13px;
    line-height: 1.48;
}

.localization-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 7px;
}

.localization-list span {
    min-width: 42px;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 9px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    color: rgba(255, 255, 255, 0.82);
    font-size: 10px;
    font-weight: 950;
    line-height: 1;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.016)),
        rgba(5, 6, 10, 0.36);
}

@media (max-width: 860px) {
    .framework-support {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .framework-copy strong {
        font-size: 28px;
    }

    .framework-copy p {
        margin-inline: auto;
    }

    .framework-list {
        justify-content: center;
    }

    .framework-localizations {
        grid-template-columns: 1fr;
    }

    .framework-localization-copy p {
        margin-inline: auto;
    }

    .localization-list {
        justify-content: center;
    }
}

/* Footer rebuild: closer to the original REDACTOR footer, with cleaner links. */
.footer {
    position: relative;
    padding: clamp(42px, 5vw, 72px) 0 28px !important;
    background:
        linear-gradient(180deg, rgba(7, 8, 12, 0), rgba(7, 8, 12, 0.95) 110px, rgba(7, 8, 12, 0.99) 100%),
        radial-gradient(720px 260px at 16% 4%, rgba(255, 54, 78, 0.1), transparent 72%),
        radial-gradient(780px 260px at 78% 8%, rgba(255, 54, 78, 0.055), transparent 72%) !important;
}

.footer .footer-shell {
    position: relative;
    width: min(100% - 44px, var(--max)) !important;
    display: grid !important;
    grid-template-columns: minmax(320px, 1.35fr) minmax(190px, 0.62fr) minmax(240px, 0.76fr) minmax(220px, 0.68fr) !important;
    gap: 18px !important;
    padding: clamp(22px, 2.2vw, 30px) !important;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 22px !important;
    background:
        radial-gradient(720px 280px at 0% 0%, rgba(255, 54, 78, 0.18), transparent 68%),
        linear-gradient(140deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.014) 58%, rgba(255, 54, 78, 0.025)),
        rgba(10, 11, 16, 0.78) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.09),
        0 20px 58px rgba(0, 0, 0, 0.28) !important;
}

.footer .footer-shell::before {
    content: "REDACTOR" !important;
    display: block !important;
    position: absolute;
    left: 28%;
    bottom: -22px;
    z-index: 0;
    pointer-events: none;
    font-size: clamp(92px, 10vw, 170px);
    line-height: 0.82;
    font-weight: 1000;
    letter-spacing: 0;
    color: rgba(255, 255, 255, 0.032);
    text-transform: uppercase;
}

.footer .footer-shell::after {
    content: "" !important;
    display: block !important;
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.09) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 255, 255, 0.045), transparent 44%, rgba(255, 54, 78, 0.045));
    background-size: 64px 100%, 100% 100%;
    opacity: 0.36;
}

.footer .footer-brand,
.footer .footer-links {
    position: relative;
    z-index: 1;
    min-height: 252px !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 14px !important;
    clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%) !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.064), rgba(255, 255, 255, 0.014) 62%, rgba(255, 54, 78, 0.028)),
        rgba(15, 16, 22, 0.74) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 10px 26px rgba(0, 0, 0, 0.16) !important;
}

.footer .footer-brand {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(26px, 3vw, 38px) !important;
}

.footer .footer-brand img {
    width: min(250px, 78%) !important;
    height: auto !important;
    max-height: 78px !important;
    margin-bottom: 28px;
    object-fit: contain;
    object-position: left center;
    filter: drop-shadow(0 0 18px rgba(255, 54, 78, 0.18));
}

.footer .footer-brand p {
    max-width: 470px !important;
    margin: 0 !important;
    color: rgba(226, 231, 240, 0.72) !important;
    font-size: 16px !important;
    line-height: 1.62 !important;
}

.footer .footer-links {
    display: flex !important;
    flex-direction: column;
    gap: 10px !important;
    padding: 22px !important;
}

.footer .footer-links > span {
    display: block;
    margin: 0 0 4px !important;
    padding: 0 0 12px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.075) !important;
    color: rgba(255, 255, 255, 0.93) !important;
    font-size: 11px !important;
    line-height: 1;
    font-weight: 1000;
    text-align: center;
    text-transform: uppercase;
}

.footer .footer-links a {
    width: 100%;
    min-height: 42px !important;
    display: flex !important;
    align-items: center;
    gap: 10px;
    padding: 0 12px !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 10px !important;
    color: rgba(226, 231, 240, 0.72) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.052), rgba(255, 255, 255, 0.018)),
        rgba(255, 255, 255, 0.026) !important;
    box-shadow: none !important;
    transition: border-color 170ms ease, color 170ms ease, background 170ms ease, transform 170ms ease;
}

.footer .footer-links a span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.footer .footer-links a::after {
    content: "" !important;
    width: 8px !important;
    height: 8px !important;
    flex: 0 0 8px !important;
    margin-left: auto !important;
    border-top: 2px solid currentColor !important;
    border-right: 2px solid currentColor !important;
    background: none !important;
    transform: rotate(45deg);
    opacity: 0.66;
}

.footer-link-icon {
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 26px;
    border: 1px solid rgba(255, 255, 255, 0.105);
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.78);
    background: rgba(255, 255, 255, 0.04);
    font-style: normal;
}

.footer-link-icon svg {
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.footer .footer-links a:hover {
    color: #fff !important;
    border-color: rgba(255, 54, 78, 0.44) !important;
    background:
        linear-gradient(135deg, rgba(255, 54, 78, 0.16), rgba(255, 255, 255, 0.035)),
        rgba(255, 255, 255, 0.036) !important;
    transform: translateY(-1px);
}

.footer .footer-links a:hover .footer-link-icon {
    color: #fff;
    border-color: rgba(255, 54, 78, 0.42);
    background: rgba(255, 54, 78, 0.16);
}

.footer .footer-bottom {
    width: min(100% - 44px, var(--max)) !important;
    margin-top: 18px !important;
    padding: 16px 4px 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.065) !important;
}

@media (max-width: 1180px) {
    .footer .footer-shell {
        grid-template-columns: minmax(0, 1fr) minmax(180px, 0.6fr) minmax(220px, 0.7fr) !important;
    }

    .footer .footer-links:last-child {
        grid-column: 2 / -1;
        min-height: 0 !important;
    }
}

@media (max-width: 820px) {
    .footer .footer-shell {
        grid-template-columns: 1fr !important;
    }

    .footer .footer-brand,
    .footer .footer-links {
        min-height: 0 !important;
    }
}

/* Footer final correction: remove the heavy old rebuild artifacts. */
.footer {
    padding: clamp(38px, 4.6vw, 64px) 0 30px !important;
    background:
        linear-gradient(180deg, rgba(7, 8, 12, 0), rgba(7, 8, 12, 0.92) 112px, rgba(7, 8, 12, 0.99)),
        radial-gradient(720px 250px at 14% 0%, rgba(255, 48, 72, 0.08), transparent 72%),
        radial-gradient(680px 240px at 84% 0%, rgba(255, 48, 72, 0.045), transparent 72%) !important;
}

.footer .footer-shell {
    width: min(100% - 44px, var(--max)) !important;
    grid-template-columns: minmax(360px, 1.15fr) minmax(180px, 0.55fr) minmax(260px, 0.75fr) minmax(220px, 0.62fr) !important;
    align-items: stretch !important;
    gap: 14px !important;
    padding: 18px !important;
    border-radius: 20px !important;
    border-color: rgba(255, 255, 255, 0.13) !important;
    background:
        radial-gradient(560px 210px at 0% 0%, rgba(255, 48, 72, 0.12), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.014) 64%, rgba(255, 48, 72, 0.018)),
        rgba(10, 11, 16, 0.82) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 18px 46px rgba(0, 0, 0, 0.24) !important;
}

.footer .footer-shell::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    left: auto !important;
    bottom: auto !important;
    z-index: 0 !important;
    pointer-events: none !important;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.055), transparent 34%, transparent 66%, rgba(255, 48, 72, 0.035)),
        radial-gradient(580px 180px at 24% 0%, rgba(255, 255, 255, 0.035), transparent 72%) !important;
    opacity: 0.42 !important;
    color: transparent !important;
    font-size: 0 !important;
    text-transform: none !important;
}

.footer .footer-shell::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 18px !important;
    z-index: 0 !important;
    pointer-events: none !important;
    border-radius: 16px !important;
    background:
        linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.055), transparent),
        linear-gradient(180deg, transparent, rgba(255, 48, 72, 0.04), transparent) !important;
    background-size: auto !important;
    opacity: 0.22 !important;
}

.footer .footer-brand,
.footer .footer-links {
    --footer-card-cut: 30px;
    min-height: 214px !important;
    overflow: hidden !important;
    contain: paint !important;
    clip-path: polygon(0 0, calc(100% - var(--footer-card-cut)) 0, 100% var(--footer-card-cut), 100% 100%, 0 100%) !important;
    border-radius: 12px 0 12px 12px !important;
    border-color: rgba(255, 255, 255, 0.105) !important;
    background:
        radial-gradient(320px 140px at 0% 0%, rgba(255, 48, 72, 0.055), transparent 74%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.052), rgba(255, 255, 255, 0.015) 62%, rgba(255, 48, 72, 0.018)),
        rgba(14, 15, 21, 0.7) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.055),
        0 8px 22px rgba(0, 0, 0, 0.14) !important;
}

.footer .footer-brand::before,
.footer .footer-links::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    z-index: 3 !important;
    width: var(--footer-card-cut) !important;
    height: var(--footer-card-cut) !important;
    pointer-events: none !important;
    background:
        linear-gradient(135deg, transparent 0 calc(50% - 1px), rgba(255, 255, 255, 0.2) 50%, rgba(255, 48, 72, 0.1) calc(50% + 1px), transparent calc(50% + 2px)) !important;
    opacity: 0.72 !important;
}

.footer .footer-brand::after,
.footer .footer-links::after {
    content: none !important;
    display: none !important;
}

.footer .footer-brand > *,
.footer .footer-links > * {
    position: relative;
    z-index: 1;
}

.footer .footer-brand {
    align-items: center !important;
    justify-content: center !important;
    gap: 24px !important;
    padding: clamp(28px, 3vw, 38px) !important;
    text-align: center !important;
}

.footer .footer-brand img {
    display: block !important;
    width: min(278px, 82%) !important;
    max-height: 82px !important;
    margin: 0 auto !important;
    object-fit: contain !important;
    object-position: center center !important;
}

.footer .footer-brand p {
    max-width: 430px !important;
    margin: 0 auto !important;
    text-align: center !important;
}

.footer .footer-links {
    justify-content: flex-start !important;
    gap: 10px !important;
    padding: 20px !important;
}

.footer .footer-links > span {
    margin: 0 0 6px !important;
    padding: 0 0 12px !important;
    text-align: center !important;
    border-bottom-color: rgba(255, 255, 255, 0.07) !important;
}

.footer .footer-links a {
    min-height: 42px !important;
    padding: 0 12px !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    border-radius: 10px !important;
}

.footer .footer-links a span {
    display: block !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    letter-spacing: 0 !important;
    line-height: 1.15 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    text-transform: none !important;
    white-space: nowrap !important;
}

.footer .footer-links a::before {
    content: none !important;
}

.footer-link-icon {
    width: 25px !important;
    height: 25px !important;
    flex-basis: 25px !important;
}

@media (max-width: 1180px) {
    .footer .footer-shell {
        grid-template-columns: minmax(0, 1fr) minmax(190px, 0.62fr) minmax(220px, 0.68fr) !important;
    }
}

@media (max-width: 860px) {
    .footer .footer-shell {
        grid-template-columns: 1fr 1fr !important;
    }

    .footer .footer-brand {
        grid-column: 1 / -1;
    }
}

@media (max-width: 620px) {
    .footer .footer-shell {
        grid-template-columns: 1fr !important;
    }

    .footer .footer-links:last-child {
        grid-column: auto;
    }
}

/* Single global REDACTOR background. Every page and section stays transparent above it. */
:root {
    --site-page-background: #020307;
    --site-grid-line: rgba(255, 255, 255, 0.016);
    --site-grid-line-soft: rgba(255, 255, 255, 0.005);
    --site-grid-accent: rgba(255, 49, 76, 0.015);
    --site-spark-red: rgba(255, 49, 76, 0.095);
    --site-spark-soft: rgba(255, 96, 116, 0.045);
    --hero-image: linear-gradient(transparent, transparent);
}

html {
    background: var(--site-page-background) !important;
    background-image: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

body {
    position: relative;
    isolation: isolate;
    min-height: 100vh;
    overflow-x: hidden !important;
    overflow-y: clip !important;
    background-color: var(--site-page-background) !important;
    background-image:
        radial-gradient(circle at 18% 24%, var(--site-spark-red) 0 1px, var(--site-spark-soft) 2px, transparent 6px),
        radial-gradient(circle at 74% 18%, rgba(255, 49, 76, 0.11) 0 1px, rgba(255, 49, 76, 0.045) 2px, transparent 7px),
        radial-gradient(circle at 42% 78%, rgba(255, 255, 255, 0.075) 0 1px, rgba(255, 49, 76, 0.035) 2px, transparent 6px),
        radial-gradient(circle at 58% 38%, rgba(255, 49, 76, 0.055), transparent 28%),
        linear-gradient(90deg, var(--site-grid-line) 1px, transparent 1px),
        linear-gradient(180deg, var(--site-grid-line) 1px, transparent 1px),
        linear-gradient(90deg, var(--site-grid-line-soft) 1px, transparent 1px),
        linear-gradient(180deg, var(--site-grid-line-soft) 1px, transparent 1px),
        linear-gradient(90deg, transparent 0, transparent calc(50% - 1px), var(--site-grid-accent) 50%, transparent calc(50% + 1px), transparent 100%),
        linear-gradient(113deg, transparent 0 18%, rgba(255, 255, 255, 0.013) 18.12% 18.3%, transparent 18.58% 64%, rgba(255, 49, 76, 0.014) 64.12% 64.42%, transparent 64.78%),
        linear-gradient(76deg, transparent 0 73%, rgba(255, 255, 255, 0.011) 73.12% 73.28%, transparent 73.62%),
        linear-gradient(116deg, transparent 0 11%, rgba(255, 255, 255, 0.012) 19%, transparent 32%),
        linear-gradient(105deg, transparent 0 56%, rgba(255, 49, 76, 0.014) 66%, transparent 80%),
        radial-gradient(1100px 680px at 48% -14%, rgba(255, 255, 255, 0.016), transparent 72%),
        radial-gradient(980px 560px at 6% -4%, rgba(54, 4, 12, 0.18), transparent 76%),
        radial-gradient(900px 560px at 96% 12%, rgba(72, 5, 16, 0.1), transparent 78%),
        radial-gradient(1040px 720px at 76% 92%, rgba(44, 3, 11, 0.15), transparent 78%),
        radial-gradient(780px 520px at 46% 46%, rgba(0, 0, 0, 0.34), transparent 74%),
        linear-gradient(180deg, rgba(2, 3, 7, 0.36) 0%, rgba(2, 3, 7, 0.62) 48%, rgba(2, 3, 7, 0.9) 100%),
        radial-gradient(900px 560px at 72% 8%, rgba(84, 5, 18, 0.14), transparent 76%),
        linear-gradient(90deg, rgba(10, 1, 5, 0.5) 0%, transparent 30%, transparent 69%, rgba(12, 1, 5, 0.35) 100%),
        linear-gradient(180deg, rgba(0, 0, 0, 0.74) 0%, transparent 26%, rgba(0, 0, 0, 0.58) 100%),
        linear-gradient(112deg, rgba(1, 2, 6, 0.995) 0%, rgba(3, 4, 9, 0.99) 48%, rgba(7, 2, 6, 0.985) 100%) !important;
    background-size: 520px 420px, 720px 560px, 860px 640px, 100% 100%, 104px 104px, 104px 104px, 28px 28px, 28px 28px, 100% 100%, 142% 142%, 150% 150%, 138% 138%, 145% 145%, auto, auto, auto, auto, auto, 100% 100%, cover, 100% 100%, 100% 100%, 100% 100% !important;
    background-position: 4% 8%, 86% 12%, 44% 76%, center top, center top, center top, center top, center top, center top, 48% 0%, 54% 0%, 50% 0%, 52% 0%, center top, center top, center top, center top, center top, center top, 72% top, center top, center top, center top !important;
    background-repeat: repeat, repeat, repeat, no-repeat, repeat, repeat, repeat, repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat !important;
    background-attachment: scroll !important;
    animation: redactor-background-breathe 52s ease-in-out infinite alternate;
}

@keyframes redactor-background-breathe {
    0% {
        background-position: 4% 8%, 86% 12%, 44% 76%, center top, center top, center top, center top, center top, center top, 48% 0%, 54% 0%, 50% 0%, 52% 0%, center top, center top, center top, center top, center top, center top, 72% top, center top, center top, center top;
    }

    45% {
        background-position: 8% 14%, 80% 20%, 48% 70%, center top, 24px 18px, -18px 24px, 10px 8px, -8px 10px, center top, 46% 2%, 57% -2%, 48% 3%, 55% -1%, center top, center top, center top, center top, center top, center top, 72% top, center top, center top, center top;
    }

    100% {
        background-position: 2% 20%, 91% 24%, 38% 68%, center top, 52px 42px, -42px 52px, 18px 14px, -14px 18px, center top, 43% 4%, 60% -4%, 45% 5%, 58% -3%, center top, center top, center top, center top, center top, center top, 72% top, center top, center top, center top;
    }
}

@media (prefers-reduced-motion: reduce) {
    body {
        animation: none !important;
    }
}

body::before,
body::after,
main.tebex-page::before,
main.tebex-page::after,
.seo-main::before,
.seo-main::after,
.seo-minimal-main::before,
.seo-minimal-main::after,
.script-product-page::before,
.script-product-page::after,
.clothing-product-page::before,
.clothing-product-page::after,
.cms-page::before,
.cms-page::after,
.hero::before,
.hero::after,
.section::before,
.section::after,
.home-section::before,
.home-section::after,
.category-nav-section::before,
.category-nav-section::after,
.catalog-section::before,
.catalog-section::after,
.preview-server-section::before,
.preview-server-section::after,
.footer::before,
.footer::after {
    content: none !important;
    display: none !important;
    background: none !important;
    box-shadow: none !important;
    animation: none !important;
}

main,
.tebex-page,
main.tebex-page,
main.tebex-page.cms-page,
main.tebex-page.seo-main,
main.tebex-page.seo-main.seo-minimal-main,
.seo-main,
.seo-minimal-main,
.tebex-page-inner,
.cms-shell,
.seo-shop,
.package-page,
.script-product-page,
.clothing-product-page,
.cms-page,
.hero,
.home-hero,
.section,
.home-section,
.category-nav-section,
.catalog-section,
.preview-server-section,
.footer {
    background: transparent !important;
    background-image: none !important;
}

.hero-bg,
.hero-shade,
.hero-depth-lines {
    display: none !important;
    background: none !important;
    background-image: none !important;
    mask-image: none !important;
    -webkit-mask-image: none !important;
}

.hero h1,
.hero .lead,
.hero-note,
.section-head h2,
.section-head p,
.category-nav-head h2,
.category-nav-head p,
.catalog-head h1,
.catalog-head p {
    color: #ffffff !important;
    text-shadow: none !important;
}

/* Soft block shadow pass for the clean global background. */
:root {
    --clean-block-shadow:
        0 14px 34px rgba(10, 12, 18, 0.10),
        0 2px 10px rgba(10, 12, 18, 0.055),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
    --clean-block-shadow-hover:
        0 18px 42px rgba(10, 12, 18, 0.13),
        0 4px 14px rgba(10, 12, 18, 0.07),
        inset 0 1px 0 rgba(255, 255, 255, 0.075);
}

.site-header,
.discount-inner,
.hero-brand-slab,
.preview-server-card,
.preview-server-panel,
.trust-bar,
.framework-support,
.home-card,
.category-nav,
.category-card,
.catalog-toolbar,
.catalog-card,
.category-products,
.empty-products,
.product-card,
.package-panel,
.package-media-panel,
.package-info-panel,
.package-card,
.module,
.module-card,
.content-card,
.cms-card,
.support-modal,
.cart-drawer,
.cart-panel,
.footer .footer-shell,
.footer .footer-brand,
.footer .footer-links {
    box-shadow: var(--clean-block-shadow) !important;
}

.hero-brand-slab:hover,
.home-card:hover,
.category-card:hover,
.product-card:hover,
.package-card:hover,
.footer .footer-links a:hover {
    box-shadow: var(--clean-block-shadow-hover) !important;
}

/* One real page scrollbar only. Background art lives on body, but body itself must not create a second scroll layer. */
html {
    height: auto !important;
    min-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    scrollbar-gutter: stable !important;
}

body {
    height: auto !important;
    min-height: 100vh !important;
    max-height: none !important;
    overflow-x: clip !important;
    overflow-y: clip !important;
}

body.cart-open {
    overflow: hidden !important;
}

/* Final homepage latest resources rail. */
#top .latest-products-section {
    position: relative !important;
    z-index: 7 !important;
    width: min(1500px, calc(100% - 44px)) !important;
    margin: clamp(54px, 5.5vw, 88px) auto clamp(30px, 3.8vw, 54px) !important;
    padding: 0 !important;
}

#top .latest-products-heading {
    position: relative !important;
    display: grid !important;
    justify-items: center !important;
    gap: 8px !important;
    margin: 0 auto clamp(22px, 2.5vw, 36px) !important;
    text-align: center !important;
}

#top .latest-products-heading::before {
    content: "" !important;
    position: absolute !important;
    top: 12px !important;
    left: 50% !important;
    z-index: -1 !important;
    width: min(760px, 76vw) !important;
    height: 1px !important;
    transform: translateX(-50%) !important;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.18), transparent) !important;
}

#top .latest-products-heading > span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 26px !important;
    padding: 0 18px !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 999px !important;
    background: rgba(14, 15, 20, 0.88) !important;
    color: rgba(255, 255, 255, 0.72) !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
}

#top .latest-products-heading h2 {
    margin: 0 !important;
    color: #fff !important;
    font-size: clamp(30px, 3.3vw, 48px) !important;
    line-height: 0.98 !important;
    letter-spacing: 0 !important;
}

#top .latest-products-slider.hero-product-showcase {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(14px, 1.4vw, 22px) !important;
    align-items: stretch !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="1"] {
    grid-template-columns: minmax(280px, 430px) !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
    grid-template-columns: repeat(2, minmax(280px, 430px)) !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase:not(.has-products) {
    grid-template-columns: minmax(280px, 640px) !important;
    justify-content: center !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto 1fr auto !important;
    gap: 14px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: 100% !important;
    padding: 12px !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 16px !important;
    background:
        linear-gradient(145deg, rgba(38, 39, 47, 0.88), rgba(16, 17, 23, 0.91)),
        radial-gradient(circle at 12% 0%, rgba(244, 25, 57, 0.2), transparent 44%) !important;
    box-shadow:
        0 18px 54px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
    color: #fff !important;
    overflow: hidden !important;
    text-decoration: none !important;
}

#top .latest-products-slider .hero-latest-card::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
        linear-gradient(90deg, rgba(244, 25, 57, 0.16), transparent 42%),
        radial-gradient(circle at 92% 8%, rgba(255, 255, 255, 0.08), transparent 28%) !important;
    opacity: 0.72 !important;
    transition: opacity 0.2s ease, transform 0.2s ease !important;
}

#top .latest-products-slider .hero-latest-card:hover {
    border-color: rgba(255, 34, 72, 0.52) !important;
    transform: translateY(-3px) !important;
    box-shadow:
        0 24px 70px rgba(0, 0, 0, 0.42),
        0 0 34px rgba(244, 25, 57, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.09) !important;
}

#top .latest-products-slider .hero-latest-card:hover::before {
    opacity: 1 !important;
}

#top .latest-products-slider .hero-latest-media {
    position: relative !important;
    z-index: 1 !important;
    display: block !important;
    width: 100% !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 13px !important;
    background: linear-gradient(180deg, rgba(12, 13, 18, 0.86), rgba(3, 4, 7, 0.96)) !important;
    overflow: hidden !important;
}

#top .latest-products-slider .hero-latest-media img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

#top .latest-products-slider .hero-latest-placeholder {
    display: grid !important;
    place-items: center !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 160px !important;
    color: rgba(255, 255, 255, 0.44) !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
}

#top .latest-products-slider .hero-latest-copy {
    position: relative !important;
    z-index: 1 !important;
    display: grid !important;
    gap: 8px !important;
    padding: 0 4px !important;
}

#top .latest-products-slider .hero-latest-kicker {
    justify-self: start !important;
    max-width: 100% !important;
    padding: 5px 10px !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.09) !important;
    color: rgba(255, 255, 255, 0.76) !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

#top .latest-products-slider .hero-latest-title {
    display: -webkit-box !important;
    margin: 0 !important;
    color: #fff !important;
    font-size: clamp(20px, 1.55vw, 27px) !important;
    font-weight: 950 !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-desc {
    display: -webkit-box !important;
    margin: 0 !important;
    color: rgba(222, 225, 234, 0.76) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-price {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    justify-self: start !important;
    margin: 2px 4px 0 !important;
    color: #fff !important;
}

#top .latest-products-slider .hero-latest-price strong {
    font-size: clamp(20px, 1.5vw, 28px) !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

#top .latest-products-slider .hero-latest-price s {
    color: rgba(255, 255, 255, 0.42) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

#top .latest-products-slider .hero-latest-discount {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 26px !important;
    padding: 0 9px !important;
    border-radius: 8px !important;
    background: linear-gradient(135deg, #ff2148, #b60822) !important;
    color: #fff !important;
    font-size: 12px !important;
    font-style: normal !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

#top .latest-products-slider .hero-products-empty {
    width: min(100%, 640px) !important;
    min-height: 150px !important;
    margin: 0 auto !important;
    padding: clamp(24px, 3vw, 40px) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 18px !important;
    background: linear-gradient(145deg, rgba(32, 33, 40, 0.84), rgba(11, 12, 17, 0.9)) !important;
    box-shadow: 0 18px 54px rgba(0, 0, 0, 0.32) !important;
    text-align: center !important;
}

@media (max-width: 1100px) {
    #top .latest-products-slider.hero-product-showcase {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 720px) {
    #top .latest-products-section {
        width: min(100% - 28px, 560px) !important;
        margin-top: 42px !important;
    }

    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase[data-product-count="1"],
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
        grid-template-columns: 1fr !important;
        justify-content: stretch !important;
    }

    #top .latest-products-heading h2 {
        font-size: clamp(28px, 10vw, 38px) !important;
    }
}

/* Homepage final: preview server lives in the hero, latest products move below. */
#top .home-hero .hero-server-showcase {
    width: min(100%, 680px) !important;
    justify-self: end !important;
    align-self: center !important;
    position: relative !important;
    z-index: 2 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 1px minmax(270px, 0.78fr) !important;
    gap: clamp(18px, 2.2vw, 32px) !important;
    align-items: center !important;
    min-height: clamp(300px, 33vw, 430px) !important;
    padding: clamp(24px, 3vw, 40px) !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 24px !important;
    background:
        radial-gradient(circle at 0 0, rgba(255, 49, 76, 0.22), transparent 36%),
        linear-gradient(135deg, rgba(43, 44, 52, 0.9), rgba(17, 18, 24, 0.88) 56%, rgba(38, 8, 18, 0.66)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 28px 82px rgba(0, 0, 0, 0.38),
        0 0 0 1px rgba(255, 49, 76, 0.08) !important;
    -webkit-backdrop-filter: blur(18px) !important;
    backdrop-filter: blur(18px) !important;
}

#top .home-hero .hero-server-showcase::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.05), transparent 40%),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 88px) !important;
    opacity: 0.42 !important;
}

#top .home-hero .hero-server-copy,
#top .home-hero .hero-server-panel {
    position: relative !important;
    z-index: 1 !important;
    min-width: 0 !important;
}

#top .home-hero .hero-server-copy {
    display: grid !important;
    align-content: center !important;
    gap: clamp(12px, 1.4vw, 18px) !important;
}

#top .home-hero .hero-server-copy h2 {
    margin: 0 !important;
    max-width: 520px !important;
    color: #fff !important;
    font-size: clamp(34px, 3.2vw, 58px) !important;
    line-height: 0.98 !important;
    letter-spacing: 0 !important;
    text-wrap: balance !important;
}

#top .home-hero .hero-server-copy p {
    margin: 0 !important;
    max-width: 620px !important;
    color: rgba(235, 238, 244, 0.72) !important;
    font-size: clamp(15px, 1.05vw, 18px) !important;
    line-height: 1.48 !important;
}

#top .home-hero .hero-server-divider {
    width: 1px !important;
    min-height: 230px !important;
    justify-self: center !important;
    background:
        linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.12) 20%, rgba(255, 49, 76, 0.36) 50%, rgba(255, 255, 255, 0.12) 80%, transparent) !important;
    box-shadow: 0 0 24px rgba(255, 49, 76, 0.14) !important;
}

#top .home-hero .hero-server-panel {
    display: grid !important;
    align-content: center !important;
    gap: 12px !important;
}

#top .home-hero .hero-server-panel strong {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    color: #fff !important;
    font-size: clamp(22px, 1.9vw, 34px) !important;
    line-height: 1.02 !important;
    letter-spacing: 0 !important;
    text-overflow: ellipsis !important;
}

#top .home-hero .hero-server-panel code {
    display: block !important;
    width: 100% !important;
    min-height: 42px !important;
    padding: 12px 14px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 10px !important;
    color: rgba(235, 238, 244, 0.76) !important;
    background: rgba(7, 8, 12, 0.44) !important;
    font: 700 13px/1.2 var(--font-body) !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

#top .home-hero .hero-server-panel .preview-server-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

#top .home-hero .hero-server-panel .btn {
    width: 100% !important;
    justify-content: center !important;
}

#top .latest-products-section {
    position: relative !important;
    z-index: 5 !important;
    width: min(1500px, calc(100% - 44px)) !important;
    margin: clamp(62px, 6.6vw, 108px) auto 0 !important;
}

#top .latest-products-heading {
    display: grid !important;
    justify-items: center !important;
    gap: 8px !important;
    margin-bottom: clamp(22px, 2.6vw, 34px) !important;
    text-align: center !important;
}

#top .latest-products-heading::before {
    content: "" !important;
    width: min(820px, 100%) !important;
    height: 1px !important;
    margin-bottom: 8px !important;
    background:
        linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.12), rgba(255, 49, 76, 0.34), rgba(255, 255, 255, 0.12), transparent) !important;
}

#top .latest-products-heading > span {
    display: inline-flex !important;
    min-height: 28px !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0 12px !important;
    border: 1px solid rgba(255, 49, 76, 0.58) !important;
    border-radius: 999px !important;
    color: #ff314c !important;
    background: rgba(255, 49, 76, 0.08) !important;
    font: 900 11px/1 var(--font-display) !important;
    text-transform: uppercase !important;
}

#top .latest-products-heading > span::before {
    content: "" !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 999px !important;
    background: #ff314c !important;
    box-shadow: 0 0 14px rgba(255, 49, 76, 0.72) !important;
}

#top .latest-products-heading h2 {
    margin: 0 !important;
    color: #fff !important;
    font-size: clamp(34px, 3.2vw, 54px) !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
}

#top .latest-products-slider.hero-product-showcase {
    width: 100% !important;
    max-width: none !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(14px, 1.7vw, 24px) !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

#top .latest-products-slider.hero-product-showcase:not(.has-products) {
    grid-template-columns: 1fr !important;
}

#top .latest-products-slider .hero-products-empty {
    min-height: 170px !important;
    display: grid !important;
    place-items: center !important;
    gap: 8px !important;
    padding: clamp(24px, 3vw, 44px) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 22px !important;
    background:
        radial-gradient(circle at 0 0, rgba(255, 49, 76, 0.18), transparent 34%),
        linear-gradient(135deg, rgba(35, 36, 43, 0.86), rgba(13, 14, 20, 0.9)) !important;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.34) !important;
    text-align: center !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    grid-column: auto !important;
    min-height: 362px !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-content: start !important;
    gap: 14px !important;
    padding: 14px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 18px !important;
    background:
        radial-gradient(circle at 0 0, rgba(255, 49, 76, 0.19), transparent 42%),
        linear-gradient(150deg, rgba(38, 39, 46, 0.88), rgba(14, 15, 21, 0.91) 58%, rgba(32, 8, 17, 0.76)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 24px 62px rgba(0, 0, 0, 0.32) !important;
    transition:
        transform 180ms ease,
        border-color 180ms ease,
        box-shadow 180ms ease !important;
}

#top .latest-products-slider .hero-latest-card:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(255, 49, 76, 0.48) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 30px 70px rgba(0, 0, 0, 0.38),
        0 0 34px rgba(255, 49, 76, 0.1) !important;
}

#top .latest-products-slider .hero-latest-media,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-media {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    border-radius: 13px !important;
}

#top .latest-products-slider .hero-latest-copy {
    gap: 9px !important;
}

#top .latest-products-slider .hero-latest-title,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-title {
    font-size: clamp(19px, 1.35vw, 24px) !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
}

#top .latest-products-slider .hero-latest-desc {
    min-height: 2.7em !important;
    display: -webkit-box !important;
    overflow: hidden !important;
    color: rgba(235, 238, 244, 0.68) !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-price,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-price {
    justify-self: start !important;
    margin-top: auto !important;
    font-size: clamp(20px, 1.45vw, 28px) !important;
}

#top .latest-products-slider .hero-latest-price s {
    margin-right: 8px !important;
    color: rgba(235, 238, 244, 0.42) !important;
    font-size: 0.7em !important;
}

@media (max-width: 1180px) {
    #top .home-hero .hero-server-showcase {
        justify-self: stretch !important;
        grid-template-columns: 1fr !important;
        min-height: auto !important;
    }

    #top .home-hero .hero-server-divider {
        width: 100% !important;
        min-height: 1px !important;
    }
}

@media (max-width: 980px) {
    #top .latest-products-slider.hero-product-showcase {
        grid-template-columns: 1fr !important;
    }

    #top .latest-products-slider .hero-latest-card,
    #top .latest-products-slider .hero-latest-card.is-featured {
        min-height: auto !important;
    }
}

@media (max-width: 680px) {
    #top .home-hero .hero-server-showcase,
    #top .latest-products-section {
        width: min(100% - 28px, 1500px) !important;
    }

    #top .home-hero .hero-server-copy h2 {
        font-size: clamp(30px, 10vw, 42px) !important;
    }

    #top .home-hero .hero-server-panel .preview-server-actions {
        grid-template-columns: 1fr !important;
    }
}

/* Absolute final: latest resources follows the category section rhythm. */
#top .latest-products-section {
    width: min(1260px, calc(100% - 44px)) !important;
    margin: clamp(46px, 5vw, 76px) auto clamp(34px, 4.2vw, 62px) !important;
    padding: clamp(18px, 2.6vw, 34px) 0 0 !important;
}

#top .latest-products-heading {
    display: grid !important;
    justify-items: center !important;
    gap: 10px !important;
    max-width: 820px !important;
    margin: 0 auto clamp(22px, 2.6vw, 34px) !important;
    text-align: center !important;
}

#top .latest-products-heading::before,
#top .latest-products-heading::after {
    content: none !important;
    display: none !important;
}

#top .latest-products-heading h2 {
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
    border: 0 !important;
    color: #fff !important;
    font-size: clamp(34px, 3.1vw, 52px) !important;
    line-height: 0.98 !important;
    font-weight: 950 !important;
    letter-spacing: 0 !important;
    text-wrap: balance !important;
    text-shadow: 0 16px 38px rgba(0, 0, 0, 0.46), 0 0 28px rgba(255, 49, 76, 0.12) !important;
}

#top .latest-products-heading p {
    max-width: 620px !important;
    margin: 0 !important;
    color: rgba(226, 231, 240, 0.72) !important;
    font-size: clamp(15px, 1.05vw, 18px) !important;
    line-height: 1.5 !important;
    font-weight: 700 !important;
}

#top .latest-products-slider.hero-product-showcase,
#top .latest-products-slider.hero-product-showcase:has(.hero-latest-card) {
    grid-template-columns: repeat(3, minmax(280px, 320px)) !important;
    align-items: stretch !important;
    justify-content: center !important;
    justify-items: stretch !important;
    gap: clamp(16px, 1.8vw, 26px) !important;
    width: 100% !important;
    max-width: 1040px !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="1"],
#top .latest-products-slider.hero-product-showcase:has(.hero-latest-card:nth-of-type(1):last-child) {
    grid-template-columns: minmax(300px, 420px) !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
    grid-template-columns: repeat(2, minmax(300px, 420px)) !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    grid-template-rows: auto minmax(70px, 1fr) auto !important;
}

#top .latest-products-slider .hero-latest-media {
    isolation: isolate !important;
}

#top .latest-products-slider .hero-latest-media .hero-latest-preview-image {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    opacity: 0 !important;
    transform: scale(1.018) !important;
    transition: opacity 420ms ease, transform 3000ms ease, filter 260ms ease !important;
}

#top .latest-products-slider .hero-latest-media .hero-latest-preview-image.is-active {
    opacity: 1 !important;
    transform: scale(1.045) !important;
}

#top .latest-products-slider .hero-latest-card:hover .hero-latest-media .hero-latest-preview-image.is-active {
    transform: scale(1.075) !important;
}

#top .latest-products-slider .hero-latest-preview-dots {
    position: absolute !important;
    left: 50% !important;
    bottom: 10px !important;
    z-index: 3 !important;
    display: inline-flex !important;
    gap: 6px !important;
    transform: translateX(-50%) !important;
    pointer-events: none !important;
}

#top .latest-products-slider .hero-latest-preview-dot {
    width: 6px !important;
    height: 6px !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.38) !important;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.48) !important;
    opacity: 0.8 !important;
    transition: width 220ms ease, background 220ms ease, opacity 220ms ease !important;
}

#top .latest-products-slider .hero-latest-preview-dot.is-active {
    width: 18px !important;
    background: #ff314c !important;
    opacity: 1 !important;
    box-shadow: 0 0 14px rgba(255, 49, 76, 0.78) !important;
}

#top .latest-products-slider.is-loading > .hero-products-empty,
#top .latest-products-slider[data-hero-loading="true"] > .hero-products-empty,
#top .latest-products-slider:not([data-hero-hydrated="true"]) > .hero-products-empty {
    display: none !important;
}

/* Latest resources: full-width list matched to the framework support block. */
#top .latest-products-section {
    width: min(100% - 44px, var(--max)) !important;
    max-width: var(--max) !important;
}

#top .latest-products-slider.hero-product-showcase,
#top .latest-products-slider.hero-product-showcase:has(.hero-latest-card),
#top .latest-products-slider.hero-product-showcase[data-product-count="1"],
#top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: stretch !important;
    justify-content: stretch !important;
    justify-items: stretch !important;
    gap: clamp(18px, 2vw, 26px) !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 auto !important;
    overflow: visible !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 300px !important;
    display: grid !important;
    grid-template-columns: minmax(360px, 42%) minmax(0, 1fr) !important;
    grid-template-rows: minmax(154px, 1fr) auto !important;
    align-self: stretch !important;
    justify-self: stretch !important;
    gap: clamp(18px, 2vw, 28px) !important;
    padding: 16px !important;
}

#top .latest-products-slider .hero-latest-media,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-media {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 268px !important;
    aspect-ratio: auto !important;
}

#top .latest-products-slider .hero-latest-copy {
    min-width: 0 !important;
    min-height: 154px !important;
    padding: 8px 10px 0 0 !important;
    gap: 11px !important;
}

#top .latest-products-slider .hero-latest-title {
    min-height: auto !important;
    max-width: 740px !important;
    font-size: clamp(28px, 2.25vw, 38px) !important;
}

#top .latest-products-slider .hero-latest-desc {
    max-width: 720px !important;
    min-height: 60px !important;
    max-height: 72px !important;
}

#top .latest-products-slider .hero-latest-footer {
    display: grid !important;
    justify-items: center !important;
    align-content: end !important;
    gap: 10px !important;
    min-height: 86px !important;
    padding: 12px 10px 0 0 !important;
}

#top .latest-products-slider .hero-latest-price,
#top .latest-products-slider .hero-latest-actions {
    justify-content: center !important;
    text-align: center !important;
}

#top .latest-products-slider .hero-latest-actions {
    width: 100% !important;
}

@media (max-width: 900px) {
    #top .latest-products-slider .hero-latest-card,
    #top .latest-products-slider .hero-latest-card.is-featured {
        grid-template-columns: 1fr !important;
        grid-template-rows: auto minmax(116px, 1fr) auto !important;
        min-height: 0 !important;
        gap: 13px !important;
        padding: 13px !important;
    }

    #top .latest-products-slider .hero-latest-media,
    #top .latest-products-slider .hero-latest-card.is-featured .hero-latest-media {
        grid-column: auto !important;
        grid-row: auto !important;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 16 / 9 !important;
    }

    #top .latest-products-slider .hero-latest-copy {
        min-height: 116px !important;
        padding: 0 2px !important;
    }

    #top .latest-products-slider .hero-latest-footer {
        padding: 10px 0 0 !important;
    }
}

/* Catalog dropdown: wider 2x2 cards with roomier product previews. */
.site-header .nav-dropdown-menu.nav-mega-menu {
    width: min(1040px, calc(100vw - 36px)) !important;
}

.site-header .nav-mega-grid {
    gap: 18px !important;
}

.site-header .nav-mega-card {
    padding: 16px !important;
}

.site-header .nav-mega-product-slide {
    min-height: 138px !important;
    grid-template-columns: minmax(168px, 44%) minmax(0, 1fr) !important;
    gap: 14px !important;
    padding: 11px !important;
}

.site-header .nav-mega-product-media {
    min-height: 116px !important;
}

.site-header .nav-mega-product-copy strong {
    font-size: 18.5px !important;
}

.site-header .nav-mega-product-description {
    font-size: 12.5px !important;
    line-height: 1.24 !important;
}

@media (max-width: 900px) {
    .site-header .nav-dropdown-menu.nav-mega-menu {
        width: min(460px, calc(100vw - 28px)) !important;
    }

    .site-header .nav-mega-product-slide {
        grid-template-columns: minmax(128px, 40%) minmax(0, 1fr) !important;
    }
}

@media (max-width: 520px) {
    .site-header .nav-mega-product-slide {
        grid-template-columns: 118px minmax(0, 1fr) !important;
    }
}

/* Product category badges: final shared REDACTOR style and centered dot. */
#top .latest-products-slider .hero-latest-kicker,
main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-meta span:first-child {
    width: max-content !important;
    max-width: 100% !important;
    min-height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    padding: 0 11px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 49, 76, 0.76) !important;
    border-radius: 999px !important;
    color: #ff4058 !important;
    background:
        radial-gradient(80px 36px at 18% 0%, rgba(255, 49, 76, 0.24), transparent 72%),
        rgba(92, 10, 23, 0.34) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 10px 22px rgba(255, 49, 76, 0.1) !important;
    font-size: 11px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    text-transform: uppercase !important;
}

#top .latest-products-slider .hero-latest-kicker::before,
main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-meta span:first-child::before {
    content: "" !important;
    width: 6px !important;
    height: 6px !important;
    flex: 0 0 6px !important;
    display: block !important;
    align-self: center !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: #ff314c !important;
    box-shadow: 0 0 12px rgba(255, 49, 76, 0.78) !important;
    transform: none !important;
}

/* Product category badges: final shared REDACTOR style and centered dot. */
#top .latest-products-slider .hero-latest-kicker,
main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-meta span:first-child {
    width: max-content !important;
    max-width: 100% !important;
    min-height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    padding: 0 11px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 49, 76, 0.76) !important;
    border-radius: 999px !important;
    color: #ff4058 !important;
    background:
        radial-gradient(80px 36px at 18% 0%, rgba(255, 49, 76, 0.24), transparent 72%),
        rgba(92, 10, 23, 0.34) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 10px 22px rgba(255, 49, 76, 0.1) !important;
    font-size: 11px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    text-transform: uppercase !important;
}

#top .latest-products-slider .hero-latest-kicker::before,
main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-meta span:first-child::before {
    content: "" !important;
    width: 6px !important;
    height: 6px !important;
    flex: 0 0 6px !important;
    display: block !important;
    align-self: center !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: #ff314c !important;
    box-shadow: 0 0 12px rgba(255, 49, 76, 0.78) !important;
    transform: none !important;
}

/* Catalog product cards: rotating media previews. */
.product-media.has-card-preview-rotator .media-main,
.product-media.has-card-preview-rotator .media-hover,
.product-media.has-card-preview-rotator .media-hint {
    opacity: 0 !important;
    pointer-events: none !important;
}

.product-card:hover .product-media.has-card-preview-rotator .media-hover {
    opacity: 0 !important;
}

.product-card-preview-rotator {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: block;
    overflow: hidden;
    border-radius: inherit;
    pointer-events: none;
}

.product-card-preview-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    opacity: 0;
    transform: scale(1.018);
    transition: opacity 420ms ease, transform 3000ms ease, filter 260ms ease;
}

.product-card-preview-image.is-active {
    opacity: 1;
    transform: scale(1.045);
}

.product-card:hover .product-card-preview-image.is-active {
    transform: scale(1.075);
}

.product-card-preview-dots {
    position: absolute;
    left: 50%;
    bottom: 12px;
    z-index: 3;
    display: inline-flex;
    gap: 6px;
    transform: translateX(-50%);
}

.product-card-preview-dot {
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.38);
    opacity: 0.82;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    transition: width 220ms ease, background 220ms ease, opacity 220ms ease;
}

.product-card-preview-dot.is-active {
    width: 18px;
    background: #ff314c;
    opacity: 1;
    box-shadow: 0 0 14px rgba(255, 49, 76, 0.76);
}

/* Catalog page product cards: REDACTOR polished layout. */
main.tebex-page.seo-main.seo-minimal-main .seo-product-grid {
    width: 100% !important;
    margin-inline: auto !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 18px !important;
    align-items: stretch !important;
    justify-items: stretch !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-card {
    width: 100% !important;
    min-height: 456px !important;
    display: flex !important;
    flex-direction: column !important;
    border-radius: 18px !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    background:
        radial-gradient(520px 240px at 0% 0%, rgba(255, 49, 76, 0.16), transparent 72%),
        radial-gradient(420px 180px at 100% 0%, rgba(255, 255, 255, 0.06), transparent 68%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.072), rgba(255, 255, 255, 0.02) 48%, rgba(255, 49, 76, 0.035)),
        rgba(12, 14, 20, 0.88) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.11),
        0 22px 54px rgba(0, 0, 0, 0.28),
        0 0 0 1px rgba(255, 49, 76, 0.035) !important;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-card:hover {
    transform: translateY(-4px);
    border-color: rgba(255, 49, 76, 0.42) !important;
    background:
        radial-gradient(560px 250px at 0% 0%, rgba(255, 49, 76, 0.22), transparent 72%),
        radial-gradient(420px 180px at 100% 0%, rgba(255, 255, 255, 0.075), transparent 68%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.086), rgba(255, 255, 255, 0.024) 48%, rgba(255, 49, 76, 0.052)),
        rgba(13, 15, 21, 0.94) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 28px 68px rgba(0, 0, 0, 0.34),
        0 0 0 1px rgba(255, 49, 76, 0.16) !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-link {
    padding: 12px 12px 0 !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-media {
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
    border-radius: 13px !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    background: #07080c !important;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.035),
        0 14px 30px rgba(0, 0, 0, 0.24) !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-media::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    z-index: 3;
    height: 40%;
    background: linear-gradient(180deg, transparent, rgba(3, 4, 7, 0.62));
    pointer-events: none;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-badge {
    top: 12px !important;
    left: 12px !important;
    min-height: 31px !important;
    padding: 0 14px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255, 255, 255, 0.22) !important;
    font-size: 12px !important;
    font-weight: 950 !important;
    letter-spacing: 0 !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.2),
        0 14px 26px rgba(0, 0, 0, 0.24) !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-body {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-items: stretch !important;
    padding: 15px 16px 16px !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-meta {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin: 0 0 12px !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-meta span {
    min-height: 27px !important;
    max-width: 100% !important;
    padding: 0 10px !important;
    border-radius: 999px !important;
    color: rgba(245, 247, 250, 0.88) !important;
    font-size: 11px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-meta span:first-child {
    border-color: rgba(255, 49, 76, 0.76) !important;
    color: #ff4058 !important;
    background:
        radial-gradient(70px 34px at 20% 0%, rgba(255, 49, 76, 0.22), transparent 72%),
        rgba(92, 10, 23, 0.34) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 10px 22px rgba(255, 49, 76, 0.1) !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-meta span:first-child::before {
    content: "";
    width: 6px;
    height: 6px;
    margin-right: 7px;
    border-radius: 999px;
    background: #ff314c;
    box-shadow: 0 0 12px rgba(255, 49, 76, 0.72);
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-meta .product-frameworks {
    margin-left: auto !important;
    color: rgba(245, 247, 250, 0.82) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.085), rgba(255, 255, 255, 0.028)),
        rgba(25, 27, 34, 0.72) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.09) !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid h3 {
    margin: 0 0 10px !important;
    color: #fff !important;
    font-size: clamp(20px, 1.35vw, 25px) !important;
    line-height: 1.04 !important;
    letter-spacing: 0 !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid h3 a {
    color: inherit !important;
    text-decoration: none !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-description {
    min-height: 74px !important;
    margin: 0 0 14px !important;
    color: rgba(226, 231, 240, 0.72) !important;
    font-size: 13px !important;
    font-weight: 760 !important;
    line-height: 1.38 !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 4 !important;
    -webkit-box-orient: vertical !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-bottom {
    width: 100% !important;
    margin-top: auto !important;
    padding-top: 14px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.095) !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto !important;
    gap: 8px !important;
    align-items: center !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-bottom > div {
    min-width: 0 !important;
    display: grid !important;
    gap: 2px !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-bottom s {
    color: rgba(226, 231, 240, 0.46) !important;
    font-size: 13px !important;
    font-weight: 850 !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-bottom strong {
    margin: 0 !important;
    color: #fff !important;
    font-size: clamp(22px, 1.45vw, 27px) !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-bottom .btn {
    min-width: 86px !important;
    min-height: 40px !important;
    justify-content: center !important;
    border-radius: 11px !important;
}

main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-bottom .btn-cart-add {
    min-width: 78px !important;
}

@media (max-width: 1180px) {
    main.tebex-page.seo-main.seo-minimal-main .seo-product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    main.tebex-page.seo-main.seo-minimal-main .seo-product-grid {
        grid-template-columns: 1fr !important;
        width: min(100%, 560px) !important;
    }
}

@media (max-width: 560px) {
    main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-card {
        min-height: 0 !important;
    }

    main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-bottom {
        grid-template-columns: 1fr 1fr !important;
    }

    main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-bottom > div {
        grid-column: 1 / -1 !important;
    }
}


@media (max-width: 1100px) {
    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase:has(.hero-latest-card),
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
        grid-template-columns: minmax(0, 720px) !important;
        max-width: 760px !important;
    }
}

@media (max-width: 720px) {
    #top .latest-products-section {
        width: min(100% - 28px, 560px) !important;
        padding-top: 12px !important;
    }

    #top .latest-products-heading h2 {
        font-size: clamp(32px, 9vw, 42px) !important;
    }

    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase:has(.hero-latest-card),
    #top .latest-products-slider.hero-product-showcase[data-product-count="1"],
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
        grid-template-columns: minmax(0, 1fr) !important;
        max-width: 440px !important;
    }

    #top .latest-products-slider .hero-latest-card,
    #top .latest-products-slider .hero-latest-card.is-featured {
        grid-template-columns: 1fr !important;
        grid-template-rows: auto minmax(116px, 1fr) auto !important;
        gap: 12px !important;
    }

    #top .latest-products-slider .hero-latest-media,
    #top .latest-products-slider .hero-latest-card.is-featured .hero-latest-media {
        grid-column: auto !important;
        grid-row: auto !important;
        aspect-ratio: 16 / 9 !important;
        height: auto !important;
    }

    #top .latest-products-slider .hero-latest-copy {
        min-height: 116px !important;
        padding: 0 2px !important;
    }

    #top .latest-products-slider .hero-latest-footer {
        padding-right: 0 !important;
    }
}

/* Absolute final: do not flash the latest resources empty state while products hydrate. */
#top .latest-products-slider.is-loading > .hero-products-empty,
#top .latest-products-slider[data-hero-loading="true"] > .hero-products-empty,
#top .latest-products-slider:not([data-hero-hydrated="true"]) > .hero-products-empty {
    display: none !important;
}

/* Latest resources: category-section heading and centered animated previews. */
#top .latest-products-section {
    width: min(1100px, calc(100% - 44px)) !important;
    margin: clamp(46px, 5vw, 76px) auto clamp(34px, 4.2vw, 62px) !important;
    padding: clamp(18px, 2.6vw, 34px) 0 0 !important;
}

#top .latest-products-heading {
    position: relative !important;
    display: grid !important;
    justify-items: center !important;
    gap: 10px !important;
    max-width: 820px !important;
    margin: 0 auto clamp(22px, 2.6vw, 34px) !important;
    text-align: center !important;
}

#top .latest-products-heading::before,
#top .latest-products-heading::after {
    content: none !important;
    display: none !important;
}

#top .latest-products-heading h2 {
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
    border: 0 !important;
    color: #fff !important;
    font-size: clamp(34px, 3.1vw, 52px) !important;
    line-height: 0.98 !important;
    font-weight: 950 !important;
    letter-spacing: 0 !important;
    text-wrap: balance !important;
    text-shadow:
        0 16px 38px rgba(0, 0, 0, 0.46),
        0 0 28px rgba(255, 49, 76, 0.12) !important;
}

#top .latest-products-heading p {
    max-width: 620px !important;
    margin: 0 !important;
    color: rgba(226, 231, 240, 0.72) !important;
    font-size: clamp(15px, 1.05vw, 18px) !important;
    line-height: 1.5 !important;
    font-weight: 700 !important;
}

#top .latest-products-slider.hero-product-showcase,
#top .latest-products-slider.hero-product-showcase:has(.hero-latest-card) {
    grid-template-columns: repeat(3, minmax(280px, 320px)) !important;
    align-items: stretch !important;
    justify-content: center !important;
    justify-items: stretch !important;
    gap: clamp(16px, 1.8vw, 26px) !important;
    width: 100% !important;
    max-width: 1040px !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="1"],
#top .latest-products-slider.hero-product-showcase:has(.hero-latest-card:nth-of-type(1):last-child) {
    grid-template-columns: minmax(300px, 420px) !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
    grid-template-columns: repeat(2, minmax(300px, 420px)) !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    grid-template-rows: auto minmax(70px, 1fr) auto !important;
}

#top .latest-products-slider .hero-latest-media {
    isolation: isolate !important;
}

#top .latest-products-slider .hero-latest-media .hero-latest-preview-image {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    opacity: 0 !important;
    transform: scale(1.018) !important;
    transition:
        opacity 420ms ease,
        transform 3000ms ease,
        filter 260ms ease !important;
}

#top .latest-products-slider .hero-latest-media .hero-latest-preview-image.is-active {
    opacity: 1 !important;
    transform: scale(1.045) !important;
}

#top .latest-products-slider .hero-latest-card:hover .hero-latest-media .hero-latest-preview-image.is-active {
    transform: scale(1.075) !important;
}

#top .latest-products-slider .hero-latest-preview-dots {
    position: absolute !important;
    left: 50% !important;
    bottom: 10px !important;
    z-index: 3 !important;
    display: inline-flex !important;
    gap: 6px !important;
    transform: translateX(-50%) !important;
    pointer-events: none !important;
}

#top .latest-products-slider .hero-latest-preview-dot {
    width: 6px !important;
    height: 6px !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.38) !important;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.48) !important;
    opacity: 0.8 !important;
    transition:
        width 220ms ease,
        background 220ms ease,
        opacity 220ms ease !important;
}

#top .latest-products-slider .hero-latest-preview-dot.is-active {
    width: 18px !important;
    background: #ff314c !important;
    opacity: 1 !important;
    box-shadow: 0 0 14px rgba(255, 49, 76, 0.78) !important;
}

@media (max-width: 1100px) {
    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase:has(.hero-latest-card),
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
        grid-template-columns: repeat(2, minmax(280px, 400px)) !important;
        max-width: 850px !important;
    }
}

@media (max-width: 720px) {
    #top .latest-products-section {
        width: min(100% - 28px, 560px) !important;
        padding-top: 12px !important;
    }

    #top .latest-products-heading h2 {
        font-size: clamp(32px, 9vw, 42px) !important;
    }

    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase:has(.hero-latest-card),
    #top .latest-products-slider.hero-product-showcase[data-product-count="1"],
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
        grid-template-columns: minmax(0, 1fr) !important;
        max-width: 440px !important;
    }
}

/* Homepage final polish: preview server + latest resources. */
#top .home-hero .hero-server-showcase {
    display: grid !important;
    grid-template-columns: minmax(340px, 1fr) 1px minmax(360px, 0.92fr) !important;
    gap: clamp(24px, 2.5vw, 42px) !important;
    align-items: center !important;
    padding: clamp(28px, 2.8vw, 44px) !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 24px !important;
    background:
        radial-gradient(circle at 8% 0%, rgba(255, 49, 84, 0.2), transparent 42%),
        linear-gradient(135deg, rgba(39, 40, 48, 0.9), rgba(15, 16, 22, 0.94) 58%, rgba(40, 8, 18, 0.84)) !important;
    box-shadow: 0 24px 72px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    overflow: hidden !important;
}

#top .home-hero .hero-server-copy {
    min-width: 0 !important;
}

#top .home-hero .hero-server-copy h2 {
    max-width: 680px !important;
    margin: 12px 0 14px !important;
    font-size: clamp(38px, 3.2vw, 58px) !important;
    line-height: 0.98 !important;
}

#top .home-hero .hero-server-copy p {
    max-width: 700px !important;
    margin: 0 !important;
}

#top .home-hero .preview-server-tags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin-top: 22px !important;
}

#top .home-hero .hero-server-divider {
    width: 1px !important;
    height: min(205px, 100%) !important;
    background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.14), rgba(255, 49, 84, 0.45), transparent) !important;
}

#top .home-hero .hero-server-panel {
    display: grid !important;
    align-content: center !important;
    gap: 12px !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

#top .home-hero .hero-server-panel strong {
    max-width: 100% !important;
    font-size: clamp(24px, 1.8vw, 32px) !important;
    line-height: 1.04 !important;
    letter-spacing: 0 !important;
    overflow-wrap: anywhere !important;
}

#top .home-hero .hero-server-panel code {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

#top .home-hero .preview-server-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

#top .home-hero .preview-server-actions .btn {
    width: 100% !important;
    min-width: 0 !important;
    justify-content: center !important;
}

#top .latest-products-section {
    width: min(1320px, calc(100% - 44px)) !important;
    margin: clamp(56px, 5.8vw, 88px) auto clamp(38px, 4vw, 62px) !important;
    padding: 0 !important;
}

#top .latest-products-heading {
    display: grid !important;
    justify-items: center !important;
    gap: 8px !important;
    margin: 0 0 clamp(20px, 2.2vw, 32px) !important;
    text-align: center !important;
}

#top .latest-products-heading span {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-height: 30px !important;
    padding: 7px 14px !important;
    border: 1px solid rgba(255, 49, 84, 0.52) !important;
    border-radius: 999px !important;
    background: rgba(255, 49, 84, 0.11) !important;
    color: #ff3154 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
}

#top .latest-products-heading span::before {
    content: "" !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background: #ff3154 !important;
    box-shadow: 0 0 14px rgba(255, 49, 84, 0.85) !important;
}

#top .latest-products-heading h2 {
    margin: 0 !important;
    font-size: clamp(34px, 3.3vw, 54px) !important;
    line-height: 0.95 !important;
}

#top .latest-products-slider .hero-product-source {
    display: none !important;
}

#top .latest-products-slider.hero-product-showcase {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(16px, 1.5vw, 24px) !important;
    width: min(1180px, 100%) !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="1"] {
    grid-template-columns: minmax(280px, 390px) !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
    grid-template-columns: repeat(2, minmax(280px, 390px)) !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase.has-products > .hero-products-empty,
#top .latest-products-slider.hero-product-showcase > .hero-products-empty[hidden],
#top .latest-products-slider.hero-product-showcase:has(.hero-latest-card) > .hero-products-empty {
    display: none !important;
}

#top .latest-products-slider.hero-product-showcase:not(.has-products):not(:has(.hero-latest-card)) {
    grid-template-columns: minmax(280px, 430px) !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase:not(.has-products):not(:has(.hero-latest-card)) > .hero-products-empty {
    display: grid !important;
    min-height: 190px !important;
    padding: clamp(24px, 3vw, 38px) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 20px !important;
    background:
        radial-gradient(circle at 12% 0%, rgba(255, 49, 84, 0.12), transparent 44%),
        linear-gradient(145deg, rgba(30, 31, 38, 0.88), rgba(13, 14, 20, 0.92)) !important;
    box-shadow: 0 22px 64px rgba(0, 0, 0, 0.28) !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto 1fr auto !important;
    gap: 13px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    width: 100% !important;
    height: auto !important;
    max-width: 390px !important;
    padding: 12px !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 18px !important;
    background:
        radial-gradient(circle at 10% 0%, rgba(255, 49, 84, 0.18), transparent 43%),
        linear-gradient(145deg, rgba(38, 39, 47, 0.9), rgba(15, 16, 22, 0.94)) !important;
    box-shadow: 0 22px 64px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
    overflow: hidden !important;
}

#top .latest-products-slider .hero-latest-media {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: rgba(0, 0, 0, 0.28) !important;
}

#top .latest-products-slider .hero-latest-media img,
#top .latest-products-slider .hero-latest-media video {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

#top .latest-products-slider .hero-latest-copy {
    display: grid !important;
    gap: 8px !important;
    min-width: 0 !important;
}

#top .latest-products-slider .hero-latest-title {
    display: -webkit-box !important;
    overflow: hidden !important;
    font-size: clamp(21px, 1.6vw, 28px) !important;
    line-height: 1.03 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-desc {
    display: -webkit-box !important;
    overflow: hidden !important;
    color: rgba(236, 238, 245, 0.72) !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-price {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
    font-size: 24px !important;
    line-height: 1 !important;
}

#top .latest-products-slider .hero-latest-price s {
    color: rgba(236, 238, 245, 0.42) !important;
    font-size: 15px !important;
}

#top .latest-products-slider .hero-latest-discount {
    padding: 6px 9px !important;
    border-radius: 999px !important;
    background: #ff3154 !important;
    color: #fff !important;
    font-style: normal !important;
    font-weight: 900 !important;
    font-size: 12px !important;
}

@media (max-width: 980px) {
    #top .home-hero .hero-server-showcase {
        grid-template-columns: 1fr !important;
    }

    #top .home-hero .hero-server-divider {
        width: 100% !important;
        height: 1px !important;
    }

    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase[data-product-count="1"],
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
        grid-template-columns: minmax(0, 390px) !important;
        justify-content: center !important;
    }
}

@media (max-width: 560px) {
    #top .home-hero .preview-server-actions {
        grid-template-columns: 1fr !important;
    }

    #top .latest-products-section {
        width: min(100% - 28px, 1500px) !important;
    }
}

/* Final homepage tidy pass: compact preview server and clean latest resources. */
#top .home-hero .hero-server-showcase {
    align-self: center !important;
    width: min(720px, 100%) !important;
    min-height: 0 !important;
    padding: clamp(22px, 2vw, 30px) !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 1px minmax(248px, 0.86fr) !important;
    gap: clamp(18px, 2vw, 28px) !important;
    border-radius: 22px !important;
    background:
        linear-gradient(128deg, rgba(53, 22, 31, 0.64), rgba(22, 23, 29, 0.9) 45%, rgba(38, 8, 18, 0.58)),
        radial-gradient(circle at 0% 0%, rgba(244, 25, 57, 0.18), transparent 42%) !important;
    box-shadow:
        0 22px 68px rgba(0, 0, 0, 0.42),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
    overflow: hidden !important;
}

#top .home-hero .hero-server-copy {
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
}

#top .home-hero .hero-server-copy h2 {
    max-width: 360px !important;
    margin: 12px 0 14px !important;
    font-size: clamp(34px, 2.45vw, 46px) !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
}

#top .home-hero .hero-server-copy p {
    max-width: 420px !important;
    margin: 0 0 18px !important;
    font-size: clamp(15px, 0.98vw, 17px) !important;
    line-height: 1.48 !important;
}

#top .home-hero .preview-server-tags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    align-items: center !important;
}

#top .home-hero .preview-server-tags span {
    min-height: 30px !important;
    padding: 8px 13px !important;
    font-size: 11px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

#top .home-hero .hero-server-divider {
    width: 1px !important;
    min-height: 100% !important;
    background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.12), rgba(244, 25, 57, 0.28), transparent) !important;
}

#top .home-hero .hero-server-panel {
    min-width: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 10px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

#top .home-hero .hero-server-panel strong {
    display: -webkit-box !important;
    max-width: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    font-size: clamp(22px, 1.65vw, 30px) !important;
    line-height: 1.02 !important;
}

#top .home-hero .hero-server-panel code {
    width: 100% !important;
    min-height: 42px !important;
    padding: 12px 14px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    border-radius: 10px !important;
}

#top .home-hero .preview-server-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 10px !important;
}

#top .home-hero .preview-server-actions .btn {
    min-height: 46px !important;
    padding: 0 14px !important;
    justify-content: center !important;
    font-size: 15px !important;
    line-height: 1.05 !important;
}

#top .latest-products-section {
    width: min(1320px, calc(100% - 44px)) !important;
    margin: clamp(58px, 6vw, 96px) auto clamp(34px, 4vw, 62px) !important;
}

#top .latest-products-heading {
    display: grid !important;
    grid-template-columns: minmax(80px, 1fr) auto minmax(80px, 1fr) !important;
    gap: 18px !important;
    align-items: center !important;
    justify-items: center !important;
    margin: 0 auto 24px !important;
    max-width: 1120px !important;
}

#top .latest-products-heading::before,
#top .latest-products-heading::after {
    content: "" !important;
    width: 100% !important;
    height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(244, 25, 57, 0.46), rgba(255, 255, 255, 0.1)) !important;
}

#top .latest-products-heading::after {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.1), rgba(244, 25, 57, 0.46), transparent) !important;
}

#top .latest-products-heading span {
    display: none !important;
}

#top .latest-products-heading h2 {
    grid-column: 2 !important;
    margin: 0 !important;
    padding: 0 2px !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #fff !important;
    text-transform: uppercase !important;
    font-size: clamp(25px, 2.1vw, 34px) !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
}

#top .latest-products-slider.hero-product-showcase {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(16px, 1.55vw, 24px) !important;
    max-width: 1180px !important;
    justify-content: center !important;
    margin: 0 auto !important;
}

#top .latest-products-slider.has-products > [data-hero-products-empty],
#top .latest-products-slider > [data-hero-products-empty][hidden] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

#top .latest-products-slider:not(.has-products) {
    grid-template-columns: minmax(280px, 430px) !important;
}

#top .latest-products-slider:not(.has-products) > [data-hero-products-empty]:not([hidden]) {
    min-height: 170px !important;
    display: grid !important;
    place-items: center !important;
    text-align: center !important;
    padding: 28px !important;
    border-radius: 18px !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    background:
        linear-gradient(145deg, rgba(28, 29, 36, 0.88), rgba(12, 13, 18, 0.94)),
        radial-gradient(circle at 10% 0%, rgba(244, 25, 57, 0.16), transparent 42%) !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="1"] {
    grid-template-columns: minmax(280px, 360px) !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
    grid-template-columns: repeat(2, minmax(280px, 360px)) !important;
    justify-content: center !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto 1fr auto !important;
    gap: 13px !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 12px !important;
    border-radius: 18px !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    background:
        linear-gradient(150deg, rgba(40, 42, 50, 0.88), rgba(15, 16, 22, 0.94) 55%, rgba(31, 8, 17, 0.72)),
        radial-gradient(circle at 15% 0%, rgba(244, 25, 57, 0.2), transparent 48%) !important;
    box-shadow: 0 20px 55px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
    overflow: hidden !important;
}

#top .latest-products-slider .hero-latest-card:hover {
    transform: translateY(-3px) !important;
    border-color: rgba(255, 43, 77, 0.45) !important;
    box-shadow: 0 26px 70px rgba(0, 0, 0, 0.42), 0 0 38px rgba(244, 25, 57, 0.14) !important;
}

#top .latest-products-slider .hero-latest-media {
    aspect-ratio: 16 / 9 !important;
    width: 100% !important;
    min-height: 0 !important;
    border-radius: 12px !important;
    background: rgba(3, 4, 8, 0.72) !important;
    overflow: hidden !important;
}

#top .latest-products-slider .hero-latest-media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

#top .latest-products-slider .hero-latest-copy {
    min-width: 0 !important;
    display: grid !important;
    align-content: start !important;
    gap: 7px !important;
}

#top .latest-products-slider .hero-latest-kicker {
    width: max-content !important;
    max-width: 100% !important;
    padding: 6px 10px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    background: rgba(255, 255, 255, 0.08) !important;
    color: rgba(255, 255, 255, 0.78) !important;
    font-size: 11px !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
}

#top .latest-products-slider .hero-latest-title {
    min-height: 0 !important;
    font-size: clamp(20px, 1.35vw, 25px) !important;
    line-height: 1.08 !important;
    text-wrap: balance !important;
}

#top .latest-products-slider .hero-latest-desc {
    min-height: 38px !important;
    color: rgba(232, 233, 239, 0.72) !important;
    font-size: 14px !important;
    line-height: 1.35 !important;
}

#top .latest-products-slider .hero-latest-price {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    align-items: center !important;
    margin-top: 2px !important;
}

#top .latest-products-slider .hero-latest-price strong {
    color: #fff !important;
    font-size: 22px !important;
    line-height: 1 !important;
}

#top .latest-products-slider .hero-latest-price s {
    color: rgba(255, 255, 255, 0.42) !important;
    font-size: 14px !important;
}

#top .latest-products-slider .hero-latest-discount {
    padding: 5px 8px !important;
    border-radius: 8px !important;
    background: #f41939 !important;
    color: #fff !important;
    font-style: normal !important;
    font-size: 12px !important;
    line-height: 1 !important;
}

@media (max-width: 1180px) {
    #top .home-hero .hero-server-showcase {
        grid-template-columns: 1fr !important;
    }

    #top .home-hero .hero-server-divider {
        width: 100% !important;
        height: 1px !important;
        min-height: 1px !important;
    }

    #top .latest-products-slider.hero-product-showcase {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 720px) {
    #top .home-hero .hero-server-showcase {
        padding: 20px !important;
        border-radius: 18px !important;
    }

    #top .home-hero .hero-server-copy h2 {
        font-size: clamp(30px, 9vw, 40px) !important;
    }

    #top .home-hero .preview-server-actions {
        grid-template-columns: 1fr !important;
    }

    #top .latest-products-heading {
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }

    #top .latest-products-heading::before,
    #top .latest-products-heading::after {
        display: none !important;
    }

    #top .latest-products-heading h2 {
        grid-column: 1 !important;
        text-align: center !important;
    }

    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase[data-product-count="1"],
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
        grid-template-columns: 1fr !important;
    }
}

/* REDACTOR final polish: preview server and latest resources. */
#top .home-hero .hero-server-showcase {
    width: min(760px, 100%) !important;
    max-width: 100% !important;
    align-self: center !important;
    display: grid !important;
    grid-template-columns: minmax(250px, 0.95fr) 1px minmax(260px, 0.78fr) !important;
    gap: clamp(22px, 2.2vw, 34px) !important;
    padding: clamp(24px, 2.3vw, 34px) !important;
    border-radius: 24px !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    background:
        linear-gradient(135deg, rgba(255, 49, 76, 0.14), transparent 34%),
        linear-gradient(145deg, rgba(29, 31, 38, 0.9), rgba(12, 13, 18, 0.84)) !important;
    box-shadow: 0 26px 70px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
    overflow: hidden !important;
}

#top .home-hero .hero-server-showcase::before,
#top .home-hero .hero-server-showcase::after {
    content: none !important;
    display: none !important;
}

#top .home-hero .hero-server-copy,
#top .home-hero .hero-server-panel {
    min-width: 0 !important;
}

#top .home-hero .hero-server-copy {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
}

#top .home-hero .hero-server-copy h2 {
    max-width: 410px !important;
    font-size: clamp(36px, 2.8vw, 50px) !important;
    line-height: 0.98 !important;
    letter-spacing: 0 !important;
    margin: 14px 0 !important;
    text-wrap: balance !important;
}

#top .home-hero .hero-server-copy p {
    max-width: 430px !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
}

#top .home-hero .preview-server-tags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-top: 18px !important;
}

#top .home-hero .preview-server-tags span {
    min-height: 28px !important;
    padding: 7px 12px !important;
    font-size: 11px !important;
    white-space: nowrap !important;
}

#top .home-hero .hero-server-divider {
    width: 1px !important;
    min-height: 190px !important;
    align-self: stretch !important;
    background: linear-gradient(180deg, transparent, rgba(255, 49, 76, 0.55), rgba(255, 255, 255, 0.1), transparent) !important;
    box-shadow: 0 0 24px rgba(255, 49, 76, 0.18) !important;
}

#top .home-hero .hero-server-panel {
    align-self: center !important;
    display: grid !important;
    gap: 12px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

#top .home-hero .hero-server-panel .preview-server-status {
    justify-self: start !important;
    margin-bottom: 2px !important;
}

#top .home-hero .hero-server-panel strong {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
    max-width: 100% !important;
    font-size: clamp(24px, 2vw, 34px) !important;
    line-height: 1.02 !important;
    overflow-wrap: anywhere !important;
}

#top .home-hero .hero-server-panel code {
    display: block !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    max-width: 100% !important;
    padding: 11px 14px !important;
    border-radius: 11px !important;
}

#top .home-hero .preview-server-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
}

#top .home-hero .preview-server-actions .btn {
    width: 100% !important;
    min-width: 0 !important;
    justify-content: center !important;
    padding-inline: 12px !important;
}

#top .latest-products-section {
    width: min(1320px, calc(100% - 44px)) !important;
    margin: clamp(54px, 5vw, 84px) auto clamp(34px, 4vw, 58px) !important;
    padding: 0 !important;
}

#top .latest-products-heading {
    display: grid !important;
    justify-items: center !important;
    gap: 10px !important;
    margin: 0 0 22px !important;
    text-align: center !important;
}

#top .latest-products-heading::before,
#top .latest-products-heading::after,
#top .latest-products-heading span::before,
#top .latest-products-heading span::after {
    content: none !important;
    display: none !important;
}

#top .latest-products-heading span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 30px !important;
    padding: 7px 18px !important;
    border: 1px solid rgba(255, 49, 76, 0.68) !important;
    border-radius: 999px !important;
    background: rgba(255, 49, 76, 0.08) !important;
    color: #ff314c !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
}

#top .latest-products-heading h2 {
    margin: 0 !important;
    font-size: clamp(30px, 2.8vw, 44px) !important;
    line-height: 1 !important;
}

#top .latest-products-slider > .hero-product-source,
#top .latest-products-slider > .product-card:not(.hero-latest-card) {
    display: none !important;
}

#top .latest-products-slider.hero-product-showcase {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(14px, 1.4vw, 20px) !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="1"],
#top .latest-products-slider.hero-product-showcase:has(.hero-latest-card:nth-of-type(1):last-child) {
    grid-template-columns: minmax(320px, 560px) !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
    grid-template-columns: repeat(2, minmax(320px, 560px)) !important;
    justify-content: center !important;
}

#top .latest-products-slider.has-products > .hero-products-empty,
#top .latest-products-slider > .hero-products-empty[hidden],
#top .latest-products-slider:has(.hero-latest-card) > .hero-products-empty {
    display: none !important;
}

#top .latest-products-slider:not(.has-products):not(:has(.hero-latest-card)) {
    grid-template-columns: minmax(280px, 430px) !important;
    justify-content: center !important;
}

#top .latest-products-slider:not(.has-products):not(:has(.hero-latest-card)) > .hero-products-empty:not([hidden]) {
    display: grid !important;
    min-height: 190px !important;
    padding: 26px !important;
    border-radius: 22px !important;
    background: linear-gradient(145deg, rgba(31, 33, 41, 0.9), rgba(12, 13, 18, 0.92)) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    box-shadow: 0 20px 54px rgba(0, 0, 0, 0.28) !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    display: grid !important;
    grid-template-columns: 124px minmax(0, 1fr) !important;
    grid-template-rows: auto 1fr auto !important;
    column-gap: 16px !important;
    row-gap: 8px !important;
    min-width: 0 !important;
    min-height: 164px !important;
    height: auto !important;
    padding: 14px !important;
    border-radius: 18px !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    background:
        linear-gradient(145deg, rgba(33, 35, 43, 0.9), rgba(12, 13, 18, 0.92)),
        radial-gradient(circle at 0 0, rgba(255, 49, 76, 0.18), transparent 44%) !important;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
    overflow: hidden !important;
    transform: none !important;
}

#top .latest-products-slider .hero-latest-card:hover {
    transform: translateY(-3px) !important;
    border-color: rgba(255, 49, 76, 0.48) !important;
    box-shadow: 0 24px 58px rgba(0, 0, 0, 0.34), 0 0 34px rgba(255, 49, 76, 0.1) !important;
}

#top .latest-products-slider .hero-latest-media,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-media {
    grid-row: 1 / 4 !important;
    width: 124px !important;
    height: 124px !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    align-self: start !important;
}

#top .latest-products-slider .hero-latest-media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

#top .latest-products-slider .hero-latest-copy {
    min-width: 0 !important;
    display: grid !important;
    gap: 5px !important;
    align-content: start !important;
}

#top .latest-products-slider .hero-latest-kicker {
    font-size: 10px !important;
    line-height: 1.1 !important;
    color: #ff314c !important;
    letter-spacing: 0.05em !important;
}

#top .latest-products-slider .hero-latest-title,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-title {
    display: -webkit-box !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    font-size: clamp(19px, 1.45vw, 25px) !important;
    line-height: 1.06 !important;
}

#top .latest-products-slider .hero-latest-desc {
    display: -webkit-box !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    font-size: 14px !important;
    line-height: 1.38 !important;
}

#top .latest-products-slider .hero-latest-price,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-price {
    align-self: end !important;
    justify-self: start !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
    align-items: center !important;
    margin-top: 4px !important;
}

#top .latest-products-slider .hero-latest-price strong {
    font-size: 20px !important;
}

#top .latest-products-slider .hero-latest-price s {
    opacity: 0.55 !important;
}

#top .latest-products-slider .hero-latest-discount {
    min-height: 24px !important;
    padding: 5px 8px !important;
    border-radius: 999px !important;
    background: #ff314c !important;
    color: #fff !important;
    font-size: 11px !important;
    font-weight: 900 !important;
}

@media (max-width: 1280px) {
    #top .home-hero .hero-server-showcase {
        width: min(100%, 720px) !important;
        grid-template-columns: 1fr !important;
    }

    #top .home-hero .hero-server-divider {
        width: 100% !important;
        min-height: 1px !important;
        background: linear-gradient(90deg, transparent, rgba(255, 49, 76, 0.5), rgba(255, 255, 255, 0.1), transparent) !important;
    }

    #top .home-hero .hero-server-panel {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 1100px) {
    #top .latest-products-slider.hero-product-showcase {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    #top .latest-products-section {
        width: min(100% - 28px, 560px) !important;
        margin-top: 42px !important;
    }

    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase[data-product-count="1"],
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
        grid-template-columns: 1fr !important;
    }

    #top .latest-products-slider .hero-latest-card,
    #top .latest-products-slider .hero-latest-card.is-featured {
        grid-template-columns: 104px minmax(0, 1fr) !important;
        min-height: 142px !important;
        padding: 12px !important;
    }

    #top .latest-products-slider .hero-latest-media,
    #top .latest-products-slider .hero-latest-card.is-featured .hero-latest-media {
        width: 104px !important;
        height: 104px !important;
    }

    #top .home-hero .preview-server-actions {
        grid-template-columns: 1fr !important;
    }
}

/* REDACTOR final homepage polish: preview server + latest resources */
#top .home-hero .hero-server-showcase {
    align-self: center !important;
    display: grid !important;
    grid-template-columns: minmax(0, 0.92fr) 1px minmax(280px, 0.74fr) !important;
    gap: clamp(18px, 2vw, 30px) !important;
    width: min(100%, 720px) !important;
    max-width: 720px !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: clamp(24px, 2.5vw, 36px) !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 24px !important;
    background:
        radial-gradient(circle at 8% 0%, rgba(255, 43, 77, 0.18), transparent 48%),
        linear-gradient(135deg, rgba(34, 35, 43, 0.91), rgba(13, 14, 20, 0.95) 62%, rgba(48, 9, 22, 0.68)) !important;
    box-shadow:
        0 30px 90px rgba(0, 0, 0, 0.42),
        inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

#top .home-hero .hero-server-showcase::before,
#top .home-hero .hero-server-showcase::after {
    pointer-events: none !important;
}

#top .home-hero .hero-server-copy,
#top .home-hero .hero-server-panel {
    min-width: 0 !important;
}

#top .home-hero .hero-server-copy h2 {
    max-width: 340px !important;
    margin: 12px 0 12px !important;
    font-size: clamp(38px, 3vw, 54px) !important;
    line-height: 0.96 !important;
    letter-spacing: 0 !important;
}

#top .home-hero .hero-server-copy p {
    max-width: 360px !important;
    color: rgba(255, 255, 255, 0.72) !important;
    font-size: clamp(14px, 0.95vw, 16px) !important;
    line-height: 1.45 !important;
}

#top .home-hero .preview-server-tags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    max-width: 360px !important;
    margin-top: 18px !important;
}

#top .home-hero .preview-server-tags span {
    width: auto !important;
    max-width: 100% !important;
    padding: 7px 12px !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.07) !important;
    color: rgba(255, 255, 255, 0.82) !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
}

#top .home-hero .hero-server-divider {
    display: block !important;
    width: 1px !important;
    min-height: 260px !important;
    align-self: stretch !important;
    background: linear-gradient(
        180deg,
        transparent,
        rgba(255, 255, 255, 0.12) 18%,
        rgba(255, 35, 70, 0.42) 52%,
        rgba(255, 255, 255, 0.08) 82%,
        transparent
    ) !important;
}

#top .home-hero .hero-server-panel {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

#top .home-hero .hero-server-panel strong {
    display: block !important;
    max-width: 100% !important;
    margin-top: 12px !important;
    overflow: hidden !important;
    color: #fff !important;
    font-size: clamp(25px, 2.15vw, 34px) !important;
    line-height: 1.06 !important;
    letter-spacing: 0 !important;
    text-overflow: ellipsis !important;
}

#top .home-hero .hero-server-panel code {
    display: block !important;
    max-width: 100% !important;
    margin-top: 14px !important;
    padding: 12px 14px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 12px !important;
    background: rgba(0, 0, 0, 0.24) !important;
    color: rgba(255, 255, 255, 0.76) !important;
    font-size: 13px !important;
    line-height: 1.1 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

#top .home-hero .preview-server-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.82fr) !important;
    gap: 10px !important;
    margin-top: 12px !important;
}

#top .home-hero .preview-server-actions .btn {
    min-width: 0 !important;
    justify-content: center !important;
    text-align: center !important;
    white-space: normal !important;
}

#top .latest-products-section {
    width: min(1320px, calc(100% - 44px)) !important;
    margin: clamp(58px, 6vw, 92px) auto !important;
    padding: 0 !important;
}

#top .latest-products-heading {
    display: grid !important;
    place-items: center !important;
    gap: 10px !important;
    margin: 0 0 clamp(22px, 2.5vw, 34px) !important;
    text-align: center !important;
}

#top .latest-products-heading::before,
#top .latest-products-heading::after {
    display: none !important;
    content: none !important;
}

#top .latest-products-heading span {
    display: inline-flex !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: max-content !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 7px 15px !important;
    border: 1px solid rgba(255, 36, 72, 0.48) !important;
    border-radius: 999px !important;
    background: rgba(255, 36, 72, 0.1) !important;
    color: #ff3158 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: 0.08em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
}

#top .latest-products-heading span::before {
    content: "" !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background: #ff3158 !important;
    box-shadow: 0 0 14px rgba(255, 36, 72, 0.8) !important;
}

#top .latest-products-heading h2 {
    margin: 0 !important;
    color: #fff !important;
    font-size: clamp(30px, 3vw, 46px) !important;
    line-height: 1.05 !important;
    letter-spacing: 0 !important;
}

#top .latest-products-slider.hero-product-showcase {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(16px, 1.6vw, 24px) !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 1240px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="1"] {
    grid-template-columns: minmax(300px, 430px) !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
    grid-template-columns: repeat(2, minmax(300px, 430px)) !important;
    justify-content: center !important;
}

#top .latest-products-slider.has-products > .hero-products-empty,
#top .latest-products-slider > .hero-products-empty[hidden] {
    display: none !important;
}

#top .latest-products-slider:not(.has-products) {
    display: flex !important;
    justify-content: center !important;
}

#top .latest-products-slider:not(.has-products) .hero-products-empty:not([hidden]) {
    display: grid !important;
    width: min(430px, 100%) !important;
    min-height: 170px !important;
    place-items: center !important;
    padding: 28px !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 22px !important;
    background:
        radial-gradient(circle at 0 0, rgba(255, 36, 72, 0.12), transparent 44%),
        linear-gradient(135deg, rgba(28, 29, 36, 0.9), rgba(13, 14, 20, 0.94)) !important;
    box-shadow:
        0 24px 70px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
    text-align: center !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    display: grid !important;
    grid-template-rows: auto 1fr auto !important;
    gap: 12px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 12px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 20px !important;
    background:
        radial-gradient(circle at 0 0, rgba(255, 36, 72, 0.15), transparent 42%),
        linear-gradient(145deg, rgba(32, 33, 40, 0.92), rgba(14, 14, 20, 0.96)) !important;
    box-shadow:
        0 24px 80px rgba(0, 0, 0, 0.38),
        inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

#top .latest-products-slider .hero-latest-card:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(255, 48, 82, 0.48) !important;
    box-shadow:
        0 30px 90px rgba(0, 0, 0, 0.44),
        0 0 34px rgba(255, 36, 72, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

#top .latest-products-slider .hero-latest-media,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-media {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    border-radius: 15px !important;
    background: rgba(0, 0, 0, 0.28) !important;
}

#top .latest-products-slider .hero-latest-media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

#top .latest-products-slider .hero-latest-copy {
    min-width: 0 !important;
    padding: 0 4px !important;
}

#top .latest-products-slider .hero-latest-kicker {
    margin-bottom: 8px !important;
}

#top .latest-products-slider .hero-latest-title,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-title {
    display: -webkit-box !important;
    margin: 0 !important;
    overflow: hidden !important;
    font-size: clamp(20px, 1.35vw, 25px) !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-desc {
    display: -webkit-box !important;
    margin-top: 8px !important;
    overflow: hidden !important;
    color: rgba(255, 255, 255, 0.68) !important;
    font-size: 14px !important;
    line-height: 1.42 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-price,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-price {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    padding: 0 4px 2px !important;
}

#top .latest-products-slider .hero-latest-price strong {
    font-size: 22px !important;
    line-height: 1 !important;
}

@media (max-width: 1180px) {
    #top .home-hero .hero-server-showcase {
        grid-template-columns: 1fr !important;
        max-width: 560px !important;
    }

    #top .home-hero .hero-server-divider {
        display: none !important;
    }

    #top .home-hero .hero-server-copy h2,
    #top .home-hero .hero-server-copy p {
        max-width: none !important;
    }
}

@media (max-width: 900px) {
    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase[data-product-count="1"],
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"],
    #top .latest-products-slider.hero-product-showcase[data-product-count="3"] {
        grid-template-columns: 1fr !important;
        max-width: 460px !important;
    }
}

/* Final homepage cleanup: compact preview server and clean latest resources. */
#top .home-hero .hero-server-showcase {
    align-self: center !important;
    width: min(100%, 720px) !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 1px minmax(265px, 330px) !important;
    gap: clamp(20px, 2.2vw, 32px) !important;
    padding: clamp(24px, 2.6vw, 34px) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 20px !important;
    background:
        radial-gradient(circle at 6% 12%, rgba(255, 45, 76, 0.18), transparent 36%),
        linear-gradient(135deg, rgba(45, 46, 54, 0.86), rgba(16, 17, 22, 0.94) 50%, rgba(46, 9, 18, 0.66)) !important;
    box-shadow:
        0 24px 74px rgba(0, 0, 0, 0.38),
        inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
    overflow: hidden !important;
}

#top .home-hero .hero-server-showcase::before {
    opacity: 0.38 !important;
}

#top .home-hero .hero-server-copy {
    align-self: center !important;
    min-width: 0 !important;
}

#top .home-hero .hero-server-copy h2 {
    max-width: 11ch !important;
    margin: 12px 0 16px !important;
    font-size: clamp(38px, 3.7vw, 60px) !important;
    line-height: 0.94 !important;
    letter-spacing: 0 !important;
}

#top .home-hero .hero-server-copy p {
    max-width: 48ch !important;
    margin-bottom: 20px !important;
    color: rgba(232, 235, 242, 0.72) !important;
}

#top .home-hero .hero-server-copy .hero-tags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

#top .home-hero .hero-server-divider {
    width: 1px !important;
    height: 100% !important;
    min-height: 210px !important;
    background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.16), rgba(255, 43, 72, 0.22), transparent) !important;
}

#top .home-hero .hero-server-panel {
    align-self: center !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

#top .home-hero .hero-server-panel strong {
    display: -webkit-box !important;
    max-width: 100% !important;
    margin: 12px 0 14px !important;
    overflow: hidden !important;
    color: #fff !important;
    font-size: clamp(23px, 1.95vw, 31px) !important;
    line-height: 1.05 !important;
    letter-spacing: 0 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .home-hero .hero-server-panel code {
    display: block !important;
    width: 100% !important;
    margin-bottom: 12px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

#top .home-hero .hero-server-panel .preview-server-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 10px !important;
}

#top .home-hero .hero-server-panel .preview-server-actions .btn {
    min-width: 0 !important;
    justify-content: center !important;
    padding-inline: 14px !important;
    text-align: center !important;
}

#top .latest-products-section {
    width: min(1420px, calc(100% - 44px)) !important;
    margin: clamp(70px, 6vw, 104px) auto clamp(44px, 4.5vw, 74px) !important;
    padding: 0 !important;
}

#top .latest-products-heading {
    display: grid !important;
    grid-template-columns: minmax(40px, 1fr) auto minmax(40px, 1fr) !important;
    align-items: center !important;
    gap: 16px !important;
    width: min(760px, 100%) !important;
    margin: 0 auto clamp(24px, 2.8vw, 36px) !important;
    text-align: center !important;
}

#top .latest-products-heading::before,
#top .latest-products-heading::after {
    content: "" !important;
    display: block !important;
    height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(255, 43, 72, 0.42), rgba(255, 255, 255, 0.13)) !important;
}

#top .latest-products-heading::after {
    transform: scaleX(-1) !important;
}

#top .latest-products-heading > span {
    grid-column: 2 !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 8px 18px !important;
    border: 1px solid rgba(255, 43, 72, 0.72) !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, rgba(66, 14, 27, 0.78), rgba(20, 21, 27, 0.92)) !important;
    box-shadow: 0 14px 38px rgba(0, 0, 0, 0.24) !important;
    color: #ff3f5f !important;
    font-size: 12px !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase !important;
}

#top .latest-products-heading > span::before,
#top .latest-products-heading > span::after {
    display: none !important;
}

#top .latest-products-heading h2 {
    grid-column: 1 / -1 !important;
    margin: 6px 0 0 !important;
    color: #fff !important;
    font-size: clamp(34px, 3vw, 50px) !important;
    line-height: 0.96 !important;
    letter-spacing: 0 !important;
}

#top .latest-products-slider.hero-product-showcase {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: clamp(14px, 1.35vw, 20px) !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

#top .latest-products-slider .hero-products-empty[hidden],
#top .latest-products-slider.has-products .hero-products-empty,
#top .latest-products-slider .hero-latest-card ~ .hero-products-empty,
#top .latest-products-slider .product-card ~ .hero-products-empty {
    display: none !important;
}

#top .latest-products-slider:not(.has-products) {
    grid-template-columns: minmax(0, 520px) !important;
    justify-content: center !important;
}

#top .latest-products-slider:not(.has-products) .hero-products-empty:not([hidden]) {
    display: grid !important;
    width: min(100%, 520px) !important;
    min-height: 170px !important;
    place-items: center !important;
    padding: 30px !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 20px !important;
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 43, 72, 0.16), transparent 44%),
        linear-gradient(145deg, rgba(34, 35, 43, 0.82), rgba(14, 15, 20, 0.9)) !important;
    box-shadow: 0 22px 62px rgba(0, 0, 0, 0.3) !important;
    text-align: center !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="1"] {
    grid-template-columns: minmax(0, 360px) !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
    grid-template-columns: repeat(2, minmax(0, 360px)) !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="3"] {
    grid-template-columns: repeat(3, minmax(0, 360px)) !important;
    justify-content: center !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto 1fr auto !important;
    gap: 13px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 12px !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 18px !important;
    background:
        radial-gradient(circle at 10% 0%, rgba(255, 43, 72, 0.19), transparent 42%),
        linear-gradient(145deg, rgba(38, 39, 47, 0.9), rgba(16, 17, 23, 0.93) 58%, rgba(36, 8, 17, 0.72)) !important;
    box-shadow:
        0 20px 58px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
    overflow: hidden !important;
}

#top .latest-products-slider .hero-latest-card:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(255, 43, 72, 0.62) !important;
    box-shadow:
        0 28px 74px rgba(0, 0, 0, 0.44),
        0 0 34px rgba(255, 43, 72, 0.12) !important;
}

#top .latest-products-slider .hero-latest-card::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background: linear-gradient(120deg, rgba(255, 255, 255, 0.08), transparent 34%, rgba(255, 43, 72, 0.06)) !important;
    opacity: 0.54 !important;
}

#top .latest-products-slider .hero-latest-media,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-media {
    position: relative !important;
    z-index: 1 !important;
    display: block !important;
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    min-height: 0 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    background: rgba(0, 0, 0, 0.42) !important;
}

#top .latest-products-slider .hero-latest-media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.26s ease, filter 0.26s ease !important;
}

#top .latest-products-slider .hero-latest-card:hover .hero-latest-media img {
    transform: scale(1.035) !important;
    filter: saturate(1.08) contrast(1.04) !important;
}

#top .latest-products-slider .hero-latest-copy {
    position: relative !important;
    z-index: 1 !important;
    display: grid !important;
    gap: 8px !important;
    min-width: 0 !important;
}

#top .latest-products-slider .hero-latest-kicker {
    width: max-content !important;
    max-width: 100% !important;
    padding: 6px 10px !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.09) !important;
    color: rgba(255, 255, 255, 0.84) !important;
    font-size: 11px !important;
    line-height: 1 !important;
}

#top .latest-products-slider .hero-latest-title,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-title {
    display: -webkit-box !important;
    margin: 0 !important;
    overflow: hidden !important;
    color: #fff !important;
    font-size: clamp(20px, 1.35vw, 25px) !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-desc {
    display: -webkit-box !important;
    min-height: 38px !important;
    overflow: hidden !important;
    color: rgba(232, 235, 242, 0.7) !important;
    font-size: 14px !important;
    line-height: 1.38 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-price,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-price {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-top: 2px !important;
    min-height: 34px !important;
}

#top .latest-products-slider .hero-latest-price strong {
    color: #fff !important;
    font-size: 23px !important;
    line-height: 1 !important;
}

#top .latest-products-slider .hero-latest-price s {
    color: rgba(255, 255, 255, 0.38) !important;
    font-size: 14px !important;
}

#top .latest-products-slider .hero-latest-discount {
    margin-left: auto !important;
    padding: 6px 9px !important;
    border-radius: 8px !important;
    background: linear-gradient(135deg, #ff2145, #a40019) !important;
    color: #fff !important;
    font-size: 12px !important;
    font-style: normal !important;
    font-weight: 900 !important;
}

@media (max-width: 1280px) {
    #top .latest-products-slider.hero-product-showcase {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1180px) {
    #top .home-hero .hero-server-showcase {
        grid-template-columns: minmax(0, 1fr) !important;
        width: min(100%, 620px) !important;
    }

    #top .home-hero .hero-server-divider {
        width: 100% !important;
        height: 1px !important;
        min-height: 1px !important;
    }

    #top .latest-products-slider.hero-product-showcase {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 720px) {
    #top .home-hero .hero-server-showcase,
    #top .latest-products-section {
        width: min(100% - 28px, 560px) !important;
    }

    #top .home-hero .hero-server-copy h2 {
        max-width: 100% !important;
        font-size: clamp(34px, 12vw, 48px) !important;
    }

    #top .home-hero .hero-server-panel .preview-server-actions {
        grid-template-columns: 1fr !important;
    }

    #top .latest-products-heading {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    #top .latest-products-heading::before,
    #top .latest-products-heading::after {
        display: none !important;
    }

    #top .latest-products-heading > span,
    #top .latest-products-heading h2 {
        grid-column: 1 !important;
        justify-self: center !important;
    }

    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase[data-product-count="1"],
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"],
    #top .latest-products-slider.hero-product-showcase[data-product-count="3"] {
        grid-template-columns: 1fr !important;
    }
}

/* Final cleanup: homepage preview server + latest resources layout. */
#top .home-hero {
    align-items: center !important;
}

#top .home-hero .hero-server-showcase {
    align-self: center !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(250px, 0.9fr) !important;
    gap: clamp(20px, 2.3vw, 34px) !important;
    width: min(100%, 760px) !important;
    max-width: 760px !important;
    min-height: 0 !important;
    padding: clamp(22px, 2.2vw, 34px) !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 18px !important;
    background:
        radial-gradient(circle at 0% 0%, rgba(244, 25, 57, 0.24), transparent 48%),
        linear-gradient(135deg, rgba(34, 35, 43, 0.9), rgba(12, 13, 18, 0.93)) !important;
    box-shadow:
        0 28px 70px rgba(0, 0, 0, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

#top .home-hero .hero-server-showcase::before {
    opacity: 0.34 !important;
}

#top .home-hero .hero-server-copy,
#top .home-hero .hero-server-panel {
    display: grid !important;
    align-content: center !important;
    min-width: 0 !important;
}

#top .home-hero .hero-server-copy {
    gap: 12px !important;
}

#top .home-hero .hero-server-panel {
    gap: 12px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

#top .home-hero .hero-server-copy > span,
#top .home-hero .preview-server-status {
    width: max-content !important;
    max-width: 100% !important;
    padding: 6px 12px !important;
    border: 1px solid rgba(255, 49, 76, 0.6) !important;
    border-radius: 999px !important;
    background: rgba(244, 25, 57, 0.08) !important;
    color: #ff2d4f !important;
    font-size: 12px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
}

#top .home-hero .hero-server-copy h2 {
    max-width: 13ch !important;
    margin: 0 !important;
    font-size: clamp(32px, 2.55vw, 46px) !important;
    line-height: 0.98 !important;
    letter-spacing: 0 !important;
    text-wrap: balance !important;
}

#top .home-hero .hero-server-copy p {
    max-width: 46ch !important;
    margin: 0 !important;
    color: rgba(235, 238, 246, 0.72) !important;
    font-size: clamp(15px, 1vw, 17px) !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
}

#top .home-hero .preview-server-tags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-top: 4px !important;
}

#top .home-hero .preview-server-tags span {
    padding: 6px 10px !important;
    font-size: 11px !important;
    line-height: 1 !important;
}

#top .home-hero .hero-server-divider {
    display: block !important;
    width: 1px !important;
    height: auto !important;
    min-height: 190px !important;
    justify-self: center !important;
    background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.14), transparent) !important;
}

#top .home-hero .hero-server-panel strong {
    display: block !important;
    max-width: 100% !important;
    color: #fff !important;
    font-size: clamp(22px, 1.55vw, 29px) !important;
    font-weight: 950 !important;
    line-height: 1.08 !important;
    text-wrap: balance !important;
    overflow-wrap: anywhere !important;
}

#top .home-hero .hero-server-panel code {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 42px !important;
    padding: 12px 14px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 10px !important;
    background: rgba(0, 0, 0, 0.22) !important;
    color: rgba(255, 255, 255, 0.78) !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

#top .home-hero .preview-server-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 10px !important;
}

#top .home-hero .preview-server-actions .btn {
    min-height: 44px !important;
    justify-content: center !important;
    padding: 0 16px !important;
    white-space: nowrap !important;
}

#top .latest-products-section {
    width: min(1480px, calc(100% - 44px)) !important;
    margin: clamp(48px, 4.8vw, 76px) auto clamp(34px, 4vw, 58px) !important;
}

#top .latest-products-heading {
    margin: 0 auto clamp(20px, 2.2vw, 30px) !important;
}

#top .latest-products-heading span {
    display: grid !important;
    grid-template-columns: minmax(60px, 1fr) auto minmax(60px, 1fr) !important;
    gap: 16px !important;
    width: min(720px, 100%) !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #fff !important;
    font-size: clamp(22px, 2vw, 30px) !important;
    font-weight: 950 !important;
    line-height: 1.1 !important;
}

#top .latest-products-heading span::before,
#top .latest-products-heading span::after {
    content: "" !important;
    align-self: center !important;
    height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.18), rgba(255, 31, 65, 0.5)) !important;
}

#top .latest-products-heading span::after {
    background: linear-gradient(90deg, rgba(255, 31, 65, 0.5), rgba(255, 255, 255, 0.18), transparent) !important;
}

#top .latest-products-heading h2 {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
}

#top .latest-products-slider.hero-product-showcase {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(16px, 1.45vw, 24px) !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

#top .latest-products-slider .hero-products-empty[hidden],
#top .latest-products-slider.has-products .hero-products-empty {
    display: none !important;
}

#top .latest-products-slider:not(.has-products) {
    grid-template-columns: minmax(280px, 430px) !important;
    justify-content: center !important;
}

#top .latest-products-slider:not(.has-products) .hero-products-empty {
    display: grid !important;
    min-height: 150px !important;
    place-items: center !important;
    padding: 28px !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 18px !important;
    background: linear-gradient(145deg, rgba(35, 36, 44, 0.82), rgba(13, 14, 19, 0.9)) !important;
    box-shadow:
        0 22px 54px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
    text-align: center !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="1"] {
    grid-template-columns: minmax(280px, 420px) !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
    grid-template-columns: repeat(2, minmax(280px, 420px)) !important;
    justify-content: center !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto 1fr auto !important;
    gap: 13px !important;
    height: 100% !important;
    min-width: 0 !important;
    padding: 12px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 16px !important;
    background:
        radial-gradient(circle at 14% 0%, rgba(255, 31, 65, 0.22), transparent 45%),
        linear-gradient(145deg, rgba(36, 37, 45, 0.9), rgba(13, 14, 19, 0.94)) !important;
    box-shadow:
        0 22px 56px rgba(0, 0, 0, 0.48),
        inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
    text-decoration: none !important;
    transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease !important;
}

#top .latest-products-slider .hero-latest-card:hover {
    transform: translateY(-3px) !important;
    border-color: rgba(255, 49, 76, 0.55) !important;
    box-shadow:
        0 30px 72px rgba(0, 0, 0, 0.58),
        0 0 34px rgba(244, 25, 57, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

#top .latest-products-slider .hero-latest-media {
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
    border-radius: 12px !important;
}

#top .latest-products-slider .hero-latest-media img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    filter: saturate(0.96) contrast(1.06) brightness(0.84) !important;
}

#top .latest-products-slider .hero-latest-copy {
    display: grid !important;
    align-content: start !important;
    gap: 8px !important;
    min-width: 0 !important;
}

#top .latest-products-slider .hero-latest-kicker {
    width: max-content !important;
    max-width: 100% !important;
    padding: 5px 9px !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.08) !important;
    color: rgba(255, 255, 255, 0.82) !important;
    font-size: 11px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
}

#top .latest-products-slider .hero-latest-title {
    display: -webkit-box !important;
    overflow: hidden !important;
    color: #fff !important;
    font-size: clamp(20px, 1.45vw, 26px) !important;
    font-weight: 950 !important;
    line-height: 1.08 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-desc {
    display: -webkit-box !important;
    overflow: hidden !important;
    color: rgba(235, 238, 246, 0.68) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-price {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 9px !important;
    padding-top: 11px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

#top .latest-products-slider .hero-latest-price strong {
    color: #fff !important;
    font-size: clamp(22px, 1.55vw, 30px) !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

#top .latest-products-slider .hero-latest-price s {
    color: rgba(255, 255, 255, 0.36) !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

#top .latest-products-slider .hero-latest-discount {
    display: inline-flex !important;
    align-items: center !important;
    padding: 5px 8px !important;
    border-radius: 7px !important;
    background: linear-gradient(135deg, #ff2448, #b4001f) !important;
    color: #fff !important;
    font-size: 12px !important;
    font-style: normal !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

@media (max-width: 1160px) {
    #top .home-hero .hero-server-showcase {
        grid-template-columns: 1fr !important;
        max-width: 620px !important;
    }

    #top .home-hero .hero-server-divider {
        width: 100% !important;
        height: 1px !important;
        min-height: 1px !important;
        background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.14), transparent) !important;
    }

    #top .latest-products-slider.hero-product-showcase {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 720px) {
    #top .home-hero .hero-server-showcase {
        width: min(100%, 520px) !important;
        padding: 22px !important;
    }

    #top .home-hero .hero-server-copy h2 {
        max-width: 100% !important;
        font-size: clamp(30px, 9vw, 44px) !important;
    }

    #top .home-hero .preview-server-actions {
        grid-template-columns: 1fr !important;
    }

    #top .latest-products-heading span {
        grid-template-columns: 1fr !important;
    }

    #top .latest-products-heading span::before,
    #top .latest-products-heading span::after {
        display: none !important;
    }

    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase[data-product-count="1"],
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
        grid-template-columns: 1fr !important;
    }
}

/* Final homepage cleanup: preview server card and latest resources. */
#top .home-hero .hero-inner {
    grid-template-columns: minmax(0, 0.92fr) minmax(520px, 0.95fr) !important;
    align-items: center !important;
    gap: clamp(42px, 5vw, 86px) !important;
}

#top .home-hero .hero-server-showcase {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(320px, 1fr) 1px minmax(260px, 0.82fr) !important;
    gap: clamp(22px, 2.4vw, 34px) !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 780px !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: clamp(24px, 2.4vw, 34px) !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 22px !important;
    background:
        radial-gradient(circle at 0% 0%, rgba(255, 47, 77, 0.2), transparent 38%),
        linear-gradient(135deg, rgba(39, 40, 49, 0.86), rgba(13, 14, 20, 0.9) 58%, rgba(45, 7, 17, 0.64)) !important;
    box-shadow:
        0 30px 90px rgba(0, 0, 0, 0.36),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

#top .home-hero .hero-server-showcase::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.06), transparent 22%, transparent 76%, rgba(255, 42, 72, 0.08)),
        radial-gradient(circle at 88% 12%, rgba(255, 255, 255, 0.08), transparent 30%) !important;
    opacity: 0.72 !important;
}

#top .home-hero .hero-server-copy,
#top .home-hero .hero-server-divider,
#top .home-hero .hero-server-panel {
    position: relative !important;
    z-index: 1 !important;
}

#top .home-hero .hero-server-copy {
    display: grid !important;
    gap: 14px !important;
    min-width: 0 !important;
}

#top .home-hero .hero-server-copy h2 {
    max-width: 12ch !important;
    margin: 0 !important;
    font-size: clamp(40px, 3.8vw, 62px) !important;
    line-height: 0.93 !important;
    letter-spacing: 0 !important;
}

#top .home-hero .hero-server-copy p {
    max-width: 380px !important;
    margin: 0 !important;
    font-size: clamp(15px, 1vw, 17px) !important;
    line-height: 1.45 !important;
    color: rgba(235, 238, 245, 0.72) !important;
}

#top .home-hero .preview-server-tags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    max-width: 420px !important;
}

#top .home-hero .hero-server-divider {
    display: block !important;
    align-self: stretch !important;
    width: 1px !important;
    min-height: 180px !important;
    background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.13), rgba(255, 42, 72, 0.2), transparent) !important;
}

#top .home-hero .hero-server-panel {
    display: grid !important;
    gap: 12px !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

#top .home-hero .hero-server-panel strong {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-size: clamp(24px, 2vw, 34px) !important;
    line-height: 1 !important;
    color: #fff !important;
}

#top .home-hero .hero-server-panel code {
    width: 100% !important;
    min-width: 0 !important;
    padding: 12px 14px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    border-radius: 11px !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    background: rgba(5, 6, 10, 0.34) !important;
}

#top .home-hero .preview-server-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 10px !important;
}

#top .home-hero .preview-server-actions .btn {
    min-width: 0 !important;
    width: 100% !important;
    justify-content: center !important;
    white-space: normal !important;
    text-align: center !important;
}

#top .latest-products-section {
    width: min(1180px, calc(100% - 44px)) !important;
    margin: clamp(58px, 5.6vw, 92px) auto clamp(38px, 4.4vw, 64px) !important;
    padding: 0 !important;
}

#top .latest-products-heading {
    display: grid !important;
    justify-items: center !important;
    gap: 9px !important;
    margin: 0 0 clamp(22px, 2.4vw, 34px) !important;
    text-align: center !important;
}

#top .latest-products-heading span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 7px 15px !important;
    border: 1px solid rgba(255, 42, 72, 0.78) !important;
    border-radius: 999px !important;
    background: rgba(255, 42, 72, 0.1) !important;
    color: #ff304e !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase !important;
    box-shadow: 0 12px 28px rgba(255, 20, 54, 0.1) !important;
}

#top .latest-products-heading span::before {
    content: "" !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 999px !important;
    background: #ff304e !important;
    box-shadow: 0 0 14px rgba(255, 48, 78, 0.85) !important;
}

#top .latest-products-heading h2 {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #fff !important;
    font-size: clamp(34px, 3.1vw, 50px) !important;
    font-weight: 950 !important;
    line-height: 0.98 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    box-shadow: none !important;
}

#top .latest-products-heading h2::before,
#top .latest-products-heading h2::after {
    display: none !important;
}

#top .latest-products-slider .hero-product-source,
#top .latest-products-slider .hero-product-source[hidden],
#top .latest-products-slider .hero-product-source * {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

#top .latest-products-slider.hero-product-showcase {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(14px, 1.45vw, 22px) !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: clamp(18px, 1.8vw, 24px) !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 22px !important;
    background:
        radial-gradient(circle at 0% 0%, rgba(255, 47, 77, 0.17), transparent 36%),
        linear-gradient(145deg, rgba(35, 36, 44, 0.78), rgba(10, 11, 16, 0.88) 58%, rgba(35, 6, 16, 0.52)) !important;
    box-shadow:
        0 26px 80px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="1"] {
    grid-template-columns: minmax(0, 410px) !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
    grid-template-columns: repeat(2, minmax(0, 410px)) !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase:not(.has-products):not(:has(.hero-latest-card)) {
    grid-template-columns: minmax(0, 440px) !important;
    justify-content: center !important;
}

#top .latest-products-slider .hero-products-empty[hidden],
#top .latest-products-slider.has-products > .hero-products-empty,
#top .latest-products-slider:has(.hero-latest-card) > .hero-products-empty {
    display: none !important;
}

#top .latest-products-slider:not(.has-products):not(:has(.hero-latest-card)) > .hero-products-empty:not([hidden]) {
    display: grid !important;
    place-items: center !important;
    gap: 9px !important;
    min-height: 170px !important;
    padding: 28px !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 18px !important;
    background: linear-gradient(145deg, rgba(26, 28, 35, 0.72), rgba(9, 10, 14, 0.78)) !important;
    text-align: center !important;
}

#top .latest-products-slider:not(.has-products):not(:has(.hero-latest-card)) > .hero-products-empty strong {
    max-width: 12ch !important;
    color: #fff !important;
    font-size: clamp(26px, 2.2vw, 34px) !important;
    line-height: 0.98 !important;
}

#top .latest-products-slider:not(.has-products):not(:has(.hero-latest-card)) > .hero-products-empty span {
    max-width: 330px !important;
    color: rgba(235, 238, 245, 0.7) !important;
    font-size: 15px !important;
    line-height: 1.35 !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    position: relative !important;
    display: grid !important;
    grid-template-rows: auto 1fr auto !important;
    gap: 12px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 12px !important;
    overflow: hidden !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 18px !important;
    background:
        radial-gradient(circle at 8% 0%, rgba(255, 48, 78, 0.22), transparent 42%),
        linear-gradient(145deg, rgba(38, 39, 47, 0.88), rgba(13, 14, 19, 0.92) 66%) !important;
    box-shadow:
        0 20px 54px rgba(0, 0, 0, 0.26),
        inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
    text-decoration: none !important;
}

#top .latest-products-slider .hero-latest-card::after {
    content: "" !important;
    position: absolute !important;
    inset: auto 14px 0 !important;
    height: 1px !important;
    background: linear-gradient(90deg, rgba(255, 42, 72, 0.65), transparent) !important;
    opacity: 0.7 !important;
}

#top .latest-products-slider .hero-latest-media {
    width: 100% !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    border-radius: 14px !important;
    border: 1px solid rgba(255, 255, 255, 0.11) !important;
    background: rgba(0, 0, 0, 0.28) !important;
}

#top .latest-products-slider .hero-latest-media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

#top .latest-products-slider .hero-latest-copy {
    display: grid !important;
    gap: 7px !important;
    min-width: 0 !important;
    padding: 0 4px 2px !important;
}

#top .latest-products-slider .hero-latest-kicker {
    justify-self: start !important;
    max-width: 100% !important;
    padding: 5px 10px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.08) !important;
    color: rgba(255, 255, 255, 0.86) !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

#top .latest-products-slider .hero-latest-title {
    display: -webkit-box !important;
    margin: 0 !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    font-size: clamp(20px, 1.45vw, 25px) !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
}

#top .latest-products-slider .hero-latest-desc {
    display: -webkit-box !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    color: rgba(235, 238, 245, 0.68) !important;
    font-size: 14.5px !important;
    line-height: 1.38 !important;
}

#top .latest-products-slider .hero-latest-price {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    min-height: 34px !important;
    margin: 0 4px 2px !important;
}

#top .latest-products-slider .hero-latest-price strong,
#top .latest-products-slider .hero-latest-price .price {
    color: #fff !important;
    font-size: clamp(19px, 1.45vw, 24px) !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

@media (max-width: 1240px) {
    #top .home-hero .hero-inner {
        grid-template-columns: 1fr !important;
        justify-items: center !important;
    }

    #top .home-hero .hero-copy {
        justify-self: start !important;
    }

    #top .home-hero .hero-server-showcase {
        max-width: min(100%, 880px) !important;
    }
}

@media (max-width: 980px) {
    #top .latest-products-slider.hero-product-showcase {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    #top .latest-products-slider.hero-product-showcase[data-product-count="1"] {
        grid-template-columns: minmax(0, 410px) !important;
    }
}

@media (max-width: 820px) {
    #top .home-hero .hero-server-showcase {
        grid-template-columns: 1fr !important;
        max-width: min(100%, 560px) !important;
    }

    #top .home-hero .hero-server-divider {
        width: 100% !important;
        height: 1px !important;
        min-height: 1px !important;
        background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.13), rgba(255, 42, 72, 0.2), transparent) !important;
    }

    #top .home-hero .hero-server-copy h2 {
        max-width: 11ch !important;
    }
}

@media (max-width: 720px) {
    #top .latest-products-section {
        width: min(100% - 28px, 560px) !important;
    }

    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase[data-product-count="1"],
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
        grid-template-columns: 1fr !important;
    }

    #top .home-hero .preview-server-actions {
        grid-template-columns: 1fr !important;
    }
}

/* FINAL HOMEPAGE RESOURCE FIX: preview server and latest products. */
#top .home-hero .hero-server-showcase {
    align-self: center !important;
    width: min(100%, 760px) !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(310px, 1fr) 1px minmax(260px, 330px) !important;
    gap: clamp(18px, 2vw, 30px) !important;
    padding: clamp(24px, 2.6vw, 36px) !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 20px !important;
    background:
        linear-gradient(135deg, rgba(255, 49, 76, 0.14), transparent 38%),
        linear-gradient(145deg, rgba(36, 37, 45, 0.88), rgba(14, 15, 21, 0.9)) !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
    overflow: hidden !important;
}

#top .home-hero .hero-server-copy {
    display: grid !important;
    align-content: center !important;
    gap: 14px !important;
    min-width: 0 !important;
    text-align: left !important;
}

#top .home-hero .hero-server-copy > span,
#top .home-hero .preview-server-status {
    width: max-content !important;
    max-width: 100% !important;
}

#top .home-hero .hero-server-copy h2 {
    max-width: 420px !important;
    margin: 0 !important;
    font-size: clamp(32px, 2.6vw, 46px) !important;
    line-height: 0.98 !important;
    letter-spacing: 0 !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    text-wrap: balance !important;
}

#top .home-hero .hero-server-copy p {
    max-width: 520px !important;
    margin: 0 !important;
    font-size: clamp(15px, 1.02vw, 17px) !important;
    line-height: 1.48 !important;
}

#top .home-hero .preview-server-tags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin-top: 6px !important;
}

#top .home-hero .hero-server-divider {
    width: 1px !important;
    min-height: 190px !important;
    background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.14), rgba(255, 49, 76, 0.32), transparent) !important;
}

#top .home-hero .hero-server-panel {
    min-width: 0 !important;
    display: grid !important;
    align-content: center !important;
    gap: 12px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

#top .home-hero .hero-server-panel strong {
    display: block !important;
    max-width: 100% !important;
    font-size: clamp(20px, 1.45vw, 28px) !important;
    line-height: 1.04 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

#top .home-hero .hero-server-panel code {
    display: block !important;
    width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

#top .home-hero .preview-server-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
}

#top .home-hero .preview-server-actions .btn {
    min-width: 0 !important;
    padding-inline: 16px !important;
}

#top .latest-products-section {
    width: min(1280px, calc(100% - 44px)) !important;
    margin: clamp(58px, 6vw, 92px) auto clamp(44px, 5vw, 74px) !important;
    padding: 0 !important;
}

#top .latest-products-heading {
    display: grid !important;
    justify-items: center !important;
    gap: 10px !important;
    margin: 0 auto clamp(22px, 2vw, 32px) !important;
    text-align: center !important;
}

#top .latest-products-heading::before,
#top .latest-products-heading::after {
    display: none !important;
}

#top .latest-products-heading span {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 30px !important;
    padding: 0 18px !important;
    border: 1px solid rgba(255, 49, 76, 0.62) !important;
    border-radius: 999px !important;
    color: #ff3150 !important;
    background: linear-gradient(135deg, rgba(255, 49, 76, 0.14), rgba(18, 19, 25, 0.86)) !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
}

#top .latest-products-heading h2 {
    display: block !important;
    margin: 0 !important;
    color: #fff !important;
    font-size: clamp(32px, 3vw, 48px) !important;
    line-height: 0.98 !important;
    font-weight: 950 !important;
    letter-spacing: 0 !important;
}

#top .latest-products-slider.hero-product-showcase,
#top .latest-products-slider.hero-product-showcase:has(.hero-latest-card) {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(14px, 1.35vw, 20px) !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

#top .latest-products-slider .hero-products-empty[hidden],
#top .latest-products-slider.has-products .hero-products-empty,
#top .latest-products-slider.hero-product-showcase:has(.hero-latest-card) .hero-products-empty {
    display: none !important;
}

#top .latest-products-slider.hero-product-showcase:not(:has(.hero-latest-card)):not(.has-products) {
    display: flex !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase:not(:has(.hero-latest-card)):not(.has-products) .hero-products-empty {
    display: grid !important;
    width: min(100%, 430px) !important;
    min-height: 150px !important;
    padding: 28px !important;
    text-align: center !important;
    place-content: center !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 20px !important;
    background:
        radial-gradient(circle at 10% 0%, rgba(255, 49, 76, 0.18), transparent 48%),
        linear-gradient(145deg, rgba(35, 36, 44, 0.85), rgba(13, 14, 20, 0.92)) !important;
    box-shadow: 0 22px 58px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="1"],
#top .latest-products-slider.hero-product-showcase:has(.hero-latest-card:nth-of-type(1):last-child) {
    grid-template-columns: minmax(280px, 360px) !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
    grid-template-columns: repeat(2, minmax(280px, 360px)) !important;
    justify-content: center !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto 1fr auto !important;
    gap: 12px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: 100% !important;
    padding: 12px !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 18px !important;
    background:
        radial-gradient(circle at 12% 0%, rgba(255, 49, 76, 0.2), transparent 44%),
        linear-gradient(145deg, rgba(38, 39, 47, 0.9), rgba(14, 15, 21, 0.94)) !important;
    box-shadow: 0 22px 58px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
    overflow: hidden !important;
}

#top .latest-products-slider .hero-latest-media,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-media {
    width: 100% !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: rgba(0, 0, 0, 0.32) !important;
}

#top .latest-products-slider .hero-latest-media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

#top .latest-products-slider .hero-latest-copy {
    display: grid !important;
    gap: 8px !important;
    min-width: 0 !important;
}

#top .latest-products-slider .hero-latest-kicker {
    width: max-content !important;
    max-width: 100% !important;
}

#top .latest-products-slider .hero-latest-title,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-title {
    display: -webkit-box !important;
    font-size: clamp(18px, 1.2vw, 23px) !important;
    line-height: 1.08 !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-desc {
    display: -webkit-box !important;
    font-size: 14px !important;
    line-height: 1.38 !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-price {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-top: 2px !important;
}

#top .latest-products-slider .hero-latest-price strong {
    font-size: clamp(19px, 1.35vw, 26px) !important;
}

#top .latest-products-slider .hero-latest-discount {
    margin-left: auto !important;
}

@media (max-width: 1180px) {
    #top .home-hero .hero-server-showcase {
        width: min(100%, 560px) !important;
        grid-template-columns: 1fr !important;
    }

    #top .home-hero .hero-server-divider {
        display: none !important;
    }

    #top .home-hero .hero-server-panel strong {
        white-space: normal !important;
    }

    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase:has(.hero-latest-card) {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 720px) {
    #top .home-hero .hero-server-showcase,
    #top .latest-products-section {
        width: min(100% - 28px, 560px) !important;
    }

    #top .home-hero .hero-server-copy h2 {
        font-size: clamp(32px, 10vw, 44px) !important;
    }

    #top .home-hero .preview-server-actions {
        grid-template-columns: 1fr !important;
    }

    #top .latest-products-heading h2 {
        font-size: clamp(30px, 10vw, 42px) !important;
    }

    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase:has(.hero-latest-card),
    #top .latest-products-slider.hero-product-showcase[data-product-count="1"],
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
        grid-template-columns: 1fr !important;
    }
}

/* Final homepage latest resources mini rail. */
#top .latest-products-section {
    position: relative !important;
    isolation: isolate !important;
    width: min(1480px, calc(100% - 44px)) !important;
    margin: clamp(58px, 5.6vw, 90px) auto clamp(34px, 4vw, 62px) !important;
    padding: 0 !important;
}

#top .latest-products-heading {
    display: grid !important;
    place-items: center !important;
    margin: 0 auto clamp(22px, 2.4vw, 34px) !important;
    text-align: center !important;
}

#top .latest-products-heading span {
    display: grid !important;
    grid-template-columns: minmax(72px, 1fr) auto minmax(72px, 1fr) !important;
    align-items: center !important;
    gap: clamp(14px, 2vw, 24px) !important;
    width: min(820px, 100%) !important;
    color: #fff !important;
    font-size: clamp(22px, 2.15vw, 32px) !important;
    font-weight: 950 !important;
    line-height: 1.08 !important;
    text-shadow: 0 14px 34px rgba(0, 0, 0, .58) !important;
}

#top .latest-products-heading span::before,
#top .latest-products-heading span::after {
    content: "" !important;
    height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .18), rgba(244, 25, 57, .42)) !important;
}

#top .latest-products-heading span::after {
    background: linear-gradient(90deg, rgba(244, 25, 57, .42), rgba(255, 255, 255, .18), transparent) !important;
}

#top .latest-products-heading h2 {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

#top .latest-products-slider.hero-product-showcase {
    position: relative !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(16px, 1.5vw, 24px) !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

#top .latest-products-slider.hero-product-showcase::before,
#top .latest-products-slider.hero-product-showcase::after {
    content: "" !important;
    position: absolute !important;
    top: -18px !important;
    bottom: -18px !important;
    width: min(120px, 8vw) !important;
    z-index: 2 !important;
    pointer-events: none !important;
}

#top .latest-products-slider.hero-product-showcase::before {
    left: -5px !important;
    background: linear-gradient(90deg, rgba(4, 4, 7, .84), transparent) !important;
}

#top .latest-products-slider.hero-product-showcase::after {
    right: -5px !important;
    background: linear-gradient(270deg, rgba(4, 4, 7, .84), transparent) !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="1"] {
    grid-template-columns: minmax(280px, 420px) !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
    grid-template-columns: repeat(2, minmax(280px, 420px)) !important;
    justify-content: center !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    position: relative !important;
    z-index: 1 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto 1fr auto !important;
    gap: 13px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: 100% !important;
    padding: 12px !important;
    color: var(--text) !important;
    text-decoration: none !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, .12) !important;
    border-radius: 16px !important;
    background:
        radial-gradient(circle at 18% 0%, rgba(244, 25, 57, .24), transparent 44%),
        linear-gradient(145deg, rgba(36, 37, 45, .9), rgba(13, 14, 19, .94)) !important;
    box-shadow: 0 22px 56px rgba(0, 0, 0, .48), inset 0 1px 0 rgba(255, 255, 255, .06) !important;
    transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease, background .24s ease !important;
}

#top .latest-products-slider .hero-latest-card:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(255, 49, 76, .55) !important;
    box-shadow: 0 30px 72px rgba(0, 0, 0, .58), 0 0 34px rgba(244, 25, 57, .15), inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

#top .latest-products-slider .hero-latest-card::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    background: linear-gradient(90deg, rgba(255, 255, 255, .06), transparent 34%, rgba(244, 25, 57, .08)) !important;
    opacity: .55 !important;
    pointer-events: none !important;
}

#top .latest-products-slider .hero-latest-media,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-media {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, .09) !important;
    border-radius: 12px !important;
    background: linear-gradient(145deg, rgba(255, 255, 255, .06), rgba(0, 0, 0, .3)) !important;
}

#top .latest-products-slider .hero-latest-media img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    filter: saturate(.96) contrast(1.06) brightness(.82) !important;
    transition: transform .32s ease, filter .32s ease !important;
}

#top .latest-products-slider .hero-latest-card:hover .hero-latest-media img {
    transform: scale(1.045) !important;
    filter: saturate(1.08) contrast(1.1) brightness(.92) !important;
}

#top .latest-products-slider .hero-latest-media::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(180deg, transparent 48%, rgba(0, 0, 0, .44)) !important;
    pointer-events: none !important;
}

#top .latest-products-slider .hero-latest-placeholder {
    display: grid !important;
    place-items: center !important;
    width: 100% !important;
    height: 100% !important;
    color: rgba(255, 255, 255, .44) !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
}

#top .latest-products-slider .hero-latest-copy {
    display: grid !important;
    align-content: start !important;
    gap: 8px !important;
    min-width: 0 !important;
    padding: 0 2px !important;
}

#top .latest-products-slider .hero-latest-kicker {
    width: max-content !important;
    max-width: 100% !important;
    padding: 5px 9px !important;
    border: 1px solid rgba(255, 255, 255, .14) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .08) !important;
    color: rgba(255, 255, 255, .82) !important;
    font-size: 11px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
}

#top .latest-products-slider .hero-latest-title,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-title {
    display: -webkit-box !important;
    color: #fff !important;
    font-size: clamp(20px, 1.45vw, 26px) !important;
    font-weight: 950 !important;
    line-height: 1.08 !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-desc {
    display: -webkit-box !important;
    color: rgba(235, 238, 246, .68) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-price,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-price {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    flex-wrap: wrap !important;
    min-height: 38px !important;
    margin-top: 2px !important;
    padding: 11px 2px 0 !important;
    border-top: 1px solid rgba(255, 255, 255, .08) !important;
}

#top .latest-products-slider .hero-latest-price strong {
    color: #fff !important;
    font-size: clamp(22px, 1.55vw, 30px) !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

#top .latest-products-slider .hero-latest-price s {
    color: rgba(255, 255, 255, .36) !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

#top .latest-products-slider .hero-latest-discount {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 24px !important;
    padding: 5px 8px !important;
    border-radius: 7px !important;
    background: linear-gradient(135deg, #ff2448, #b4001f) !important;
    color: #fff !important;
    font-size: 12px !important;
    font-style: normal !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

@media (max-width: 1100px) {
    #top .latest-products-slider.hero-product-showcase {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 720px) {
    #top .latest-products-section {
        width: min(100% - 28px, 520px) !important;
        margin-top: 44px !important;
    }

    #top .latest-products-heading span {
        grid-template-columns: 1fr !important;
    }

    #top .latest-products-heading span::before,
    #top .latest-products-heading span::after,
    #top .latest-products-slider.hero-product-showcase::before,
    #top .latest-products-slider.hero-product-showcase::after {
        display: none !important;
    }

    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase[data-product-count="1"],
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }
}

/* Home latest products: compact live Tebex cards instead of full catalog cards. */
.hero-product-source,
.hero-product-source[hidden],
[data-hero-product-source] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
    position: absolute !important;
    inline-size: 0 !important;
    block-size: 0 !important;
    overflow: hidden !important;
}

.home-hero .hero-product-showcase > .product-card:not(.hero-latest-card) {
    display: none !important;
    visibility: hidden !important;
}

.home-hero .hero-product-showcase {
    width: min(100%, 700px);
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    align-self: center;
    padding: clamp(14px, 1.5vw, 20px);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 24px;
    background:
        radial-gradient(420px 190px at 0 0, rgba(255, 49, 76, 0.18), transparent 70%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(13, 14, 20, 0.78) 48%, rgba(82, 10, 24, 0.22));
    box-shadow:
        0 26px 80px rgba(0, 0, 0, 0.42),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(18px);
}

.home-hero .hero-product-showcase:not(.has-products) {
    grid-template-columns: 1fr;
}

.home-hero .hero-product-showcase[data-product-count="1"] {
    grid-template-columns: 1fr;
    max-width: 560px;
}

.home-hero .hero-product-showcase[data-product-count="2"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.home-hero .hero-product-showcase[data-product-count="3"] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.home-hero .hero-product-showcase[data-product-count="4"] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.home-hero .hero-product-showcase.has-products .hero-products-empty,
.hero-products-empty[hidden] {
    display: none !important;
}

.hero-products-empty {
    grid-column: 1 / -1;
    display: grid;
    gap: 8px;
    padding: 28px;
    min-height: 180px;
    align-content: center;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 18px;
    color: rgba(226, 230, 238, 0.76);
    background: rgba(8, 9, 13, 0.42);
}

.hero-products-empty strong {
    color: #ffffff;
    font-size: clamp(22px, 2vw, 30px);
    line-height: 1.08;
}

.hero-latest-card {
    position: relative;
    min-width: 0;
    min-height: 214px;
    display: grid;
    align-content: start;
    gap: 12px;
    padding: 14px;
    overflow: hidden;
    color: #ffffff;
    text-decoration: none;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 18px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(9, 10, 14, 0.74) 62%, rgba(63, 8, 20, 0.2));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 18px 44px rgba(0, 0, 0, 0.24);
    transition:
        transform 0.22s ease,
        border-color 0.22s ease,
        background 0.22s ease,
        box-shadow 0.22s ease;
}

.hero-latest-card::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(240px 120px at 15% 0%, rgba(255, 49, 76, 0.16), transparent 66%);
    opacity: 0.82;
}

.hero-latest-card:hover {
    transform: translateY(-2px);
    border-color: rgba(255, 49, 76, 0.48);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 24px 56px rgba(0, 0, 0, 0.32),
        0 0 28px rgba(255, 49, 76, 0.12);
}

.hero-latest-card.is-featured {
    grid-column: 1 / -1;
    min-height: 126px;
    grid-template-columns: minmax(116px, 150px) minmax(0, 1fr) auto;
    align-items: center;
}

.home-hero .hero-product-showcase[data-product-count="1"] .hero-latest-card.is-featured {
    grid-template-columns: minmax(128px, 172px) minmax(0, 1fr);
}

.hero-latest-media {
    position: relative;
    z-index: 1;
    width: 100%;
    aspect-ratio: 16 / 10;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 14px;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(0, 0, 0, 0.6));
}

.hero-latest-card.is-featured .hero-latest-media {
    height: 104px;
    aspect-ratio: auto;
}

.hero-latest-media img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.hero-latest-placeholder {
    color: rgba(255, 255, 255, 0.62);
    font-size: 11px;
    font-weight: 900;
    line-height: 1.2;
    text-transform: uppercase;
}

.hero-latest-copy {
    position: relative;
    z-index: 1;
    min-width: 0;
    display: grid;
    gap: 5px;
}

.hero-latest-kicker {
    color: #ff2f53;
    font-size: 10px;
    font-weight: 900;
    line-height: 1.2;
    text-transform: uppercase;
}

.hero-latest-title {
    color: #ffffff;
    font-size: clamp(18px, 1.45vw, 24px);
    font-weight: 950;
    line-height: 1.02;
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.hero-latest-card.is-featured .hero-latest-title {
    max-width: 430px;
    font-size: clamp(26px, 2.2vw, 36px);
}

.hero-latest-desc {
    color: rgba(224, 229, 238, 0.78);
    font-size: 14px;
    line-height: 1.38;
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.hero-latest-price {
    position: relative;
    z-index: 1;
    display: inline-flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: flex-start;
    gap: 8px;
    color: #ffffff;
    font-weight: 950;
    line-height: 1;
}

.hero-latest-card.is-featured .hero-latest-price {
    justify-self: end;
    font-size: clamp(22px, 1.7vw, 30px);
}

.home-hero .hero-product-showcase[data-product-count="1"] .hero-latest-card.is-featured .hero-latest-price {
    justify-self: start;
}

.hero-latest-price s {
    color: rgba(224, 229, 238, 0.54);
    font-size: 0.72em;
    font-weight: 800;
}

.hero-latest-price strong {
    color: #ffffff;
}

@media (min-width: 1181px) {
    .home-hero .hero-inner {
        grid-template-columns: minmax(0, 700px) minmax(460px, 680px) !important;
        gap: clamp(34px, 5vw, 76px) !important;
        justify-content: space-between !important;
        align-items: center !important;
    }
}

@media (max-width: 1180px) {
    .home-hero .hero-product-showcase {
        width: min(100%, 720px);
        margin-top: 20px;
    }
}

@media (max-width: 760px) {
    .home-hero .hero-product-showcase,
    .home-hero .hero-product-showcase[data-product-count] {
        grid-template-columns: 1fr;
        padding: 14px;
        border-radius: 20px;
    }

    .hero-latest-card.is-featured {
        grid-template-columns: 1fr;
    }

    .hero-latest-card.is-featured .hero-latest-media {
        height: auto;
        aspect-ratio: 16 / 10;
    }

    .hero-latest-card.is-featured .hero-latest-price {
        justify-self: start;
    }
}

html:has(body.cart-open) {
    overflow: hidden !important;
}

body::before,
body::after {
    content: none !important;
    display: none !important;
    position: static !important;
    inset: auto !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    background: none !important;
    box-shadow: none !important;
    transform: none !important;
    animation: none !important;
}

/* Floating REDACTOR atmosphere. Fixed decorative layers do not affect page height or scrolling. */
body > * {
    position: relative;
    z-index: 1;
}

body::before,
body::after {
    content: "" !important;
    display: block !important;
    position: fixed !important;
    inset: -12vh -10vw !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    pointer-events: none !important;
    z-index: 0 !important;
}

body::before {
    opacity: 0.36 !important;
    background:
        radial-gradient(560px 320px at 14% 18%, rgba(255, 49, 76, 0.042), transparent 72%),
        radial-gradient(460px 300px at 82% 20%, rgba(255, 49, 76, 0.026), transparent 74%),
        radial-gradient(720px 420px at 56% 78%, rgba(72, 6, 17, 0.065), transparent 76%),
        radial-gradient(680px 340px at 28% 86%, rgba(255, 49, 76, 0.034), transparent 76%),
        radial-gradient(520px 300px at 92% 64%, rgba(255, 92, 110, 0.026), transparent 74%),
        radial-gradient(420px 260px at 30% 62%, rgba(255, 255, 255, 0.022), transparent 72%) !important;
    filter: blur(28px) saturate(0.92) !important;
    transform: translate3d(0, 0, 0) scale(1) !important;
    animation: redactor-fog-float 28s ease-in-out infinite alternate !important;
}

body::after {
    opacity: 0.32 !important;
    background-image:
        radial-gradient(circle at 10% 22%, rgba(255, 49, 76, 0.3) 0 1px, rgba(255, 49, 76, 0.064) 2px, transparent 5px),
        radial-gradient(circle at 68% 12%, rgba(255, 91, 111, 0.18) 0 1px, rgba(255, 49, 76, 0.042) 2px, transparent 5px),
        radial-gradient(circle at 88% 58%, rgba(255, 255, 255, 0.12) 0 1px, rgba(255, 49, 76, 0.04) 2px, transparent 5px),
        radial-gradient(circle at 34% 78%, rgba(255, 49, 76, 0.24) 0 1px, rgba(255, 49, 76, 0.05) 2px, transparent 5px),
        radial-gradient(circle at 48% 36%, rgba(255, 49, 76, 0.13) 0 1px, transparent 4px),
        radial-gradient(circle at 78% 84%, rgba(255, 120, 137, 0.14) 0 1px, transparent 4px),
        radial-gradient(circle at 22% 50%, rgba(255, 255, 255, 0.08) 0 1px, transparent 4px),
        radial-gradient(circle at 92% 18%, rgba(255, 49, 76, 0.18) 0 1px, rgba(255, 49, 76, 0.035) 2px, transparent 5px),
        radial-gradient(circle at 56% 66%, rgba(255, 255, 255, 0.06) 0 1px, rgba(255, 49, 76, 0.028) 2px, transparent 5px),
        radial-gradient(circle at 6% 84%, rgba(255, 49, 76, 0.12) 0 1px, transparent 4px) !important;
    background-size: 360px 520px, 520px 620px, 430px 560px, 610px 700px, 300px 440px, 480px 640px, 390px 500px, 460px 580px, 570px 650px, 340px 490px !important;
    background-position: 0 0, 120px 80px, 40px 160px, 220px 120px, 80px 40px, 160px 220px, 260px 60px, 320px 30px, 70px 260px, 180px 340px !important;
    background-repeat: repeat !important;
    filter: blur(0.2px) !important;
    transform: translate3d(0, 0, 0) !important;
    animation: redactor-sparks-drift 18s linear infinite !important;
}

.redactor-ambient-canvas {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 0 !important;
    pointer-events: none !important;
    opacity: 0.7;
    mix-blend-mode: screen;
    filter: saturate(0.98) brightness(0.94);
}

@keyframes redactor-fog-float {
    0% {
        opacity: 0.24;
        transform: translate3d(-4vw, -3vh, 0) scale(1.04);
    }

    48% {
        opacity: 0.36;
        transform: translate3d(5vw, 3.5vh, 0) scale(1.08);
    }

    100% {
        opacity: 0.28;
        transform: translate3d(-2vw, 6vh, 0) scale(1.06);
    }
}

@keyframes redactor-sparks-drift {
    0% {
        background-position: 0 0, 120px 80px, 40px 160px, 220px 120px, 80px 40px, 160px 220px, 260px 60px, 320px 30px, 70px 260px, 180px 340px;
        opacity: 0.24;
        transform: translate3d(-4vw, 2vh, 0);
    }

    50% {
        opacity: 0.42;
        transform: translate3d(4vw, -7vh, 0);
    }

    100% {
        background-position: 184px -420px, -90px -360px, 240px -300px, 20px -460px, 260px -260px, -70px -390px, 420px -330px, 140px -410px, 310px -260px, -120px -300px;
        opacity: 0.3;
        transform: translate3d(-3vw, -13vh, 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    body::before,
    body::after {
        animation: none !important;
    }
}

/* The panel image belongs only to the first home screen. It scrolls away with the hero,
   while the shared animated background continues across every page. */
.hero.home-hero {
    position: relative !important;
    isolation: isolate !important;
    overflow: visible !important;
    background: transparent !important;
}

.hero.home-hero .hero-bg,
.hero.home-hero .hero-shade,
.hero.home-hero .hero-depth-lines {
    display: block !important;
    position: absolute !important;
    pointer-events: none !important;
    background-repeat: no-repeat !important;
}

.hero.home-hero .hero-bg {
    inset: 0 0 -320px !important;
    z-index: 0 !important;
    background-image: var(--hero-image) !important;
    background-size: cover !important;
    background-position: 72% top !important;
    opacity: 0.68 !important;
    filter: saturate(1.08) contrast(1.08) brightness(0.72) !important;
    transform: translate3d(0, 0, 0) !important;
    -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 56%, rgba(0, 0, 0, 0.78) 70%, rgba(0, 0, 0, 0.34) 86%, transparent 100%) !important;
    mask-image: linear-gradient(180deg, #000 0%, #000 56%, rgba(0, 0, 0, 0.78) 70%, rgba(0, 0, 0, 0.34) 86%, transparent 100%) !important;
}

.hero.home-hero .hero-shade {
    inset: 0 0 -320px !important;
    z-index: 1 !important;
    background:
        linear-gradient(90deg, rgba(2, 3, 7, 0.86) 0%, rgba(2, 3, 7, 0.58) 34%, rgba(2, 3, 7, 0.22) 68%, rgba(24, 2, 8, 0.46) 100%),
        linear-gradient(180deg, rgba(2, 3, 7, 0.12) 0%, rgba(2, 3, 7, 0.18) 42%, rgba(2, 3, 7, 0.7) 74%, rgba(2, 3, 7, 0.96) 100%),
        radial-gradient(720px 420px at 18% 36%, rgba(2, 3, 7, 0.62), transparent 72%),
        radial-gradient(860px 520px at 82% 8%, rgba(255, 49, 76, 0.1), transparent 78%) !important;
    -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 64%, rgba(0, 0, 0, 0.82) 82%, transparent 100%) !important;
    mask-image: linear-gradient(180deg, #000 0%, #000 64%, rgba(0, 0, 0, 0.82) 82%, transparent 100%) !important;
}

.hero.home-hero .hero-depth-lines {
    inset: 0 0 -260px !important;
    z-index: 2 !important;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.024) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 255, 255, 0.014) 1px, transparent 1px),
        linear-gradient(114deg, transparent 0 57%, rgba(255, 255, 255, 0.045) 57.1%, transparent 57.42%),
        linear-gradient(103deg, transparent 0 71%, rgba(255, 49, 76, 0.07) 71.1%, transparent 71.55%) !important;
    background-size: 96px 96px, 96px 96px, 100% 100%, 100% 100% !important;
    opacity: 0.52 !important;
    mix-blend-mode: screen !important;
    -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 58%, rgba(0, 0, 0, 0.62) 80%, transparent 100%) !important;
    mask-image: linear-gradient(180deg, #000 0%, #000 58%, rgba(0, 0, 0, 0.62) 80%, transparent 100%) !important;
}

.hero.home-hero::before,
.hero.home-hero::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: -44px 0 -330px !important;
    pointer-events: none !important;
    z-index: 2 !important;
    background-repeat: repeat !important;
    -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 62%, rgba(0, 0, 0, 0.66) 82%, transparent 100%) !important;
    mask-image: linear-gradient(180deg, #000 0%, #000 62%, rgba(0, 0, 0, 0.66) 82%, transparent 100%) !important;
}

.hero.home-hero::before {
    background-image:
        radial-gradient(circle at 12% 22%, rgba(255, 49, 76, 0.36) 0 1px, rgba(255, 49, 76, 0.085) 2px, transparent 5px),
        radial-gradient(circle at 64% 14%, rgba(255, 96, 116, 0.22) 0 1px, rgba(255, 49, 76, 0.058) 2px, transparent 5px),
        radial-gradient(circle at 88% 44%, rgba(255, 255, 255, 0.13) 0 1px, rgba(255, 49, 76, 0.046) 2px, transparent 5px),
        radial-gradient(circle at 32% 72%, rgba(255, 49, 76, 0.27) 0 1px, rgba(255, 49, 76, 0.06) 2px, transparent 5px),
        radial-gradient(circle at 46% 38%, rgba(255, 49, 76, 0.16) 0 1px, transparent 4px),
        radial-gradient(circle at 78% 82%, rgba(255, 128, 144, 0.14) 0 1px, transparent 4px),
        radial-gradient(circle at 20% 52%, rgba(255, 255, 255, 0.08) 0 1px, transparent 4px),
        radial-gradient(circle at 94% 20%, rgba(255, 49, 76, 0.24) 0 1px, rgba(255, 49, 76, 0.052) 2px, transparent 5px),
        radial-gradient(circle at 54% 66%, rgba(255, 255, 255, 0.07) 0 1px, rgba(255, 49, 76, 0.03) 2px, transparent 5px),
        radial-gradient(circle at 8% 84%, rgba(255, 49, 76, 0.15) 0 1px, transparent 4px) !important;
    background-size: 330px 470px, 470px 560px, 390px 510px, 560px 640px, 280px 410px, 430px 590px, 360px 480px, 420px 540px, 520px 610px, 310px 440px !important;
    background-position: 0 0, 120px 80px, 40px 160px, 220px 120px, 80px 40px, 160px 220px, 260px 60px, 310px 28px, 70px 250px, 170px 330px !important;
    opacity: 0.54 !important;
    mix-blend-mode: screen !important;
    filter: blur(0.25px) saturate(1.08) !important;
    animation: redactor-hero-sparks-drift 18s linear infinite !important;
}

.hero.home-hero::after {
    background:
        radial-gradient(620px 300px at 18% 28%, rgba(255, 49, 76, 0.068), transparent 72%),
        radial-gradient(680px 330px at 76% 16%, rgba(255, 49, 76, 0.044), transparent 74%),
        radial-gradient(760px 400px at 58% 78%, rgba(70, 6, 17, 0.105), transparent 78%),
        radial-gradient(520px 280px at 38% 12%, rgba(255, 115, 130, 0.028), transparent 74%),
        radial-gradient(620px 340px at 92% 66%, rgba(255, 49, 76, 0.038), transparent 76%),
        radial-gradient(460px 240px at 6% 80%, rgba(255, 255, 255, 0.018), transparent 72%),
        linear-gradient(112deg, transparent 0 18%, rgba(255, 255, 255, 0.026) 18.12% 18.32%, transparent 18.72% 66%, rgba(255, 49, 76, 0.032) 66.1% 66.52%, transparent 67%),
        linear-gradient(76deg, transparent 0 72%, rgba(255, 255, 255, 0.02) 72.12% 72.36%, transparent 72.82%) !important;
    background-size: auto, auto, auto, auto, auto, auto, 140% 140%, 150% 150% !important;
    opacity: 0.5 !important;
    mix-blend-mode: screen !important;
    filter: blur(20px) saturate(1.06) !important;
    animation: redactor-hero-fog-drift 30s ease-in-out infinite alternate !important;
}

.hero.home-hero > :not(.hero-bg):not(.hero-shade):not(.hero-depth-lines) {
    position: relative !important;
    z-index: 4 !important;
}

@keyframes redactor-hero-sparks-drift {
    0% {
        background-position: 0 0, 120px 80px, 40px 160px, 220px 120px, 80px 40px, 160px 220px, 260px 60px, 310px 28px, 70px 250px, 170px 330px;
        opacity: 0.42;
        transform: translate3d(-3vw, 2vh, 0);
    }

    48% {
        opacity: 0.58;
        transform: translate3d(3vw, -6vh, 0);
    }

    100% {
        background-position: 170px -390px, -80px -330px, 220px -280px, 18px -430px, 240px -240px, -60px -360px, 390px -300px, 130px -380px, 300px -250px, -110px -280px;
        opacity: 0.46;
        transform: translate3d(-2vw, -12vh, 0);
    }
}

@keyframes redactor-hero-fog-drift {
    0% {
        opacity: 0.34;
        transform: translate3d(-4vw, -2vh, 0) scale(1.03);
    }

    52% {
        opacity: 0.56;
        transform: translate3d(5vw, 3vh, 0) scale(1.07);
    }

    100% {
        opacity: 0.4;
        transform: translate3d(-2vw, 6vh, 0) scale(1.05);
    }
}

@media (max-width: 760px) {
    .hero.home-hero .hero-bg {
        background-position: 64% top !important;
        opacity: 0.56 !important;
    }
}

/* Global image pass: the panel background is now shared across every page, then fades into the live site atmosphere. */
body > * {
    position: relative;
    z-index: 2;
}

body > .redactor-site-image-bg {
    position: absolute !important;
    inset: 0 0 auto !important;
    z-index: 0 !important;
    width: 100% !important;
    height: clamp(880px, 116svh, 1240px) !important;
    pointer-events: none !important;
    overflow: hidden !important;
    background-image: var(--hero-image) !important;
    background-size: cover !important;
    background-position: 72% top !important;
    background-repeat: no-repeat !important;
    filter: saturate(1.06) contrast(1.08) brightness(0.72) !important;
    transform: translate3d(0, 0, 0) !important;
    -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 48%, rgba(0, 0, 0, 0.82) 64%, rgba(0, 0, 0, 0.38) 84%, transparent 100%) !important;
    mask-image: linear-gradient(180deg, #000 0%, #000 48%, rgba(0, 0, 0, 0.82) 64%, rgba(0, 0, 0, 0.38) 84%, transparent 100%) !important;
}

.redactor-site-image-bg::before,
.redactor-site-image-bg::after {
    content: "" !important;
    position: absolute !important;
    pointer-events: none !important;
}

.redactor-site-image-bg::before {
    inset: 0 !important;
    z-index: 1 !important;
    background:
        linear-gradient(90deg, rgba(2, 3, 7, 0.9) 0%, rgba(2, 3, 7, 0.58) 34%, rgba(2, 3, 7, 0.24) 68%, rgba(25, 2, 9, 0.52) 100%),
        linear-gradient(180deg, rgba(2, 3, 7, 0.14) 0%, rgba(2, 3, 7, 0.18) 44%, rgba(2, 3, 7, 0.72) 76%, rgba(2, 3, 7, 0.98) 100%),
        linear-gradient(90deg, rgba(255, 255, 255, 0.024) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 255, 255, 0.014) 1px, transparent 1px),
        linear-gradient(114deg, transparent 0 56%, rgba(255, 255, 255, 0.04) 56.1%, transparent 56.42%),
        linear-gradient(103deg, transparent 0 70%, rgba(255, 49, 76, 0.074) 70.1%, transparent 70.55%),
        radial-gradient(720px 420px at 18% 36%, rgba(2, 3, 7, 0.62), transparent 72%),
        radial-gradient(860px 520px at 82% 8%, rgba(255, 49, 76, 0.11), transparent 78%) !important;
    background-size: auto, auto, 96px 96px, 96px 96px, 100% 100%, 100% 100%, auto, auto !important;
}

.redactor-site-image-bg::after {
    inset: -70px -7vw -210px !important;
    z-index: 2 !important;
    background-image:
        radial-gradient(circle at 12% 22%, rgba(255, 49, 76, 0.36) 0 1px, rgba(255, 49, 76, 0.082) 2px, transparent 5px),
        radial-gradient(circle at 64% 14%, rgba(255, 96, 116, 0.22) 0 1px, rgba(255, 49, 76, 0.056) 2px, transparent 5px),
        radial-gradient(circle at 88% 44%, rgba(255, 255, 255, 0.13) 0 1px, rgba(255, 49, 76, 0.044) 2px, transparent 5px),
        radial-gradient(circle at 32% 72%, rgba(255, 49, 76, 0.27) 0 1px, rgba(255, 49, 76, 0.058) 2px, transparent 5px),
        radial-gradient(circle at 46% 38%, rgba(255, 49, 76, 0.16) 0 1px, transparent 4px),
        radial-gradient(circle at 78% 82%, rgba(255, 128, 144, 0.14) 0 1px, transparent 4px),
        radial-gradient(circle at 20% 52%, rgba(255, 255, 255, 0.08) 0 1px, transparent 4px),
        radial-gradient(circle at 94% 20%, rgba(255, 49, 76, 0.24) 0 1px, rgba(255, 49, 76, 0.052) 2px, transparent 5px),
        radial-gradient(circle at 54% 66%, rgba(255, 255, 255, 0.07) 0 1px, rgba(255, 49, 76, 0.03) 2px, transparent 5px),
        radial-gradient(circle at 8% 84%, rgba(255, 49, 76, 0.15) 0 1px, transparent 4px),
        radial-gradient(circle at 28% 12%, rgba(255, 49, 76, 0.18) 0 1px, rgba(255, 49, 76, 0.036) 2px, transparent 5px),
        radial-gradient(circle at 70% 52%, rgba(255, 255, 255, 0.06) 0 1px, rgba(255, 49, 76, 0.026) 2px, transparent 5px),
        radial-gradient(circle at 42% 92%, rgba(255, 49, 76, 0.13) 0 1px, transparent 4px),
        radial-gradient(circle at 96% 76%, rgba(255, 97, 116, 0.1) 0 1px, transparent 4px),
        radial-gradient(620px 300px at 18% 28%, rgba(255, 49, 76, 0.068), transparent 72%),
        radial-gradient(680px 330px at 76% 16%, rgba(255, 49, 76, 0.044), transparent 74%),
        radial-gradient(760px 400px at 58% 78%, rgba(70, 6, 17, 0.11), transparent 78%),
        radial-gradient(520px 280px at 38% 12%, rgba(255, 115, 130, 0.03), transparent 74%),
        radial-gradient(620px 340px at 92% 66%, rgba(255, 49, 76, 0.04), transparent 76%),
        radial-gradient(460px 240px at 6% 80%, rgba(255, 255, 255, 0.02), transparent 72%),
        linear-gradient(112deg, transparent 0 18%, rgba(255, 255, 255, 0.026) 18.12% 18.32%, transparent 18.72% 66%, rgba(255, 49, 76, 0.032) 66.1% 66.52%, transparent 67%),
        linear-gradient(76deg, transparent 0 72%, rgba(255, 255, 255, 0.02) 72.12% 72.36%, transparent 72.82%) !important;
    background-size: 330px 470px, 470px 560px, 390px 510px, 560px 640px, 280px 410px, 430px 590px, 360px 480px, 420px 540px, 520px 610px, 310px 440px, 410px 610px, 700px 760px, 560px 720px, 300px 530px, auto, auto, auto, auto, auto, auto, 140% 140%, 150% 150% !important;
    background-position: 0 0, 120px 80px, 40px 160px, 220px 120px, 80px 40px, 160px 220px, 260px 60px, 310px 28px, 70px 250px, 170px 330px, 260px 110px, 90px 300px, 340px 420px, 30px 470px, center, center, center, center, center, center, center, center !important;
    background-repeat: repeat !important;
    opacity: 0.62 !important;
    mix-blend-mode: screen !important;
    filter: blur(0.8px) saturate(1.08) !important;
    animation: redactor-site-image-atmosphere 20s linear infinite !important;
}

.redactor-ambient-canvas,
body::before,
body::after {
    z-index: 1 !important;
}

.redactor-ambient-canvas {
    opacity: 0.84 !important;
    filter: saturate(1.04) brightness(1) !important;
}

body::before {
    opacity: 0.44 !important;
    background:
        radial-gradient(620px 360px at 14% 18%, rgba(255, 49, 76, 0.05), transparent 72%),
        radial-gradient(520px 320px at 82% 20%, rgba(255, 49, 76, 0.032), transparent 74%),
        radial-gradient(760px 440px at 56% 78%, rgba(72, 6, 17, 0.076), transparent 76%),
        radial-gradient(720px 360px at 28% 86%, rgba(255, 49, 76, 0.04), transparent 76%),
        radial-gradient(560px 320px at 92% 64%, rgba(255, 92, 110, 0.03), transparent 74%),
        radial-gradient(520px 280px at 30% 62%, rgba(255, 255, 255, 0.024), transparent 72%),
        radial-gradient(520px 300px at 8% 54%, rgba(255, 49, 76, 0.028), transparent 76%),
        radial-gradient(680px 380px at 68% 92%, rgba(255, 49, 76, 0.026), transparent 78%) !important;
    filter: blur(34px) saturate(0.94) !important;
}

body::after {
    opacity: 0.38 !important;
    background-image:
        radial-gradient(circle at 10% 22%, rgba(255, 49, 76, 0.34) 0 1px, rgba(255, 49, 76, 0.072) 2px, transparent 5px),
        radial-gradient(circle at 68% 12%, rgba(255, 91, 111, 0.2) 0 1px, rgba(255, 49, 76, 0.046) 2px, transparent 5px),
        radial-gradient(circle at 88% 58%, rgba(255, 255, 255, 0.13) 0 1px, rgba(255, 49, 76, 0.044) 2px, transparent 5px),
        radial-gradient(circle at 34% 78%, rgba(255, 49, 76, 0.26) 0 1px, rgba(255, 49, 76, 0.054) 2px, transparent 5px),
        radial-gradient(circle at 48% 36%, rgba(255, 49, 76, 0.15) 0 1px, transparent 4px),
        radial-gradient(circle at 78% 84%, rgba(255, 120, 137, 0.16) 0 1px, transparent 4px),
        radial-gradient(circle at 22% 50%, rgba(255, 255, 255, 0.085) 0 1px, transparent 4px),
        radial-gradient(circle at 92% 18%, rgba(255, 49, 76, 0.22) 0 1px, rgba(255, 49, 76, 0.04) 2px, transparent 5px),
        radial-gradient(circle at 56% 66%, rgba(255, 255, 255, 0.072) 0 1px, rgba(255, 49, 76, 0.03) 2px, transparent 5px),
        radial-gradient(circle at 6% 84%, rgba(255, 49, 76, 0.16) 0 1px, transparent 4px),
        radial-gradient(circle at 28% 14%, rgba(255, 49, 76, 0.18) 0 1px, rgba(255, 49, 76, 0.036) 2px, transparent 5px),
        radial-gradient(circle at 72% 46%, rgba(255, 255, 255, 0.06) 0 1px, rgba(255, 49, 76, 0.026) 2px, transparent 5px),
        radial-gradient(circle at 41% 92%, rgba(255, 49, 76, 0.14) 0 1px, transparent 4px),
        radial-gradient(circle at 96% 74%, rgba(255, 97, 116, 0.09) 0 1px, transparent 4px) !important;
    background-size: 360px 520px, 520px 620px, 430px 560px, 610px 700px, 300px 440px, 480px 640px, 390px 500px, 460px 580px, 570px 650px, 340px 490px, 410px 610px, 700px 760px, 560px 720px, 300px 530px !important;
    background-position: 0 0, 120px 80px, 40px 160px, 220px 120px, 80px 40px, 160px 220px, 260px 60px, 320px 30px, 70px 260px, 180px 340px, 250px 110px, 90px 310px, 330px 430px, 20px 470px !important;
}

.hero.home-hero .hero-bg,
.hero.home-hero .hero-shade,
.hero.home-hero .hero-depth-lines,
.hero.home-hero::before,
.hero.home-hero::after {
    content: none !important;
    display: none !important;
}

.hero.home-hero > :not(.hero-bg):not(.hero-shade):not(.hero-depth-lines) {
    z-index: 3 !important;
}

@keyframes redactor-site-image-atmosphere {
    0% {
        background-position: 0 0, 120px 80px, 40px 160px, 220px 120px, 80px 40px, 160px 220px, 260px 60px, 310px 28px, 70px 250px, 170px 330px, 260px 110px, 90px 300px, 340px 420px, 30px 470px, center, center, center, center, center, center, center, center;
        opacity: 0.5;
        transform: translate3d(-2vw, 1vh, 0);
    }

    50% {
        opacity: 0.68;
        transform: translate3d(2vw, -4vh, 0);
    }

    100% {
        background-position: 170px -390px, -80px -330px, 220px -280px, 18px -430px, 240px -240px, -60px -360px, 390px -300px, 130px -380px, 300px -250px, -110px -280px, 410px -360px, 260px -430px, 70px -520px, 190px -360px, center, center, center, center, center, center, center, center;
        opacity: 0.54;
        transform: translate3d(-1vw, -9vh, 0);
    }
}

@keyframes redactor-sparks-drift {
    0% {
        background-position: 0 0, 120px 80px, 40px 160px, 220px 120px, 80px 40px, 160px 220px, 260px 60px, 320px 30px, 70px 260px, 180px 340px, 250px 110px, 90px 310px, 330px 430px, 20px 470px;
        opacity: 0.28;
        transform: translate3d(-4vw, 2vh, 0);
    }

    50% {
        opacity: 0.48;
        transform: translate3d(4vw, -7vh, 0);
    }

    100% {
        background-position: 184px -420px, -90px -360px, 240px -300px, 20px -460px, 260px -260px, -70px -390px, 420px -330px, 140px -410px, 310px -260px, -120px -300px, 420px -360px, 270px -430px, 80px -520px, 200px -360px;
        opacity: 0.34;
        transform: translate3d(-3vw, -13vh, 0);
    }
}

@media (max-width: 760px) {
    body > .redactor-site-image-bg {
        height: clamp(780px, 112svh, 1040px) !important;
        background-position: 64% top !important;
        filter: saturate(1.04) contrast(1.06) brightness(0.62) !important;
    }
}

/* Performance pass: canvas now handles the living atmosphere, so heavy CSS layers stay quiet. */
body {
    animation: none !important;
}

body::before {
    opacity: 0.24 !important;
    filter: blur(18px) saturate(0.9) !important;
    animation: redactor-fog-float 72s ease-in-out infinite alternate !important;
}

body::after {
    opacity: 0.14 !important;
    filter: none !important;
    animation: none !important;
}

body > .redactor-site-image-bg::after {
    opacity: 0.24 !important;
    filter: none !important;
    animation: none !important;
}

.redactor-ambient-canvas {
    opacity: 0.58 !important;
    filter: none !important;
}

@media (max-width: 760px) {
    body::before {
        opacity: 0.18 !important;
        filter: blur(14px) saturate(0.9) !important;
    }

    body::after,
    body > .redactor-site-image-bg::after {
        opacity: 0.1 !important;
    }

    .redactor-ambient-canvas {
        opacity: 0.42 !important;
    }
}

/* Final UI polish: preview server divider, framework badge and close-button hover. */
.preview-server-panel::before {
    content: none !important;
    display: none !important;
}

.framework-copy > span {
    width: max-content !important;
    min-height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0 12px !important;
    border: 1px solid rgba(255, 49, 76, 0.58) !important;
    border-radius: 999px !important;
    color: #ff314c !important;
    background:
        linear-gradient(135deg, rgba(255, 49, 76, 0.12), rgba(255, 255, 255, 0.026)),
        rgba(255, 49, 76, 0.04) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 12px 30px rgba(255, 49, 76, 0.08) !important;
}

.framework-copy > span::before {
    content: "" !important;
    width: 6px !important;
    height: 6px !important;
    flex: 0 0 6px !important;
    border-radius: 999px !important;
    background: #ff314c !important;
    box-shadow: 0 0 14px rgba(255, 49, 76, 0.72) !important;
}

.support-close,
.cart-close {
    transition:
        color 170ms ease,
        border-color 170ms ease,
        background 170ms ease,
        box-shadow 170ms ease,
        transform 170ms ease !important;
}

.support-close span,
.cart-close::before,
.cart-close::after {
    transition:
        background 170ms ease,
        transform 170ms ease,
        box-shadow 170ms ease !important;
}

.support-close:hover,
.support-close:focus-visible,
.cart-close:hover,
.cart-close:focus-visible {
    color: #ff314c !important;
    border-color: rgba(255, 49, 76, 0.78) !important;
    background:
        linear-gradient(135deg, rgba(255, 49, 76, 0.18), rgba(255, 255, 255, 0.04)),
        rgba(255, 49, 76, 0.06) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.11),
        0 0 0 1px rgba(255, 49, 76, 0.16),
        0 14px 34px rgba(255, 49, 76, 0.18) !important;
    transform: translateY(-1px) scale(1.04) !important;
}

.support-close:hover span:first-child,
.support-close:focus-visible span:first-child {
    transform: rotate(135deg) !important;
}

.support-close:hover span+span,
.support-close:focus-visible span+span {
    transform: rotate(45deg) !important;
}

.cart-close:hover::before,
.cart-close:focus-visible::before {
    transform: rotate(135deg) !important;
}

.cart-close:hover::after,
.cart-close:focus-visible::after {
    transform: rotate(45deg) !important;
}

/* Preview server final card pass: compact, single-piece REDACTOR block. */
.preview-server-card {
    position: relative !important;
    isolation: isolate !important;
    grid-template-columns: minmax(0, 1fr) minmax(390px, 0.43fr) !important;
    align-items: center !important;
    gap: clamp(22px, 3.2vw, 46px) !important;
    min-height: 238px !important;
    padding: clamp(26px, 3.1vw, 38px) !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 20px !important;
    background:
        radial-gradient(680px 240px at 0% 12%, rgba(255, 49, 76, 0.16), transparent 68%),
        radial-gradient(520px 220px at 94% 8%, rgba(255, 255, 255, 0.035), transparent 70%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.064), rgba(255, 255, 255, 0.018) 58%, rgba(255, 49, 76, 0.024)),
        rgba(11, 12, 17, 0.88) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.09),
        inset 0 -1px 0 rgba(255, 49, 76, 0.08),
        0 22px 60px rgba(0, 0, 0, 0.34) !important;
}

.preview-server-card::before {
    content: "" !important;
    position: absolute !important;
    inset: 1px !important;
    z-index: -1 !important;
    border-radius: inherit !important;
    pointer-events: none !important;
    background:
        linear-gradient(90deg, rgba(255, 49, 76, 0.08), transparent 32%, transparent 68%, rgba(255, 255, 255, 0.026)),
        linear-gradient(180deg, rgba(255, 255, 255, 0.038), transparent 42%) !important;
    opacity: 0.72 !important;
}

.preview-server-copy {
    align-self: center !important;
    gap: 12px !important;
}

.preview-server-copy h2 {
    max-width: 720px !important;
    font-size: clamp(30px, 3.05vw, 42px) !important;
    line-height: 1.02 !important;
}

.preview-server-copy p {
    max-width: 760px !important;
    color: rgba(225, 229, 238, 0.74) !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
}

.preview-server-panel {
    align-self: center !important;
    display: grid !important;
    gap: 11px !important;
    min-width: 0 !important;
    padding: 18px !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 16px !important;
    background:
        radial-gradient(360px 170px at 0% 0%, rgba(255, 49, 76, 0.105), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.018)),
        rgba(7, 8, 12, 0.54) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.075),
        0 18px 40px rgba(0, 0, 0, 0.2) !important;
}

.preview-server-panel::before,
.preview-server-panel::after {
    content: none !important;
    display: none !important;
}

.preview-server-status {
    margin-bottom: 2px !important;
    color: rgba(255, 255, 255, 0.86) !important;
    background: rgba(255, 49, 76, 0.055) !important;
}

.preview-server-panel strong {
    max-width: 100% !important;
    color: #fff !important;
    font-size: clamp(18px, 1.32vw, 23px) !important;
    line-height: 1.05 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.preview-server-panel code {
    min-height: 40px !important;
    display: flex !important;
    align-items: center !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 10px !important;
    color: rgba(235, 238, 245, 0.82) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.048), rgba(255, 255, 255, 0.014)),
        rgba(0, 0, 0, 0.18) !important;
}

.preview-server-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

.preview-server-actions .btn {
    width: 100% !important;
    min-height: 44px !important;
    justify-content: center !important;
    padding: 0 14px !important;
}

@media (max-width: 980px) {
    .preview-server-card {
        grid-template-columns: 1fr !important;
        min-height: 0 !important;
    }

    .preview-server-panel strong {
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }
}

@media (max-width: 560px) {
    .preview-server-actions {
        grid-template-columns: 1fr !important;
    }
}

/* Preview server composition pass: less empty space, clearer hierarchy. */
.preview-server-section {
    margin-top: clamp(-38px, -2.5vw, -22px) !important;
    margin-bottom: clamp(26px, 3.6vw, 48px) !important;
}

.preview-server-card {
    grid-template-columns: minmax(0, 0.95fr) minmax(360px, 430px) !important;
    min-height: 218px !important;
    padding: clamp(24px, 2.6vw, 34px) !important;
}

.preview-server-card::after {
    content: "" !important;
    position: absolute !important;
    top: 28px !important;
    bottom: 28px !important;
    left: min(68%, calc(100% - 500px)) !important;
    width: 1px !important;
    pointer-events: none !important;
    background:
        linear-gradient(
            180deg,
            transparent,
            rgba(255, 255, 255, 0.09) 18%,
            rgba(255, 49, 76, 0.22) 50%,
            rgba(255, 255, 255, 0.07) 82%,
            transparent
        ) !important;
    opacity: 0.75 !important;
}

.preview-server-copy {
    max-width: 760px !important;
}

.preview-server-copy h2 {
    max-width: 610px !important;
    font-size: clamp(30px, 2.75vw, 40px) !important;
}

.preview-server-tags {
    max-width: 760px !important;
    margin-top: 8px !important;
    gap: 8px !important;
}

.preview-server-tags span {
    min-height: 30px !important;
    padding: 0 12px !important;
    border-color: rgba(255, 255, 255, 0.13) !important;
    color: rgba(248, 250, 255, 0.84) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.076), rgba(255, 255, 255, 0.022)),
        rgba(14, 15, 20, 0.58) !important;
}

.preview-server-tags span::before {
    background: #ff314c !important;
    box-shadow: 0 0 14px rgba(255, 49, 76, 0.72) !important;
}

.preview-server-panel {
    width: 100% !important;
    justify-self: end !important;
    padding: 16px !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    border-radius: 14px !important;
    background:
        radial-gradient(320px 150px at 12% 0%, rgba(255, 49, 76, 0.09), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.016)),
        rgba(6, 7, 11, 0.48) !important;
}

.preview-server-panel strong {
    font-size: clamp(17px, 1.2vw, 21px) !important;
}

.preview-server-panel code {
    min-height: 38px !important;
    padding: 9px 12px !important;
}

.preview-server-actions .btn {
    min-height: 42px !important;
}

@media (max-width: 1100px) {
    .preview-server-card::after {
        display: none !important;
    }
}

@media (max-width: 980px) {
    .preview-server-card {
        grid-template-columns: 1fr !important;
    }

    .preview-server-copy {
        max-width: none !important;
    }

    .preview-server-panel {
        justify-self: stretch !important;
    }
}

/* Preview server: one card, one divider, no nested-card feeling. */
.preview-server-card {
    grid-template-columns: minmax(0, 1fr) minmax(360px, 450px) !important;
    gap: clamp(24px, 4vw, 58px) !important;
}

.preview-server-card::after {
    top: 24px !important;
    bottom: 24px !important;
    left: auto !important;
    right: clamp(420px, 31vw, 500px) !important;
    display: block !important;
    opacity: 0.78 !important;
    background:
        linear-gradient(
            180deg,
            transparent,
            rgba(255, 255, 255, 0.08) 13%,
            rgba(255, 49, 76, 0.5) 50%,
            rgba(255, 255, 255, 0.075) 87%,
            transparent
        ) !important;
    box-shadow: 0 0 26px rgba(255, 49, 76, 0.18) !important;
}

.preview-server-panel {
    width: min(100%, 430px) !important;
    justify-self: end !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.preview-server-panel code {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.052), rgba(255, 255, 255, 0.014)),
        rgba(4, 5, 9, 0.28) !important;
}

@media (max-width: 1100px) {
    .preview-server-card::after {
        display: none !important;
    }
}

@media (max-width: 980px) {
    .preview-server-panel {
        width: 100% !important;
        justify-self: stretch !important;
        padding-top: 18px !important;
        border-top: 1px solid rgba(255, 49, 76, 0.22) !important;
    }
}

/* Locale dropdown: keep the scrollbar inside the rounded menu. */
.locale-menu {
    width: 198px !important;
    max-height: min(484px, calc(100vh - 124px)) !important;
    display: block !important;
    padding: 8px 11px 8px 8px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scrollbar-gutter: stable !important;
    border-radius: 16px !important;
    clip-path: inset(0 round 16px) !important;
}

.locale-menu a,
.locale-menu button {
    width: 100% !important;
    margin-bottom: 6px !important;
}

.locale-menu a:last-child,
.locale-menu button:last-child {
    margin-bottom: 0 !important;
}

.locale-menu::-webkit-scrollbar {
    width: 6px !important;
}

.locale-menu::-webkit-scrollbar-track {
    margin: 8px 0 !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.028) !important;
}

.locale-menu::-webkit-scrollbar-thumb {
    border: 0 !important;
    border-radius: 999px !important;
    background:
        linear-gradient(180deg, rgba(255, 49, 76, 0.9), rgba(116, 14, 31, 0.82)) !important;
}

/* Locale dropdown scrollbar final fix: no browser arrows, visible thumb is inset. */
.locale-menu {
    box-sizing: border-box !important;
    width: 204px !important;
    padding: 8px 14px 8px 8px !important;
    overflow-y: auto !important;
    scrollbar-width: thin !important;
    scrollbar-color: rgba(255, 49, 76, 0.78) transparent !important;
    background-clip: padding-box !important;
}

.locale-menu::-webkit-scrollbar {
    width: 12px !important;
    background: transparent !important;
}

.locale-menu::-webkit-scrollbar-button,
.locale-menu::-webkit-scrollbar-corner {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
    background: transparent !important;
}

.locale-menu::-webkit-scrollbar-track {
    margin: 12px 3px !important;
    border-radius: 999px !important;
    background: transparent !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.035) !important;
}

.locale-menu::-webkit-scrollbar-thumb {
    min-height: 56px !important;
    border: 4px solid transparent !important;
    border-radius: 999px !important;
    background:
        linear-gradient(180deg, rgba(255, 49, 76, 0.94), rgba(124, 16, 34, 0.84)) border-box !important;
    background-clip: content-box !important;
    box-shadow: none !important;
}

.locale-menu::-webkit-scrollbar-thumb:hover {
    background:
        linear-gradient(180deg, rgba(255, 82, 104, 1), rgba(157, 22, 43, 0.94)) border-box !important;
    background-clip: content-box !important;
}

/* Opera/Chromium scrollbar arrow buttons: remove every concrete state. */
*::-webkit-scrollbar-button,
*::-webkit-scrollbar-button:single-button,
*::-webkit-scrollbar-button:single-button:vertical,
*::-webkit-scrollbar-button:single-button:horizontal,
*::-webkit-scrollbar-button:single-button:vertical:decrement,
*::-webkit-scrollbar-button:single-button:vertical:increment,
*::-webkit-scrollbar-button:single-button:horizontal:decrement,
*::-webkit-scrollbar-button:single-button:horizontal:increment,
*::-webkit-scrollbar-button:vertical:start:decrement,
*::-webkit-scrollbar-button:vertical:end:increment,
*::-webkit-scrollbar-button:horizontal:start:decrement,
*::-webkit-scrollbar-button:horizontal:end:increment,
html::-webkit-scrollbar-button,
body::-webkit-scrollbar-button,
.locale-menu::-webkit-scrollbar-button {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    display: none !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
}

*::-webkit-scrollbar-button:vertical,
html::-webkit-scrollbar-button:vertical,
body::-webkit-scrollbar-button:vertical,
.locale-menu::-webkit-scrollbar-button:vertical {
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
}

*::-webkit-scrollbar-button:horizontal,
html::-webkit-scrollbar-button:horizontal,
body::-webkit-scrollbar-button:horizontal,
.locale-menu::-webkit-scrollbar-button:horizontal {
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
}

/* Final fallback for Opera: neutralize visible scrollbar arrow glyphs. */
::-webkit-scrollbar-button,
::-webkit-scrollbar-button:vertical,
::-webkit-scrollbar-button:vertical:start,
::-webkit-scrollbar-button:vertical:end,
::-webkit-scrollbar-button:vertical:decrement,
::-webkit-scrollbar-button:vertical:increment,
::-webkit-scrollbar-button:vertical:start:decrement,
::-webkit-scrollbar-button:vertical:end:increment,
::-webkit-scrollbar-button:single-button,
::-webkit-scrollbar-button:single-button:vertical,
::-webkit-scrollbar-button:single-button:vertical:decrement,
::-webkit-scrollbar-button:single-button:vertical:increment,
html::-webkit-scrollbar-button,
html::-webkit-scrollbar-button:vertical,
body::-webkit-scrollbar-button,
body::-webkit-scrollbar-button:vertical,
.locale-menu::-webkit-scrollbar-button,
.locale-menu::-webkit-scrollbar-button:vertical {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 0 !important;
    height: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background-color: transparent !important;
    background-image: linear-gradient(transparent, transparent) !important;
    box-shadow: none !important;
    color: transparent !important;
}

html::-webkit-scrollbar-button:vertical,
body::-webkit-scrollbar-button:vertical,
::-webkit-scrollbar-button:vertical {
    height: 1px !important;
    background:
        linear-gradient(180deg, rgba(7, 8, 12, 0.96), rgba(7, 8, 12, 0.96)) !important;
}

.locale-menu::-webkit-scrollbar-button:vertical {
    height: 1px !important;
    background:
        linear-gradient(180deg, rgba(16, 17, 22, 0.98), rgba(16, 17, 22, 0.98)) !important;
}

/* Chromium/Opera fix: standard scrollbar-* overrides WebKit button styling. */
@supports selector(::-webkit-scrollbar) {
    html,
    body,
    .locale-menu,
    .nav-dropdown-menu,
    .cart-items,
    .gallery-strip,
    .rl-flow-section .rl-flow {
        scrollbar-width: auto !important;
        scrollbar-color: auto !important;
    }

    html::-webkit-scrollbar-button,
    body::-webkit-scrollbar-button,
    .locale-menu::-webkit-scrollbar-button,
    .nav-dropdown-menu::-webkit-scrollbar-button,
    .cart-items::-webkit-scrollbar-button,
    .gallery-strip::-webkit-scrollbar-button,
    .rl-flow-section .rl-flow::-webkit-scrollbar-button {
        width: 0 !important;
        height: 0 !important;
        display: none !important;
        -webkit-appearance: none !important;
        appearance: none !important;
        background: transparent !important;
    }
}

/* Final REDACTOR scrollbar colors: dark track, restrained red thumb. */
::-webkit-scrollbar {
    width: 14px !important;
    height: 14px !important;
}

::-webkit-scrollbar-track {
    background:
        linear-gradient(180deg, rgba(255, 49, 76, 0.035), transparent 30%, rgba(255, 49, 76, 0.026)),
        rgba(5, 6, 10, 0.96) !important;
    border-left: 1px solid rgba(255, 255, 255, 0.035) !important;
}

::-webkit-scrollbar-thumb {
    border: 4px solid rgba(5, 6, 10, 0.96) !important;
    border-radius: 999px !important;
    background:
        linear-gradient(180deg, rgba(255, 75, 94, 0.84), rgba(201, 17, 43, 0.76) 48%, rgba(89, 8, 19, 0.88)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.15),
        0 0 12px rgba(255, 49, 76, 0.11) !important;
}

::-webkit-scrollbar-thumb:hover {
    background:
        linear-gradient(180deg, rgba(255, 96, 114, 0.92), rgba(232, 20, 48, 0.86) 52%, rgba(118, 10, 25, 0.94)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.19),
        0 0 18px rgba(255, 49, 76, 0.18) !important;
}

.locale-menu::-webkit-scrollbar {
    width: 10px !important;
}

.locale-menu::-webkit-scrollbar-track {
    margin: 12px 3px !important;
    background: rgba(3, 4, 8, 0.28) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.026) !important;
}

.locale-menu::-webkit-scrollbar-thumb {
    border: 3px solid transparent !important;
    background:
        linear-gradient(180deg, rgba(255, 75, 94, 0.84), rgba(190, 17, 41, 0.78), rgba(86, 8, 18, 0.9)) border-box !important;
    background-clip: content-box !important;
}

.locale-menu::-webkit-scrollbar-thumb:hover {
    background:
        linear-gradient(180deg, rgba(255, 98, 116, 0.94), rgba(224, 20, 48, 0.86), rgba(112, 10, 24, 0.94)) border-box !important;
    background-clip: content-box !important;
}

/* Homepage flow polish: intro -> test -> compatibility -> catalog -> proof -> checkout. */
#top .preview-server-section {
    margin-bottom: clamp(18px, 2.8vw, 34px) !important;
}

#top .trust-bar {
    margin-top: clamp(8px, 1.4vw, 18px) !important;
    margin-bottom: clamp(18px, 2.4vw, 30px) !important;
}

#top .framework-support {
    margin-top: clamp(18px, 2.2vw, 28px) !important;
    margin-bottom: clamp(36px, 4.6vw, 66px) !important;
}

#top .category-nav-section {
    padding-top: clamp(34px, 4.2vw, 60px) !important;
    padding-bottom: clamp(28px, 3.6vw, 52px) !important;
}

#top .category-nav-section + #catalog.catalog-section {
    padding-top: clamp(28px, 3.4vw, 48px) !important;
}

#top #catalog.catalog-section {
    padding-bottom: clamp(44px, 5vw, 72px) !important;
}

#top #catalog.catalog-section .section-head,
#top .category-nav-head,
#top .problems-section .section-head,
#top .why-section .section-head,
#top .split-section .decision-copy,
#top .faq-section .section-head {
    max-width: 820px;
}

#top .catalog-more {
    margin-top: clamp(24px, 3.2vw, 42px) !important;
}

#top .problems-section {
    padding-top: clamp(48px, 5vw, 76px) !important;
    padding-bottom: clamp(26px, 3.2vw, 44px) !important;
}

#top .why-section {
    padding-top: clamp(28px, 3.2vw, 46px) !important;
    padding-bottom: clamp(48px, 5.4vw, 78px) !important;
}

#top .why-section::before {
    opacity: 0.18 !important;
}

#top .why-grid .home-card {
    min-height: 196px !important;
}

#top .why-grid .home-card h3,
#top .problem-grid .home-card h3 {
    margin-top: 14px !important;
}

#top .split-section {
    padding-top: clamp(50px, 5.6vw, 82px) !important;
}

#top .faq-section {
    padding-top: clamp(44px, 4.8vw, 70px) !important;
}

#top .final-cta {
    margin-top: clamp(20px, 2.6vw, 36px) !important;
    text-align: center !important;
}

#top .final-cta .hero-actions {
    justify-content: center !important;
}

@media (max-width: 980px) {
    #top .framework-support {
        margin-bottom: 38px !important;
    }

    #top .category-nav-section,
    #top #catalog.catalog-section,
    #top .problems-section,
    #top .why-section,
    #top .split-section,
    #top .faq-section {
        padding-top: 38px !important;
        padding-bottom: 38px !important;
    }
}

/* Final upgrade cards polish: compact original cards with the step number tucked into the right side. */
#top .category-nav {
    gap: 18px !important;
}

#top .category-card {
    min-height: 268px !important;
    padding: 24px !important;
    gap: 13px !important;
    align-content: start !important;
    border-radius: 18px !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
    background:
        radial-gradient(260px 180px at 7% 0%, rgba(255, 49, 76, 0.18), transparent 68%),
        radial-gradient(220px 150px at 92% 24%, rgba(255, 255, 255, 0.045), transparent 70%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.074), rgba(255, 255, 255, 0.022) 54%, rgba(233, 18, 42, 0.045)),
        rgba(12, 13, 17, 0.82) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.09),
        inset 0 -1px 0 rgba(255, 49, 76, 0.06),
        0 18px 44px rgba(0, 0, 0, 0.28) !important;
}

#top .category-card::before {
    top: 22px !important;
    right: 24px !important;
    left: auto !important;
    transform: none !important;
    color: rgba(255, 255, 255, 0.043) !important;
    font-size: clamp(86px, 7.2vw, 112px) !important;
    font-weight: 950 !important;
    line-height: 0.84 !important;
    letter-spacing: 0 !important;
    text-shadow: none !important;
}

#top .category-card::after {
    inset: auto 24px 18px !important;
    opacity: 0.72 !important;
    background: linear-gradient(90deg, rgba(255, 49, 76, 0.86), rgba(255, 255, 255, 0.24) 38%, transparent 78%) !important;
}

#top .category-card:hover {
    border-color: rgba(255, 49, 76, 0.38) !important;
    background:
        radial-gradient(280px 190px at 7% 0%, rgba(255, 49, 76, 0.24), transparent 70%),
        radial-gradient(240px 160px at 92% 24%, rgba(255, 255, 255, 0.058), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.088), rgba(255, 255, 255, 0.026) 54%, rgba(233, 18, 42, 0.062)),
        rgba(14, 15, 20, 0.88) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.11),
        inset 0 -1px 0 rgba(255, 49, 76, 0.08),
        0 22px 52px rgba(0, 0, 0, 0.34),
        0 0 0 1px rgba(255, 49, 76, 0.1) !important;
}

#top .category-icon {
    width: 58px !important;
    height: 58px !important;
    border-radius: 10px !important;
    background:
        radial-gradient(circle at 35% 18%, rgba(255, 255, 255, 0.22), transparent 44%),
        linear-gradient(145deg, rgba(255, 49, 76, 0.36), rgba(255, 255, 255, 0.055)),
        rgba(255, 255, 255, 0.035) !important;
}

#top .category-card-nui .category-icon {
    background:
        radial-gradient(circle at 35% 18%, rgba(255, 255, 255, 0.26), transparent 44%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.26), rgba(255, 255, 255, 0.055)),
        rgba(255, 255, 255, 0.035) !important;
}

#top .category-copy {
    max-width: min(315px, 78%) !important;
    gap: 7px !important;
}

#top .category-copy small {
    color: rgba(255, 255, 255, 0.88) !important;
}

#top .category-copy strong {
    max-width: 100% !important;
    font-size: clamp(28px, 2.15vw, 34px) !important;
    line-height: 0.98 !important;
}

#top .category-copy em {
    max-width: 285px !important;
    color: rgba(214, 216, 224, 0.76) !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
}

#top .category-tags {
    max-width: 78% !important;
    margin-top: 1px !important;
}

#top .category-cta {
    margin-top: auto !important;
}

@media (max-width: 980px) {
    #top .category-card {
        min-height: 242px !important;
    }

    #top .category-copy,
    #top .category-tags {
        max-width: 100% !important;
    }

    #top .category-card::before {
        top: 18px !important;
        right: 18px !important;
        font-size: 82px !important;
    }
}

/* First-screen spacing: keep the next homepage block from peeking into the hero fold. */
#top .hero.home-hero {
    min-height: calc(100svh - var(--header-h, 86px)) !important;
    padding-top: calc(var(--header-h, 86px) + clamp(52px, 6.4svh, 82px)) !important;
    padding-bottom: clamp(82px, 9svh, 126px) !important;
}

#top .hero.home-hero .hero-bg,
#top .hero.home-hero .hero-shade {
    inset: 0 0 -360px !important;
    -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 58%, rgba(0, 0, 0, 0.82) 72%, rgba(0, 0, 0, 0.38) 88%, transparent 100%) !important;
    mask-image: linear-gradient(180deg, #000 0%, #000 58%, rgba(0, 0, 0, 0.82) 72%, rgba(0, 0, 0, 0.38) 88%, transparent 100%) !important;
}

#top .preview-server-section {
    margin-top: clamp(12px, 2.2vw, 30px) !important;
}

@media (max-width: 820px) {
    #top .hero.home-hero {
        min-height: auto !important;
        padding-top: calc(var(--header-h, 78px) + clamp(34px, 9vw, 58px)) !important;
        padding-bottom: clamp(76px, 12vw, 112px) !important;
    }

    #top .preview-server-section {
        margin-top: clamp(18px, 5vw, 34px) !important;
    }
}

/* Footer final: grouped REDACTOR-style chamfered panels. */
.footer {
    position: relative !important;
    margin-top: 0 !important;
    padding: clamp(42px, 4.8vw, 72px) 0 30px !important;
    overflow: hidden !important;
    background: transparent !important;
}

.footer::before,
.footer::after {
    content: none !important;
    display: none !important;
}

.footer .footer-shell {
    position: relative !important;
    z-index: 1 !important;
    width: min(100% - 44px, var(--max)) !important;
    margin: 0 auto !important;
    display: grid !important;
    grid-template-columns: minmax(380px, 1.45fr) minmax(210px, 0.66fr) minmax(270px, 0.9fr) minmax(220px, 0.7fr) !important;
    align-items: stretch !important;
    gap: 16px !important;
    padding: clamp(18px, 1.8vw, 22px) !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 22px !important;
    background:
        radial-gradient(640px 220px at 0% 0%, rgba(255, 48, 72, 0.14), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.058), rgba(255, 255, 255, 0.014) 62%, rgba(255, 48, 72, 0.02)),
        rgba(10, 11, 16, 0.82) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.075),
        0 18px 48px rgba(0, 0, 0, 0.28) !important;
}

.footer .footer-shell::before {
    content: none !important;
    display: none !important;
}

.footer .footer-shell::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    border-radius: inherit !important;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.045), transparent 34%, rgba(255, 48, 72, 0.025)),
        linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent 46%, rgba(0, 0, 0, 0.16)) !important;
    opacity: 0.45 !important;
}

.footer .footer-brand,
.footer .footer-links {
    --footer-card-cut: 18px;
    position: relative !important;
    z-index: 1 !important;
    min-height: 218px !important;
    overflow: hidden !important;
    contain: paint !important;
    clip-path: polygon(0 0, calc(100% - var(--footer-card-cut)) 0, 100% var(--footer-card-cut), 100% 100%, var(--footer-card-cut) 100%, 0 calc(100% - var(--footer-card-cut))) !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 0 !important;
    background:
        radial-gradient(320px 140px at 0% 0%, rgba(255, 48, 72, 0.07), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.018) 62%, rgba(255, 48, 72, 0.024)),
        rgba(17, 18, 24, 0.78) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.07),
        0 14px 34px rgba(0, 0, 0, 0.18) !important;
}

.footer .footer-brand::before,
.footer .footer-links::before {
    content: none !important;
    display: none !important;
}

.footer .footer-brand::after,
.footer .footer-links::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.035), transparent 34%, rgba(255, 48, 72, 0.02)),
        linear-gradient(180deg, rgba(255, 255, 255, 0.034), transparent 48%, rgba(0, 0, 0, 0.12));
    opacity: 0.66 !important;
}

.footer .footer-brand > *,
.footer .footer-links > * {
    position: relative !important;
    z-index: 2 !important;
}

.footer .footer-brand {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 22px !important;
    padding: clamp(26px, 3vw, 38px) !important;
    text-align: left !important;
}

.footer .footer-brand img {
    display: block !important;
    width: min(250px, 82%) !important;
    height: auto !important;
    max-height: 78px !important;
    margin: 0 !important;
    object-fit: contain !important;
    object-position: left center !important;
    filter: drop-shadow(0 0 18px rgba(255, 48, 72, 0.18)) !important;
}

.footer .footer-brand p {
    max-width: 430px !important;
    margin: 0 !important;
    color: rgba(226, 231, 240, 0.72) !important;
    font-size: 16px !important;
    line-height: 1.62 !important;
    text-align: left !important;
}

.footer .footer-links {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    padding: 20px !important;
}

.footer .footer-links > span {
    display: block !important;
    margin: 0 0 6px !important;
    padding: 0 0 12px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.075) !important;
    color: rgba(255, 255, 255, 0.93) !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 1000 !important;
    text-align: center !important;
    text-transform: uppercase !important;
}

.footer .footer-links a {
    width: 100% !important;
    min-height: 42px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 0 12px !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 10px !important;
    color: rgba(226, 231, 240, 0.72) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.018)),
        rgba(255, 255, 255, 0.032) !important;
    box-shadow: none !important;
    text-decoration: none !important;
}

.footer .footer-links a span {
    display: block !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.footer .footer-links a::after {
    content: "" !important;
    width: 8px !important;
    height: 8px !important;
    flex: 0 0 8px !important;
    margin-left: auto !important;
    border-top: 2px solid currentColor !important;
    border-right: 2px solid currentColor !important;
    background: none !important;
    transform: rotate(45deg) !important;
    opacity: 0.66 !important;
}

.footer .footer-links a:hover {
    color: #fff !important;
    border-color: rgba(255, 54, 78, 0.44) !important;
    background:
        linear-gradient(135deg, rgba(255, 54, 78, 0.16), rgba(255, 255, 255, 0.035)),
        rgba(255, 255, 255, 0.038) !important;
    transform: translateY(-1px);
}

.footer .footer-links a:hover .footer-link-icon {
    color: #fff !important;
    border-color: rgba(255, 54, 78, 0.42) !important;
    background: rgba(255, 54, 78, 0.16) !important;
}

.footer-link-icon {
    width: 26px !important;
    height: 26px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 26px !important;
    border: 1px solid rgba(255, 255, 255, 0.105) !important;
    border-radius: 8px !important;
    color: rgba(255, 255, 255, 0.78) !important;
    background: rgba(255, 255, 255, 0.04) !important;
    font-style: normal !important;
}

.footer .footer-bottom {
    width: min(100% - 44px, var(--max)) !important;
    margin: 18px auto 0 !important;
    padding: 16px 4px 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.07) !important;
}

.redactor-ambient-canvas {
    opacity: 0.78 !important;
}

body::before {
    opacity: 0.34 !important;
}

body::after {
    opacity: 0.23 !important;
}

body > .redactor-site-image-bg::after {
    opacity: 0.34 !important;
}

@media (max-width: 1180px) {
    .footer .footer-shell {
        grid-template-columns: minmax(0, 1.2fr) minmax(190px, 0.68fr) minmax(240px, 0.8fr) !important;
    }

    .footer .footer-links:last-child {
        grid-column: 2 / -1 !important;
        min-height: 0 !important;
    }
}

@media (max-width: 860px) {
    .footer .footer-shell {
        grid-template-columns: 1fr 1fr !important;
    }

    .footer .footer-brand {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 620px) {
    .footer .footer-shell {
        grid-template-columns: 1fr !important;
    }

    .footer .footer-brand,
    .footer .footer-links {
        min-height: 0 !important;
    }

    .footer .footer-links:last-child {
        grid-column: auto !important;
    }
}

/* RU/UA labels are longer than EN, so keep the header and hero composed. */
html:lang(ru) .nav,
html:lang(uk) .nav {
    gap: clamp(10px, 1vw, 18px) !important;
}

html:lang(ru) .nav a,
html:lang(uk) .nav a,
html:lang(ru) .nav-dropdown-toggle,
html:lang(uk) .nav-dropdown-toggle {
    gap: 7px !important;
    font-size: clamp(12px, 0.78vw, 14px) !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
}

html:lang(ru) .header-actions,
html:lang(uk) .header-actions,
html:lang(ru) .social-links,
html:lang(uk) .social-links {
    gap: 8px !important;
}

html:lang(ru) .nav-cart,
html:lang(uk) .nav-cart,
html:lang(ru) .locale-current,
html:lang(uk) .locale-current,
html:lang(ru) .cfx-auth,
html:lang(uk) .cfx-auth,
html:lang(ru) .header-cta,
html:lang(uk) .header-cta {
    white-space: nowrap !important;
}

html:lang(ru) .home-hero h1,
html:lang(uk) .home-hero h1 {
    max-width: min(760px, 100%) !important;
    font-size: clamp(46px, 4.65vw, 78px) !important;
    line-height: 0.98 !important;
    text-wrap: balance;
}

html:lang(ru) .home-hero .hero-lead,
html:lang(uk) .home-hero .hero-lead {
    max-width: 720px !important;
    font-size: clamp(18px, 1.22vw, 22px) !important;
    line-height: 1.28 !important;
}

html:lang(ru) .home-hero .hero-note,
html:lang(uk) .home-hero .hero-note {
    max-width: 700px !important;
    font-size: clamp(13px, 0.86vw, 16px) !important;
    line-height: 1.42 !important;
}

html:lang(ru) .hero-proof-row,
html:lang(uk) .hero-proof-row {
    max-width: 760px !important;
    gap: 8px !important;
}

html:lang(ru) .hero-proof-row span,
html:lang(uk) .hero-proof-row span {
    padding: 8px 12px !important;
    font-size: clamp(9px, 0.58vw, 10.5px) !important;
    line-height: 1.08 !important;
    white-space: nowrap !important;
}

html:lang(ru) .home-hero .hero-actions .btn,
html:lang(uk) .home-hero .hero-actions .btn {
    min-width: 0 !important;
    padding-inline: clamp(20px, 1.7vw, 30px) !important;
    font-size: clamp(14px, 0.95vw, 16px) !important;
}

html:lang(ru) .btn,
html:lang(uk) .btn,
html:lang(ru) .chip,
html:lang(uk) .chip,
html:lang(ru) .product-badge,
html:lang(uk) .product-badge,
html:lang(ru) .trust-bar span,
html:lang(uk) .trust-bar span {
    letter-spacing: 0 !important;
    line-height: 1.14 !important;
}

/* Login/auth page polish: safer long locale text. */
main.tebex-page.username-page .tebex-form-shell {
    width: min(100% - 44px, 980px) !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding: clamp(28px, 3.2vw, 40px) !important;
    min-height: 0 !important;
    align-content: start !important;
}

main.tebex-page.username-page .tebex-form-shell .page-title h1 {
    max-width: 100% !important;
    font-size: clamp(40px, 4.5vw, 58px) !important;
    line-height: 1 !important;
    text-wrap: balance;
}

html:lang(ru) main.tebex-page.username-page .tebex-form-shell .page-title h1,
html:lang(uk) main.tebex-page.username-page .tebex-form-shell .page-title h1 {
    font-size: clamp(36px, 3.8vw, 52px) !important;
    line-height: 1.02 !important;
}

main.tebex-page.username-page .tebex-form-shell .page-title p:not(.eyebrow) {
    max-width: 580px !important;
    font-size: clamp(15px, 1vw, 17px) !important;
    line-height: 1.46 !important;
}

html:lang(ru) .footer .footer-links a,
html:lang(uk) .footer .footer-links a {
    min-width: 0 !important;
    gap: 8px !important;
    padding-inline: 10px !important;
}

html:lang(ru) .footer .footer-links a span,
html:lang(uk) .footer .footer-links a span,
html:lang(ru) .nav-mega-card-link span,
html:lang(uk) .nav-mega-card-link span,
html:lang(ru) .nav-mega-chip,
html:lang(uk) .nav-mega-chip {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html:lang(ru) .section-head h2,
html:lang(uk) .section-head h2,
html:lang(ru) .category-card h3,
html:lang(uk) .category-card h3,
html:lang(ru) .seo-shop-head h1,
html:lang(uk) .seo-shop-head h1,
html:lang(ru) .cms-hero h1,
html:lang(uk) .cms-hero h1,
html:lang(ru) .tebex-form-shell h1,
html:lang(uk) .tebex-form-shell h1 {
    text-wrap: balance;
    overflow-wrap: break-word;
}

@media (max-width: 720px) {
    main.tebex-page.username-page .tebex-form-shell .page-title h1 {
        font-size: clamp(34px, 10vw, 44px) !important;
    }
}

/* Homepage final: make localizations read like the framework proof block. */
#top .framework-localizations {
    grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr) !important;
    gap: clamp(18px, 2.4vw, 34px) !important;
    padding-top: clamp(22px, 2.4vw, 30px) !important;
}

#top .framework-localization-copy {
    gap: 10px !important;
}

#top .framework-localization-copy > span {
    width: max-content !important;
    min-height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0 12px !important;
    border: 1px solid rgba(255, 49, 76, 0.58) !important;
    border-radius: 999px !important;
    color: #ff314c !important;
    background:
        linear-gradient(135deg, rgba(255, 49, 76, 0.12), rgba(255, 255, 255, 0.026)),
        rgba(255, 49, 76, 0.04) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 12px 30px rgba(255, 49, 76, 0.08) !important;
}

#top .framework-localization-copy > span::before {
    content: "" !important;
    width: 6px !important;
    height: 6px !important;
    flex: 0 0 6px !important;
    border-radius: 999px !important;
    background: #ff314c !important;
    box-shadow: 0 0 14px rgba(255, 49, 76, 0.72) !important;
}

#top .framework-localization-copy p {
    max-width: 640px !important;
    font-size: 15px !important;
    line-height: 1.58 !important;
}

/* Homepage final: split FAQ into two clean columns with a soft divider. */
#top .faq-layout {
    width: min(100% - 44px, 1040px) !important;
}

#top .faq-list {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    align-items: start !important;
    gap: clamp(22px, 3vw, 42px) !important;
}

#top .faq-list::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 8px !important;
    bottom: 8px !important;
    left: 50% !important;
    width: 1px !important;
    transform: translateX(-50%) !important;
    pointer-events: none !important;
    background:
        linear-gradient(180deg, transparent, rgba(255, 49, 76, 0.5) 18%, rgba(255, 255, 255, 0.12) 50%, rgba(255, 49, 76, 0.5) 82%, transparent) !important;
    box-shadow: 0 0 22px rgba(255, 49, 76, 0.14) !important;
}

#top .faq-column {
    display: grid !important;
    gap: 12px !important;
    align-content: start !important;
    min-width: 0 !important;
}

#top .faq-column details {
    width: 100% !important;
}

#top .faq-list summary {
    min-height: 62px !important;
    padding-right: clamp(126px, 10vw, 164px) !important;
}

#top .faq-list details::before {
    right: 52px !important;
}

@media (max-width: 980px) {
    #top .framework-localizations,
    #top .faq-list {
        grid-template-columns: 1fr !important;
    }

    #top .framework-localization-copy,
    #top .localization-list {
        justify-items: center !important;
        justify-content: center !important;
        text-align: center !important;
    }

    #top .faq-list::before {
        content: none !important;
        display: none !important;
    }
}

@media (max-width: 620px) {
    #top .faq-list summary {
        padding-right: 86px !important;
    }

    #top .faq-list details::before {
        display: none !important;
    }
}

/* Auth page final: keep it in the same document flow as the rest of the store. */
html.is-username-page {
    height: auto !important;
    min-height: 100% !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    scrollbar-gutter: auto !important;
}

body.is-username-page {
    height: auto !important;
    min-height: 100vh !important;
    max-height: none !important;
    overflow-x: clip !important;
    overflow-y: clip !important;
    padding-top: var(--header-h) !important;
    display: block !important;
}

body.is-username-page main.tebex-page.username-page {
    min-height: 0 !important;
    padding-top: clamp(82px, 7vw, 118px) !important;
    padding-bottom: clamp(34px, 4vw, 56px) !important;
    display: block !important;
}

body.is-username-page main.tebex-page.username-page .tebex-form-shell {
    width: min(100% - 44px, 980px) !important;
    margin: 0 auto !important;
    gap: clamp(18px, 1.8vw, 24px) !important;
    padding: clamp(30px, 3.2vw, 46px) !important;
}

body.is-username-page .footer {
    margin-top: clamp(42px, 4.5vw, 68px) !important;
}

body.is-username-page .scroll-top {
    display: none !important;
}

html.is-username-page {
    scrollbar-width: thin !important;
    scrollbar-color: rgba(185, 21, 49, 0.82) rgba(12, 13, 18, 0.7) !important;
}

body.is-username-page {
    scrollbar-width: none !important;
}

body.is-username-page::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
}

@media (max-width: 720px) {
    body.is-username-page main.tebex-page.username-page {
        min-height: auto !important;
        padding-top: 30px !important;
        padding-bottom: 28px !important;
        display: block !important;
    }
}

/* Final scroll ownership: one browser document scrollbar, no nested body scrollbar. */
html {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    scrollbar-gutter: stable !important;
}

body {
    overflow-x: clip !important;
    overflow-y: clip !important;
}

body.cart-open {
    overflow: hidden !important;
}

/* Absolute last override: compact homepage latest resources rail. */
#top .latest-products-section {
    width: min(1500px, calc(100% - 44px)) !important;
    margin: clamp(54px, 5.5vw, 88px) auto clamp(30px, 3.8vw, 54px) !important;
    padding: 0 !important;
}

#top .latest-products-slider.hero-product-showcase {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(14px, 1.4vw, 22px) !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="1"] {
    grid-template-columns: minmax(280px, 430px) !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
    grid-template-columns: repeat(2, minmax(280px, 430px)) !important;
    justify-content: center !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto 1fr auto !important;
    gap: 14px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: 100% !important;
    padding: 12px !important;
    border-radius: 16px !important;
    background:
        linear-gradient(145deg, rgba(38, 39, 47, 0.88), rgba(16, 17, 23, 0.91)),
        radial-gradient(circle at 12% 0%, rgba(244, 25, 57, 0.2), transparent 44%) !important;
}

#top .latest-products-slider .hero-latest-media {
    width: 100% !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
}

#top .latest-products-slider .hero-latest-title {
    display: -webkit-box !important;
    font-size: clamp(20px, 1.55vw, 27px) !important;
    line-height: 1.08 !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-desc {
    display: -webkit-box !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

@media (max-width: 1100px) {
    #top .latest-products-slider.hero-product-showcase {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 720px) {
    #top .latest-products-section {
        width: min(100% - 28px, 560px) !important;
        margin-top: 42px !important;
    }

    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase[data-product-count="1"],
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
        grid-template-columns: 1fr !important;
    }
}

/* Preview server: horizontal information flow instead of a vertical half-split. */
#top .home-hero .hero-server-showcase {
    width: min(100%, 820px) !important;
    max-width: 820px !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-items: stretch !important;
    gap: clamp(12px, 1.35vw, 16px) !important;
    padding: clamp(20px, 1.7vw, 26px) !important;
}

#top .home-hero .hero-server-copy {
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-content: start !important;
    gap: 9px !important;
}

#top .home-hero .hero-server-copy h2 {
    max-width: none !important;
    margin: 0 !important;
    font-size: clamp(32px, 2.25vw, 42px) !important;
    line-height: 0.98 !important;
    text-wrap: balance !important;
}

#top .home-hero .hero-server-copy p {
    max-width: 720px !important;
    margin: 0 !important;
}

#top .home-hero .preview-server-tags {
    max-width: none !important;
    margin-top: 2px !important;
    gap: 8px !important;
}

#top .home-hero .preview-server-tags span {
    min-height: 26px !important;
    padding: 6px 11px !important;
}

#top .home-hero .hero-server-divider {
    width: 100% !important;
    height: 1px !important;
    min-height: 1px !important;
    align-self: stretch !important;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.14), rgba(255, 49, 76, 0.42), rgba(255, 255, 255, 0.12), transparent) !important;
    box-shadow: 0 0 24px rgba(255, 49, 76, 0.16) !important;
}

#top .home-hero .hero-server-panel {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
        "status"
        "name"
        "url"
        "actions" !important;
    align-items: start !important;
    gap: 8px !important;
    padding: 0 !important;
}

#top .home-hero .hero-server-panel .preview-server-status {
    grid-area: status !important;
    justify-self: start !important;
}

#top .home-hero .hero-server-panel strong {
    grid-area: name !important;
    display: block !important;
    max-width: 100% !important;
    font-size: clamp(21px, 1.55vw, 28px) !important;
    line-height: 1.04 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

#top .home-hero .hero-server-panel code {
    grid-area: url !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 10px 14px !important;
}

#top .home-hero .preview-server-actions {
    grid-area: actions !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(130px, 150px)) !important;
    justify-content: center !important;
    justify-self: center !important;
    width: min(100%, 330px) !important;
    margin-top: 6px !important;
    align-self: auto !important;
    align-content: center !important;
    gap: 10px !important;
}

#top .home-hero .preview-server-actions .btn {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 42px !important;
    justify-content: center !important;
}

@media (max-width: 1240px) {
    #top .home-hero .hero-server-showcase {
        max-width: min(100%, 820px) !important;
    }
}

@media (max-width: 820px) {
    #top .home-hero .hero-server-showcase {
        max-width: min(100%, 620px) !important;
    }

    #top .home-hero .hero-server-copy h2 {
        max-width: none !important;
    }

    #top .home-hero .hero-server-panel {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "status"
            "name"
            "url"
            "actions" !important;
        gap: 10px !important;
    }

    #top .home-hero .preview-server-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        align-self: auto !important;
    }
}

@media (max-width: 560px) {
    #top .home-hero .hero-server-showcase {
        padding: 18px !important;
    }

    #top .home-hero .hero-server-copy h2 {
        font-size: clamp(30px, 8.5vw, 38px) !important;
    }

    #top .home-hero .preview-server-actions {
        grid-template-columns: 1fr !important;
    }
}

/* Latest resources: REDACTOR storefront rail. */
#top .latest-products-section {
    position: relative !important;
    width: min(1260px, calc(100% - 44px)) !important;
    margin: clamp(48px, 5vw, 78px) auto clamp(34px, 4vw, 58px) !important;
    padding: 0 !important;
}

#top .latest-products-heading {
    position: relative !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 0 auto clamp(18px, 2vw, 28px) !important;
    text-align: center !important;
}

#top .latest-products-heading::before,
#top .latest-products-heading::after {
    content: "" !important;
    display: block !important;
    width: min(170px, 18vw) !important;
    height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(255, 49, 76, 0.82)) !important;
}

#top .latest-products-heading::after {
    background: linear-gradient(90deg, rgba(255, 49, 76, 0.82), transparent) !important;
}

#top .latest-products-heading span {
    width: auto !important;
    min-width: 0 !important;
    min-height: 34px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 9px !important;
    margin: 0 14px !important;
    padding: 0 20px !important;
    border: 1px solid rgba(255, 49, 76, 0.7) !important;
    border-radius: 999px !important;
    color: #fff !important;
    background:
        linear-gradient(135deg, rgba(255, 49, 76, 0.16), rgba(255, 255, 255, 0.035)),
        rgba(14, 15, 20, 0.86) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 0 28px rgba(255, 49, 76, 0.12) !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 950 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
}

#top .latest-products-heading span::before {
    content: "" !important;
    width: 7px !important;
    height: 7px !important;
    flex: 0 0 7px !important;
    border-radius: 999px !important;
    background: #ff314c !important;
    box-shadow: 0 0 15px rgba(255, 49, 76, 0.82) !important;
}

#top .latest-products-heading span::after {
    content: none !important;
    display: none !important;
}

#top .latest-products-heading h2 {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

#top .latest-products-slider.hero-product-showcase,
#top .latest-products-slider.hero-product-showcase:has(.hero-latest-card) {
    position: relative !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(16px, 1.6vw, 24px) !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

#top .latest-products-slider.hero-product-showcase::before,
#top .latest-products-slider.hero-product-showcase::after {
    content: none !important;
    display: none !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="1"],
#top .latest-products-slider.hero-product-showcase:has(.hero-latest-card:nth-of-type(1):last-child) {
    grid-template-columns: minmax(560px, 860px) !important;
    justify-content: center !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
    grid-template-columns: repeat(2, minmax(520px, 600px)) !important;
    justify-content: center !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    position: relative !important;
    isolation: isolate !important;
    display: grid !important;
    grid-template-columns: minmax(210px, 42%) minmax(0, 1fr) !important;
    grid-template-rows: minmax(124px, 1fr) auto !important;
    align-self: stretch !important;
    gap: 14px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: 100% !important;
    padding: 12px 12px 14px !important;
    overflow: hidden !important;
    color: var(--text) !important;
    text-decoration: none !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 16px !important;
    background:
        radial-gradient(360px 170px at 0% 0%, rgba(255, 49, 76, 0.2), transparent 68%),
        radial-gradient(280px 150px at 100% 16%, rgba(255, 255, 255, 0.06), transparent 72%),
        linear-gradient(145deg, rgba(38, 39, 47, 0.92), rgba(13, 14, 20, 0.96) 58%, rgba(54, 7, 18, 0.44)) !important;
    box-shadow:
        0 22px 58px rgba(0, 0, 0, 0.42),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
    transition:
        transform 180ms ease,
        border-color 180ms ease,
        box-shadow 180ms ease,
        background 180ms ease !important;
}

#top .latest-products-slider .hero-latest-card::before {
    content: "" !important;
    position: absolute !important;
    inset: auto 12px 0 !important;
    z-index: -1 !important;
    height: 2px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, #ff314c, rgba(255, 255, 255, 0.28), transparent) !important;
    opacity: 0.74 !important;
    pointer-events: none !important;
}

#top .latest-products-slider .hero-latest-card::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.045), transparent 28%, rgba(255, 49, 76, 0.05)),
        linear-gradient(180deg, rgba(255, 255, 255, 0.025), transparent 42%) !important;
    opacity: 0.78 !important;
    pointer-events: none !important;
}

#top .latest-products-slider .hero-latest-card:hover {
    transform: translateY(-3px) !important;
    border-color: rgba(255, 49, 76, 0.52) !important;
    background:
        radial-gradient(380px 180px at 0% 0%, rgba(255, 49, 76, 0.27), transparent 70%),
        radial-gradient(300px 160px at 100% 16%, rgba(255, 255, 255, 0.075), transparent 72%),
        linear-gradient(145deg, rgba(43, 44, 53, 0.96), rgba(15, 16, 22, 0.98) 58%, rgba(70, 8, 22, 0.5)) !important;
    box-shadow:
        0 28px 72px rgba(0, 0, 0, 0.52),
        0 0 34px rgba(255, 49, 76, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

#top .latest-products-slider .hero-latest-media,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-media {
    position: relative !important;
    display: block !important;
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 12px !important;
    text-decoration: none !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.06), rgba(0, 0, 0, 0.42)),
        rgba(4, 5, 8, 0.7) !important;
}

#top .latest-products-slider .hero-latest-media img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    filter: saturate(1.02) contrast(1.08) brightness(0.84) !important;
    transition:
        transform 260ms ease,
        filter 260ms ease !important;
}

#top .latest-products-slider .hero-latest-card:hover .hero-latest-media img {
    transform: scale(1.045) !important;
    filter: saturate(1.12) contrast(1.1) brightness(0.92) !important;
}

#top .latest-products-slider .hero-latest-media::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background:
        linear-gradient(180deg, transparent 45%, rgba(0, 0, 0, 0.44)),
        linear-gradient(90deg, rgba(255, 49, 76, 0.12), transparent 42%) !important;
    pointer-events: none !important;
}

#top .latest-products-slider .hero-latest-media .hero-latest-discount {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    z-index: 2 !important;
    display: inline-flex !important;
    align-items: center !important;
    min-height: 26px !important;
    padding: 0 10px !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #ff314c, #a9051b) !important;
    color: #fff !important;
    box-shadow: 0 12px 28px rgba(255, 49, 76, 0.24) !important;
    font-size: 11px !important;
    font-style: normal !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
}

#top .latest-products-slider .hero-latest-placeholder {
    display: grid !important;
    place-items: center !important;
    width: 100% !important;
    height: 100% !important;
    color: rgba(255, 255, 255, 0.46) !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
}

#top .latest-products-slider .hero-latest-copy {
    display: flex !important;
    flex-direction: column !important;
    align-content: start !important;
    justify-content: flex-start !important;
    gap: 9px !important;
    min-height: 128px !important;
    min-width: 0 !important;
    padding: 4px 4px 0 0 !important;
}

#top .latest-products-slider .hero-latest-kicker {
    width: max-content !important;
    max-width: 100% !important;
    min-height: 25px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 0 10px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 999px !important;
    color: rgba(238, 241, 247, 0.84) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02)),
        rgba(255, 255, 255, 0.045) !important;
    font-size: 11px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    text-transform: uppercase !important;
}

#top .latest-products-slider .hero-latest-kicker::before {
    content: "" !important;
    width: 6px !important;
    height: 6px !important;
    flex: 0 0 6px !important;
    border-radius: 999px !important;
    background: #ff314c !important;
    box-shadow: 0 0 13px rgba(255, 49, 76, 0.8) !important;
}

#top .latest-products-slider .hero-latest-title,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-title {
    display: -webkit-box !important;
    color: #fff !important;
    font-size: clamp(21px, 1.42vw, 28px) !important;
    font-weight: 950 !important;
    line-height: 1.08 !important;
    overflow: hidden !important;
    text-shadow: 0 12px 30px rgba(0, 0, 0, 0.36) !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-desc {
    display: -webkit-box !important;
    min-height: 39px !important;
    max-height: 42px !important;
    margin-top: 0 !important;
    overflow: hidden !important;
    color: rgba(226, 230, 238, 0.66) !important;
    font-size: 13.5px !important;
    font-weight: 800 !important;
    line-height: 1.28 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#top .latest-products-slider .hero-latest-footer {
    position: relative !important;
    z-index: 1 !important;
    display: grid !important;
    justify-items: center !important;
    align-content: end !important;
    gap: 9px !important;
    min-width: 0 !important;
    min-height: 78px !important;
    margin: 0 !important;
    padding: 12px 4px 0 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.09) !important;
}

#top .latest-products-slider .hero-latest-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;
    flex: 0 0 auto !important;
    min-width: 0 !important;
}

#top .latest-products-slider .hero-latest-actions .btn {
    min-height: 42px !important;
    padding: 0 14px !important;
    border-radius: 10px !important;
    font-size: 13px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

#top .latest-products-slider .hero-latest-details {
    min-width: 88px !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)),
        rgba(24, 25, 30, 0.86) !important;
    color: #fff !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 12px 24px rgba(0, 0, 0, 0.24) !important;
}

#top .latest-products-slider .hero-latest-add {
    min-width: 82px !important;
    border-color: rgba(255, 86, 110, 0.72) !important;
    background:
        linear-gradient(135deg, #ff314c 0%, #d80f2c 48%, #760817 100%) !important;
    color: #fff !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.24),
        0 18px 36px rgba(255, 49, 76, 0.32) !important;
}

#top .latest-products-slider .hero-latest-plus {
    display: grid !important;
    place-items: center !important;
    width: 16px !important;
    height: 16px !important;
    border-radius: 6px !important;
    background: rgba(255, 255, 255, 0.2) !important;
    font-size: 14px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

#top .latest-products-slider .hero-latest-price,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-price {
    display: flex !important;
    align-self: center !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    flex: 0 0 auto !important;
    flex-wrap: nowrap !important;
    min-height: 40px !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border-top: 0 !important;
}

#top .latest-products-slider .hero-latest-price strong {
    color: #fff !important;
    font-size: clamp(24px, 1.48vw, 30px) !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

#top .latest-products-slider .hero-latest-price s {
    color: rgba(255, 255, 255, 0.42) !important;
    font-size: 14px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
}

#top .latest-products-slider .hero-latest-price > .hero-latest-discount {
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    min-height: 25px !important;
    padding: 0 10px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #ff314c, #a9051b) !important;
    color: #fff !important;
    font-size: 11px !important;
    font-style: normal !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
}

@media (max-width: 1100px) {
    #top .latest-products-section {
        width: min(100% - 36px, 1040px) !important;
    }

    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase:has(.hero-latest-card),
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 720px) {
    #top .latest-products-section {
        width: min(100% - 28px, 560px) !important;
        margin-top: 42px !important;
    }

    #top .latest-products-heading::before,
    #top .latest-products-heading::after {
        width: 42px !important;
    }

    #top .latest-products-heading span {
        margin-inline: 10px !important;
        padding-inline: 14px !important;
        font-size: 11px !important;
    }

    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase:has(.hero-latest-card),
    #top .latest-products-slider.hero-product-showcase[data-product-count="1"],
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
        grid-template-columns: 1fr !important;
    }
}

/* Absolute final: latest resources follows the category section rhythm. */
#top .latest-products-section {
    width: min(1100px, calc(100% - 44px)) !important;
    margin: clamp(46px, 5vw, 76px) auto clamp(34px, 4.2vw, 62px) !important;
    padding: clamp(18px, 2.6vw, 34px) 0 0 !important;
}

#top .latest-products-heading {
    display: grid !important;
    justify-items: center !important;
    gap: 10px !important;
    max-width: 820px !important;
    margin: 0 auto clamp(22px, 2.6vw, 34px) !important;
    text-align: center !important;
}

#top .latest-products-heading::before,
#top .latest-products-heading::after {
    content: none !important;
    display: none !important;
}

#top .latest-products-heading h2 {
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
    border: 0 !important;
    color: #fff !important;
    font-size: clamp(34px, 3.1vw, 52px) !important;
    line-height: 0.98 !important;
    font-weight: 950 !important;
    letter-spacing: 0 !important;
    text-wrap: balance !important;
    text-shadow: 0 16px 38px rgba(0, 0, 0, 0.46), 0 0 28px rgba(255, 49, 76, 0.12) !important;
}

#top .latest-products-heading p {
    max-width: 620px !important;
    margin: 0 !important;
    color: rgba(226, 231, 240, 0.72) !important;
    font-size: clamp(15px, 1.05vw, 18px) !important;
    line-height: 1.5 !important;
    font-weight: 700 !important;
}

#top .latest-products-slider.hero-product-showcase,
#top .latest-products-slider.hero-product-showcase:has(.hero-latest-card) {
    grid-template-columns: minmax(0, 1120px) !important;
    align-items: stretch !important;
    justify-content: center !important;
    justify-items: stretch !important;
    gap: clamp(16px, 1.8vw, 24px) !important;
    width: 100% !important;
    max-width: 1120px !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="1"],
#top .latest-products-slider.hero-product-showcase:has(.hero-latest-card:nth-of-type(1):last-child) {
    grid-template-columns: minmax(0, 1120px) !important;
    max-width: 1120px !important;
}

#top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
    grid-template-columns: minmax(0, 1120px) !important;
    max-width: 1120px !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    display: grid !important;
    grid-template-columns: minmax(340px, 42%) minmax(0, 1fr) !important;
    grid-template-rows: minmax(146px, 1fr) auto !important;
    align-self: stretch !important;
    min-height: 286px !important;
    padding: 14px !important;
    gap: clamp(16px, 1.8vw, 24px) !important;
}

#top .latest-products-slider .hero-latest-media,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-media {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 258px !important;
    aspect-ratio: auto !important;
    isolation: isolate !important;
}

#top .latest-products-slider .hero-latest-copy {
    justify-content: flex-start !important;
    gap: 10px !important;
    min-height: 146px !important;
    padding: 6px 8px 0 0 !important;
}

#top .latest-products-slider .hero-latest-title {
    min-height: 58px !important;
    font-size: clamp(26px, 2.1vw, 34px) !important;
}

#top .latest-products-slider .hero-latest-desc {
    min-height: 39px !important;
    max-height: 42px !important;
    font-size: 13.5px !important;
}

#top .latest-products-slider .hero-latest-footer {
    display: grid !important;
    justify-items: center !important;
    align-content: end !important;
    gap: 9px !important;
    min-height: 84px !important;
    padding: 12px 8px 0 0 !important;
}

#top .latest-products-slider .hero-latest-price {
    justify-content: center !important;
    text-align: center !important;
}

#top .latest-products-slider .hero-latest-actions {
    width: 100% !important;
    justify-content: center !important;
    gap: 8px !important;
}

#top .latest-products-slider .hero-latest-action {
    min-width: 108px !important;
    justify-content: center !important;
}

#top .latest-products-slider .hero-latest-action--cart {
    min-width: 116px !important;
}

#top .latest-products-slider .hero-latest-media .hero-latest-preview-image {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    opacity: 0 !important;
    transform: scale(1.018) !important;
    transition: opacity 420ms ease, transform 3000ms ease, filter 260ms ease !important;
}

#top .latest-products-slider .hero-latest-media .hero-latest-preview-image.is-active {
    opacity: 1 !important;
    transform: scale(1.045) !important;
}

#top .latest-products-slider .hero-latest-card:hover .hero-latest-media .hero-latest-preview-image.is-active {
    transform: scale(1.075) !important;
}

#top .latest-products-slider .hero-latest-preview-dots {
    position: absolute !important;
    left: 50% !important;
    bottom: 10px !important;
    z-index: 3 !important;
    display: inline-flex !important;
    gap: 6px !important;
    transform: translateX(-50%) !important;
    pointer-events: none !important;
}

#top .latest-products-slider .hero-latest-preview-dot {
    width: 6px !important;
    height: 6px !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.38) !important;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.48) !important;
    opacity: 0.8 !important;
    transition: width 220ms ease, background 220ms ease, opacity 220ms ease !important;
}

#top .latest-products-slider .hero-latest-preview-dot.is-active {
    width: 18px !important;
    background: #ff314c !important;
    opacity: 1 !important;
    box-shadow: 0 0 14px rgba(255, 49, 76, 0.78) !important;
}

@media (max-width: 1100px) {
    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase:has(.hero-latest-card),
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
        grid-template-columns: minmax(0, 860px) !important;
        max-width: 900px !important;
    }

    #top .latest-products-slider .hero-latest-card,
    #top .latest-products-slider .hero-latest-card.is-featured {
        grid-template-columns: minmax(280px, 40%) minmax(0, 1fr) !important;
    }

    #top .latest-products-slider .hero-latest-title {
        font-size: clamp(24px, 3vw, 30px) !important;
    }
}

@media (max-width: 720px) {
    #top .latest-products-section {
        width: min(100% - 28px, 560px) !important;
        padding-top: 12px !important;
    }

    #top .latest-products-heading h2 {
        font-size: clamp(32px, 9vw, 42px) !important;
    }

    #top .latest-products-slider.hero-product-showcase,
    #top .latest-products-slider.hero-product-showcase:has(.hero-latest-card),
    #top .latest-products-slider.hero-product-showcase[data-product-count="1"],
    #top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
        grid-template-columns: minmax(0, 1fr) !important;
        max-width: 560px !important;
    }

    #top .latest-products-slider .hero-latest-card,
    #top .latest-products-slider .hero-latest-card.is-featured {
        grid-template-columns: 1fr !important;
        grid-template-rows: auto minmax(116px, 1fr) auto !important;
        min-height: 0 !important;
        gap: 12px !important;
        padding: 12px !important;
    }

    #top .latest-products-slider .hero-latest-media,
    #top .latest-products-slider .hero-latest-card.is-featured .hero-latest-media {
        grid-column: auto !important;
        grid-row: auto !important;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 16 / 9 !important;
    }

    #top .latest-products-slider .hero-latest-copy {
        min-height: 116px !important;
        padding: 0 2px !important;
    }

    #top .latest-products-slider .hero-latest-footer {
        min-height: 76px !important;
        padding: 10px 0 0 !important;
    }
}

/* Absolute final: do not flash the latest resources empty state while products hydrate. */
#top .latest-products-slider.is-loading > .hero-products-empty,
#top .latest-products-slider[data-hero-loading="true"] > .hero-products-empty,
#top .latest-products-slider:not([data-hero-hydrated="true"]) > .hero-products-empty {
    display: none !important;
}

/* Latest resources: final full-width list matched to the framework support block. */
#top .latest-products-section {
    width: min(100% - 44px, var(--max)) !important;
    max-width: var(--max) !important;
}

#top .latest-products-slider.hero-product-showcase,
#top .latest-products-slider.hero-product-showcase:has(.hero-latest-card),
#top .latest-products-slider.hero-product-showcase[data-product-count="1"],
#top .latest-products-slider.hero-product-showcase[data-product-count="2"] {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: stretch !important;
    justify-content: stretch !important;
    justify-items: stretch !important;
    gap: clamp(18px, 2vw, 26px) !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 auto !important;
    overflow: visible !important;
}

#top .latest-products-slider .hero-latest-card,
#top .latest-products-slider .hero-latest-card.is-featured {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 300px !important;
    display: grid !important;
    grid-template-columns: minmax(360px, 42%) minmax(0, 1fr) !important;
    grid-template-rows: minmax(154px, 1fr) auto !important;
    align-self: stretch !important;
    justify-self: stretch !important;
    gap: clamp(18px, 2vw, 28px) !important;
    padding: 16px !important;
}

#top .latest-products-slider .hero-latest-media,
#top .latest-products-slider .hero-latest-card.is-featured .hero-latest-media {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 268px !important;
    aspect-ratio: auto !important;
}

#top .latest-products-slider .hero-latest-copy {
    min-width: 0 !important;
    min-height: 154px !important;
    padding: 8px 10px 0 0 !important;
    gap: 11px !important;
}

#top .latest-products-slider .hero-latest-title {
    min-height: auto !important;
    max-width: 740px !important;
    font-size: clamp(28px, 2.25vw, 38px) !important;
}

#top .latest-products-slider .hero-latest-desc {
    max-width: 720px !important;
    min-height: 60px !important;
    max-height: 72px !important;
}

#top .latest-products-slider .hero-latest-footer {
    display: grid !important;
    justify-items: center !important;
    align-content: end !important;
    gap: 10px !important;
    min-height: 86px !important;
    padding: 12px 10px 0 0 !important;
}

#top .latest-products-slider .hero-latest-price,
#top .latest-products-slider .hero-latest-actions {
    justify-content: center !important;
    text-align: center !important;
}

#top .latest-products-slider .hero-latest-actions {
    width: 100% !important;
}

@media (max-width: 900px) {
    #top .latest-products-slider .hero-latest-card,
    #top .latest-products-slider .hero-latest-card.is-featured {
        grid-template-columns: 1fr !important;
        grid-template-rows: auto minmax(116px, 1fr) auto !important;
        min-height: 0 !important;
        gap: 13px !important;
        padding: 13px !important;
    }

    #top .latest-products-slider .hero-latest-media,
    #top .latest-products-slider .hero-latest-card.is-featured .hero-latest-media {
        grid-column: auto !important;
        grid-row: auto !important;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 16 / 9 !important;
    }

    #top .latest-products-slider .hero-latest-copy {
        min-height: 116px !important;
        padding: 0 2px !important;
    }

    #top .latest-products-slider .hero-latest-footer {
        padding: 10px 0 0 !important;
    }
}

/* Catalog dropdown: compact category showcase. */
.site-header .nav-dropdown-menu.nav-mega-menu {
    width: min(1110px, calc(100vw - 36px)) !important;
    max-height: min(560px, calc(100vh - 96px)) !important;
    display: grid !important;
    gap: 14px !important;
    padding: 14px !important;
    overflow: auto !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 18px !important;
    background:
        radial-gradient(520px 220px at 0% 0%, rgba(255, 49, 76, 0.22), transparent 70%),
        radial-gradient(420px 220px at 100% 0%, rgba(255, 255, 255, 0.08), transparent 72%),
        linear-gradient(145deg, rgba(37, 38, 46, 0.97), rgba(10, 11, 16, 0.98) 62%, rgba(43, 6, 16, 0.78)) !important;
    box-shadow:
        0 28px 76px rgba(0, 0, 0, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

.site-header .nav-mega-head {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 18px !important;
    padding: 0 !important;
}

.site-header .nav-mega-eyebrow {
    color: #ff314c !important;
    font-size: 11px !important;
    font-weight: 1000 !important;
    line-height: 1 !important;
    letter-spacing: 0.06em !important;
}

.site-header .nav-mega-head strong {
    margin-top: 7px !important;
    font-size: clamp(30px, 2.45vw, 40px) !important;
    line-height: 0.94 !important;
}

.site-header .nav-mega-full {
    min-height: 38px !important;
    padding: 0 17px !important;
    border: 1px solid rgba(255, 255, 255, 0.22) !important;
    border-radius: 999px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.025)),
        rgba(35, 36, 43, 0.86) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
    font-size: 12px !important;
    font-weight: 950 !important;
}

.site-header .nav-mega-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(320px, 350px)) !important;
    justify-content: center !important;
    align-items: stretch !important;
    gap: 14px !important;
}

.site-header .nav-mega-card {
    min-height: 348px !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 14px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 18px !important;
    background:
        radial-gradient(330px 170px at 0% 0%, rgba(255, 49, 76, 0.2), transparent 72%),
        linear-gradient(145deg, rgba(41, 42, 50, 0.92), rgba(12, 13, 19, 0.96) 58%, rgba(54, 7, 18, 0.55)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 18px 48px rgba(0, 0, 0, 0.34) !important;
}

.site-header .nav-mega-card.is-active,
.site-header .nav-mega-card:hover {
    border-color: rgba(255, 49, 76, 0.44) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 20px 54px rgba(0, 0, 0, 0.38),
        0 0 28px rgba(255, 49, 76, 0.12) !important;
}

.site-header .nav-mega-card::before {
    top: 13px !important;
    right: 13px !important;
    max-width: 84% !important;
    color: rgba(255, 255, 255, 0.035) !important;
    font-size: clamp(50px, 4.2vw, 66px) !important;
    line-height: 0.78 !important;
}

.site-header .nav-mega-card-top {
    align-items: flex-start !important;
    margin-bottom: 0 !important;
}

.site-header .nav-mega-card-top > span {
    max-width: 170px !important;
    color: rgba(255, 150, 162, 0.95) !important;
    font-size: 11px !important;
    font-weight: 1000 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
}

.site-header .nav-mega-card-link {
    min-height: 30px !important;
    max-width: 130px !important;
    padding: 0 11px !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    border-radius: 999px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.03)),
        rgba(42, 43, 49, 0.86) !important;
    font-size: 10px !important;
    font-weight: 1000 !important;
}

.site-header .nav-mega-title {
    width: max-content !important;
    max-width: 64% !important;
    margin-top: 2px !important;
    color: #fff !important;
    font-size: clamp(30px, 2.1vw, 36px) !important;
    line-height: 0.9 !important;
    font-weight: 1000 !important;
}

.site-header .nav-mega-chips {
    min-height: 72px !important;
    margin-top: 12px !important;
    gap: 8px !important;
}

.site-header .nav-mega-chip {
    max-width: 150px !important;
    min-height: 30px !important;
    padding: 0 12px !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 999px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.025)),
        rgba(255, 255, 255, 0.045) !important;
    color: rgba(255, 255, 255, 0.82) !important;
    font-size: 11px !important;
    font-weight: 950 !important;
}

.site-header .nav-mega-preview {
    margin-top: auto !important;
    padding-top: 12px !important;
}

.site-header .nav-mega-product-slide {
    min-height: 130px !important;
    display: none !important;
    grid-template-columns: 124px minmax(0, 1fr) !important;
    gap: 12px !important;
    align-items: stretch !important;
    padding: 10px !important;
    border: 1px solid rgba(255, 49, 76, 0.3) !important;
    border-radius: 16px !important;
    background:
        radial-gradient(240px 120px at 0% 0%, rgba(255, 49, 76, 0.2), transparent 72%),
        linear-gradient(135deg, rgba(255, 49, 76, 0.1), rgba(255, 255, 255, 0.02)),
        rgba(9, 10, 14, 0.74) !important;
}

.site-header .nav-mega-product-slide.is-active {
    display: grid !important;
}

.site-header .nav-mega-product-media {
    min-height: 100% !important;
    border-radius: 12px !important;
}

.site-header .nav-mega-product-copy {
    justify-content: center !important;
}

.site-header .nav-mega-product-badge {
    min-height: 21px !important;
    padding: 0 9px !important;
    font-size: 9.5px !important;
}

.site-header .nav-mega-product-copy strong {
    font-size: 18px !important;
    line-height: 0.96 !important;
    -webkit-line-clamp: 2 !important;
}

.site-header .nav-mega-product-description {
    margin-top: 5px !important;
    font-size: 12px !important;
    line-height: 1.22 !important;
    -webkit-line-clamp: 2 !important;
}

.site-header .nav-mega-product-copy b {
    margin-top: 8px !important;
    padding: 4px 9px !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.12) !important;
    font-size: 13px !important;
}

.site-header .nav-mega-slider-controls {
    display: none !important;
    align-items: center !important;
    gap: 8px !important;
    margin-top: 9px !important;
}

.site-header .nav-mega-preview.has-products .nav-mega-slider-controls {
    display: flex !important;
}

.site-header .nav-mega-slider-controls button {
    width: 32px !important;
    height: 32px !important;
    flex: 0 0 32px !important;
    border-radius: 999px !important;
}

.site-header .nav-mega-slider-controls strong {
    height: 32px !important;
    flex: 1 1 auto !important;
    border-radius: 999px !important;
    font-size: 13px !important;
}

@media (max-width: 1120px) {
    .site-header .nav-mega-grid {
        grid-template-columns: repeat(auto-fit, minmax(300px, 340px)) !important;
    }
}

@media (max-width: 760px) {
    .site-header .nav-dropdown-menu.nav-mega-menu {
        width: min(100vw - 24px, 380px) !important;
        padding: 12px !important;
    }

    .site-header .nav-mega-head {
        display: grid !important;
    }

    .site-header .nav-mega-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

/* Catalog dropdown: automatic sizing refinement. */
.site-header .nav-dropdown-menu.nav-mega-menu {
    width: max-content !important;
    min-width: min(420px, calc(100vw - 36px)) !important;
    max-width: calc(100vw - 36px) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(100vh - 96px) !important;
    align-content: start !important;
}

.site-header .nav-mega-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    justify-content: center !important;
    width: auto !important;
    max-width: 100% !important;
}

.site-header .nav-mega-card {
    width: min(350px, 100%) !important;
    flex: 0 1 350px !important;
    min-height: 0 !important;
    height: auto !important;
}

.site-header .nav-mega-card.is-single {
    min-height: 0 !important;
}

.site-header .nav-mega-card:not(.is-single) {
    min-height: 342px !important;
}

.site-header .nav-mega-card.is-single .nav-mega-title {
    margin-bottom: 12px !important;
}

.site-header .nav-mega-card.is-single .nav-mega-preview {
    margin-top: 14px !important;
}

.site-header .nav-mega-card:not(.is-single) .nav-mega-preview {
    margin-top: auto !important;
}

.site-header .nav-mega-product-slide {
    min-height: 118px !important;
    grid-template-columns: 122px minmax(0, 1fr) !important;
}

.site-header .nav-mega-product-copy strong {
    font-size: 17px !important;
}

.site-header .nav-mega-card-top > span {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

@media (max-width: 760px) {
    .site-header .nav-dropdown-menu.nav-mega-menu {
        width: min(100vw - 24px, 380px) !important;
        min-width: 0 !important;
    }

    .site-header .nav-mega-card {
        width: 100% !important;
        flex-basis: 100% !important;
    }
}

/* Catalog dropdown: wider cards and rotating resource media. */
.site-header .nav-mega-card {
    width: min(390px, 100%) !important;
    flex: 0 1 390px !important;
}

.site-header .nav-mega-grid {
    gap: 16px !important;
}

.site-header .nav-mega-title {
    display: block !important;
    width: max-content !important;
    max-width: min(230px, 72%) !important;
    margin-top: 4px !important;
    margin-bottom: 14px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #fff !important;
    cursor: default !important;
    pointer-events: none !important;
}

.site-header .nav-mega-title:hover {
    border-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #fff !important;
}

.site-header .nav-mega-chip {
    cursor: default !important;
    pointer-events: none !important;
}

.site-header .nav-mega-product-slide {
    min-height: 124px !important;
    grid-template-columns: 142px minmax(0, 1fr) !important;
}

.site-header .nav-mega-product-media {
    position: relative !important;
    isolation: isolate !important;
    min-height: 102px !important;
    overflow: hidden !important;
}

.site-header .nav-mega-product-media:has(.nav-mega-preview-image) > span:not(.nav-mega-preview-dots) {
    display: none !important;
}

.site-header .nav-mega-product-media .nav-mega-preview-image {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    opacity: 0 !important;
    transform: scale(1.018) !important;
    transition: opacity 420ms ease, transform 3000ms ease, filter 260ms ease !important;
}

.site-header .nav-mega-product-media .nav-mega-preview-image.is-active {
    opacity: 1 !important;
    transform: scale(1.045) !important;
}

.site-header .nav-mega-product-slide:hover .nav-mega-preview-image.is-active {
    transform: scale(1.07) !important;
}

.site-header .nav-mega-preview-dots {
    position: absolute !important;
    left: 50% !important;
    bottom: 8px !important;
    z-index: 3 !important;
    display: inline-flex !important;
    gap: 5px !important;
    transform: translateX(-50%) !important;
    pointer-events: none !important;
}

.site-header .nav-mega-preview-dot {
    width: 5px !important;
    height: 5px !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.38) !important;
    opacity: 0.82 !important;
    box-shadow: 0 0 9px rgba(0, 0, 0, 0.52) !important;
    transition: width 220ms ease, background 220ms ease, opacity 220ms ease !important;
}

.site-header .nav-mega-preview-dot.is-active {
    width: 16px !important;
    background: #ff314c !important;
    opacity: 1 !important;
    box-shadow: 0 0 12px rgba(255, 49, 76, 0.75) !important;
}

@media (max-width: 760px) {
    .site-header .nav-mega-card {
        width: 100% !important;
        flex-basis: 100% !important;
    }

    .site-header .nav-mega-product-slide {
        grid-template-columns: 118px minmax(0, 1fr) !important;
    }
}

/* Catalog dropdown: viewport-safe 2x2 category grid. */
.site-header .nav-dropdown-menu.nav-mega-menu {
    left: 50% !important;
    right: auto !important;
    width: min(860px, calc(100vw - 36px)) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 36px) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(100vh - 96px) !important;
    overflow: auto !important;
    transform: translate(-50%, -8px) scale(0.985) !important;
}

.site-header .nav-dropdown.is-open .nav-dropdown-menu.nav-mega-menu {
    transform: translate(-50%, 0) scale(1) !important;
}

.site-header .nav-mega-head {
    width: 100% !important;
}

.site-header .nav-mega-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    justify-content: stretch !important;
    width: 100% !important;
    max-width: none !important;
    gap: 16px !important;
}

.site-header .nav-mega-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    flex: none !important;
}

.site-header .nav-mega-title {
    max-width: min(310px, 100%) !important;
    font-size: clamp(30px, 2vw, 36px) !important;
    line-height: 0.9 !important;
    text-wrap: balance !important;
}

.site-header .nav-mega-card[data-title="Server Packs"] .nav-mega-title {
    max-width: 100% !important;
    font-size: clamp(28px, 1.85vw, 34px) !important;
}

.site-header .nav-mega-product-slide {
    grid-template-columns: minmax(124px, 38%) minmax(0, 1fr) !important;
}

@media (max-width: 900px) {
    .site-header .nav-dropdown-menu.nav-mega-menu {
        width: min(430px, calc(100vw - 28px)) !important;
    }

    .site-header .nav-mega-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

@media (max-width: 520px) {
    .site-header .nav-dropdown-menu.nav-mega-menu {
        width: min(100vw - 20px, 390px) !important;
    }

    .site-header .nav-mega-head {
        display: grid !important;
    }

    .site-header .nav-mega-product-slide {
        grid-template-columns: 112px minmax(0, 1fr) !important;
    }
}

/* Catalog dropdown: final roomier 2x2 cards. */
.site-header .nav-dropdown-menu.nav-mega-menu {
    width: min(1040px, calc(100vw - 36px)) !important;
}

.site-header .nav-mega-grid {
    gap: 18px !important;
}

.site-header .nav-mega-card {
    padding: 16px !important;
}

.site-header .nav-mega-product-slide {
    min-height: 138px !important;
    grid-template-columns: minmax(168px, 44%) minmax(0, 1fr) !important;
    gap: 14px !important;
    padding: 11px !important;
}

.site-header .nav-mega-product-media {
    min-height: 116px !important;
}

.site-header .nav-mega-product-copy strong {
    font-size: 18.5px !important;
}

.site-header .nav-mega-product-description {
    font-size: 12.5px !important;
    line-height: 1.24 !important;
}

@media (max-width: 900px) {
    .site-header .nav-dropdown-menu.nav-mega-menu {
        width: min(460px, calc(100vw - 28px)) !important;
    }

    .site-header .nav-mega-product-slide {
        grid-template-columns: minmax(128px, 40%) minmax(0, 1fr) !important;
    }
}

@media (max-width: 520px) {
    .site-header .nav-mega-product-slide {
        grid-template-columns: 118px minmax(0, 1fr) !important;
    }
}

/* Product category badges: final shared REDACTOR style and centered dot. */
#top .latest-products-slider .hero-latest-kicker,
main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-meta span:first-child {
    width: max-content !important;
    max-width: 100% !important;
    min-height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    padding: 0 11px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 49, 76, 0.76) !important;
    border-radius: 999px !important;
    color: #ff4058 !important;
    background:
        radial-gradient(80px 36px at 18% 0%, rgba(255, 49, 76, 0.24), transparent 72%),
        rgba(92, 10, 23, 0.34) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 10px 22px rgba(255, 49, 76, 0.1) !important;
    font-size: 11px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    text-transform: uppercase !important;
}

#top .latest-products-slider .hero-latest-kicker::before,
main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-meta span:first-child::before {
    content: "" !important;
    width: 6px !important;
    height: 6px !important;
    flex: 0 0 6px !important;
    display: block !important;
    align-self: center !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: #ff314c !important;
    box-shadow: 0 0 12px rgba(255, 49, 76, 0.78) !important;
    transform: none !important;
}

/* Catalog search must fully hide non-matching cards. */
main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-card.is-hidden,
main.tebex-page.seo-main.seo-minimal-main .seo-product-grid .product-card[hidden] {
    display: none !important;
}

/* Package detail page: final REDACTOR product layout. */
main.tebex-page.package-main {
    position: relative !important;
    min-height: 100svh !important;
    padding: calc(var(--header-h) + 52px) 0 clamp(70px, 7vw, 110px) !important;
    color: #fff !important;
    background: transparent !important;
}

main.tebex-page.package-main .package-page {
    width: min(1500px, calc(100% - 44px)) !important;
    margin: 0 auto !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1.38fr) minmax(360px, 0.62fr) !important;
    gap: clamp(18px, 2vw, 28px) !important;
    align-items: start !important;
    background: transparent !important;
}

main.tebex-page.package-main .package-media,
main.tebex-page.package-main .package-content {
    min-width: 0 !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 22px !important;
    background:
        radial-gradient(680px 260px at 0% 0%, rgba(255, 49, 76, 0.14), transparent 72%),
        radial-gradient(460px 220px at 100% 0%, rgba(255, 255, 255, 0.06), transparent 68%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.072), rgba(255, 255, 255, 0.022)),
        rgba(11, 13, 19, 0.88) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 24px 70px rgba(0, 0, 0, 0.32),
        0 0 0 1px rgba(255, 49, 76, 0.04) !important;
}

main.tebex-page.package-main .package-media {
    display: grid !important;
    gap: 12px !important;
    padding: 14px !important;
    overflow: hidden !important;
}

main.tebex-page.package-main .product-media-large {
    position: relative !important;
    width: 100% !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 16px !important;
    background: #07080c !important;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.035),
        0 18px 42px rgba(0, 0, 0, 0.26) !important;
}

main.tebex-page.package-main .product-media-large .media-hover,
main.tebex-page.package-main .product-media-large .media-hint {
    display: none !important;
}

main.tebex-page.package-main .product-media-large .product-visual,
main.tebex-page.package-main .product-media-large .product-placeholder,
main.tebex-page.package-main .product-media-large img,
main.tebex-page.package-main .product-media-large video {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    object-position: center !important;
}

main.tebex-page.package-main .gallery-strip {
    width: 100% !important;
    display: grid !important;
    grid-auto-flow: column !important;
    grid-auto-columns: minmax(132px, 178px) !important;
    grid-template-columns: none !important;
    gap: 10px !important;
    padding: 0 0 4px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    border: 0 !important;
    background: transparent !important;
    scrollbar-color: rgba(255, 49, 76, 0.8) rgba(255, 255, 255, 0.08) !important;
    scrollbar-width: thin !important;
}

main.tebex-page.package-main .gallery-thumb {
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: transparent !important;
}

main.tebex-page.package-main .gallery-thumb .product-media {
    width: 100% !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 12px !important;
    opacity: 0.72 !important;
    background: #07080c !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

main.tebex-page.package-main .gallery-thumb:hover .product-media,
main.tebex-page.package-main .gallery-thumb.is-active .product-media {
    border-color: rgba(255, 49, 76, 0.78) !important;
    opacity: 1 !important;
    filter: brightness(1.08) saturate(1.06) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.13),
        0 0 0 1px rgba(255, 49, 76, 0.16),
        0 14px 30px rgba(0, 0, 0, 0.28) !important;
}

main.tebex-page.package-main .package-content {
    display: grid !important;
    align-content: start !important;
    gap: 18px !important;
    padding: clamp(22px, 2.1vw, 30px) !important;
}

main.tebex-page.package-main .package-content .eyebrow {
    width: max-content !important;
    min-height: 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 13px !important;
    border: 1px solid rgba(255, 49, 76, 0.72) !important;
    border-radius: 999px !important;
    color: #ff4058 !important;
    background: rgba(92, 10, 23, 0.34) !important;
    font-size: 12px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase !important;
}

main.tebex-page.package-main .package-content .eyebrow::before {
    content: "" !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 999px !important;
    background: #ff314c !important;
    box-shadow: 0 0 12px rgba(255, 49, 76, 0.78) !important;
}

main.tebex-page.package-main .package-content h1 {
    margin: 0 !important;
    color: #fff !important;
    font-size: clamp(32px, 2.7vw, 48px) !important;
    font-weight: 950 !important;
    line-height: 1.03 !important;
    letter-spacing: 0 !important;
    overflow-wrap: anywhere !important;
    text-wrap: balance !important;
}

main.tebex-page.package-main .package-actions {
    display: grid !important;
    gap: 13px !important;
    margin-top: 2px !important;
    padding-top: 18px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}

main.tebex-page.package-main .package-price {
    display: grid !important;
    gap: 4px !important;
    margin: 2px 0 0 !important;
}

main.tebex-page.package-main .package-price s {
    width: max-content !important;
    color: rgba(226, 231, 240, 0.48) !important;
    font-size: 16px !important;
    font-weight: 850 !important;
}

main.tebex-page.package-main .package-price strong {
    color: #fff !important;
    font-size: clamp(30px, 2.25vw, 40px) !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
}

main.tebex-page.package-main .package-actions > .btn {
    width: 100% !important;
    min-height: 52px !important;
    justify-content: center !important;
    border-radius: 12px !important;
}

main.tebex-page.package-main .package-badges {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

main.tebex-page.package-main .package-badges span {
    min-height: 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 0 11px !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 999px !important;
    color: rgba(245, 247, 250, 0.84) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.085), rgba(255, 255, 255, 0.028)),
        rgba(25, 27, 34, 0.72) !important;
    font-size: 11px !important;
    font-weight: 950 !important;
    text-transform: uppercase !important;
}

main.tebex-page.package-main .package-description {
    grid-column: 1 / -1 !important;
    min-width: 0 !important;
    margin-top: 0 !important;
    padding: clamp(22px, 2.4vw, 34px) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 22px !important;
    background:
        radial-gradient(760px 260px at 0% 0%, rgba(255, 49, 76, 0.12), transparent 72%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.064), rgba(255, 255, 255, 0.018)),
        rgba(11, 13, 19, 0.88) !important;
    color: rgba(226, 231, 240, 0.84);
    font-size: 15px;
    font-weight: 680;
    line-height: 1.64;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 24px 70px rgba(0, 0, 0, 0.28) !important;
}

main.tebex-page.package-main .package-description > :first-child {
    margin-top: 0;
}

main.tebex-page.package-main .package-description > :last-child {
    margin-bottom: 0;
}

main.tebex-page.package-main .package-description img,
main.tebex-page.package-main .package-description video,
main.tebex-page.package-main .package-description iframe {
    max-width: 100% !important;
    border-radius: inherit;
}

main.tebex-page.package-main .package-description img,
main.tebex-page.package-main .package-description video {
    height: auto;
}

main.tebex-page.package-main .package-description table {
    max-width: 100%;
    overflow: hidden;
}

main.tebex-page.package-main .package-description :is(th, td) {
    min-width: 0;
}

@media (max-width: 1100px) {
    main.tebex-page.package-main .package-page {
        grid-template-columns: 1fr !important;
        width: min(900px, calc(100% - 32px)) !important;
    }
}

@media (max-width: 640px) {
    main.tebex-page.package-main {
        padding-top: calc(var(--header-h) + 30px) !important;
    }

    main.tebex-page.package-main .package-page {
        width: min(100% - 24px, 560px) !important;
    }

    main.tebex-page.package-main .package-media,
    main.tebex-page.package-main .package-content,
    main.tebex-page.package-main .package-description {
        border-radius: 16px !important;
    }

    main.tebex-page.package-main .package-media {
        padding: 10px !important;
    }

    main.tebex-page.package-main .gallery-strip {
        grid-auto-columns: minmax(112px, 44vw) !important;
    }

    main.tebex-page.package-main .package-actions {
        align-items: stretch !important;
        flex-direction: column !important;
    }

    main.tebex-page.package-main .package-actions > .btn {
        width: 100% !important;
    }
}

/* Homepage preview servers: support one or two test servers cleanly. */
#top .home-hero .hero-server-list {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
}

#top .home-hero .hero-server-list .hero-server-panel {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
        "status actions"
        "name actions"
        "url actions" !important;
    align-items: center !important;
    gap: 8px 16px !important;
    min-width: 0 !important;
    padding: 14px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 14px !important;
    background:
        radial-gradient(330px 140px at 0% 0%, rgba(255, 49, 76, 0.12), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.058), rgba(255, 255, 255, 0.016)),
        rgba(6, 7, 11, 0.5) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 16px 34px rgba(0, 0, 0, 0.18) !important;
}

#top .home-hero .hero-server-list .hero-server-panel::before,
#top .home-hero .hero-server-list .hero-server-panel::after {
    content: none !important;
    display: none !important;
}

#top .home-hero .hero-server-list .preview-server-status {
    grid-area: status !important;
    justify-self: start !important;
    min-height: 26px !important;
    margin: 0 !important;
}

#top .home-hero .hero-server-list .hero-server-panel strong {
    grid-area: name !important;
    max-width: 100% !important;
    font-size: clamp(18px, 1.25vw, 24px) !important;
    line-height: 1.05 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

#top .home-hero .hero-server-list .hero-server-panel strong.is-server-name-pending {
    color: rgba(235, 238, 245, 0.58) !important;
}

#top .home-hero .hero-server-list .hero-server-panel code {
    grid-area: url !important;
    width: 100% !important;
    min-height: 38px !important;
    min-width: 0 !important;
    padding: 9px 12px !important;
}

#top .home-hero .hero-server-list .preview-server-actions {
    grid-area: actions !important;
    width: auto !important;
    min-width: 136px !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-self: stretch !important;
    justify-self: end !important;
    align-content: center !important;
    gap: 8px !important;
    margin: 0 !important;
}

#top .home-hero .hero-server-list .preview-server-actions .btn {
    min-height: 38px !important;
    padding: 0 14px !important;
}

@media (max-width: 820px) {
    #top .home-hero .hero-server-list .hero-server-panel {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "status"
            "name"
            "url"
            "actions" !important;
        gap: 9px !important;
    }

    #top .home-hero .hero-server-list .preview-server-actions {
        width: min(100%, 330px) !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        justify-self: center !important;
    }
}

@media (max-width: 560px) {
    #top .home-hero .hero-server-list .preview-server-actions {
        width: 100% !important;
        grid-template-columns: 1fr !important;
    }
}

/* Preview server live status. */
#top .home-hero .hero-server-list .preview-server-status {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 0 11px !important;
    border-radius: 999px !important;
    transition:
        color 180ms ease,
        border-color 180ms ease,
        background 180ms ease,
        box-shadow 180ms ease !important;
}

#top .home-hero .hero-server-list .preview-server-status::before {
    margin-top: 0 !important;
    transform: none !important;
}

#top .home-hero .hero-server-list .preview-server-status [data-server-status-label] {
    line-height: 1 !important;
}

#top .home-hero .hero-server-list .preview-server-status.is-checking {
    color: rgba(235, 238, 245, 0.82) !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    background: rgba(255, 255, 255, 0.055) !important;
}

#top .home-hero .hero-server-list .preview-server-status.is-checking::before {
    background: rgba(235, 238, 245, 0.74) !important;
    box-shadow: 0 0 12px rgba(235, 238, 245, 0.42) !important;
}

#top .home-hero .hero-server-list .preview-server-status.is-online {
    color: #42ff8b !important;
    border-color: rgba(66, 255, 139, 0.52) !important;
    background: rgba(33, 128, 72, 0.14) !important;
    box-shadow: 0 0 22px rgba(66, 255, 139, 0.08) !important;
}

#top .home-hero .hero-server-list .preview-server-status.is-online::before {
    background: #42ff8b !important;
    box-shadow: 0 0 14px rgba(66, 255, 139, 0.72) !important;
}

#top .home-hero .hero-server-list .preview-server-status.is-offline {
    color: #ff4058 !important;
    border-color: rgba(255, 49, 76, 0.62) !important;
    background: rgba(92, 10, 23, 0.28) !important;
}

#top .home-hero .hero-server-list .preview-server-status.is-offline::before {
    background: #ff314c !important;
    box-shadow: 0 0 14px rgba(255, 49, 76, 0.72) !important;
}

#top .home-hero .hero-server-list .preview-server-status.is-unknown {
    color: rgba(235, 238, 245, 0.72) !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
    background: rgba(255, 255, 255, 0.045) !important;
}

#top .home-hero .hero-server-list .preview-server-status.is-unknown::before {
    background: rgba(235, 238, 245, 0.62) !important;
    box-shadow: none !important;
}

/* Homepage standalone preview server block. */
#top .home-preview-server {
    position: relative !important;
    width: min(1500px, calc(100% - 44px)) !important;
    margin: clamp(28px, 3vw, 44px) auto clamp(28px, 3.2vw, 52px) !important;
    padding: 0 !important;
}

#top .trust-bar+.home-preview-server {
    margin-top: clamp(28px, 3.2vw, 46px) !important;
}

#top .home-preview-server+.framework-support {
    margin-top: 0 !important;
}

#top .home-preview-server-card {
    position: relative !important;
    isolation: isolate !important;
    display: grid !important;
    grid-template-columns: minmax(0, 0.95fr) minmax(420px, 0.72fr) !important;
    align-items: center !important;
    gap: clamp(22px, 3.5vw, 56px) !important;
    min-height: 0 !important;
    padding: clamp(24px, 2.7vw, 38px) !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 22px !important;
    background:
        radial-gradient(760px 300px at 0% 0%, rgba(255, 49, 76, 0.18), transparent 68%),
        radial-gradient(540px 240px at 100% 8%, rgba(255, 255, 255, 0.055), transparent 70%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.072), rgba(255, 255, 255, 0.022) 58%, rgba(255, 49, 76, 0.03)),
        rgba(10, 11, 16, 0.9) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        inset 0 -1px 0 rgba(255, 49, 76, 0.1),
        0 28px 78px rgba(0, 0, 0, 0.34) !important;
}

#top .home-preview-server-card::before {
    content: "" !important;
    position: absolute !important;
    inset: 1px !important;
    z-index: -1 !important;
    border-radius: inherit !important;
    pointer-events: none !important;
    background:
        linear-gradient(90deg, rgba(255, 49, 76, 0.1), transparent 36%, transparent 66%, rgba(255, 255, 255, 0.03)),
        linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 46%) !important;
}

#top .home-preview-server .hero-server-copy {
    display: grid !important;
    align-content: center !important;
    gap: 12px !important;
    max-width: 760px !important;
}

#top .home-preview-server .preview-server-kicker {
    width: max-content !important;
}

#top .home-preview-server .hero-server-copy h2 {
    max-width: 760px !important;
    margin: 0 !important;
    color: #fff !important;
    font-size: clamp(34px, 3.35vw, 56px) !important;
    font-weight: 950 !important;
    line-height: 0.98 !important;
    letter-spacing: 0 !important;
    text-wrap: balance !important;
}

#top .home-preview-server .hero-server-copy p {
    max-width: 760px !important;
    margin: 0 !important;
    color: rgba(225, 229, 238, 0.75) !important;
    font-size: clamp(15px, 1.05vw, 17px) !important;
    font-weight: 760 !important;
    line-height: 1.5 !important;
}

#top .home-preview-server .preview-server-tags {
    max-width: 760px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-top: 2px !important;
}

#top .home-preview-server .preview-server-tags span {
    min-height: 28px !important;
    padding: 0 12px !important;
}

#top .home-preview-server .hero-server-list {
    width: 100% !important;
    display: grid !important;
    gap: 12px !important;
}

#top .home-preview-server .hero-server-panel {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
        "head actions"
        "url actions" !important;
    align-items: center !important;
    gap: 12px 16px !important;
    min-width: 0 !important;
    padding: 16px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 16px !important;
    background:
        radial-gradient(360px 160px at 0% 0%, rgba(255, 49, 76, 0.13), transparent 72%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.064), rgba(255, 255, 255, 0.018)),
        rgba(7, 8, 12, 0.54) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 16px 34px rgba(0, 0, 0, 0.2) !important;
}

#top .home-preview-server .hero-server-head {
    grid-area: head !important;
    min-width: 0 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 9px 12px !important;
}

#top .home-preview-server .preview-server-status {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    min-height: 26px !important;
    margin: 0 !important;
    padding: 0 11px !important;
    border-radius: 999px !important;
}

#top .home-preview-server .preview-server-status[hidden] {
    display: none !important;
}

#top .home-preview-server .preview-server-status::before {
    margin-top: 0 !important;
    transform: none !important;
}

#top .home-preview-server .preview-server-status [data-server-status-label] {
    line-height: 1 !important;
}

#top .home-preview-server .preview-server-status.is-checking {
    color: rgba(235, 238, 245, 0.82) !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    background: rgba(255, 255, 255, 0.055) !important;
}

#top .home-preview-server .preview-server-status.is-checking::before {
    background: rgba(235, 238, 245, 0.74) !important;
    box-shadow: 0 0 12px rgba(235, 238, 245, 0.42) !important;
}

#top .home-preview-server .preview-server-status.is-online {
    color: #42ff8b !important;
    border-color: rgba(66, 255, 139, 0.52) !important;
    background: rgba(33, 128, 72, 0.14) !important;
    box-shadow: 0 0 22px rgba(66, 255, 139, 0.08) !important;
}

#top .home-preview-server .preview-server-status.is-online::before {
    background: #42ff8b !important;
    box-shadow: 0 0 14px rgba(66, 255, 139, 0.72) !important;
}

#top .home-preview-server .preview-server-status.is-offline {
    color: #ff4058 !important;
    border-color: rgba(255, 49, 76, 0.62) !important;
    background: rgba(92, 10, 23, 0.28) !important;
}

#top .home-preview-server .preview-server-status.is-offline::before {
    background: #ff314c !important;
    box-shadow: 0 0 14px rgba(255, 49, 76, 0.72) !important;
}

#top .home-preview-server .preview-server-status.is-unknown {
    color: rgba(235, 238, 245, 0.72) !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
    background: rgba(255, 255, 255, 0.045) !important;
}

#top .home-preview-server .preview-server-status.is-unknown::before {
    background: rgba(235, 238, 245, 0.62) !important;
    box-shadow: none !important;
}

#top .home-preview-server .hero-server-panel strong {
    min-width: 0 !important;
    flex: 1 1 220px !important;
    color: #fff !important;
    font-size: clamp(20px, 1.45vw, 28px) !important;
    font-weight: 950 !important;
    line-height: 1.04 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

#top .home-preview-server .hero-server-panel strong.is-server-name-pending {
    color: rgba(235, 238, 245, 0.58) !important;
}

#top .home-preview-server .hero-server-panel code {
    grid-area: url !important;
    width: 100% !important;
    min-height: 40px !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    padding: 10px 13px !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 10px !important;
    color: rgba(235, 238, 245, 0.82) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.052), rgba(255, 255, 255, 0.014)),
        rgba(4, 5, 9, 0.3) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

#top .home-preview-server .preview-server-actions {
    grid-area: actions !important;
    width: auto !important;
    min-width: 150px !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-self: stretch !important;
    align-content: center !important;
    gap: 8px !important;
    margin: 0 !important;
}

#top .home-preview-server .preview-server-actions .btn {
    width: 100% !important;
    min-height: 40px !important;
    justify-content: center !important;
    padding: 0 14px !important;
}

@media (max-width: 1120px) {
    #top .home-preview-server-card {
        grid-template-columns: 1fr !important;
    }

    #top .home-preview-server .hero-server-copy {
        max-width: none !important;
    }
}

@media (max-width: 680px) {
    #top .home-preview-server {
        width: min(100% - 28px, 620px) !important;
    }

    #top .home-preview-server-card {
        padding: 18px !important;
        border-radius: 18px !important;
    }

    #top .home-preview-server .hero-server-panel {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "head"
            "url"
            "actions" !important;
    }

    #top .home-preview-server .preview-server-actions {
        width: 100% !important;
        min-width: 0 !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 480px) {
    #top .home-preview-server .preview-server-actions {
        grid-template-columns: 1fr !important;
    }
}

/* Preview server: full-width copy with horizontal server cards. */
#top .home-preview-server-card {
    grid-template-columns: 1fr !important;
    align-items: stretch !important;
    gap: clamp(18px, 2.2vw, 28px) !important;
}

#top .home-preview-server .hero-server-copy {
    max-width: none !important;
    width: 100% !important;
}

#top .home-preview-server .hero-server-copy h2 {
    max-width: none !important;
    font-size: clamp(34px, 3.15vw, 52px) !important;
}

#top .home-preview-server .hero-server-copy p {
    max-width: 1080px !important;
}

#top .home-preview-server .preview-server-tags {
    max-width: none !important;
}

#top .home-preview-server .hero-server-list {
    grid-template-columns: repeat(auto-fit, minmax(460px, 1fr)) !important;
    align-items: stretch !important;
}

#top .home-preview-server .hero-server-panel {
    min-height: 122px !important;
}

#top .home-preview-server .hero-server-panel strong {
    font-size: clamp(17px, 1.12vw, 22px) !important;
}

@media (max-width: 980px) {
    #top .home-preview-server .hero-server-list {
        grid-template-columns: 1fr !important;
    }
}

/* Preview server final placement: copy on top, server cards along the bottom. */
body #top .home-preview-server .home-preview-server-card.home-preview-server-card--stacked {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: clamp(18px, 2.2vw, 30px) !important;
}

body #top .home-preview-server .home-preview-server-card--stacked .home-preview-server-copy {
    width: 100% !important;
    max-width: none !important;
}

body #top .home-preview-server .home-preview-server-card--stacked .home-preview-server-copy h2,
body #top .home-preview-server .home-preview-server-card--stacked .home-preview-server-copy p,
body #top .home-preview-server .home-preview-server-card--stacked .home-preview-server-copy .preview-server-tags {
    max-width: none !important;
}

body #top .home-preview-server .home-preview-server-card--stacked .home-preview-server-grid {
    width: 100% !important;
    max-width: none !important;
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 520px), 1fr)) !important;
    align-items: stretch !important;
    gap: 14px !important;
}

body #top .home-preview-server .home-preview-server-card--stacked .home-preview-server-grid .hero-server-panel {
    width: 100% !important;
    min-height: 118px !important;
    margin: 0 !important;
}

body #top .home-preview-server .home-preview-server-card--stacked .home-preview-server-grid .hero-server-panel strong {
    font-size: clamp(16px, 1.05vw, 21px) !important;
}

@media (max-width: 760px) {
    body #top .home-preview-server .home-preview-server-card--stacked .home-preview-server-grid {
        grid-template-columns: 1fr !important;
    }
}

/* Preview server status: keep the dot tight to Online / Offline text. */
body #top .home-preview-server .home-preview-server-card--stacked .preview-server-status {
    width: auto !important;
    min-width: 0 !important;
    max-width: max-content !important;
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    padding: 0 11px !important;
}

body #top .home-preview-server .home-preview-server-card--stacked .preview-server-status::before {
    position: static !important;
    flex: 0 0 6px !important;
    width: 6px !important;
    height: 6px !important;
    margin: 0 !important;
    transform: none !important;
}

body #top .home-preview-server .home-preview-server-card--stacked .preview-server-status [data-server-status-label] {
    flex: 0 0 auto !important;
    display: inline-block !important;
    margin: 0 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

/* Mobile performance: keep the atmosphere visible, but freeze decorative motion. */
@media (max-width: 820px), (hover: none) and (pointer: coarse) {
    body::before,
    body::after,
    body > .redactor-site-image-bg::before,
    body > .redactor-site-image-bg::after,
    .hero.home-hero::before,
    .hero.home-hero::after,
    .hero.home-hero .hero-depth-lines {
        animation: none !important;
        transform: translate3d(0, 0, 0) !important;
        will-change: auto !important;
    }

    body::before {
        opacity: 0.16 !important;
        filter: blur(12px) saturate(0.9) !important;
    }

    body::after,
    body > .redactor-site-image-bg::after {
        opacity: 0.1 !important;
        filter: none !important;
    }

    .redactor-ambient-canvas {
        opacity: 0.38 !important;
        animation: none !important;
        transform: none !important;
        will-change: auto !important;
    }
}

/* Preview server badge: match the Resource localizations pill style. */
body #top .home-preview-server .preview-server-kicker {
    width: max-content !important;
    min-height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0 12px !important;
    border: 1px solid rgba(255, 49, 76, 0.58) !important;
    border-radius: 999px !important;
    color: #ff314c !important;
    background:
        linear-gradient(135deg, rgba(255, 49, 76, 0.12), rgba(255, 255, 255, 0.026)),
        rgba(255, 49, 76, 0.04) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 12px 30px rgba(255, 49, 76, 0.08) !important;
}

body #top .home-preview-server .preview-server-kicker::before {
    content: "" !important;
    width: 6px !important;
    height: 6px !important;
    flex: 0 0 6px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: #ff314c !important;
    box-shadow: 0 0 14px rgba(255, 49, 76, 0.72) !important;
}

/* REDACTOR content actions: catalog and preview-server details. */
#top .latest-products-more,
#top .home-preview-server-more {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

#top .latest-products-more {
    margin-top: clamp(18px, 2vw, 28px);
}

#top .latest-products-more .btn,
#top .home-preview-server-more .btn {
    min-width: 190px;
    min-height: 46px;
    justify-content: center;
}

#top .home-preview-server-more {
    margin-top: -4px;
}

main.tebex-page.package-main .package-test-server {
    display: grid;
    gap: 11px;
    margin-top: 2px;
    padding: 18px;
    border: 1px solid rgba(255, 49, 76, 0.25);
    border-radius: 16px;
    background:
        linear-gradient(135deg, rgba(255, 49, 76, 0.1), transparent 52%),
        rgba(7, 8, 12, 0.58);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.07),
        0 16px 34px rgba(0, 0, 0, 0.2);
}

main.tebex-page.package-main .package-test-server-kicker {
    width: max-content;
    min-height: 26px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0 10px;
    border: 1px solid rgba(255, 49, 76, 0.3);
    border-radius: 999px;
    color: #ff6074;
    background: rgba(255, 49, 76, 0.08);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

main.tebex-page.package-main .package-test-server-kicker::before {
    content: "";
    width: 6px;
    height: 6px;
    flex: 0 0 6px;
    border-radius: 999px;
    background: #ff314c;
    box-shadow: 0 0 12px rgba(255, 49, 76, 0.72);
}

main.tebex-page.package-main .package-test-server > strong {
    color: #fff;
    font-size: clamp(20px, 1.5vw, 26px);
    font-weight: 950;
    line-height: 1.08;
}

main.tebex-page.package-main .package-test-server > p {
    margin: 0;
    color: rgba(225, 229, 238, 0.72);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.5;
}

main.tebex-page.package-main .package-test-server > .btn {
    width: min(100%, 210px);
    min-height: 44px;
    justify-content: center;
    margin: 3px auto 0;
}

@media (max-width: 560px) {
    #top .latest-products-more .btn,
    #top .home-preview-server-more .btn,
    main.tebex-page.package-main .package-test-server > .btn {
        width: 100%;
    }
}

/* Mobile performance hard pass: no canvas and no heavy fixed atmosphere layers. */
@media (max-width: 820px), (hover: none) and (pointer: coarse) {
    .redactor-ambient-canvas,
    html.redactor-static-ambient .redactor-ambient-canvas,
    body::before,
    body::after {
        content: none !important;
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
        animation: none !important;
        transform: none !important;
        filter: none !important;
        mix-blend-mode: normal !important;
    }

    body > .redactor-site-image-bg {
        height: clamp(720px, 104svh, 980px) !important;
        background-position: 64% top !important;
        filter: saturate(1.02) contrast(1.04) brightness(0.62) !important;
        transform: none !important;
        will-change: auto !important;
    }

    body > .redactor-site-image-bg::before {
        animation: none !important;
        transform: none !important;
        filter: none !important;
        background:
            linear-gradient(90deg, rgba(2, 3, 7, 0.92) 0%, rgba(2, 3, 7, 0.68) 42%, rgba(25, 2, 9, 0.58) 100%),
            linear-gradient(180deg, rgba(2, 3, 7, 0.12) 0%, rgba(2, 3, 7, 0.34) 52%, rgba(2, 3, 7, 0.98) 100%),
            linear-gradient(90deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px),
            linear-gradient(180deg, rgba(255, 255, 255, 0.01) 1px, transparent 1px),
            radial-gradient(640px 360px at 78% 12%, rgba(255, 49, 76, 0.1), transparent 76%) !important;
        background-size: auto, auto, 110px 110px, 110px 110px, auto !important;
    }

    body > .redactor-site-image-bg::after {
        content: "" !important;
        display: block !important;
        inset: -40px -6vw -120px !important;
        opacity: 0.14 !important;
        visibility: visible !important;
        animation: none !important;
        transform: none !important;
        filter: none !important;
        mix-blend-mode: screen !important;
        background-image:
            radial-gradient(circle at 12% 22%, rgba(255, 49, 76, 0.28) 0 1px, rgba(255, 49, 76, 0.06) 2px, transparent 5px),
            radial-gradient(circle at 78% 18%, rgba(255, 96, 116, 0.16) 0 1px, rgba(255, 49, 76, 0.04) 2px, transparent 5px),
            radial-gradient(circle at 88% 64%, rgba(255, 255, 255, 0.08) 0 1px, transparent 4px),
            radial-gradient(circle at 30% 78%, rgba(255, 49, 76, 0.2) 0 1px, transparent 4px),
            linear-gradient(112deg, transparent 0 24%, rgba(255, 255, 255, 0.022) 24.12% 24.28%, transparent 24.7% 72%, rgba(255, 49, 76, 0.028) 72.1% 72.42%, transparent 72.8%) !important;
        background-size: 320px 460px, 430px 560px, 380px 510px, 520px 620px, 130% 130% !important;
        background-position: 0 0, 100px 70px, 40px 150px, 190px 110px, center !important;
        background-repeat: repeat !important;
    }
}

/* Mobile navigation: keep the catalog mega menu inside the burger panel. */
@media (max-width: 820px), (hover: none) and (pointer: coarse) {
    html,
    body {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    .site-header {
        z-index: 120 !important;
        overflow: visible !important;
    }

    .site-header .brand {
        min-width: 0 !important;
    }

    .site-header .brand img {
        max-width: 178px !important;
        height: auto !important;
        max-height: 48px !important;
    }

    .site-header .header-actions {
        display: none !important;
    }

    .site-header .nav-toggle {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .site-header .nav {
        position: fixed !important;
        top: calc(var(--header-h) + var(--ticker-h) + 10px) !important;
        left: 10px !important;
        right: 10px !important;
        width: auto !important;
        max-width: calc(100vw - 20px) !important;
        max-height: min(74svh, 640px) !important;
        display: none !important;
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: stretch !important;
        gap: 8px !important;
        margin: 0 !important;
        padding: 10px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        border: 1px solid rgba(255, 255, 255, 0.14) !important;
        border-radius: 16px !important;
        background:
            radial-gradient(420px 220px at 0% 0%, rgba(255, 49, 76, 0.18), transparent 72%),
            linear-gradient(145deg, rgba(18, 19, 25, 0.98), rgba(6, 7, 11, 0.98) 62%, rgba(45, 6, 16, 0.9)) !important;
        box-shadow:
            0 22px 54px rgba(0, 0, 0, 0.5),
            inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
        z-index: 125 !important;
    }

    .site-header .nav.is-open,
    .site-header .nav.open {
        display: grid !important;
    }

    .site-header .nav > a,
    .site-header .nav-dropdown-toggle,
    .site-header .nav-cart,
    .site-header .locale-current,
    .site-header .cfx-auth-nav {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 44px !important;
        display: grid !important;
        grid-template-columns: 24px minmax(0, 1fr) auto !important;
        align-items: center !important;
        justify-items: start !important;
        gap: 10px !important;
        padding: 0 12px !important;
        border-radius: 11px !important;
        text-align: left !important;
    }

    .site-header .nav > a > span:not(.nav-icon),
    .site-header .nav-dropdown-toggle > span:not(.nav-icon),
    .site-header .nav-cart > span,
    .site-header .locale-current > span,
    .site-header .cfx-auth-nav > span {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .site-header .nav-dropdown {
        position: relative !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    .site-header .nav-dropdown-menu.nav-mega-menu {
        position: static !important;
        inset: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: 0 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transform: none !important;
        border: 0 !important;
        border-radius: 14px !important;
        background: transparent !important;
        box-shadow: none !important;
        scrollbar-gutter: auto !important;
    }

    .site-header .nav-dropdown.is-open .nav-dropdown-menu.nav-mega-menu {
        max-height: min(58svh, 560px) !important;
        gap: 10px !important;
        margin-top: 8px !important;
        padding: 10px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        border: 1px solid rgba(255, 255, 255, 0.12) !important;
        background:
            radial-gradient(320px 160px at 0% 0%, rgba(255, 49, 76, 0.16), transparent 72%),
            rgba(8, 9, 14, 0.76) !important;
    }

    .site-header .nav-mega-head {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .site-header .nav-mega-head strong {
        max-width: 100% !important;
        font-size: 24px !important;
        line-height: 0.98 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        text-wrap: wrap !important;
    }

    .site-header .nav-mega-full {
        width: 100% !important;
        min-height: 38px !important;
        justify-content: center !important;
        padding: 0 12px !important;
    }

    .site-header .nav-mega-grid {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 10px !important;
    }

    .site-header .nav-mega-card {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
        flex: none !important;
        padding: 12px !important;
        overflow: hidden !important;
        border-radius: 13px !important;
    }

    .site-header .nav-mega-card::before {
        top: 10px !important;
        right: 10px !important;
        max-width: 78% !important;
        font-size: 44px !important;
        line-height: 0.8 !important;
        opacity: 0.55 !important;
    }

    .site-header .nav-mega-card-top {
        align-items: center !important;
        gap: 8px !important;
    }

    .site-header .nav-mega-card-top > span {
        max-width: min(150px, 52vw) !important;
        font-size: 10px !important;
    }

    .site-header .nav-mega-card-link {
        min-height: 32px !important;
        max-width: 132px !important;
        padding: 0 10px !important;
        font-size: 10px !important;
    }

    .site-header .nav-mega-title,
    .site-header .nav-mega-card[data-title="Server Packs"] .nav-mega-title {
        width: auto !important;
        max-width: 100% !important;
        margin: 10px 0 8px !important;
        font-size: 26px !important;
        line-height: 0.98 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        text-wrap: wrap !important;
    }

    .site-header .nav-mega-chips {
        min-height: 0 !important;
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
        margin-top: 8px !important;
    }

    .site-header .nav-mega-chip {
        min-height: 28px !important;
        max-width: 100% !important;
        padding: 0 9px !important;
        font-size: 10px !important;
    }

    .site-header .nav-mega-preview {
        margin-top: 10px !important;
        padding-top: 0 !important;
    }

    .site-header .nav-mega-product-slide {
        min-height: 102px !important;
        grid-template-columns: 94px minmax(0, 1fr) !important;
        gap: 10px !important;
        padding: 9px !important;
        border-radius: 13px !important;
    }

    .site-header .nav-mega-product-media {
        width: 94px !important;
        min-width: 0 !important;
        min-height: 76px !important;
        height: 76px !important;
        border-radius: 10px !important;
    }

    .site-header .nav-mega-product-copy {
        min-width: 0 !important;
        justify-content: center !important;
    }

    .site-header .nav-mega-product-badge {
        min-height: 20px !important;
        max-width: 112px !important;
        padding: 0 8px !important;
        font-size: 9px !important;
    }

    .site-header .nav-mega-product-copy strong {
        font-size: 15px !important;
        line-height: 1.03 !important;
        -webkit-line-clamp: 2 !important;
        overflow: hidden !important;
    }

    .site-header .nav-mega-product-description {
        margin-top: 4px !important;
        font-size: 11px !important;
        line-height: 1.2 !important;
        -webkit-line-clamp: 2 !important;
        overflow: hidden !important;
    }

    .site-header .nav-mega-product-copy b {
        margin-top: 6px !important;
        font-size: 12px !important;
    }

    .site-header .nav-mega-slider-controls {
        grid-template-columns: 32px minmax(0, 1fr) 32px !important;
        gap: 7px !important;
        margin-top: 8px !important;
    }

    .site-header .nav-mega-slider-controls button,
    .site-header .nav-mega-slider-controls strong {
        height: 32px !important;
    }
}

@media (max-width: 420px) {
    .site-header {
        padding-right: 12px !important;
        padding-left: 12px !important;
    }

    .site-header .brand img {
        max-width: 154px !important;
    }

    .site-header .nav {
        left: 8px !important;
        right: 8px !important;
        max-width: calc(100vw - 16px) !important;
        max-height: min(72svh, 560px) !important;
        padding: 9px !important;
    }

    .site-header .nav-dropdown.is-open .nav-dropdown-menu.nav-mega-menu {
        max-height: min(54svh, 470px) !important;
        padding: 9px !important;
    }

    .site-header .nav-mega-product-slide {
        grid-template-columns: 82px minmax(0, 1fr) !important;
        gap: 8px !important;
    }

    .site-header .nav-mega-product-media {
        width: 82px !important;
        height: 68px !important;
        min-height: 68px !important;
    }
}

/* Product video previews and static (non-zooming) resource imagery. */
.product-youtube {
    position: absolute;
    inset: 0;
    overflow: hidden;
    background: #07080c;
}

.product-youtube img,
.product-youtube iframe,
main.tebex-page.package-main .product-media-large iframe {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    border: 0 !important;
}

.product-youtube img {
    z-index: 1;
    object-fit: cover;
}

.product-youtube iframe {
    z-index: 2;
    pointer-events: none;
}

.product-youtube iframe:not([src]),
#top .latest-products-slider .hero-latest-preview-video iframe:not([src]) {
    opacity: 0;
    visibility: hidden;
}

#top .latest-products-slider .hero-latest-preview-video {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    background: #07080c !important;
}

#top .latest-products-slider .hero-latest-preview-video.is-active {
    opacity: 1 !important;
}

#top .latest-products-slider .hero-latest-preview-video img,
#top .latest-products-slider .hero-latest-preview-video iframe {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    border: 0 !important;
    object-fit: cover !important;
}

#top .latest-products-slider .hero-latest-preview-video img {
    z-index: 1;
}

#top .latest-products-slider .hero-latest-preview-video iframe {
    z-index: 2;
    pointer-events: none;
}

.product-card .product-media img,
.product-card-preview-image,
#top .latest-products-slider .hero-latest-media img,
#top .latest-products-slider .hero-latest-media .hero-latest-preview-image,
#top .latest-products-slider .hero-latest-preview-video img,
.site-header .nav-mega-product-media img,
.site-header .nav-mega-product-media .nav-mega-preview-image,
main.tebex-page.package-main .package-media img,
main.tebex-page.package-main .gallery-thumb img {
    transform: none !important;
    animation: none !important;
    transition-property: opacity, filter !important;
}