:root {
    --red: #d50000;
    --dark-red: #a80000;
    --ink: #171717;
    --muted: #70757d;
    --line: #e8e8e8;
    --soft: #f4f4f4;
    --dark: #050505;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    color: var(--ink);
    background: #fff;
    font-size: 14px;
}
a { color: inherit; text-decoration: none; }
img, video { max-width: 100%; display: block; }
.container { width: min(1180px, calc(100% - 36px)); margin: 0 auto; }
.center { text-align: center; }

.topbar {
    background: #f8f8f8;
    border-bottom: 1px solid var(--line);
    color: #535353;
    font-size: 12px;
}
.topbar__inner {
    min-height: 34px;
    display: flex;
    gap: 22px;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}
.navbar {
    background: #fff;
    border-bottom: 1px solid var(--line);
    position: sticky;
    top: 0;
    z-index: 20;
}
.navgrid {
    min-height: 76px;
    display: grid;
    grid-template-columns: 190px 1fr auto;
    align-items: center;
    gap: 18px;
}
.logo img { width: 150px; }
.navlinks {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    font-size: 13px;
    font-weight: 700;
}
.navlinks a.is-active { color: var(--red); }
.navactions { display: flex; align-items: center; gap: 12px; font-size: 12px; }
.navactions input {
    width: 170px;
    border: 1px solid var(--line);
    border-radius: 3px;
    padding: 9px 11px;
}
.navactions button,
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 0 22px;
    border: 0;
    background: var(--red);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    border-radius: 2px;
    box-shadow: 0 8px 18px rgba(213,0,0,.18);
}
.btn--light { background: #fff; color: var(--red); }

.hero {
    position: relative;
    min-height: 565px;
    background: #000;
    overflow: hidden;
}
.hero__slide {
    min-height: 565px;
    background-size: cover;
    background-position: center right;
    position: absolute;
    inset: 0;
    opacity: 0;
}
.hero__slide.is-active { opacity: 1; position: relative; }
.hero__shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(0,0,0,.88), rgba(0,0,0,.55) 36%, rgba(0,0,0,.12));
}
.hero__content {
    position: relative;
    z-index: 2;
    min-height: 500px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #fff;
}
.badge {
    width: max-content;
    background: rgba(213,0,0,.92);
    padding: 7px 12px;
    border-radius: 30px;
    font-weight: 800;
    font-size: 12px;
    margin-bottom: 22px;
}
.hero h1 {
    margin: 0;
    max-width: 470px;
    font-size: 56px;
    line-height: .92;
    font-weight: 900;
    letter-spacing: 0;
}
.hero h2 {
    max-width: 520px;
    margin: 14px 0 22px;
    font-size: 20px;
    color: #d8d8d8;
}
.hero p { margin: 0 0 8px; font-weight: 800; color: #ececec; }
.hero__specs { display: flex; gap: 10px; flex-wrap: wrap; }
.hero__specs span {
    border: 1px solid rgba(255,255,255,.28);
    background: rgba(255,255,255,.08);
    padding: 8px 13px;
    color: #eee;
    font-size: 12px;
}
.hero__buttons { display: flex; gap: 12px; margin-top: 26px; }
.hero__buttons a {
    background: var(--red);
    color: #fff;
    padding: 12px 22px;
    font-weight: 800;
    font-size: 12px;
}
.hero__buttons a + a { background: #1f1f1f; }
.hero__stamp {
    position: absolute;
    right: 11%;
    top: 25%;
    z-index: 3;
    width: 118px;
    height: 118px;
    border-radius: 50%;
    background: var(--red);
    color: #fff;
    display: grid;
    place-items: center;
    text-align: center;
    font-size: 17px;
    font-weight: 900;
    border: 7px solid rgba(255,255,255,.35);
}
.hero__tabs {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 4;
    display: flex;
    justify-content: center;
    background: rgba(0,0,0,.86);
    color: #aaa;
    font-size: 11px;
}
.hero__tabs span { padding: 16px 22px; border-left: 1px solid #222; }
.hero__tabs span:first-child { color: #fff; border-bottom: 3px solid var(--red); }

.section { padding: 54px 0; }
.section--tint { background: #f3f3f3; }
h2 {
    margin: 0 0 12px;
    font-size: 31px;
    line-height: 1.12;
    font-weight: 900;
}
.lead, .section p, .brand-intro p {
    color: var(--muted);
    line-height: 1.65;
}
.brand-intro {
    min-height: 190px;
    display: flex;
    align-items: flex-end;
    padding: 42px 0 26px;
    background: #fff;
}
.brand-intro h2 {
    font-size: 30px;
    margin-bottom: 18px;
}
.brand-intro p {
    max-width: 620px;
    margin: 0 auto;
    font-size: 13px;
}
.brand-strip {
    height: 100px;
    display: flex;
    align-items: center;
    overflow: hidden;
    background: #fff;
}
.brand-marquee {
    width: min(571px, calc(100% - 32px));
    margin: 0 auto;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}
.brand-row {
    display: flex;
    align-items: center;
    gap: 34px;
    width: max-content;
    animation: brandDrift 22s linear infinite;
}
.brand-row div {
    width: 62px;
    height: 62px;
    flex: 0 0 62px;
    display: grid;
    place-items: center;
    filter: grayscale(1);
    opacity: .82;
    transition: filter .35s ease, opacity .35s ease, transform .35s ease;
}
.brand-row div:hover {
    filter: grayscale(0);
    opacity: 1;
    transform: translateY(-3px) scale(1.04);
}
.brand-stats {
    min-height: 334px;
    padding: 64px 0 46px;
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 45%, rgba(215, 25, 32, .08) 0 7%, transparent 26%),
        radial-gradient(ellipse at 50% 42%, rgba(215, 25, 32, .08) 0 18%, transparent 58%),
        linear-gradient(#fff, #fff);
}
.brand-stats::before {
    content: "";
    position: absolute;
    left: 50%;
    top: -58px;
    width: min(980px, 92vw);
    aspect-ratio: 1 / .55;
    opacity: .24;
    background:
        radial-gradient(ellipse at center, transparent 0 58%, rgba(215,25,32,.18) 58.5% 59.5%, transparent 60%),
        repeating-radial-gradient(ellipse at center, transparent 0 44px, rgba(120,128,138,.54) 45px 46px),
        repeating-linear-gradient(90deg, transparent 0 86px, rgba(120,128,138,.38) 87px 88px),
        linear-gradient(90deg, transparent 49.7%, rgba(120,128,138,.55) 50%, transparent 50.3%),
        linear-gradient(0deg, transparent 49.7%, rgba(120,128,138,.5) 50%, transparent 50.3%);
    border-radius: 50%;
    transform: translateX(-50%);
    pointer-events: none;
}
.brand-stats::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 14% 35%, rgba(207,0,0,.13) 0 5px, transparent 6px),
        radial-gradient(circle at 75% 38%, rgba(207,0,0,.13) 0 4px, transparent 5px),
        radial-gradient(circle at 58% 66%, rgba(207,0,0,.13) 0 5px, transparent 6px);
    animation: mapPulse 4.8s ease-in-out infinite;
    pointer-events: none;
}
.brand-stats .container {
    position: relative;
    z-index: 1;
}
.stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    margin: 0 0 34px;
}
.stats div { display: flex; align-items: center; justify-content: center; gap: 11px; }
.stats strong { color: var(--red); font-size: 54px; line-height: 1; font-weight: 900; }
.stats span { text-align: left; font-weight: 800; font-size: 13px; }
.brand-stats h3 {
    margin: 0 0 12px;
    font-size: 24px;
    font-weight: 900;
}
.brand-stats p {
    max-width: 650px;
    margin: 0 auto 22px;
    font-size: 13px;
}

.product-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
    margin: 28px 0;
}
.product-card {
    background: #fff;
    border: 1px solid var(--line);
    box-shadow: 0 9px 24px rgba(0,0,0,.08);
    position: relative;
}
.product-card img {
    width: 100%;
    aspect-ratio: 1.22;
    object-fit: cover;
}
.product-card div { padding: 14px; }
.product-card h3 { margin: 0 0 8px; font-size: 13px; font-weight: 900; }
.product-card p { margin: 0 0 10px; font-size: 11px; color: #777; line-height: 1.45; }
.product-card strong { color: var(--red); font-size: 13px; }
.ribbon {
    position: absolute;
    top: 10px;
    left: 10px;
    background: var(--red);
    color: #fff;
    padding: 5px 8px;
    font-size: 10px;
    font-weight: 900;
    z-index: 1;
}
.rail-track .sbk-car {
    flex: 0 0 calc((100% - 66px) / 4);
}
.sbk-car {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(16,17,20,.06);
    cursor: pointer;
    transition: .32s;
}
.sbk-car:hover {
    transform: translateY(-7px);
    box-shadow: 0 24px 55px rgba(16,17,20,.12);
}
.sbk-car__media {
    position: relative;
    height: 225px;
    overflow: hidden;
    background: linear-gradient(145deg,#f8f8f9,#eceef0);
}
.sbk-car__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .45s;
}
.sbk-car:hover .sbk-car__media img {
    transform: scale(1.045);
}
.sbk-car__tag {
    position: absolute;
    left: 14px;
    top: 14px;
    padding: 7px 10px;
    border-radius: 7px;
    background: var(--red);
    color: #fff;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .7px;
}
.sbk-car__fav {
    position: absolute;
    right: 14px;
    top: 14px;
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 50%;
    background: rgba(255,255,255,.94);
    color: var(--red);
    font-size: 18px;
    cursor: pointer;
}
.sbk-car__body {
    padding: 20px;
}
.sbk-car__brand {
    color: var(--red);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 1.4px;
    text-transform: uppercase;
}
.sbk-car h3 {
    margin: 7px 0 13px;
    font-size: 20px;
    line-height: 1.25;
}
.sbk-car h3 a {
    color: inherit;
    text-decoration: none;
}
.sbk-car__specs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 7px;
    padding: 13px 0;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    color: #666;
    font-size: 11px;
}
.sbk-car__specs span {
    text-align: center;
}
.sbk-car__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding-top: 16px;
}
.sbk-price small {
    display: block;
    color: #888;
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: .8px;
}
.sbk-price strong {
    color: #111;
    font-size: 20px;
}
.sbk-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.sbk-actions form {
    margin: 0;
}
.sbk-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 0 12px;
    border: 0;
    border-radius: 8px;
    background: #111216;
    color: #fff;
    text-decoration: none;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
}
.sbk-action-btn--red {
    background: var(--red);
}
.sbk-action-btn:disabled {
    background: #999;
    cursor: not-allowed;
}
.sbk-toast {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 99999;
    max-width: min(330px, calc(100vw - 44px));
    padding: 13px 16px;
    border-radius: 8px;
    background: #111216;
    color: #fff;
    box-shadow: 0 18px 40px rgba(0,0,0,.22);
    font-size: 13px;
    font-weight: 700;
    opacity: 0;
    pointer-events: none;
    transform: translateY(12px);
    transition: opacity .2s ease, transform .2s ease;
}
.sbk-toast.is-visible {
    opacity: 1;
    transform: translateY(0);
}
.sbk-toast.is-error {
    background: #a90c12;
}
@media (max-width: 620px) {
    .rail-track .sbk-car {
        flex-basis: min(330px, 84vw);
    }
}

