.fk-brands-page .entry-title,
.fk-brands-page .page-title,
.fk-brands-page article.page > header.entry-header {
    display: none !important;
}

.fk-brands-page .site-content,
.fk-brands-page #content,
.fk-brands-page .content-area,
.fk-brands-page .site-main,
.fk-brands-page article.page,
.fk-brands-page .entry-content {
    background: #070809 !important;
}

.fk-brands-page .site-content > .ast-container,
.fk-brands-page .site-content .ast-container {
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
}

.fk-brands-page .content-area,
.fk-brands-page .site-main,
.fk-brands-page article.page,
.fk-brands-page .entry-content {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.fk-brands-directory {
    --fk-gold: #d5a84d;
    --fk-gold-light: #f0ca6b;
    --fk-panel: #111315;
    --fk-panel-2: #171a1e;
    --fk-border: #343941;
    --fk-text: #f7f8fa;
    --fk-muted: #aeb4bd;
    min-height: 70vh;
    padding: 0 0 70px;
    background:
        radial-gradient(circle at 15% 0, rgba(213, 168, 77, .10), transparent 30%),
        linear-gradient(180deg, #070809, #090b0d);
    color: var(--fk-text);
}

.fk-brands-directory * {
    box-sizing: border-box;
}

.fk-brands-hero {
    padding: 76px max(24px, calc((100vw - 1280px) / 2)) 64px;
    border-bottom: 1px solid rgba(213, 168, 77, .30);
    background:
        linear-gradient(90deg, rgba(3, 5, 7, .97), rgba(3, 5, 7, .75)),
        radial-gradient(circle at 75% 40%, rgba(213, 168, 77, .15), transparent 35%);
}

.fk-brands-eyebrow,
.fk-brands-section-heading > span {
    display: block;
    margin-bottom: 10px;
    color: var(--fk-gold);
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .17em;
    text-transform: uppercase;
}

.fk-brands-hero h1 {
    max-width: 820px;
    margin: 0;
    color: #fff;
    font-size: clamp(2.35rem, 5vw, 4.65rem);
    line-height: 1.04;
    letter-spacing: -.04em;
}

.fk-brands-hero p {
    max-width: 780px;
    margin: 20px 0 0;
    color: #c3c8cf;
    font-size: 1.04rem;
    line-height: 1.65;
}

.fk-brands-jump-links {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.fk-brands-jump-links a {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    padding: 10px 20px;
    border: 1px solid var(--fk-gold);
    border-radius: 5px;
    background: linear-gradient(135deg, #e5bb61, #bd8727);
    color: #08090b !important;
    font-weight: 900;
    text-decoration: none !important;
}

.fk-brands-search-panel,
.fk-brands-section,
.fk-brands-no-results {
    width: min(1280px, calc(100% - 36px));
    margin-left: auto;
    margin-right: auto;
}

.fk-brands-search-panel {
    margin-top: 34px;
    padding: 22px;
    border: 1px solid rgba(213, 168, 77, .48);
    border-radius: 8px;
    background: linear-gradient(180deg, #15181b, #101214);
}

.fk-brands-search-panel label {
    display: block;
    margin-bottom: 9px;
    color: #fff;
    font-weight: 900;
}

.fk-brands-search-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
}

.fk-brands-search-row input {
    min-height: 48px;
    padding: 11px 14px;
    border: 1px solid #454b54;
    border-radius: 5px;
    background: #080a0c;
    color: #fff;
}

.fk-brands-search-row input:focus {
    border-color: var(--fk-gold);
    box-shadow: 0 0 0 2px rgba(213, 168, 77, .18);
    outline: 0;
}

.fk-brands-search-row button {
    min-height: 48px;
    padding: 11px 20px;
    border: 1px solid var(--fk-gold);
    border-radius: 5px;
    background: transparent;
    color: var(--fk-gold-light);
    font-weight: 900;
    cursor: pointer;
}

.fk-brands-section {
    scroll-margin-top: 120px;
    padding-top: 62px;
}

.fk-brands-section-heading {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: end;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgba(213, 168, 77, .35);
}

.fk-brands-section-heading > span {
    grid-column: 1 / -1;
}

.fk-brands-section-heading h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(1.9rem, 3vw, 2.8rem);
    letter-spacing: -.025em;
}

.fk-brands-section-heading p {
    margin: 0;
    color: var(--fk-muted);
}

.fk-brand-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.fk-brand-card {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 14px;
    align-items: center;
    min-height: 104px;
    padding: 17px;
    border: 1px solid var(--fk-border);
    border-radius: 7px;
    background: linear-gradient(180deg, var(--fk-panel-2), var(--fk-panel));
    color: #fff !important;
    text-decoration: none !important;
    transition: transform .18s ease, border-color .18s ease, background .18s ease;
}

.fk-brand-card:hover,
.fk-brand-card:focus-visible {
    transform: translateY(-3px);
    border-color: var(--fk-gold);
    background: #191c20;
    outline: 0;
}


.fk-brand-copy strong,
.fk-brand-copy span {
    display: block;
}

.fk-brand-copy strong {
    color: #fff;
    font-size: 1rem;
    line-height: 1.3;
}

.fk-brand-copy span {
    margin-top: 4px;
    color: var(--fk-muted);
    font-size: .82rem;
}

.fk-brand-arrow {
    color: var(--fk-gold);
    font-size: 1.3rem;
    transition: transform .18s ease;
}

.fk-brand-card:hover .fk-brand-arrow {
    transform: translateX(4px);
}

.fk-brands-empty,
.fk-brands-no-results {
    padding: 24px;
    border: 1px dashed #555c66;
    border-radius: 7px;
    background: #111315;
    color: #c4c9d0;
    text-align: center;
}

.fk-brand-card[hidden] {
    display: none !important;
}

.fk-brands-no-results {
    margin-top: 32px;
}

@media (max-width: 1050px) {
    .fk-brand-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 780px) {
    .fk-brand-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .fk-brands-hero {
        padding: 54px 18px 46px;
    }

    .fk-brands-search-panel,
    .fk-brands-section,
    .fk-brands-no-results {
        width: calc(100% - 20px);
    }

    .fk-brands-search-row {
        grid-template-columns: 1fr;
    }

    .fk-brands-section-heading {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .fk-brand-grid {
        grid-template-columns: 1fr;
    }
}


/* v1.0.2 — supplier-access tire brands with no published products */
.fk-brand-card--available {
    cursor: default;
    grid-template-columns: 1fr auto;
}

.fk-brand-card--available:hover,
.fk-brand-card--available:focus-visible {
    transform: none;
    border-color: rgba(213, 168, 77, .48);
    background: linear-gradient(180deg, var(--fk-panel-2), var(--fk-panel));
}

.fk-brand-available-mark {
    color: var(--fk-gold);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}


/* v1.0.3 — logo-first tire brand cards */
.fk-brand-logo-wrap {
    min-width: 0;
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    overflow: hidden;
}

.fk-brand-logo {
    display: block;
    max-width: 150px;
    max-height: 48px;
    width: auto;
    height: auto;
    object-fit: contain;
    filter: none;
}

.fk-brand-logo-status {
    display: block;
    color: var(--fk-muted);
    font-size: .76rem;
    font-weight: 700;
    line-height: 1.2;
    margin-top: 4px;
}

.fk-brand-card:has(.fk-brand-logo-wrap) {
    grid-template-columns: 1fr auto;
    align-items: center;
}

.fk-brand-card:has(.fk-brand-logo-wrap) .fk-brand-logo-status {
    grid-column: 1 / 2;
}

@media (max-width: 560px) {
    .fk-brand-logo-wrap {
        height: 52px;
    }

    .fk-brand-logo {
        max-width: 132px;
        max-height: 44px;
    }
}


/* v1.0.5 — white Tire Brand cards for logo clarity */
.fk-brand-card--tires {
    background: #ffffff !important;
    border-color: rgba(212, 175, 55, .72) !important;
    color: #111111 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .08) !important;
}

.fk-brand-card--tires:hover,
.fk-brand-card--tires:focus-visible,
.fk-brand-card--tires.fk-brand-card--available:hover,
.fk-brand-card--tires.fk-brand-card--available:focus-visible {
    background: #ffffff !important;
    border-color: #d4af37 !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .10) !important;
}

.fk-brand-card--tires .fk-brand-copy strong {
    color: #111111 !important;
}

.fk-brand-card--tires .fk-brand-copy span,
.fk-brand-card--tires .fk-brand-logo-status {
    color: #666666 !important;
}

.fk-brand-card--tires .fk-brand-arrow,
.fk-brand-card--tires .fk-brand-available-mark {
    color: #b98a22 !important;
}

.fk-brand-card--tires .fk-brand-logo-wrap {
    background: #ffffff;
    border-radius: 6px;
}

.fk-brand-card--tires .fk-brand-logo {
    filter: none !important;
    opacity: 1 !important;
}

/* v1.0.6 — clearer logo presentation on white tire cards */
.fk-brand-card--tires .fk-brand-logo-wrap {
    min-height: 62px;
    padding: 7px 8px;
    border-radius: 6px;
    overflow: hidden;
}
.fk-brand-card--tires .fk-brand-logo {
    max-width: 165px;
    max-height: 52px;
    object-fit: contain;
}


/* v1.0.7 — compact tire-brand tiles (roughly half prior footprint) */
#tire-brands .fk-brand-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
}

#tire-brands .fk-brand-card--tires {
    min-height: 56px !important;
    padding: 6px 9px !important;
    gap: 6px !important;
    border-radius: 6px !important;
    box-shadow: none !important;
}

#tire-brands .fk-brand-logo-wrap,
#tire-brands .fk-brand-card--tires .fk-brand-logo-wrap {
    height: 34px !important;
    min-height: 34px !important;
    padding: 2px 3px !important;
    margin: 0 !important;
    border-radius: 4px !important;
}

#tire-brands .fk-brand-logo,
#tire-brands .fk-brand-card--tires .fk-brand-logo {
    max-width: 118px !important;
    max-height: 30px !important;
    width: auto !important;
    height: auto !important;
}

#tire-brands .fk-brand-copy strong {
    font-size: .83rem !important;
    line-height: 1.05 !important;
}

#tire-brands .fk-brand-copy span,
#tire-brands .fk-brand-logo-status,
#tire-brands .fk-brand-available-mark {
    display: none !important;
}

#tire-brands .fk-brand-arrow {
    font-size: 1rem !important;
}

#tire-brands .fk-brand-card:hover,
#tire-brands .fk-brand-card:focus-visible {
    transform: translateY(-1px) !important;
}

@media (max-width: 1100px) {
    #tire-brands .fk-brand-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
    #tire-brands .fk-brand-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
    #tire-brands .fk-brand-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 420px) {
    #tire-brands .fk-brand-grid { grid-template-columns: 1fr; }
}


/* v1.0.8 — fast progressive tire-logo resolver */
#tire-brands .fk-brand-logo-wrap {
    display: none;
}

#tire-brands .fk-brand-logo-wrap.is-loaded {
    display: flex;
}

#tire-brands .fk-brand-copy--logo-fallback {
    display: grid;
}