:root{
    --brand-purple:#5c35f4;
    --brand-purple-dark:#3c22c9;
    --brand-ink:#11131a;
    --brand-muted:#626875;
    --brand-line:#e3e6ec;
    --brand-soft:#f7f5ff;
}

.brands-page{background:#fff;color:var(--brand-ink)}
.brands-main{padding-bottom:64px}

/* Hero — follows the same container, radius and spacing system as other pages */
.brands-v2-hero{
    position:relative;
    height:clamp(360px,28vw,430px);
    margin-top:18px;
    overflow:hidden;
    border:1px solid var(--brand-line);
    border-radius:16px;
    background:
        radial-gradient(circle at 78% 28%,rgba(117,74,255,.18),transparent 31%),
        linear-gradient(105deg,#fff 0%,#fbfaff 48%,#eee8ff 100%);
    box-shadow:0 18px 45px rgba(15,23,42,.07);
}
.brands-v2-hero::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.92) 38%,rgba(255,255,255,.22) 66%,rgba(255,255,255,0) 100%);
}
.brands-v2-hero-inner{position:relative;height:100%;display:grid;grid-template-columns:48% 52%;align-items:center}
.brands-v2-hero-copy{position:relative;z-index:3;padding:42px 0 44px 52px}
.brands-breadcrumb{display:flex;align-items:center;gap:11px;margin-bottom:24px;color:#7b808b;font-size:11px}
.brands-breadcrumb a{color:#5f6470;text-decoration:none}
.brands-breadcrumb strong{color:var(--brand-purple);font-weight:700}
.brands-v2-hero-copy h1{margin:0;max-width:670px;font-size:clamp(38px,3.2vw,53px);line-height:1.03;letter-spacing:-1.8px;text-transform:uppercase;font-weight:900}
.brands-title-line{display:block;width:48px;height:4px;margin-top:17px;border-radius:4px;background:var(--brand-purple)}
.brands-v2-hero-copy p{max-width:560px;margin:18px 0 0;color:#545b68;font-size:13px;line-height:1.72}
.brands-v2-primary{
    width:max-content;min-height:46px;margin-top:25px;padding:0 21px;border-radius:9px;
    background:linear-gradient(135deg,#4c2be9,#704eff);color:#fff;text-decoration:none;
    display:flex;align-items:center;justify-content:center;gap:12px;font-size:11px;font-weight:800;
    box-shadow:0 11px 25px rgba(82,48,228,.25);transition:transform .18s ease,box-shadow .18s ease;
}
.brands-v2-primary:hover{transform:translateY(-2px);box-shadow:0 15px 31px rgba(82,48,228,.34)}
.brands-v2-primary .icon{width:15px;height:15px}
.brands-v2-hero-art{position:absolute;z-index:2;right:0;bottom:0;width:59%;height:100%;display:flex;align-items:flex-end;justify-content:flex-end;overflow:hidden}
.brands-v2-hero-art img{width:100%;height:100%;object-fit:cover;object-position:center right;mix-blend-mode:multiply;filter:saturate(.96) contrast(1.03)}

/* Brand directory */
.brands-v2-directory{padding-top:58px;scroll-margin-top:80px}
.brands-v2-section-heading{text-align:center}
.brands-v2-section-heading h2{margin:0;font-size:32px;line-height:1.08;text-transform:uppercase;letter-spacing:-.9px;font-weight:900}
.brands-v2-section-heading p{margin:11px 0 0;color:#696f7a;font-size:12px;line-height:1.65}
.brands-v2-search-box{position:relative;width:min(720px,100%);height:48px;margin:26px auto 15px}
.brands-v2-search-box>.icon{position:absolute;z-index:2;left:17px;top:50%;width:19px;height:19px;color:#585e69;transform:translateY(-50%)}
.brands-v2-search-box input{
    width:100%;height:100%;padding:0 18px 0 49px;border:1px solid #d9dce4;border-radius:10px;background:#fff;
    color:#22252d;outline:0;font-size:12px;box-shadow:0 8px 22px rgba(15,23,42,.035);
}
.brands-v2-search-box input::placeholder{color:#8a8f99}
.brands-v2-search-box input:focus{border-color:#8d73fa;box-shadow:0 0 0 4px rgba(92,53,244,.12)}
.brands-v2-filters{display:flex;align-items:center;justify-content:center;gap:11px;flex-wrap:wrap;margin-bottom:25px}
.brands-v2-filter{
    min-width:105px;height:40px;padding:0 18px;border:1px solid #dde0e7;border-radius:8px;background:#fff;color:#464c57;
    font-size:10px;font-weight:700;transition:all .18s ease;
}
.brands-v2-filter:hover{border-color:#b7a6f7;color:#5130cf;background:#fbfaff}
.brands-v2-filter.is-active{border-color:transparent;background:linear-gradient(135deg,#4c2be9,#6f4df8);color:#fff;box-shadow:0 9px 21px rgba(82,48,228,.2)}

.brands-v2-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.brands-v2-card{
    min-width:0;height:142px;padding:17px 17px 15px;border:1px solid var(--brand-line);border-radius:12px;background:#fff;color:#171922;
    text-decoration:none;display:flex;flex-direction:column;justify-content:space-between;
    box-shadow:0 8px 22px rgba(15,23,42,.035);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.brands-v2-card:hover{transform:translateY(-4px);border-color:#c8bcfa;box-shadow:0 17px 35px rgba(57,42,126,.1)}
.brands-v2-card[hidden]{display:none!important}
.brand-logo{height:72px;display:flex;align-items:center;justify-content:center;gap:8px;overflow:hidden}
.brand-logo img{max-width:138px;max-height:58px;object-fit:contain}
.brand-logo strong{font-size:24px;line-height:1;font-weight:900;letter-spacing:-1px;white-space:nowrap}
.brand-logo-dell img{max-height:56px}.brand-logo-hp img{max-height:55px}.brand-logo-lenovo img{max-width:138px}.brand-logo-asus img{max-width:132px}.brand-logo-acer img{max-width:128px}.brand-logo-intel img{max-width:108px}.brand-logo-msi img{max-width:122px}
.brand-logo-gigabyte strong{font-size:19px;color:#111}.brand-logo-samsung strong{font-size:23px;color:#1549a6;letter-spacing:.2px}.brand-logo-kingston strong{font-family:"Montserrat",Arial,Helvetica,sans-serif;font-size:21px;color:#121212}.brand-logo-crucial strong{font-size:21px;color:#151515}.brand-logo-seagate strong{font-size:19px;color:#6dbd45;font-weight:700;letter-spacing:2px}.brand-logo-logitech strong{font-size:21px;color:#111}.brand-logo-corsair strong{font-size:19px;color:#111}.brand-logo-epson strong{font-size:21px;color:#17479e}.brand-logo-wd strong{font-size:17px;color:#1c5f9c}.brand-logo-viewsonic strong{font-size:17px;color:#32343c}.brand-logo-brother strong{font-size:21px;color:#174a9d}.brand-logo-dlink strong{font-size:21px;color:#e5232f}
.brand-logo-microsoft{gap:10px}.brand-logo-microsoft strong{font-size:16px;letter-spacing:0}.ms-symbol{display:grid;grid-template-columns:repeat(2,14px);grid-template-rows:repeat(2,14px);gap:2px}.ms-symbol i:nth-child(1){background:#f25022}.ms-symbol i:nth-child(2){background:#7fba00}.ms-symbol i:nth-child(3){background:#00a4ef}.ms-symbol i:nth-child(4){background:#ffb900}
.brand-logo-nvidia strong{font-size:18px;letter-spacing:0}.nvidia-eye{position:relative;width:34px;height:24px;border:5px solid #76b900;border-radius:55% 45% 55% 45%;transform:skew(-12deg)}.nvidia-eye::after{content:"";position:absolute;left:8px;top:3px;width:6px;height:6px;border:3px solid #76b900;border-radius:50%}
.brand-logo-amd{gap:5px}.brand-logo-amd strong{font-size:23px;letter-spacing:0}.amd-arrow{width:19px;height:19px;border-top:6px solid #20a26a;border-right:6px solid #20a26a;position:relative}.amd-arrow::before{content:"";position:absolute;right:-6px;bottom:-6px;width:12px;height:6px;background:#20a26a}.amd-arrow::after{content:"";position:absolute;left:-6px;top:6px;width:6px;height:12px;background:#20a26a}
.brand-logo-razer{color:#0b6829}.brand-logo-razer strong{font-size:19px;letter-spacing:0}.razer-mark{font-size:37px;line-height:1;transform:rotate(-20deg);font-weight:900}.brand-logo-tplink{color:#20b8c3}.brand-logo-tplink strong{font-size:19px;letter-spacing:-.5px}.tplink-mark{width:32px;height:32px;border-radius:10px 10px 50% 10px;background:#45c5cb;color:#fff;display:grid;place-items:center;font-size:20px;font-weight:900}
.brands-v2-card-bottom{display:flex;align-items:flex-end;gap:8px}
.brands-v2-card-copy{min-width:0;display:flex;flex-direction:column;gap:4px}
.brands-v2-card-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;line-height:1.1}
.brands-v2-card-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#747a85;font-size:10px;line-height:1.2}
.brands-v2-card-arrow{margin-left:auto;color:#5c35f4;font-size:20px;line-height:1}
.brands-v2-load{min-width:190px;height:42px;margin:22px auto 0;padding:0 21px;border:1px solid #9f88f3;border-radius:8px;background:#fff;color:#5834d7;display:flex;align-items:center;justify-content:center;gap:13px;font-size:10px;font-weight:700;transition:all .18s ease}
.brands-v2-load:hover{background:#faf8ff;transform:translateY(-1px)}
.brands-v2-load .icon{width:15px;height:15px;transition:transform .2s ease}
.brands-v2-load.is-open .icon{transform:rotate(180deg)}
.brands-v2-load[hidden]{display:none!important}
.brands-v2-empty{min-height:220px;border:1px dashed #cfc9e6;border-radius:12px;background:#faf9ff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.brands-v2-empty[hidden]{display:none!important}
.brands-v2-empty>.icon{width:33px;height:33px;color:#7041e7}
.brands-v2-empty h3{margin:12px 0 6px;font-size:18px}
.brands-v2-empty p{margin:0;color:#6f7481;font-size:11px}
.brands-v2-empty button{height:38px;margin-top:14px;padding:0 17px;border:0;border-radius:8px;background:#5c35f4;color:#fff;font-size:10px;font-weight:700}

/* Trust benefits */
.brands-v2-benefits{
    min-height:112px;margin-top:58px;border:1px solid var(--brand-line);border-radius:14px;background:#fff;
    display:grid;grid-template-columns:repeat(4,1fr);overflow:hidden;box-shadow:0 12px 32px rgba(15,23,42,.045);
}
.brands-v2-benefits article{padding:21px 25px;display:flex;align-items:center;gap:16px}
.brands-v2-benefits article:not(:last-child){border-right:1px solid var(--brand-line)}
.brands-v2-benefits article>span{width:54px;height:54px;border:1px solid #d8ceff;border-radius:50%;color:#5c35f4;display:grid;place-items:center;flex:0 0 auto;background:#fbfaff}
.brands-v2-benefits article>span .icon{width:28px;height:28px}
.brands-v2-benefits h3{margin:0 0 7px;font-size:11px;line-height:1.2;text-transform:uppercase;font-weight:800}
.brands-v2-benefits p{margin:0;color:#666d79;font-size:10px;line-height:1.5}

/* Help CTA */
.brands-v2-help{
    position:relative;min-height:210px;margin-top:22px;border:1px solid var(--brand-line);border-radius:16px;
    background:linear-gradient(90deg,#f7f4ff 0%,#fff 56%,#fbfaff 100%);overflow:hidden;
    display:grid;grid-template-columns:34% 46% 20%;align-items:center;box-shadow:0 12px 32px rgba(58,39,136,.055);
}
.brands-v2-help-image{align-self:stretch;overflow:hidden}
.brands-v2-help-image img{width:100%;height:100%;object-fit:cover;object-position:center;mix-blend-mode:multiply}
.brands-v2-help-copy{padding:32px 34px}
.brands-v2-help-copy>span{color:#5c35f4;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.03em}
.brands-v2-help-copy h2{margin:8px 0 10px;font-size:28px;line-height:1.12;letter-spacing:-.8px}
.brands-v2-help-copy p{margin:0;color:#626875;font-size:11px;line-height:1.65}
.brands-v2-help-copy a{width:max-content;min-height:43px;margin-top:17px;padding:0 18px;border-radius:8px;background:linear-gradient(135deg,#4c2be9,#704eff);color:#fff;text-decoration:none;display:flex;align-items:center;gap:11px;font-size:10px;font-weight:700}
.brands-v2-help-copy a .icon{width:14px;height:14px}
.brands-v2-help-mark{justify-self:center;width:86px;height:86px;border:2px solid #bba9fb;border-radius:50%;color:#7043e8;font-size:48px;font-weight:700;display:grid;place-items:center;box-shadow:0 0 0 22px rgba(126,83,234,.035)}

.brands-footer{margin-top:0}
.floating-whatsapp{position:fixed;z-index:60;right:26px;bottom:26px;width:54px;height:54px;border-radius:50%;background:#16bd4a;color:#fff;display:grid;place-items:center;text-decoration:none;box-shadow:0 14px 32px rgba(22,189,74,.35);transition:transform .18s ease}
.floating-whatsapp:hover{transform:translateY(-3px)}
.floating-whatsapp .icon{width:29px;height:29px}

@media (max-width:1280px){
    .brands-v2-hero-copy{padding-left:38px}
    .brands-v2-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
    .brands-v2-help-copy h2{font-size:25px}
}

@media (max-width:980px){
    .brands-main{padding-bottom:48px}
    .brands-v2-hero{height:500px}
    .brands-v2-hero-inner{grid-template-columns:1fr}
    .brands-v2-hero-copy{padding:38px 32px 250px}
    .brands-v2-hero-copy h1{font-size:42px}
    .brands-v2-hero-art{right:-20px;width:82%;height:275px}
    .brands-v2-hero::after{background:linear-gradient(180deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.92) 49%,rgba(255,255,255,.08) 78%,rgba(255,255,255,0) 100%)}
    .brands-v2-directory{padding-top:48px}
    .brands-v2-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
    .brands-v2-benefits{grid-template-columns:repeat(2,1fr)}
    .brands-v2-benefits article:nth-child(2){border-right:0}
    .brands-v2-benefits article:nth-child(-n+2){border-bottom:1px solid var(--brand-line)}
    .brands-v2-help{grid-template-columns:38% 62%}
    .brands-v2-help-mark{display:none}
}

@media (max-width:680px){
    .brands-v2-hero{height:520px;margin-top:12px}
    .brands-v2-hero-copy{padding:30px 22px 250px}
    .brands-breadcrumb{margin-bottom:18px}
    .brands-v2-hero-copy h1{font-size:35px;letter-spacing:-1.1px}
    .brands-v2-hero-copy p{font-size:11px;line-height:1.65}
    .brands-v2-hero-art{right:-60px;width:118%;height:250px}
    .brands-v2-primary{min-height:43px}
    .brands-v2-directory{padding-top:42px}
    .brands-v2-section-heading h2{font-size:27px}
    .brands-v2-section-heading p{font-size:11px}
    .brands-v2-section-heading p br{display:none}
    .brands-v2-search-box{height:46px;margin-top:21px}
    .brands-v2-filters{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;margin-bottom:19px}
    .brands-v2-filter{flex:0 0 auto}
    .brands-v2-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
    .brands-v2-card{height:130px;padding:14px}
    .brand-logo{height:64px}
    .brand-logo img{max-width:112px;max-height:48px}
    .brand-logo strong{font-size:20px}
    .brands-v2-card-copy strong{font-size:11px}
    .brands-v2-benefits{grid-template-columns:1fr;margin-top:44px}
    .brands-v2-benefits article{border-right:0!important;border-bottom:1px solid var(--brand-line)}
    .brands-v2-benefits article:last-child{border-bottom:0}
    .brands-v2-help{grid-template-columns:1fr;min-height:auto;margin-top:18px}
    .brands-v2-help-image{height:150px}
    .brands-v2-help-copy{padding:25px 22px 28px}
    .brands-v2-help-copy h2{font-size:23px}
    .floating-whatsapp{right:18px;bottom:18px}
}

@media (max-width:390px){
    .brands-v2-hero-copy h1{font-size:31px}
    .brands-v2-card{padding-inline:11px}
    .brands-v2-card-copy small{font-size:10px}
}

/* Brand cards: four-column desktop layout with slightly taller, consistent cards */
.brands-v2-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:16px;
}
.brands-v2-card{
    height:190px;
    padding:18px 18px 15px;
    align-items:stretch;
    justify-content:flex-start;
    border-color:#dfd8f8;
    background:linear-gradient(145deg,#fff 0%,#fdfcff 100%);
    box-shadow:0 9px 24px rgba(70,49,142,.045);
}
.brands-v2-card:hover{
    transform:translateY(-4px);
    border-color:#a994f4;
    box-shadow:0 18px 36px rgba(57,42,126,.11);
}
.brand-logo{
    height:58px;
    justify-content:flex-start;
    overflow:visible;
}
.brand-logo img{max-width:138px;max-height:48px}
.brand-logo-dell img{max-height:45px}
.brand-logo-hp img{max-height:45px}
.brand-logo-lenovo img{max-width:132px}
.brand-logo-asus img{max-width:122px}
.brand-logo-acer img{max-width:118px}
.brand-logo-intel img{max-width:100px}
.brand-logo-msi img{max-width:116px}
.brand-logo strong{font-size:22px}
.brands-v2-card-content{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:6px;
    margin-top:6px;
}
.brands-v2-card-content strong{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:13px;
    line-height:1.15;
}
.brands-v2-card-content small{
    min-height:32px;
    overflow:hidden;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    color:#646b78;
    font-size:10px;
    line-height:1.5;
}
.brands-v2-card-button{
    width:100%;
    height:32px;
    margin-top:auto;
    border:1px solid #a88ff4;
    border-radius:7px;
    color:#5b35df;
    background:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:10px;
    font-weight:700;
    transition:background-color .18s ease,color .18s ease,border-color .18s ease;
}
.brands-v2-card:hover .brands-v2-card-button{
    background:#6340e8;
    border-color:#6340e8;
    color:#fff;
}

@media (max-width:980px){
    .brands-v2-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
    .brands-v2-card{height:184px}
}

@media (max-width:680px){
    .brands-v2-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
    .brands-v2-card{height:170px;padding:14px}
    .brand-logo{height:49px}
    .brand-logo img{max-width:108px;max-height:40px}
    .brand-logo strong{font-size:19px}
    .brands-v2-card-content{margin-top:4px}
    .brands-v2-card-content small{min-height:27px;font-size:10px}
    .brands-v2-card-button{height:29px;font-size:10px}
}



/* Compact brand directory — authoritative final sizing */
.brands-v2-directory{margin-top:58px}
.brands-v2-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    align-items:stretch;
    gap:18px;
}
.brands-v2-card{
    height:176px;
    min-height:176px;
    padding:14px 15px;
    border:1px solid #e4e0ee;
    border-radius:24px;
    background:#fff;
    box-shadow:0 5px 16px rgba(32,24,74,.045);
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    text-decoration:none;
    overflow:hidden;
    transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.brands-v2-card:hover{
    transform:translateY(-3px);
    border-color:#cfc2f8;
    box-shadow:0 10px 24px rgba(54,37,124,.08);
}
.brand-logo{
    width:100%;
    height:64px;
    min-height:64px;
    max-height:64px;
    padding:4px 2px 8px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
}
.brand-logo img{
    display:block;
    width:auto;
    height:auto;
    max-width:172px;
    max-height:54px;
    object-fit:contain;
    object-position:center;
}
.brand-logo strong{
    max-width:100%;
    font-size:22px;
    line-height:1;
    text-align:center;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.brands-v2-card-content{
    min-width:0;
    margin:0;
    display:flex;
    flex-direction:column;
    gap:4px;
    text-align:left;
}
.brands-v2-card-content strong{
    font-size:12.5px;
    line-height:1.2;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.brands-v2-card-content small{
    min-height:27px;
    color:#6c7180;
    font-size:10px;
    line-height:1.45;
    overflow:hidden;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
}
.brands-v2-card-button{
    width:max-content;
    max-width:100%;
    min-width:0;
    height:29px;
    margin-top:auto;
    padding:0 13px;
    border:1px solid #a893ee;
    border-radius:999px;
    background:transparent;
    color:#5d38d5;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:10px;
    font-weight:700;
    transition:background-color .18s ease,color .18s ease,border-color .18s ease;
}
.brands-v2-card:hover .brands-v2-card-button{
    background:#f6f3ff;
    border-color:#7958e8;
    color:#4e2bc8;
}

@media (max-width:1180px){
    .brands-v2-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:760px){
    .brands-v2-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
    .brands-v2-card{height:170px;min-height:170px;padding:13px 14px;border-radius:20px}
    .brand-logo{height:64px;min-height:64px;max-height:64px}
    .brand-logo img{max-width:142px;max-height:50px}
    .brand-logo strong{font-size:19px}
}
@media (max-width:430px){
    .brands-v2-grid{grid-template-columns:1fr}
    .brands-v2-card{height:166px;min-height:166px}
}

/* LASTO typography — Brands Page final active rules */
.brands-page{font-family:"Montserrat",Arial,Helvetica,sans-serif}
.brands-v2-hero-copy h1{font-size:var(--font-page-title);font-weight:800;line-height:1.1}
.brands-v2-hero-copy p{font-size:14px;line-height:1.65}
.brands-v2-section-heading h2{font-size:var(--font-section-title);font-weight:800;line-height:1.2}
.brands-v2-section-heading p{font-size:13px;line-height:1.6}
.brands-v2-breadcrumb,.brands-breadcrumb{font-size:11.5px;line-height:1.5}
.brands-v2-search-box input,.brands-v2-search input{font-size:13px}
.brands-v2-filter-button,.brands-v2-filter{font-size:11.5px;font-weight:700}
.brands-v2-card{height:205px;min-height:205px}
.brand-logo{height:76px;min-height:76px;max-height:76px}
.brand-logo img{max-width:180px;max-height:62px;object-fit:contain}
.brands-v2-card-content{gap:5px}
.brands-v2-card-content strong{font-size:15px;font-weight:700;line-height:1.3}
.brands-v2-card-content small,.brands-v2-card-content p{min-height:35px;font-size:11.5px;line-height:1.5;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.brands-v2-card-button{min-height:36px;height:36px;margin-top:auto;padding-inline:15px;font-size:11px;font-weight:700}
.brands-v2-load,.brands-v2-empty button,.brands-v2-help-copy a{font-size:11.5px;font-weight:700}
.brands-v2-benefits h3{font-size:13px;font-weight:800}
.brands-v2-benefits p,.brands-v2-help-copy p{font-size:12px;line-height:1.6}
.brands-v2-help-copy>span{font-size:10.5px;font-weight:800}
@media (max-width:760px){
    .brands-v2-card{height:202px;min-height:202px}
    .brands-v2-card-content strong{font-size:14px}
    .brands-v2-card-content small,.brands-v2-card-content p{font-size:11.5px}
    .brands-v2-card-button{min-height:36px;height:36px;font-size:11px}
}
@media (max-width:430px){
    .brands-v2-card{height:198px;min-height:198px}
}



/* Requested internal banner sizing; hero CTA removal leaves no blank gap. */
.brands-v2-hero{height:clamp(240px,18vw,320px);margin-top:20px;border-radius:18px;overflow:hidden}
.brands-v2-hero-copy{padding-top:28px;padding-bottom:28px}
.brands-v2-hero-copy p{margin-bottom:0}
@media (max-width:768px){
    .brands-v2-hero{height:auto;min-height:500px}
}

/* Stack the internal Brands hero on tablet/mobile so text never overlays the artwork. */
@media (max-width:768px){
    .brands-v2-hero{height:auto;min-height:500px}
    .brands-v2-hero-inner{height:auto;min-height:500px;display:flex;flex-direction:column;align-items:stretch}
    .brands-v2-hero-copy{width:100%;padding:28px 22px 22px}
    .brands-v2-hero-copy h1{font-size:clamp(30px,9vw,38px);line-height:1.08}
    .brands-v2-hero-copy p{font-size:12px;line-height:1.6}
    .brands-v2-hero-art{position:relative;right:auto;bottom:auto;width:100%;height:240px;min-height:240px;margin-top:auto}
    .brands-v2-hero-art img{object-position:center}
    .brands-v2-hero::after{background:linear-gradient(180deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.93) 48%,rgba(255,255,255,.08) 72%,rgba(255,255,255,0) 100%)}
}

/* Compact desktop Brands hero copy so every text line remains inside the internal banner. */
@media (min-width:769px){
    .brands-v2-hero-inner{grid-template-columns:56% 44%}
    .brands-v2-hero-copy{height:100%;min-height:0;box-sizing:border-box;padding:14px 0 14px 40px;display:flex;flex-direction:column;justify-content:center}
    .brands-breadcrumb{margin-bottom:9px}
    .brands-v2-hero-copy h1{max-width:660px;font-size:clamp(34px,2.35vw,44px);line-height:1.02;letter-spacing:-1.35px}
    .brands-title-line{margin-top:8px}
    .brands-v2-hero-copy p{max-width:610px;margin-top:8px;font-size:12px;line-height:1.5}
    .brands-v2-hero-art{width:55%}
}
@media (min-width:769px) and (max-width:1100px){
    .brands-v2-hero-copy{padding-left:28px}
    .brands-v2-hero-copy h1{font-size:30px;letter-spacing:-1px}
}

/* =========================================================
   BRAND DIRECTORY CARDS — TALLER + NARROWER
   Authoritative final override
   ========================================================= */

/* Keep four cards per row, but use a narrower centred grid. */
.brands-v2-grid {
    width: min(1160px, 100%);
    margin-inline: auto;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
}

.brands-v2-card {
    height: 250px;
    min-height: 250px;
    padding: 22px 20px 20px;
    border-radius: 24px;
}

.brand-logo {
    height: 88px;
    min-height: 88px;
    max-height: 88px;
    padding: 4px 4px 12px;
}

.brand-logo img {
    max-width: 170px;
    max-height: 66px;
}

.brands-v2-card-content {
    gap: 7px;
}

.brands-v2-card-content strong {
    font-size: 15px;
    line-height: 1.3;
}

.brands-v2-card-content small,
.brands-v2-card-content p {
    min-height: 42px;
    font-size: 11.5px;
    line-height: 1.55;
}

.brands-v2-card-button {
    min-height: 38px;
    height: 38px;
    padding-inline: 16px;
}

@media (max-width: 1180px) {
    .brands-v2-grid {
        width: 100%;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 18px;
    }

    .brands-v2-card {
        height: 238px;
        min-height: 238px;
    }
}

@media (max-width: 760px) {
    .brands-v2-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }

    .brands-v2-card {
        height: 220px;
        min-height: 220px;
        padding: 18px 16px 16px;
        border-radius: 20px;
    }

    .brand-logo {
        height: 74px;
        min-height: 74px;
        max-height: 74px;
    }

    .brand-logo img {
        max-width: 138px;
        max-height: 54px;
    }
}

@media (max-width: 430px) {
    .brands-v2-grid {
        grid-template-columns: 1fr;
    }

    .brands-v2-card {
        width: min(320px, 100%);
        height: 216px;
        min-height: 216px;
        margin-inline: auto;
    }
}