.why {
    background: #101820;
    color: #fff;
    padding: 42px 0;
}
.why h2 { text-align: center; margin-bottom: 28px; }
.why-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}
.why-card {
    min-height: 150px;
    background: #ad0000;
    border: 1px solid rgba(255,255,255,.65);
    display: grid;
    place-items: center;
    text-align: center;
    padding: 24px;
}
.why-card h3 { margin: 6px 0 0; font-size: 15px; }

.members {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 42px;
    margin: 20px 0 30px;
}
.members img { max-width: 150px; max-height: 56px; object-fit: contain; }
.payment-card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    max-width: 760px;
    margin: 18px auto 0;
    background: #fff;
    box-shadow: 0 12px 35px rgba(0,0,0,.1);
    text-align: left;
}
.payment-card > div { padding: 32px; }
.payment-card > div:first-child { background: #050505; color: #fff; }
.payment-card img { display: inline-block; width: 64px; margin-right: 22px; }

.mini-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 24px 0;
}
.mini-row article {
    border: 1px solid var(--line);
    background: #fff;
    padding: 9px;
}
.mini-row img { aspect-ratio: 1.55; object-fit: cover; width: 100%; }
.mini-row h3 { font-size: 12px; margin: 8px 0 4px; }
.mini-row strong { color: var(--red); font-size: 12px; }

.steps { text-align: center; }
.eyebrow {
    color: var(--red) !important;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    margin-bottom: 6px;
}
.step-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 28px;
}
.step-grid article { padding: 8px 20px; }
.step-grid img { height: 44px; margin: 0 auto 18px; }
.step-grid h3 { font-size: 16px; margin: 0 0 10px; }

.auction { padding: 52px 0; background: #fff; }
.auction__grid, .register__grid, .faq__grid, .testimonial-grid {
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    gap: 42px;
    align-items: center;
}
.auction h2 { font-size: 36px; }
.auction img { width: 100%; max-height: 310px; object-fit: contain; }

.body-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 17px;
    margin: 28px 0;
}
.body-grid article {
    border: 2px solid #ef5555;
    border-radius: 8px;
    padding: 10px;
    background: #fff;
}
.body-grid img { height: 86px; width: 100%; object-fit: contain; }
.body-grid h3 { margin: 6px 0 0; font-size: 14px; }

.videos { background: #f4f4f4; }
.video-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}
.video-grid video {
    width: 100%;
    aspect-ratio: 9 / 16;
    object-fit: cover;
    background: #000;
    border-radius: 4px;
    box-shadow: 0 12px 30px rgba(0,0,0,.16);
}

.testimonials { background: #ededed; padding: 44px 0; }
.testimonial-grid article {
    background: #fff;
    padding: 32px;
    box-shadow: 0 8px 24px rgba(0,0,0,.1);
}
.testimonial-grid strong, .testimonial-grid span { display: block; margin-top: 8px; }

.register {
    background: var(--red);
    color: #fff;
    padding: 40px 0;
}
.register p { color: #fff; opacity: .9; }
.register img {
    width: 100%;
    max-height: 250px;
    object-fit: contain;
    filter: drop-shadow(0 18px 18px rgba(0,0,0,.22));
}

.blog-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
    margin: 24px 0;
}
.blog-grid article {
    border: 1px solid var(--line);
    background: #fff;
    box-shadow: 0 10px 22px rgba(0,0,0,.07);
}
.blog-grid img { aspect-ratio: 1.65; object-fit: cover; width: 100%; }
.blog-grid span {
    display: inline-block;
    margin: 14px 14px 0;
    color: var(--red);
    font-size: 11px;
    font-weight: 900;
}
.blog-grid h3 { margin: 8px 14px 18px; font-size: 15px; line-height: 1.3; }
.blog-grid article a {
    display: block;
    height: 100%;
    color: inherit;
    text-decoration: none;
}
.blog-grid.rail-track .rail-item {
    flex: 0 0 calc((100% - 44px) / 3);
}

.faq { background: #f5f5f5; }
.faq details {
    background: #fff;
    border: 1px solid var(--line);
    margin-bottom: 8px;
}
.faq summary {
    cursor: pointer;
    padding: 14px 16px;
    font-weight: 800;
    font-size: 13px;
}
.faq details p { padding: 0 16px 16px; margin: 0; }
.faq img { max-height: 330px; object-fit: contain; }

.footer {
    background: #030303;
    color: #bcbcbc;
    padding: 46px 0 20px;
}
.footer__grid {
    display: grid;
    grid-template-columns: 1.4fr repeat(4, 1fr);
    gap: 28px;
}
.footer img { width: 150px; margin-bottom: 18px; filter: brightness(1.12); }
.footer h3 { color: #fff; font-size: 15px; margin: 0 0 16px; }
.footer a, .footer p { display: block; color: #bcbcbc; font-size: 12px; line-height: 1.8; margin: 0; }
.copyright { text-align: center; color: #777; margin: 30px 0 0; font-size: 12px; }

@keyframes brandDrift {
    from { transform: translate3d(0, 0, 0); }
    to { transform: translate3d(calc(-50% - 17px), 0, 0); }
}

@keyframes mapPulse {
    0%, 100% { opacity: .65; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.015); }
}

@keyframes revealUp {
    from { opacity: 0; transform: translate3d(0, 24px, 0); }
    to { opacity: 1; transform: translate3d(0, 0, 0); }
}

.reveal-on-scroll {
    opacity: 0;
    transform: translate3d(0, 24px, 0);
}

.reveal-on-scroll.is-visible {
    animation: revealUp .75s cubic-bezier(.22, .61, .36, 1) forwards;
}

.brand-strip.reveal-on-scroll.is-visible {
    animation-delay: .08s;
}

.brand-stats.reveal-on-scroll.is-visible {
    animation-delay: .14s;
}

.topbar {
    background: #fff;
    color: #4e4e4e;
    font-size: 11px;
}
.topbar__inner {
    min-height: 28px;
    justify-content: space-between;
    gap: 16px;
}
.topbar__left,
.topbar__right {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
}
.navbar {
    position: relative;
    box-shadow: 0 1px 0 rgba(0,0,0,.05);
}
.navgrid {
    min-height: 62px;
    grid-template-columns: 138px 1fr auto;
}
.logo img { width: 112px; }
.navlinks {
    justify-content: flex-start;
    gap: 19px;
    font-size: 11px;
    letter-spacing: 0;
    font-weight: 800;
}
.navactions {
    gap: 10px;
    font-size: 11px;
    font-weight: 700;
}
.navactions input {
    width: 155px;
    height: 30px;
    padding: 7px 10px;
    font-size: 11px;
}
.navactions button {
    min-height: 30px;
    padding: 0 14px;
    font-size: 11px;
}
.hero,
.hero__slide {
    min-height: 640px;
}
.hero__slide {
    transition: opacity .7s ease;
    background-position: center right;
}
.hero__content {
    min-height: 592px;
    padding-top: 22px;
}
.badge {
    padding: 6px 11px;
    font-size: 11px;
    margin-bottom: 24px;
}
.hero h1 {
    max-width: 500px;
    font-size: 64px;
    line-height: .9;
}
.hero h2 {
    font-size: 18px;
    font-weight: 500;
}
.hero p {
    font-size: 13px;
    letter-spacing: .3px;
}
.hero__specs span {
    font-size: 11px;
    padding: 8px 14px;
}
.hero__buttons a {
    padding: 12px 23px;
    font-size: 11px;
}
.hero__stamp {
    right: 13%;
    top: 22%;
    width: 104px;
    height: 104px;
    font-size: 15px;
}
.hero__arrow,
.rail-arrow {
    border: 0;
    background: rgba(0,0,0,.72);
    color: #fff;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    font-size: 28px;
    line-height: 1;
    z-index: 8;
}
.hero__arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
.hero__arrow--prev { left: 22px; }
.hero__arrow--next { right: 22px; }
.hero__tabs {
    height: 52px;
    align-items: stretch;
}
.hero__tabs button {
    border: 0;
    border-left: 1px solid #222;
    background: transparent;
    color: #9d9d9d;
    padding: 0 23px;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}
.hero__tabs button.is-active {
    color: #fff;
    border-bottom: 3px solid var(--red);
}
.hero__tabs span { display: none; }
h2 {
    font-size: 27px;
    letter-spacing: 0;
}
.section { padding: 48px 0; }
.lead,
.section p,
.brand-intro p,
.brand-stats p {
    font-size: 12px;
}
.product-card h3 { font-size: 12px; line-height: 1.25; }
.product-card p { font-size: 10.5px; }
.product-card strong { font-size: 12px; }
.rail-slider {
    position: relative;
    margin: 24px 0;
}
.rail-track {
    display: flex;
    gap: 18px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    padding: 4px 2px 18px;
    scrollbar-width: none;
}
.rail-track::-webkit-scrollbar { display: none; }
.rail-item {
    flex: 0 0 calc((100% - 54px) / 4);
    scroll-snap-align: start;
}
.blog-grid.rail-track .rail-item {
    flex: 0 0 calc((100% - 36px) / 3);
}
.mini-row.rail-track {
    display: flex;
    gap: 12px;
}
.mini-row .rail-item {
    flex-basis: calc((100% - 36px) / 4);
}
.video-grid.rail-track {
    display: flex;
    justify-content: flex-start;
}
.video-grid .rail-item {
    flex: 0 0 calc((100% - 44px) / 3);
}
.rail-arrow {
    position: absolute;
    top: 42%;
    transform: translateY(-50%);
    border-radius: 0;
    box-shadow: 0 8px 18px rgba(0,0,0,.18);
}
.rail-arrow--prev { left: -17px; }
.rail-arrow--next { right: -17px; }
.why-card span::before {
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    margin: 0 auto 9px;
    background: #fff;
    clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
}
.footer {
    padding: 38px 0 16px;
    background: #000;
}
.footer__grid {
    grid-template-columns: 1.5fr .8fr .8fr 1fr 1.15fr 1.05fr;
    gap: 24px;
}
.footer img {
    width: 128px;
    margin-bottom: 14px;
}
.footer h3 {
    font-size: 12px;
    margin-bottom: 12px;
    font-weight: 900;
}
.footer a,
.footer p {
    font-size: 11px;
    line-height: 1.75;
}
.footer__about p { max-width: 255px; }
.copyright {
    border-top: 1px solid #171717;
    padding-top: 12px;
    margin-top: 24px;
    font-size: 10px;
}

.topbar__inner {
    min-height: 76px;
    align-items: flex-start;
    padding-top: 9px;
}
.topbar__left {
    align-self: center;
    gap: 14px;
}
.topbar__right {
    display: grid;
    grid-template-columns: repeat(4, minmax(78px, auto));
    gap: 0;
    align-self: flex-start;
}
.topbar__right span {
    min-height: 46px;
    padding: 0 14px;
    border-left: 1px solid #d7d7d7;
    font-weight: 900;
    line-height: 1.35;
}
.topbar__right span:last-child {
    grid-column: 1;
}
.navbar {
    min-height: 116px;
}
.navgrid {
    min-height: 91px;
    grid-template-columns: 170px 440px 1fr;
    align-items: start;
    padding-top: 4px;
    gap: 0;
}
.logo img {
    width: 143px;
    margin-top: 10px;
}
.navlinks {
    display: grid;
    grid-template-columns: repeat(4, max-content);
    gap: 10px 32px;
    align-content: start;
    padding-top: 22px;
    font-size: 16px;
    font-weight: 900;
}
.navlinks a:nth-child(7),
.navlinks a:nth-child(8) {
    grid-row: auto;
}
.navactions {
    display: grid;
    grid-template-columns: 160px 24px 70px 118px;
    grid-template-rows: 36px 40px;
    gap: 10px 10px;
    align-items: center;
    padding-top: 10px;
    font-size: 15px;
    justify-content: end;
}
.navactions input {
    grid-column: 1 / 3;
    grid-row: 1;
    width: 160px;
    height: 36px;
    padding: 0 12px;
    font-size: 13px;
    font-weight: 700;
}
.navactions button {
    grid-column: 4;
    grid-row: 2;
    min-height: 40px;
    min-width: 118px;
    border-radius: 5px;
    font-size: 15px;
    box-shadow: none;
}
.cart-link {
    grid-column: 3;
    grid-row: 2;
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    color: #fff;
    background: #000;
    border-radius: 50%;
    font-size: 11px;
    position: relative;
}
.navactions a:not(.cart-link):nth-of-type(1) {
    grid-column: 3;
    grid-row: 1;
}
.navactions a:not(.cart-link):nth-of-type(2) {
    grid-column: 4;
    grid-row: 1;
}
.cart-link::before {
    content: "";
    position: absolute;
    left: -17px;
    bottom: 1px;
    width: 18px;
    height: 14px;
    border: 2px solid #111;
    border-top: 0;
}

.why {
    background: #202733;
    padding: 20px 0 34px;
}
.why .container {
    width: min(999px, calc(100% - 40px));
}
.why h2 {
    font-size: 36px;
    line-height: 1.18;
    margin-bottom: 34px;
}
.why-grid {
    gap: 16px 40px;
}
.why-card {
    min-height: 346px;
    border-radius: 6px;
    background: #930707;
    border: 1px solid #fff;
    padding: 78px 32px 42px;
    align-content: center;
}
.why-card span::before {
    width: 42px;
    height: 42px;
    margin-bottom: 28px;
    clip-path: none;
    border-radius: 8px;
}
.why-card:nth-child(2) span::before {
    border-radius: 50% 50% 10% 10%;
}
.why-card:nth-child(3) span::before {
    border-radius: 50%;
}
.why-card:nth-child(5) span::before {
    border-radius: 50%;
    background:
        linear-gradient(#930707 0 0) 50% 0 / 4px 100% no-repeat,
        linear-gradient(90deg, transparent 43%, #930707 43% 57%, transparent 57%) 0 50% / 100% 4px no-repeat,
        #fff;
}
.why-card h3 {
    color: #fff;
    font-size: 20px;
    line-height: 1.02;
    font-weight: 900;
    max-width: 210px;
    margin: 0 auto;
}

.payments {
    padding: 0 0 10px;
    background: #fff;
}
.payments .container {
    width: min(999px, calc(100% - 20px));
}
.payments h2 {
    color: #840b0b;
    font-size: 39px;
    line-height: 1;
    margin-bottom: 72px;
    font-weight: 900;
}
.members {
    min-height: 184px;
    margin: 0 0 10px;
    gap: 0;
    position: relative;
}
.members img {
    max-height: 68px;
    max-width: 180px;
}
.members img:first-child,
.members img:last-child {
    opacity: .08;
}
.members img:nth-child(2) {
    transform: scale(1.25);
}
.payment-title {
    text-align: left;
    font-size: 30px;
    line-height: 1.1;
    margin: 10px 0 60px;
    font-weight: 900;
}
.payment-card {
    max-width: none;
    width: 100%;
    grid-template-columns: 480px 1fr;
    gap: 10px;
    margin: 0;
    box-shadow: none;
}
.payment-card > div {
    min-height: 417px;
    padding: 98px 58px 58px;
    border-radius: 11px;
}
.payment-card > div:first-child {
    background: #000;
}
.payment-card > div:first-child h4 {
    color: #fff;
    font-size: 29px;
    line-height: 1;
    margin: 0 0 38px;
}
.payment-card > div:first-child p {
    color: #fff;
    font-size: 16px;
    line-height: 1.45;
    font-weight: 700;
}
.payment-card > div:nth-child(2) {
    border: 1px solid #b60000;
    background: #fff;
    padding: 37px 58px;
}
.payment-card > div:nth-child(2) p {
    color: #080808;
    font-size: 25px;
    line-height: 1.02;
    max-width: 360px;
    margin-bottom: 72px;
}
.payment-card > div:nth-child(2) h4 {
    color: #080808;
    font-size: 30px;
    line-height: 1;
    font-weight: 400;
    margin: 0 0 70px;
    max-width: 410px;
}
.payment-card > div:nth-child(2) h4 span {
    color: #f00000;
    font-weight: 900;
}
.payment-card img {
    width: 58px;
    margin-right: 20px;
}

.footer {
    padding: 0;
    background: #000;
}
.footer__grid {
    width: min(999px, 100%);
    grid-template-columns: 1.45fr 1fr 1fr 1fr 1fr 1fr;
    gap: 0;
}
.footer__grid > div {
    padding: 0 30px 28px;
    min-height: 330px;
    border-right: 1px solid #fff;
}
.footer__grid > div:nth-child(n+5) {
    min-height: 305px;
    padding-top: 0;
}
.footer__grid > div:nth-child(1) { grid-column: span 2; }
.footer__grid > div:nth-child(4) { grid-column: span 2; border-right: 0; }
.footer__grid > div:nth-child(n+5) { border-top: 1px solid #222; }
.footer__grid > div:last-child { border-right: 0; }
.footer img {
    display: none;
}
.footer h3 {
    font-size: 18px;
    line-height: 1.35;
    margin: 0 0 30px;
}
.footer a,
.footer p {
    color: #fff;
    font-size: 15px;
    line-height: 1.55;
    font-weight: 700;
}
.footer__grid > div:nth-child(4) {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-content: start;
    column-gap: 22px;
}
.footer__grid > div:nth-child(4) h3 {
    grid-column: 1 / -1;
}
.footer a {
    position: relative;
    padding-left: 18px;
    margin-bottom: 8px;
}
.footer a::before {
    content: "*";
    color: #ff0000;
    position: absolute;
    left: 0;
    top: 0;
    font-size: 20px;
    line-height: 1;
}
.footer__about {
    display: flex;
    align-items: center;
}
.footer__about p {
    max-width: 310px;
}
.copyright {
    color: #fff;
    border-top: 1px solid #222;
    padding: 14px 0;
    margin: 0;
}

@media (max-width: 980px) {
    .navgrid { grid-template-columns: 1fr; padding: 12px 0; }
    .logo img { margin: 0 auto; }
    .navlinks, .navactions { justify-content: center; flex-wrap: wrap; }
    .product-grid, .mini-row, .body-grid { grid-template-columns: repeat(2, 1fr); }
    .rail-item,
    .mini-row .rail-item {
        flex-basis: calc((100% - 18px) / 2);
    }
    .blog-grid.rail-track .rail-item {
        flex-basis: calc((100% - 18px) / 2);
    }
    .video-grid .rail-item {
        flex-basis: calc((100% - 22px) / 2);
    }
    .stats, .why-grid, .step-grid, .video-grid, .blog-grid, .footer__grid { grid-template-columns: 1fr 1fr; }
    .auction__grid, .register__grid, .faq__grid, .testimonial-grid { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
    .container { width: min(100% - 24px, 1180px); }
    .hero, .hero__slide { min-height: 520px; }
    .hero h1 { font-size: 38px; }
    .hero__stamp { width: 88px; height: 88px; right: 18px; top: 100px; font-size: 13px; }
    .hero__tabs { display: none; }
    h2 { font-size: 25px; }
    .product-grid, .mini-row, .body-grid, .stats, .why-grid, .step-grid, .video-grid, .blog-grid, .footer__grid, .payment-card { grid-template-columns: 1fr; }
    .stats div { justify-content: flex-start; }
    .members { gap: 18px; flex-wrap: wrap; }
    .navactions input { width: 100%; }
    .topbar__inner,
    .topbar__left,
    .topbar__right {
        justify-content: center;
    }
    .navlinks { justify-content: center; }
    .hero__arrow { display: none; }
    .rail-arrow { display: none; }
    .rail-item,
    .mini-row .rail-item,
    .video-grid .rail-item {
        flex-basis: 86%;
    }
    .blog-grid.rail-track .rail-item {
        flex-basis: 86%;
    }
}

/* Final UI polish layer */
body {
    font-family: "Inter", "Segoe UI", Roboto, Arial, sans-serif;
    background: #f6f7f9;
    color: #101318;
}

.container {
    width: min(1180px, calc(100% - 40px));
}

.topbar {
    background: #0c1118;
    color: rgba(255,255,255,.88);
    border: 0;
    font-size: 12px;
}

.topbar__inner {
    min-height: 42px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.topbar__left,
.topbar__right {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.topbar__left span,
.topbar__right span {
    min-height: auto;
    border: 0;
    padding: 6px 10px;
    line-height: 1;
    border-radius: 999px;
    background: rgba(255,255,255,.07);
    font-weight: 700;
}

.navbar {
    min-height: auto;
    background: rgba(255,255,255,.96);
    backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(15,23,42,.08);
    box-shadow: 0 10px 30px rgba(15,23,42,.08);
    position: sticky;
    top: 0;
    z-index: 30;
}

.navgrid {
    min-height: 88px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 0;
}

.logo {
    flex: 0 0 auto;
}

.logo img {
    width: 148px;
    margin: 0;
}

.navlinks {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0;
    font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
    font-size: 17px;
    font-weight: 600;
}

.navlinks a {
    padding: 10px 12px;
    border-radius: 999px;
    transition: background .25s ease, color .25s ease, transform .25s ease;
    white-space: nowrap;
}

.navlinks a.is-active,
.navlinks a:hover {
    color: #d50000;
    background: #fff1f1;
    transform: translateY(-1px);
}

.navactions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding: 0;
    font-size: 13px;
    font-weight: 800;
}

.navactions input {
    width: 170px;
    height: 40px;
    grid-column: auto;
    grid-row: auto;
    border-radius: 999px;
    border: 1px solid #e4e8ef;
    background: #f8fafc;
    padding: 0 15px;
}

.navactions a:not(.cart-link),
.navactions a:not(.cart-link):nth-of-type(1),
.navactions a:not(.cart-link):nth-of-type(2) {
    grid-column: auto;
    grid-row: auto;
    white-space: nowrap;
}

.cart-link {
    grid-column: auto;
    grid-row: auto;
    width: 34px;
    height: 34px;
    box-shadow: 0 8px 20px rgba(0,0,0,.16);
}

.cart-link::before {
    display: none;
}

.navactions button {
    grid-column: auto;
    grid-row: auto;
    min-width: 104px;
    min-height: 40px;
    border-radius: 999px;
    background: linear-gradient(135deg, #e50000, #a90000);
    box-shadow: 0 12px 24px rgba(213,0,0,.24);
}

.section,
.brand-intro,
.brand-strip,
.brand-stats,
.why,
.payments,
.auction,
.testimonials,
.register,
.faq {
    position: relative;
}

.why {
    padding: 70px 0;
    background:
        radial-gradient(circle at 20% 20%, rgba(213,0,0,.18), transparent 28%),
        linear-gradient(135deg, #151b25, #222b37);
}

.why .container {
    width: min(1120px, calc(100% - 40px));
}

.why h2 {
    font-size: 38px;
    margin-bottom: 34px;
    text-shadow: 0 8px 28px rgba(0,0,0,.2);
}

.why-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.why-card {
    min-height: 250px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 18px;
    background:
        linear-gradient(145deg, rgba(255,255,255,.08), transparent 32%),
        linear-gradient(135deg, #b10000, #820202);
    box-shadow: 0 22px 45px rgba(0,0,0,.24);
    padding: 36px 24px;
    transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}

.why-card:hover {
    transform: translateY(-8px);
    border-color: rgba(255,255,255,.55);
    box-shadow: 0 30px 58px rgba(0,0,0,.32);
}

.why-card span::before {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    margin-bottom: 24px;
    background:
        radial-gradient(circle at 35% 30%, #fff, #f3f3f3 58%, #d9d9d9);
    box-shadow: inset 0 -8px 16px rgba(0,0,0,.08), 0 16px 30px rgba(0,0,0,.18);
}

.why-card h3 {
    font-size: 20px;
    line-height: 1.12;
}

.payments {
    padding: 74px 0;
    background:
        radial-gradient(circle at 15% 12%, rgba(213,0,0,.08), transparent 24%),
        linear-gradient(180deg, #fff, #f6f7f9);
}

.payments .container {
    width: min(1120px, calc(100% - 40px));
}

.payments h2 {
    font-size: 40px;
    color: #8b0000;
    margin: 0 0 34px;
}

.members {
    min-height: auto;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    margin: 0 auto 58px;
}

.members article {
    min-height: 150px;
    display: grid;
    place-items: center;
    gap: 12px;
    padding: 24px;
    border-radius: 18px;
    background: rgba(255,255,255,.84);
    border: 1px solid #edf0f5;
    box-shadow: 0 20px 44px rgba(15,23,42,.08);
    transition: transform .35s ease, box-shadow .35s ease;
}

.members article:hover {
    transform: translateY(-6px);
    box-shadow: 0 28px 56px rgba(15,23,42,.14);
}

.members img,
.members img:first-child,
.members img:last-child,
.members img:nth-child(2) {
    opacity: 1;
    transform: none;
    max-width: 180px;
    max-height: 72px;
    object-fit: contain;
}

.members span {
    color: #6b7280;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.payment-title {
    margin: 0 0 22px;
    font-size: 30px;
}

.payment-card {
    display: grid;
    grid-template-columns: .95fr 1.05fr;
    gap: 22px;
    width: 100%;
}

.payment-card > div {
    min-height: 360px;
    border-radius: 20px;
    padding: 54px 58px;
    box-shadow: 0 24px 55px rgba(15,23,42,.12);
}

.payment-card > div:first-child {
    background:
        radial-gradient(circle at 90% 12%, rgba(213,0,0,.35), transparent 28%),
        linear-gradient(135deg, #050505, #161616);
}

.payment-card > div:first-child h4,
.payment-card > div:nth-child(2) h4 {
    font-size: 30px;
    line-height: 1.08;
}

.payment-card > div:first-child p {
    font-size: 15px;
    line-height: 1.65;
}

.payment-card > div:nth-child(2) {
    border: 1px solid rgba(213,0,0,.25);
    background:
        radial-gradient(circle at 90% 85%, rgba(213,0,0,.08), transparent 28%),
        #fff;
}

.payment-card > div:nth-child(2) p {
    font-size: 24px;
    max-width: 460px;
    margin-bottom: 56px;
}

.payment-card img {
    width: 74px;
    vertical-align: middle;
    filter: drop-shadow(0 10px 14px rgba(15,23,42,.1));
}

.footer {
    padding: 64px 0 0;
    background:
        radial-gradient(circle at 15% 0, rgba(213,0,0,.18), transparent 30%),
        #050505;
}

.footer__grid {
    width: min(1180px, calc(100% - 40px));
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1.35fr;
    gap: 18px;
}

.footer__grid > div,
.footer__grid > div:nth-child(n+5) {
    min-height: auto;
    padding: 24px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px;
    background: rgba(255,255,255,.035);
}

.footer__grid > div:nth-child(1),
.footer__grid > div:nth-child(4) {
    grid-column: auto;
}

.footer__grid > div:nth-child(4) {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 18px;
}

.footer__grid > div:nth-child(n+5) {
    border-top: 1px solid rgba(255,255,255,.08);
}

.footer h3 {
    font-size: 18px;
    margin-bottom: 18px;
}

.footer a,
.footer p {
    font-size: 13px;
    line-height: 1.65;
}

.footer__about {
    align-items: flex-start;
}

.footer__about p {
    max-width: none;
}

.copyright {
    margin-top: 28px;
    background: rgba(255,255,255,.04);
    border-top: 1px solid rgba(255,255,255,.08);
}

.product-card,
.blog-grid article,
.body-grid article,
.mini-row article,
.testimonial-grid article {
    transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}

.product-card:hover,
.blog-grid article:hover,
.body-grid article:hover,
.mini-row article:hover,
.testimonial-grid article:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 44px rgba(15,23,42,.13);
}

@media (max-width: 1100px) {
    .navgrid {
        flex-wrap: wrap;
        justify-content: center;
        padding: 16px 0;
    }

    .navlinks {
        order: 3;
        flex-basis: 100%;
        flex-wrap: wrap;
    }

    .navactions {
        flex-wrap: wrap;
    }
}

@media (max-width: 820px) {
    .topbar__inner,
    .topbar__left,
    .topbar__right,
    .navlinks,
    .navactions {
        justify-content: center;
    }

    .members,
    .payment-card,
    .why-grid,
    .footer__grid {
        grid-template-columns: 1fr;
    }

    .payment-card > div {
        padding: 34px 28px;
    }

    .footer__grid > div:nth-child(4) {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .001ms !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }
}

.why-grid {
    perspective: 1200px;
}

.why-card {
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
    min-height: 270px;
    display: block;
}

.why-card:hover,
.why-card:focus {
    transform: none;
    box-shadow: none;
    outline: none;
}

.why-card__inner {
    position: relative;
    width: 100%;
    min-height: 270px;
    transform-style: preserve-3d;
    transition: transform .72s cubic-bezier(.2, .7, .2, 1);
}

.why-card:hover .why-card__inner,
.why-card:focus .why-card__inner,
.why-card:focus-within .why-card__inner {
    transform: rotateY(180deg);
}

.why-card__face {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 270px;
    padding: 34px 26px;
    border-radius: 20px;
    backface-visibility: hidden;
    overflow: hidden;
    text-align: center;
    border: 1px solid rgba(255,255,255,.18);
}

.why-card__front {
    background:
        linear-gradient(145deg, rgba(255,255,255,.12), transparent 36%),
        linear-gradient(135deg, #bd0000, #790101);
    box-shadow: 0 22px 45px rgba(0,0,0,.24);
}

.why-card__front::after {
    content: "";
    position: absolute;
    inset: -45% -70%;
    background: linear-gradient(115deg, transparent 42%, rgba(255,255,255,.22), transparent 58%);
    transform: translateX(-40%);
    transition: transform .75s ease;
}

.why-card:hover .why-card__front::after,
.why-card:focus .why-card__front::after {
    transform: translateX(40%);
}

.why-card__back {
    transform: rotateY(180deg);
    align-items: flex-start;
    justify-content: space-between;
    text-align: left;
    background:
        radial-gradient(circle at 85% 15%, rgba(213,0,0,.26), transparent 28%),
        linear-gradient(145deg, #ffffff, #f5f7fb);
    color: #141821;
    box-shadow: 0 30px 58px rgba(0,0,0,.28);
}

.why-card__front span::before {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    margin: 0 auto 24px;
    background:
        radial-gradient(circle at 35% 30%, #fff, #f3f3f3 58%, #d9d9d9);
    box-shadow: inset 0 -8px 16px rgba(0,0,0,.08), 0 16px 30px rgba(0,0,0,.18);
}

.why-card__front h3 {
    color: #fff;
    font-size: 21px;
    line-height: 1.12;
    margin: 0 0 24px;
}

.why-card__front button,
.why-card__back a {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 18px;
    border: 0;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .02em;
    cursor: pointer;
    transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
}

.why-card__front button {
    color: #a40000;
    background: #fff;
    box-shadow: 0 12px 26px rgba(0,0,0,.18);
}

.why-card__back a {
    color: #fff;
    background: linear-gradient(135deg, #e50000, #9a0000);
    box-shadow: 0 14px 30px rgba(213,0,0,.24);
}

.why-card__front button:hover,
.why-card__back a:hover {
    transform: translateY(-2px) scale(1.03);
    box-shadow: 0 18px 34px rgba(0,0,0,.2);
}

.why-card__back h3 {
    margin: 0;
    color: #9d0000;
    font-size: 21px;
    line-height: 1.1;
}

.why-card__back p {
    margin: 18px 0 22px;
    color: #374151;
    font-size: 14px;
    line-height: 1.58;
    font-weight: 700;
}

/* Responsive header safety pass */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

.topbar,
.navbar {
    width: 100%;
}

.topbar .container,
.navbar .container {
    width: min(1180px, calc(100% - 32px));
}

.topbar__inner,
.navgrid,
.navlinks,
.navactions {
    min-width: 0;
}

.navgrid {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
}

.navlinks {
    display: flex;
    flex-wrap: wrap;
    min-width: 0;
    gap: 6px;
}

.navlinks a {
    max-width: 100%;
}

.navactions {
    display: flex;
    flex-wrap: wrap;
    min-width: 0;
}

.navactions input {
    max-width: min(190px, 100%);
}

@media (max-width: 1180px) {
    .navgrid {
        grid-template-columns: auto minmax(0, 1fr);
        padding: 14px 0;
    }

    .navactions {
        grid-column: 1 / -1;
        justify-content: center;
    }

    .navlinks {
        justify-content: flex-end;
    }
}

@media (max-width: 860px) {
    .topbar__inner {
        min-height: auto;
        padding: 10px 0;
        justify-content: center;
    }

    .topbar__left,
    .topbar__right {
        width: 100%;
        justify-content: center;
        gap: 7px;
    }

    .topbar__left span,
    .topbar__right span {
        font-size: 11px;
        padding: 6px 8px;
    }

    .navgrid {
        display: flex;
        flex-direction: column;
        gap: 12px;
        min-height: auto;
        padding: 14px 0 16px;
    }

    .logo img {
        width: 132px;
    }

    .navlinks {
        order: 2;
        width: 100%;
        justify-content: center;
        gap: 6px;
    }

    .navlinks a {
        padding: 8px 10px;
        font-size: 12px;
    }

    .navactions {
        order: 1;
        width: 100%;
        justify-content: center;
        gap: 8px;
    }

    .navactions input {
        width: min(320px, 100%);
        flex: 1 1 220px;
    }
}

@media (max-width: 560px) {
    .topbar .container,
    .navbar .container {
        width: min(100% - 20px, 1180px);
    }

    .topbar__left span,
    .topbar__right span {
        font-size: 10px;
        padding: 5px 7px;
    }

    .logo img {
        width: 116px;
    }

    .navactions {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }

    .navactions input {
        grid-column: 1 / -1;
        width: 100%;
        max-width: 100%;
        flex: none;
    }

    .navactions a:not(.cart-link) {
        justify-self: center;
        font-size: 12px;
    }

    .cart-link {
        justify-self: end;
    }

    .navactions button {
        justify-self: start;
        min-width: 118px;
    }

    .navlinks {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7px;
    }

    .navlinks a {
        text-align: center;
        white-space: normal;
    }
}

@media (max-width: 360px) {
    .navlinks {
        grid-template-columns: 1fr;
    }

    .navactions {
        grid-template-columns: 1fr;
    }

    .cart-link,
    .navactions button {
        justify-self: center;
    }
}

/* Keep upper contact/time header in one line */
.topbar__inner {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
}

.topbar__inner::-webkit-scrollbar {
    display: none;
}

.topbar__left,
.topbar__right {
    flex-wrap: nowrap;
    white-space: nowrap;
}

.topbar__left {
    flex: 0 0 auto;
}

.topbar__right {
    flex: 0 0 auto;
    margin-left: auto;
}

.topbar__left span,
.topbar__right span {
    white-space: nowrap;
}

/* Keep the main header on one row on desktop/tablet */
@media (min-width: 861px) {
    .navbar .container {
        width: min(1240px, calc(100% - 24px));
    }

    .navgrid {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        min-height: 82px;
        padding: 0;
    }

    .logo img {
        width: clamp(112px, 10vw, 138px);
    }

    .navlinks {
        order: initial;
        flex: 1 1 auto;
        flex-basis: auto;
        display: flex;
        flex-wrap: nowrap;
        justify-content: center;
        gap: 4px;
        min-width: 0;
        overflow: visible;
    }

    .navlinks a {
        padding: 8px 8px;
        font-size: clamp(15px, .95vw, 13px);
        white-space: nowrap;
    }

    .navactions {
        flex: 0 1 auto;
        flex-wrap: nowrap;
        justify-content: flex-end;
        gap: 7px;
        min-width: 0;
    }

    .navactions input {
        width: clamp(118px, 13vw, 170px);
        height: 38px;
        padding-inline: 12px;
    }

    .navactions a:not(.cart-link) {
        font-size: clamp(11px, .9vw, 13px);
    }

    .cart-link {
        width: 32px;
        height: 32px;
        flex: 0 0 32px;
    }

    .navactions button {
        min-width: 92px;
        min-height: 38px;
        padding-inline: 14px;
        font-size: 13px;
    }
}

@media (min-width: 861px) and (max-width: 1080px) {
    .navactions a:not(.cart-link):first-of-type {
        display: none;
    }
}

/* Final polish for the latest requested sections */
.topbar__right {
    position: relative;
    flex: 0 0 clamp(310px, 38vw, 430px);
    width: clamp(310px, 38vw, 430px);
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    overflow: hidden;
    margin-left: auto;
    align-self: center;
    margin-top: 6px;
    margin-bottom: 6px;
}

.topbar__clocks {
    position: relative;
    flex: 0 0 clamp(150px, 18vw, 210px);
    height: 30px;
    overflow: hidden;
}

.topbar__clocks > span {
    position: absolute;
    inset: 50% 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 30px;
    min-height: 0;
    padding: 5px 10px;
    border: 0;
    border-radius: 999px;
    background: #f7f7f7;
    color: #111;
    font-size: 11px;
    font-weight: 900;
    line-height: 1;
    opacity: 0;
    transform: translateY(calc(-50% + 12px));
    transition: opacity .42s ease, transform .42s ease;
    pointer-events: none;
}

.topbar__clocks > span.is-active {
    opacity: 1;
    transform: translateY(-50%);
    pointer-events: auto;
}

.currency-converter {
    flex: 0 0 clamp(150px, 18vw, 210px);
    width: clamp(150px, 18vw, 210px);
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 5px 8px;
    border-radius: 999px;
    background: #f7f7f7;
    color: #111;
    font-size: 11px;
    font-weight: 900;
    line-height: 1;
}

.currency-converter,
.currency-converter * {
    color: #000;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 900;
    text-shadow: .25px 0 0 #000;
}

.currency-converter label {
    display: flex;
    align-items: center;
    gap: 2px;
    min-width: 0;
    color: #111;
    white-space: nowrap;
}

.currency-converter input {
    width: 42px;
    height: 18px;
    border: 0;
    border-radius: 999px;
    background: #fff;
    color: #111;
    font: inherit;
    font-size: 11px;
    font-weight: 900;
    text-align: center;
    outline: none;
}

.currency-converter input:focus {
    box-shadow: 0 0 0 2px rgba(213, 0, 0, .18);
}

.currency-converter__swap {
    color: var(--red);
    font-size: 11px;
    font-weight: 900;
}

.brand-stats {
    min-height: 0;
    padding: 66px 0 54px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .72) 0%, rgba(255, 248, 248, .58) 54%, rgba(255, 255, 255, .78) 100%),
        radial-gradient(circle at 16% 30%, rgba(207, 17, 17, .13), transparent 28%),
        url("../img/world-map-bg-attractive.png") center/cover no-repeat;
}

.brand-stats::before {
    inset: auto;
    left: 50%;
    top: 10px;
    width: min(1040px, 94vw);
    height: 360px;
    opacity: .2;
    background: url("../img/world-map-bg-attractive.png") center/contain no-repeat;
    transform: translateX(-50%);
}

.brand-intro,
.brand-strip,
.brand-stats {
    position: relative;
    isolation: isolate;
}

.brand-intro::before,
.brand-strip::before {
    content: "";
    position: absolute;
    left: 50%;
    z-index: 0;
    width: 100%;
    height: 360px;
    transform: translateX(-50%);
    background: url("../img/world-map-bg-attractive.png") center/cover no-repeat;
    opacity: .7;
    pointer-events: none;
}

.brand-intro .container,
.brand-strip .brand-marquee,
.brand-stats .container {
    position: relative;
    z-index: 1;
}

.brand-intro::before {
    bottom: -190px;
}

.brand-strip::before {
    top: -130px;
}

.brand-stats::before {
    top: 50%;
    width: 100%;
    height: 100%;
    opacity: .5;
    background-size: cover;
    transform: translate(-50%, -50%);
}

.brand-stats .container {
    max-width: 1120px;
}

.stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin: 0 auto 28px;
}

.stats div {
    min-height: 126px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 22px 16px;
    border: 1px solid rgba(205, 17, 17, .12);
    border-radius: 16px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 18px 42px rgba(20, 20, 20, .08);
    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}

.stats div:hover {
    transform: translateY(-6px);
    border-color: rgba(205, 17, 17, .32);
    box-shadow: 0 22px 52px rgba(205, 17, 17, .13);
}

.stats strong {
    color: var(--red);
    font-size: clamp(38px, 4.3vw, 58px);
    line-height: .9;
    font-weight: 950;
    letter-spacing: 0;
}

.stats span {
    max-width: 130px;
    color: #202020;
    text-align: center;
    font-size: 12px;
    font-weight: 900;
    line-height: 1.35;
    text-transform: uppercase;
}

.videos {
    padding-block: 52px;
}

.videos .container {
    max-width: 980px;
}

.video-grid.rail-track {
    justify-content: center;
    gap: 18px;
}

.video-grid video.rail-item,
.video-grid .rail-item {
    flex: 0 0 230px;
    max-width: 230px;
    aspect-ratio: 9 / 14;
    border-radius: 18px;
    box-shadow: 0 18px 38px rgba(0, 0, 0, .15);
}

.footer .footer__about img {
    display: block;
    width: 150px;
    height: auto;
    margin: 0 0 18px;
    filter: brightness(1.12);
}

@media (max-width: 860px) {
    .topbar__inner {
        gap: 8px;
    }

    .topbar__right {
        flex-basis: 156px;
        width: 156px;
        height: 28px;
    }

    .stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .video-grid video.rail-item,
    .video-grid .rail-item {
        flex-basis: 200px;
        max-width: 200px;
    }
}

@media (max-width: 520px) {
    .topbar__inner {
        width: calc(100% - 20px);
        justify-content: space-between !important;
        gap: 6px;
        overflow: hidden;
    }

    .topbar__left {
        flex: 1 1 auto;
        min-width: 0;
        max-width: calc(100% - 118px);
        justify-content: flex-start !important;
        gap: 5px;
        overflow: hidden;
    }

    .topbar__left span {
        flex: 0 1 auto;
        min-width: 0;
        max-width: 34%;
        overflow: hidden;
        text-overflow: ellipsis;
        padding: 5px 6px;
        font-size: 9.5px;
    }

    .topbar__right {
        flex: 0 0 112px;
        width: 112px;
        margin-left: 0;
    }

    .topbar__right span {
        font-size: 9.5px;
        padding-inline: 7px;
    }

    .stats {
        grid-template-columns: 1fr;
    }

    .video-grid video.rail-item,
    .video-grid .rail-item {
        flex-basis: 74%;
        max-width: 220px;
    }
}

/* Requested section refinements */
.why-card__front .why-icon::before {
    content: "";
    width: 68px;
    height: 68px;
    margin: 0 auto 24px;
    border-radius: 20px;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 36px 36px;
    box-shadow: inset 0 -8px 16px rgba(183, 0, 0, .12), 0 16px 28px rgba(0, 0, 0, .2);
}

.why-card__front .why-icon--expertise::before {
    background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M12 3l7 3v5c0 4.2-2.8 8.1-7 9-4.2-.9-7-4.8-7-9V6l7-3Z' stroke='%23b40000' stroke-width='2'/%3E%3Cpath d='M9 12l2 2 4-5' stroke='%23b40000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.why-card__front .why-icon--selection::before {
    background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M5 16h14l-1.4-4.2A3 3 0 0014.8 10H9.2a3 3 0 00-2.8 1.8L5 16Z' stroke='%23b40000' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M7 16v2M17 16v2M8 13h8' stroke='%23b40000' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='7.5' cy='18' r='1.5' fill='%23b40000'/%3E%3Ccircle cx='16.5' cy='18' r='1.5' fill='%23b40000'/%3E%3C/svg%3E");
}

.why-card__front .why-icon--reliable::before {
    background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M7 3h8l4 4v14H7V3Z' stroke='%23b40000' stroke-width='2'/%3E%3Cpath d='M15 3v5h5M9 13h6M9 17h4' stroke='%23b40000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.why-card__front .why-icon--purchase::before {
    background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M4 7h16l-2 10H7L4 7Z' stroke='%23b40000' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M4 7 3 4H1M9 20h.01M17 20h.01' stroke='%23b40000' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M9 12h6' stroke='%23b40000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.why-card__front .why-icon--global::before {
    background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 24 24' fill='none'%3E%3Ccircle cx='12' cy='12' r='8' stroke='%23b40000' stroke-width='2'/%3E%3Cpath d='M4 12h16M12 4c2 2.2 3 4.8 3 8s-1 5.8-3 8c-2-2.2-3-4.8-3-8s1-5.8 3-8Z' stroke='%23b40000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.why-card__front .why-icon--service::before {
    background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M7 12a5 5 0 0110 0v3a3 3 0 01-3 3h-2' stroke='%23b40000' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M5 12h3v5H5a2 2 0 01-2-2v-1a2 2 0 012-2ZM19 12h-3v5h3a2 2 0 002-2v-1a2 2 0 00-2-2Z' stroke='%23b40000' stroke-width='2'/%3E%3Cpath d='M12 18h2' stroke='%23b40000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.steps {
    background:
        linear-gradient(180deg, #fff 0%, #fff7f7 100%);
}

.step-grid article {
    position: relative;
    padding: 28px 24px;
    border: 1px solid rgba(183, 0, 0, .1);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 18px 38px rgba(20, 20, 20, .08);
}

.step-icon {
    width: 76px;
    height: 76px;
    display: inline-grid;
    place-items: center;
    margin: 0 auto 18px;
    border-radius: 24px;
    background: linear-gradient(135deg, #c90000, #7d0000);
    box-shadow: 0 18px 30px rgba(183, 0, 0, .22);
}

.step-icon::before {
    content: "";
    width: 42px;
    height: 42px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.step-icon--chat::before {
    background-image: url("data:image/svg+xml,%3Csvg width='42' height='42' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M5 6h14v9H9l-4 4V6Z' stroke='white' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M8 10h8M8 13h5' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.step-icon--car::before {
    background-image: url("data:image/svg+xml,%3Csvg width='42' height='42' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M4 15h16l-1.5-4.4A3 3 0 0015.7 8H8.3a3 3 0 00-2.8 2.6L4 15Z' stroke='white' stroke-width='2' stroke-linejoin='round'/%3E%3Ccircle cx='7' cy='17' r='2' stroke='white' stroke-width='2'/%3E%3Ccircle cx='17' cy='17' r='2' stroke='white' stroke-width='2'/%3E%3Cpath d='M8 12h8' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.step-icon--ship::before {
    background-image: url("data:image/svg+xml,%3Csvg width='42' height='42' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M4 13h16l-2 5H6l-2-5Z' stroke='white' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M7 13V8h7l3 5M9 8V5h4v3M6 21c1.2-.8 2.4-.8 3.6 0 1.2.8 2.4.8 3.6 0 1.2-.8 2.4-.8 3.6 0' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.testimonials {
    overflow: hidden;
    background:
        radial-gradient(circle at 82% 22%, rgba(207, 17, 17, .16), transparent 30%),
        linear-gradient(135deg, #f5f5f5 0%, #fff 55%, #f9ecec 100%);
    padding: 66px 0;
}

.testimonial-grid {
    grid-template-columns: .82fr 1.18fr;
}

.testimonial-copy {
    position: relative;
}

.testimonial-copy h2 {
    margin-bottom: 14px;
}

.testimonial-copy > p:last-child {
    max-width: 390px;
    color: #555;
    font-weight: 700;
}

.testimonial-card {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(183, 0, 0, .12);
    border-radius: 24px;
    background:
        linear-gradient(135deg, rgba(255,255,255,.94), rgba(255,255,255,.78)),
        linear-gradient(135deg, rgba(207,17,17,.08), transparent);
    box-shadow: 0 24px 60px rgba(20, 20, 20, .12);
}

.testimonial-card::before {
    content: "";
    position: absolute;
    right: -70px;
    top: -80px;
    width: 210px;
    height: 210px;
    border-radius: 50%;
    background: rgba(207, 17, 17, .09);
}

.testimonial-card__quote {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    margin-bottom: 18px;
    border-radius: 18px;
    background: linear-gradient(135deg, #d00000, #8f0000);
    box-shadow: 0 16px 30px rgba(207, 17, 17, .25);
}

.testimonial-card__quote::before {
    content: "\"";
    color: #fff;
    font-size: 48px;
    line-height: .9;
    font-weight: 900;
}

.testimonial-card p {
    position: relative;
    margin: 0 0 22px;
    color: #202020;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 750;
}

.testimonial-card__person {
    display: flex;
    align-items: center;
    gap: 14px;
}

.testimonial-card__person > span {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: #111;
    font-weight: 900;
}

.testimonial-card__person strong,
.testimonial-card__person small {
    display: block;
    margin: 0;
}

.testimonial-card__person small {
    color: #c60000;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.footer__grid {
    grid-template-columns: 1.25fr .75fr .75fr 1.15fr 1.65fr;
    align-items: stretch;
}

.footer__about p {
    max-width: none;
}

.footer .footer__about img {
    float: left;
    width: 128px;
    margin: 2px 16px 8px 0;
}

.footer__offices {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 18px;
}

.footer__offices h3 {
    grid-column: 1 / -1;
    margin-bottom: 4px;
}

.footer__offices div {
    padding: 0 0 12px;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.footer__offices strong {
    display: block;
    color: #fff;
    font-size: 13px;
    line-height: 1.35;
    margin-bottom: 5px;
}

.footer__offices p + p {
    color: #aaa;
    font-weight: 600;
}

@media (max-width: 1100px) {
    .testimonial-grid,
    .footer__grid {
        grid-template-columns: 1fr;
    }

    .footer__offices {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .testimonial-card p {
        font-size: 14px;
    }

    .footer .footer__about img {
        width: 112px;
    }

    .footer__offices {
        grid-template-columns: 1fr;
    }
}

/* Visible inline icons and footer office placement */
.why-card__front .why-icon {
    width: 68px;
    height: 68px;
    display: grid;
    place-items: center;
    margin: 0 auto 24px;
    border-radius: 20px;
    background: #fff;
    box-shadow: inset 0 -8px 16px rgba(183, 0, 0, .12), 0 16px 28px rgba(0, 0, 0, .2);
}

.why-card__front .why-icon::before,
.step-icon::before,
.testimonial-card__quote::before {
    content: none !important;
    display: none !important;
}

.why-icon svg,
.step-icon svg,
.testimonial-card__quote svg {
    display: block;
    width: 40px;
    height: 40px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.why-icon {
    color: #b40000;
}

.why-icon circle {
    fill: none;
}

.why-icon--selection circle,
.why-icon--car circle {
    fill: currentColor;
    stroke: none;
}

.step-icon svg {
    width: 42px;
    height: 42px;
    color: #fff;
}

.step-icon circle {
    fill: none;
}

.testimonial-card__quote svg {
    width: 30px;
    height: 30px;
    color: #fff;
    fill: currentColor;
    stroke: none;
}

.footer__offices {
    grid-column: 1 / -1;
    margin-top: 18px;
}

@media (min-width: 1101px) {
    .footer__grid {
        grid-template-columns: 1.25fr .85fr .85fr 1.35fr;
    }
}

/* Logo preloader and ready-to-ship hero badge */
.site-preloader {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 22px;
    background:
        radial-gradient(circle at 50% 46%, rgba(207, 17, 17, .18), transparent 25%),
        linear-gradient(135deg, #070707 0%, #141414 54%, #080808 100%);
    opacity: 1;
    visibility: visible;
    transition: opacity .55s ease, visibility .55s ease;
}

.site-preloader.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.site-preloader__mark {
    position: relative;
    width: 148px;
    height: 148px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 30px 70px rgba(0, 0, 0, .35);
}

.site-preloader__mark::before,
.site-preloader__mark::after,
.site-preloader__mark span {
    content: "";
    position: absolute;
    border-radius: 50%;
}

.site-preloader__mark::before {
    inset: -14px;
    border: 4px solid rgba(255, 255, 255, .16);
    border-top-color: #d00000;
    border-right-color: #d00000;
    animation: preloaderSpin 1.1s linear infinite;
}

.site-preloader__mark::after {
    inset: -27px;
    border: 1px solid rgba(255, 255, 255, .14);
}

.site-preloader__mark span {
    inset: -27px;
    border-top: 1px solid rgba(255, 255, 255, .55);
    animation: preloaderSpinReverse 2.4s linear infinite;
}

.site-preloader__mark img {
    width: 104px;
    height: auto;
    position: relative;
    z-index: 1;
}

.site-preloader p {
    margin: 0;
    color: #fff;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

.hero__stamp {
    width: 188px;
    height: 188px;
    right: clamp(52px, 12vw, 170px);
    top: 18%;
    display: grid;
    place-items: center;
    border: 0;
    background: transparent;
    color: #fff;
    font-size: inherit;
}

.hero__stamp-ring {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
    animation: stampRotate 12s linear infinite;
}

.hero__stamp-ring text {
    fill: #fff;
    font-size: 16px;
    font-weight: 950;
    letter-spacing: 6px;
}

.hero__stamp-core {
    position: relative;
    z-index: 1;
    width: 118px;
    height: 118px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 3px;
    border: 2px solid rgba(255, 255, 255, .75);
    border-radius: 50%;
    background: #c8121f;
    box-shadow: 0 20px 38px rgba(0, 0, 0, .22);
}

.hero__stamp-core svg {
    width: 28px;
    height: 28px;
    fill: none;
    stroke: #fff;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.hero__stamp-core strong,
.hero__stamp-core small {
    display: block;
    color: #fff;
    line-height: .9;
    text-align: center;
}

.hero__stamp-core strong {
    font-size: 23px;
    font-weight: 950;
}

.hero__stamp-core small {
    font-size: 12px;
    font-weight: 950;
}

@keyframes stampRotate {
    to { transform: rotate(360deg); }
}

@keyframes preloaderSpin {
    to { transform: rotate(360deg); }
}

@keyframes preloaderSpinReverse {
    to { transform: rotate(-360deg); }
}

@media (max-width: 620px) {
    /* Phones: in the empty top corner of the hero, clear of the car's name
       (at top: 92px it sat on the heading and hid its letters). */
    .hero__stamp {
        width: 104px;
        height: 104px;
        right: 12px;
        top: 14px;
    }

    .hero__stamp-ring text {
        font-size: 17px;
        letter-spacing: 5px;
    }

    .hero__stamp-core {
        width: 66px;
        height: 66px;
    }

    .hero__stamp-core svg {
        width: 17px;
        height: 17px;
    }

    .hero__stamp-core strong {
        font-size: 13px;
    }

    .hero__stamp-core small {
        font-size: 8px;
    }
}
.sbk-brand-menu {
    position: static;
}


/* Brand button */

.sbk-brand-trigger {
    display: flex !important;
    align-items: center;
    gap: 5px;
    font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
    font-size: inherit;
    font-weight: inherit;
}

.sbk-brand-trigger svg {
    width: 13px;
    height: 13px;

    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;

    transition:
        transform .25s ease,
        color .25s ease;
}


/* ======================================
   DROPDOWN
====================================== */

.sbk-brand-dropdown {

    position: absolute;

    z-index: 99999;

    left: 50%;
    top: calc(100% - 2px);

    width: min(1180px, calc(100vw - 40px));

    transform:
        translateX(-50%)
        translateY(14px);

    padding-top: 15px;

    opacity: 0;
    visibility: hidden;

    pointer-events: none;

    transition:
        opacity .22s ease,
        transform .22s ease,
        visibility .22s ease;
}


/*
IMPORTANT:
navgrid needs position relative so
the dropdown stays underneath navbar.
*/

.navgrid {
    position: relative;
}


/* Invisible bridge prevents menu closing
   when mouse travels to dropdown */

.sbk-brand-dropdown::before {

    content: "";

    position: absolute;

    left: 0;
    right: 0;

    top: 0;

    height: 18px;
}


/* SHOW ON HOVER */

.sbk-brand-menu:hover .sbk-brand-dropdown,
.sbk-brand-menu:focus-within .sbk-brand-dropdown,
.sbk-brand-menu.is-open .sbk-brand-dropdown {

    opacity: 1;
    visibility: visible;

    pointer-events: auto;

    transform:
        translateX(-50%)
        translateY(0);
}


.sbk-brand-menu:hover .sbk-brand-trigger,
.sbk-brand-menu.is-open .sbk-brand-trigger {

    color: #d71920;
}


.sbk-brand-menu:hover .sbk-brand-trigger svg,
.sbk-brand-menu.is-open .sbk-brand-trigger svg {

    transform: rotate(180deg);
}


/* ======================================
   WHITE MEGA MENU PANEL
====================================== */

.sbk-brand-dropdown-inner {

    position: relative;

    padding: 25px;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fbfbfb 100%
        );

    border:
        1px solid
        rgba(0,0,0,.07);

    border-radius: 16px;

    box-shadow:
        0 25px 70px rgba(0,0,0,.18);

    overflow: hidden;
}


/* Red top line */

.sbk-brand-dropdown-inner::before {

    content: "";

    position: absolute;

    top: 0;
    left: 30px;

    width: 90px;
    height: 3px;

    background: #d71920;

    border-radius:
        0 0 10px 10px;
}


/* ======================================
   DROPDOWN HEADER
====================================== */

.sbk-brand-dropdown-header {

    display: flex;

    justify-content: space-between;
    align-items: flex-end;

    gap: 20px;

    padding:
        2px 5px 19px;

    margin-bottom: 5px;

    border-bottom:
        1px solid #eeeeee;
}


.sbk-brand-small {

    display: block;

    margin-bottom: 4px;

    color: #d71920;

    font-size: 9px;
    line-height: 1;

    font-weight: 800;

    letter-spacing: 1.6px;
}


.sbk-brand-dropdown-header h3 {

    margin: 0;

    color: #111;

    font-size: 20px;
    line-height: 1.2;

    font-weight: 800;
}


.sbk-view-brands {

    display: flex !important;

    align-items: center;

    gap: 8px;

    color: #d71920 !important;

    font-size: 12px !important;

    font-weight: 700 !important;

    text-decoration: none !important;
}


.sbk-view-brands span {

    font-size: 17px;

    transition:
        transform .2s ease;
}


.sbk-view-brands:hover span {

    transform:
        translateX(4px);
}


/* ======================================
   BRAND GRID
====================================== */

.sbk-brand-grid {

    display: grid;

    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 10px;

    padding-top: 15px;
}


/* ======================================
   BRAND CARD
====================================== */

.sbk-brand-item {

    position: relative;

    display: flex !important;

    flex-direction: column;

    align-items: center;
    justify-content: center;

    min-width: 0;

    height: 112px;

    padding: 12px 8px;

    color: #151515 !important;

    text-decoration: none !important;

    background: #fff;

    border:
        1px solid #eeeeee;

    border-radius: 10px;

    overflow: hidden;

    transition:
        transform .25s ease,
        border-color .25s ease,
        box-shadow .25s ease,
        background .25s ease;
}


/* Red underline */

.sbk-brand-item::after {

    content: "";

    position: absolute;

    left: 50%;
    bottom: 0;

    width: 0;
    height: 3px;

    transform:
        translateX(-50%);

    background: #d71920;

    transition:
        width .25s ease;
}


/* Hover */

.sbk-brand-item:hover {

    transform:
        translateY(-4px);

    border-color:
        rgba(215,25,32,.28);

    background: #fff;

    box-shadow:
        0 10px 25px
        rgba(0,0,0,.09);
}


.sbk-brand-item:hover::after {

    width: 100%;
}


/* ======================================
   LOGO AREA
====================================== */

.sbk-brand-logo {

    width: 100%;
    height: 55px;

    display: flex;

    align-items: center;
    justify-content: center;

    margin-bottom: 7px;
}


.sbk-brand-logo img {

    display: block;

    width: auto;
    height: auto;

    max-width: 78px;
    max-height: 48px;

    object-fit: contain;

    transition:
        transform .25s ease;
}


.sbk-brand-item:hover
.sbk-brand-logo img {

    transform:
        scale(1.08);
}


/* Brand name */

.sbk-brand-item > span {

    display: block;

    width: 100%;

    overflow: hidden;

    color: #202020;

    font-size: 11px;
    line-height: 1.2;

    font-weight: 700;

    text-align: center;

    text-overflow: ellipsis;

    white-space: nowrap;
}


/* ======================================
   RESPONSIVE
====================================== */

@media (max-width: 1100px) {

    .sbk-brand-grid {

        grid-template-columns:
            repeat(4, 1fr);
    }

}


@media (max-width: 850px) {

    .sbk-brand-dropdown {

        width:
            calc(100vw - 24px);
    }


    .sbk-brand-grid {

        grid-template-columns:
            repeat(3, 1fr);
    }

}


@media (max-width: 600px) {

    .sbk-brand-dropdown {

        position: fixed;

        left: 12px;
        right: 12px;

        top: 115px;

        width: auto;

        max-height:
            calc(100vh - 135px);

        padding-top: 0;

        overflow-y: auto;

        transform:
            translateY(10px);
    }


    .sbk-brand-menu:hover
    .sbk-brand-dropdown,
    .sbk-brand-menu:focus-within
    .sbk-brand-dropdown,
    .sbk-brand-menu.is-open
    .sbk-brand-dropdown {

        transform:
            translateY(0);
    }


    .sbk-brand-dropdown-inner {

        padding: 18px;

        border-radius: 12px;
    }


    .sbk-brand-dropdown-header {

        align-items: center;

        padding-bottom: 14px;
    }


    .sbk-brand-dropdown-header h3 {

        font-size: 17px;
    }


    .sbk-brand-grid {

        grid-template-columns:
            repeat(2, 1fr);

        gap: 8px;
    }


    .sbk-brand-item {

        height: 100px;
    }

}

/* Final mobile responsiveness pass */
.nav-toggle {
    display: none;
    width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid #ececec;
    border-radius: 8px;
    background: #fff;
    color: #111;
    cursor: pointer;
}

.nav-toggle span {
    display: block;
    width: 20px;
    height: 2px;
    margin: 5px auto;
    border-radius: 999px;
    background: currentColor;
    transition: transform .22s ease, opacity .22s ease;
}

.nav-toggle.is-active span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.nav-toggle.is-active span:nth-child(2) {
    opacity: 0;
}

.nav-toggle.is-active span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

@media (max-width: 900px) {
    body {
        overflow-x: hidden;
    }

    .topbar {
        display: none;
    }

    .navbar {
        position: sticky;
        top: 0;
        z-index: 1000;
        background: #fff;
        box-shadow: 0 8px 24px rgba(0,0,0,.08);
    }

    .navbar .container {
        width: min(100% - 24px, 1180px) !important;
    }

    .navgrid {
        display: grid !important;
        grid-template-columns: auto 42px !important;
        gap: 10px !important;
        align-items: center !important;
        justify-content: normal !important;
        justify-items: stretch !important;
        width: 100% !important;
        min-height: 62px !important;
        padding: 10px 0 !important;
    }

    .logo {
        justify-self: start;
    }

    .logo img {
        width: 124px !important;
        max-width: 38vw;
        margin: 0 !important;
    }

    .nav-toggle {
        display: block;
        justify-self: end;
        box-shadow: 0 8px 20px rgba(0,0,0,.06);
    }

    .navlinks,
    .navactions {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        display: none !important;
        max-height: 0;
        margin: 0 !important;
        padding: 0 !important;
        opacity: 0;
        overflow: hidden;
        pointer-events: none;
        transform: translateY(-6px);
        transition: max-height .25s ease, opacity .2s ease, transform .2s ease;
    }

    .navgrid.is-open .navlinks,
    .navgrid.is-open .navactions {
        display: grid !important;
        max-height: 720px;
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
    }

    .navlinks {
        order: 2;
        grid-template-columns: 1fr !important;
        gap: 0 !important;
        border-top: 1px solid #f0f0f0;
        margin-top: 6px !important;
        padding: 6px 0 0 !important;
    }

    .navlinks a,
    .sbk-brand-trigger {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        min-height: 44px;
        padding: 0 10px !important;
        border-radius: 0 !important;
        border-bottom: 1px solid #f1f1f1;
        background: transparent;
        color: #111;
        font-size: 14px !important;
        font-weight: 700 !important;
        white-space: normal !important;
        transform: none !important;
    }

    .navlinks a.is-active,
    .navlinks a:hover,
    .sbk-brand-menu:hover .sbk-brand-trigger,
    .sbk-brand-menu.is-open .sbk-brand-trigger {
        background: linear-gradient(90deg, rgba(213,0,0,.1), transparent) !important;
        color: var(--red) !important;
    }

    .navlinks a.is-active {
        box-shadow: inset 3px 0 0 var(--red);
    }

    .sbk-brand-menu {
        width: 100%;
        position: relative;
    }

    .sbk-brand-dropdown {
        position: static !important;
        width: 100% !important;
        max-height: 0 !important;
        padding: 0 !important;
        opacity: 0 !important;
        visibility: hidden !important;
        overflow: hidden !important;
        transform: none !important;
        transition: max-height .25s ease, opacity .2s ease !important;
    }

    .sbk-brand-menu.is-open .sbk-brand-dropdown {
        max-height: 70vh !important;
        margin-top: 8px;
        opacity: 1 !important;
        visibility: visible !important;
        overflow-y: auto !important;
    }

    .sbk-brand-dropdown-inner {
        padding: 14px !important;
        border-radius: 10px !important;
    }

    .sbk-brand-dropdown-header {
        align-items: flex-start !important;
        gap: 10px !important;
    }

    .sbk-brand-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    .sbk-brand-item {
        height: 92px !important;
        padding: 10px 6px !important;
    }

    .navactions {
        order: 3;
        grid-template-columns: auto auto minmax(0, 1fr) !important;
        align-items: center !important;
        gap: 10px !important;
        margin-top: 12px !important;
        padding: 12px 0 2px !important;
        border-top: 1px solid #f0f0f0;
    }

    .navactions .sbk-search {
        grid-column: 1 / -1;
        width: 100%;
        order: -1;
        margin-bottom: 2px !important;
    }

    .navactions input,
    .sbk-search input {
        width: 100% !important;
        max-width: 100% !important;
        height: 44px !important;
        border-radius: 999px !important;
        border-color: #e5e7eb !important;
        background: #f9fafb !important;
        box-shadow: inset 0 1px 2px rgba(0,0,0,.03);
    }

    .sbk-search-suggestions {
        left: 0;
        right: auto;
        width: 100% !important;
        max-width: 100% !important;
    }

    .navactions button {
        justify-self: start;
        min-height: 42px !important;
        padding: 0 22px !important;
        border-radius: 999px !important;
        white-space: nowrap;
        box-shadow: 0 12px 26px rgba(213,0,0,.18) !important;
    }

    .navactions .sbk-head-icon {
        width: 40px !important;
        height: 40px !important;
        border-radius: 12px !important;
        background: #f9fafb !important;
        box-shadow: none !important;
    }
}

@media (max-width: 620px) {
    h2,
    .brand-intro h2,
    .auction h2,
    .register h2 {
        font-size: clamp(24px, 7vw, 34px) !important;
        line-height: 1.12 !important;
    }

    .section {
        padding: 38px 0 !important;
    }

    .hero,
    .hero__slide {
        min-height: 540px !important;
    }

    .hero__content {
        min-height: 500px !important;
        padding: 88px 0 56px !important;
        justify-content: flex-end !important;
    }

    .hero h1 {
        max-width: 100% !important;
        font-size: clamp(38px, 12vw, 54px) !important;
        line-height: .96 !important;
    }

    .hero h2 {
        font-size: 16px !important;
        line-height: 1.35 !important;
    }

    .hero__buttons {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        gap: 8px !important;
    }

    .hero__buttons a,
    .btn {
        width: 100%;
        min-height: 42px;
        text-align: center;
    }

    .stats,
    .why-grid,
    .step-grid,
    .body-grid,
    .blog-grid,
    .auction__grid,
    .register__grid,
    .testimonial-grid,
    .payment-card,
    .sbk-product-grid,
    .sbk-checkout-grid {
        grid-template-columns: 1fr !important;
    }

    .stats div {
        justify-content: flex-start !important;
        padding: 0 8px;
    }

    .product-grid.rail-track,
    .mini-row.rail-track,
    .video-grid.rail-track,
    .blog-grid.rail-track {
        display: flex !important;
        gap: 14px !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory;
        padding: 4px 2px 18px !important;
    }

    .product-card.rail-item,
    .mini-row .rail-item,
    .blog-grid.rail-track .rail-item,
    .rail-track .sbk-car {
        flex: 0 0 min(330px, 86vw) !important;
    }

    .product-card img,
    .sbk-car__media {
        height: 220px !important;
        aspect-ratio: auto !important;
    }

    .sbk-car__foot {
        align-items: flex-start !important;
        flex-direction: column !important;
    }

    .sbk-actions,
    .sbk-actions form,
    .sbk-action-btn {
        width: 100% !important;
    }

    .sbk-action-btn {
        min-height: 42px !important;
    }

    .members {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .payment-card > div {
        padding: 24px !important;
    }

    .why-card,
    .why-card__inner,
    .why-card__face {
        min-height: 250px !important;
    }

    .rail-arrow {
        display: none !important;
    }
}

@media (max-width: 520px) {
    .container,
    .sbk-shop .container,
    .sbk-product .container,
    .sbk-checkout .container,
    .sbk-contact .container,
    .sbk-list .container {
        width: calc(100% - 24px) !important;
    }

    .navgrid {
        min-height: 64px !important;
    }

    .logo img {
        width: 112px !important;
    }

    .navactions {
        grid-template-columns: 1fr 1fr !important;
    }

    .navactions .sbk-head-icon {
        justify-self: start;
    }

    .navactions button {
        justify-self: start;
    }

    .sbk-shop-hero,
    .sbk-product-hero,
    .sbk-checkout-hero,
    .sbk-contact-hero {
        min-height: 300px !important;
        padding: 56px 0 !important;
    }

    .sbk-shop-hero h1,
    .sbk-product-hero h1,
    .sbk-checkout-hero h1,
    .sbk-contact-hero h1 {
        font-size: clamp(38px, 12vw, 52px) !important;
        line-height: 1 !important;
        letter-spacing: 0 !important;
    }

    .sbk-shop-layout,
    .sbk-cars,
    .sbk-spec-grid,
    .sbk-related-grid,
    .sbk-checkout-form,
    .sbk-list-item {
        grid-template-columns: 1fr !important;
    }

    .sbk-filter,
    .sbk-buybox,
    .sbk-summary {
        position: static !important;
    }

    .sbk-gallery-main img {
        height: 320px !important;
    }

    .sbk-gallery-thumbs {
        grid-template-columns: repeat(3, 1fr) !important;
    }

    .sbk-buy-actions {
        grid-template-columns: 1fr !important;
    }

    .sbk-list-item img {
        width: 100% !important;
        height: 210px !important;
    }

    .sbk-toast {
        left: 14px;
        right: 14px;
        bottom: 14px;
        max-width: none;
    }
}
.navactions button.sbk-account-toggle {
    display: inline-grid !important;
    grid-column: auto !important;
    grid-row: auto !important;
    place-items: center !important;
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    min-height: 46px !important;
    padding: 0 !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 50% !important;
    background: #fff !important;
    background-image: none !important;
    color: #111 !important;
    box-shadow: 0 8px 22px rgba(17,18,22,.08) !important;
}

@media (max-width: 900px) {
    .navgrid.is-open {
        max-height: calc(100vh - 12px);
        overflow-y: auto;
        align-content: start;
    }

    .navgrid.is-open .navactions {
        grid-template-columns: 44px 44px minmax(72px, 1fr) minmax(104px, 1.25fr) !important;
        gap: 8px !important;
        align-items: center !important;
    }

    .navactions .sbk-search {
        grid-column: 1 / -1 !important;
    }

    .navactions .sbk-head-icon,
    .navactions .sbk-auth-link,
    .navactions button:not(.sbk-account-toggle) {
        justify-self: stretch !important;
    }

    .navactions .sbk-head-icon,
    .navactions button.sbk-account-toggle {
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
        border-radius: 12px !important;
    }

    .navactions .sbk-auth-link,
    .navactions button:not(.sbk-account-toggle) {
        min-width: 0 !important;
        min-height: 44px !important;
        padding: 0 12px !important;
        font-size: 12px !important;
        text-align: center;
    }
}

@media (max-width: 380px) {
    .navgrid.is-open .navactions {
        grid-template-columns: 42px 42px minmax(66px, 1fr) minmax(92px, 1.15fr) !important;
        gap: 7px !important;
    }

    .navactions .sbk-head-icon,
    .navactions button.sbk-account-toggle {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;
    }

    .navactions .sbk-auth-link,
    .navactions button:not(.sbk-account-toggle) {
        padding: 0 10px !important;
        font-size: 11px !important;
    }
}

@media (max-width: 900px) {
    .sbk-brand-menu.is-open .sbk-brand-dropdown {
        max-height: min(420px, 52vh) !important;
        margin-top: 0 !important;
        padding: 10px 0 4px !important;
        border-bottom: 1px solid #f1f1f1;
        background: #fff !important;
    }

    .sbk-brand-dropdown-inner {
        padding: 12px !important;
        border: 1px solid #f0f0f0 !important;
        border-radius: 8px !important;
        background: #fff !important;
        box-shadow: none !important;
    }

    .sbk-brand-dropdown-inner::before {
        left: 12px !important;
        width: 72px !important;
        height: 2px !important;
    }

    .sbk-brand-dropdown-header {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 12px !important;
        align-items: center !important;
        padding: 4px 0 12px !important;
        margin-bottom: 12px !important;
        border-bottom: 1px solid #f1f1f1 !important;
    }

    .sbk-brand-small {
        margin-bottom: 3px !important;
        font-size: 8px !important;
        line-height: 1.1 !important;
        letter-spacing: .08em !important;
    }

    .sbk-brand-dropdown-header h3 {
        max-width: 120px;
        font-size: 15px !important;
        line-height: 1.05 !important;
    }

    .sbk-view-brands {
        min-height: 34px !important;
        padding: 0 8px !important;
        border: 1px solid #ffe0e0 !important;
        border-radius: 999px !important;
        background: #fff7f7 !important;
        color: #d50000 !important;
        font-size: 11px !important;
        white-space: nowrap !important;
    }

    .sbk-view-brands span {
        font-size: 14px !important;
    }

    .sbk-brand-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    .sbk-brand-item {
        height: 82px !important;
        min-height: 82px !important;
        padding: 9px 7px 8px !important;
        border-radius: 8px !important;
        background: #fff !important;
        border-color: #eeeeee !important;
        box-shadow: 0 1px 0 rgba(17,18,22,.02) !important;
        justify-content: center !important;
        gap: 6px !important;
    }

    .sbk-brand-logo {
        height: 44px !important;
    }

    .sbk-brand-logo img {
        max-width: 62px !important;
        max-height: 36px !important;
    }

    .sbk-brand-item > span {
        font-size: 10px !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
        text-overflow: ellipsis !important;
    }
}

@media (max-width: 380px) {
    .sbk-brand-menu.is-open .sbk-brand-dropdown {
        max-height: min(390px, 50vh) !important;
    }

    .sbk-brand-dropdown-inner {
        padding: 10px !important;
    }

    .sbk-brand-dropdown-header {
        gap: 8px !important;
    }

    .sbk-view-brands {
        padding: 0 7px !important;
        font-size: 10px !important;
    }

    .sbk-brand-item {
        height: 78px !important;
        min-height: 78px !important;
    }
}