/* GB Tyres: lighter surfaces, the existing navy identity, and clear cyan actions.
 * Load after site.css, catalogue.css and tyre-pages.css. Homepage selectors use
 * one extra class because its original stylesheet is embedded in front-page.php.
 * No structural, imagery, video, or interaction changes are made here.
 */
:root{
  --ink-3:#52626b;
  --gbt-refresh-ink:#24343d;
  --gbt-refresh-navy:#123b52;
  --gbt-refresh-muted:#52626b;
  --gbt-refresh-cyan:#00a9d5;
  --gbt-refresh-link:#006782;
  --gbt-refresh-line:#dce4e7;
  --gbt-refresh-paper:#f7f7f3;
  --gbt-refresh-mist:#edf7f8;
}

/* Shared chrome: navy stays in the masthead; its surrounding areas breathe. */
.utility{background:#f3f5f3;color:#52626b;border-bottom-color:#e1e7e5}
.utility a,.utility strong{color:#344b57}
.utility a:hover{color:#006782}
.pagehead{background:linear-gradient(110deg,#f7f7f3 0%,#f2f8f8 100%);border-bottom-color:var(--gbt-refresh-line)}
.pagehead h1{color:var(--gbt-refresh-navy)}
.pagehead .lede{color:var(--gbt-refresh-muted)}
.pagehead .crumbs,.pagehead .crumbs a{color:#596a73}
.pagehead .crumbs a:hover{color:var(--gbt-refresh-link)}
.pagehead .eyebrow{color:var(--gbt-refresh-link)}
main section.band.paper{background:var(--gbt-refresh-paper)}
main section.band.dark{background:linear-gradient(115deg,#edf7f8,#f5f8f5);color:var(--gbt-refresh-ink);border-block:1px solid #dfe9e8}
main section.band.dark :is(h2,h3,h4){color:var(--gbt-refresh-navy)}
main section.band.dark p,main section.band.dark .band-head p{color:var(--gbt-refresh-muted)}
main section.band.dark .eyebrow.on-dark{color:var(--gbt-refresh-link)}
main section.band.dark .btn-onDark{background:#fff;color:var(--gbt-refresh-navy);border-color:#a8c3cc}
main section.band.dark .btn-onDark:hover{background:#def2f5;color:var(--gbt-refresh-navy);border-color:#3d8b9f}
main section.band.dark .card,main section.band.dark .proof-item{background:#fff;color:var(--gbt-refresh-ink);border-color:var(--gbt-refresh-line)}
main section.band.dark .card p,main section.band.dark .proof-label{color:var(--gbt-refresh-muted)}
main section.band.dark .proof{background:#fff;border-color:#d1e0e4}
main section.band.dark .card-more{color:var(--gbt-refresh-link)}
main section.band.dark .contact-strip{border-color:#cbdde2}
main section.band.dark .cs-label,main section.band.dark .cs-big{color:var(--gbt-refresh-navy)}
main section.band.dark .cs-sub,main section.band.dark .cs-sub a{color:var(--gbt-refresh-muted)}
main section.band.dark a.cs-big:hover,main section.band.dark .cs-sub a:hover{color:var(--gbt-refresh-link)}
.page-cols .aside-cta{background:#f1f8f7;border-color:#cbdfe0}
.page-cols .aside-talk{background:#f8f8f4}
.page-cols .aside-box h4,.page-cols .aside-talk .aside-hours{color:#52626b}
.page-cols .aside-box .btn-primary{color:#052d43}
.page-cols .aside-box .btn-primary:hover{background:#32c9ec;color:#052d43;border-color:#32c9ec}
footer.site{background:#f2f4f1;color:#52626b;border-top:1px solid #dce5e2}
footer.site h4{color:var(--gbt-refresh-navy)}
footer.site a{color:#425961}
footer.site a:hover{color:#006782;text-decoration:underline;text-underline-offset:4px}
footer.site .footer-base{color:#596a70;border-color:#d0dddc}

/* The catalogue uses neutral product cards and a clear, gentle detail action. */
.gbt-brand-directory .prose{font-size:16px;line-height:1.65}
.gbt-brand-directory h2.sec{font-size:clamp(24px,2.5vw,30px)}
.gbt-brand-directory h3{font-size:18px}
main .brandwall{gap:14px}
main .brandtile,main .gbt-brand-feature-head{position:relative;display:flex;flex-direction:column;box-sizing:border-box;min-width:0;min-height:184px;padding:16px 12px 12px;align-items:center;justify-content:flex-end;gap:3px;text-align:center;border-radius:8px;background:#fff}
main .brandtile-logo{position:absolute;inset-inline:14px;top:50%;height:56px;transform:translateY(-50%);display:flex;align-items:center;justify-content:center}
main .brandtile-logo img{display:block;width:auto;height:auto;max-width:100%;max-height:56px;object-fit:contain;object-position:center}
main .brandtile-logo--padded{overflow:hidden}
main .brandtile-logo--padded img{width:100%;max-height:none}
main .brandtile-logo--inverse{background:#25323c;border-radius:3px;padding:10px}
main .brandtile-name,main .gbt-brand-feature h3.brandtile-name{margin:0;font-size:13px;line-height:1.35;letter-spacing:0;font-weight:600;color:var(--gbt-refresh-navy)}
main .brandtile-role{display:block;min-height:27px;font-size:10px;line-height:1.35;letter-spacing:.025em;color:var(--gbt-refresh-muted)}
main .brandtile.exclusive{border-color:#bfdce3;background:#fff}
main .brandtile.exclusive .brandtile-role{color:var(--gbt-refresh-link)}
main .brandtile:hover{border-color:#32869c;box-shadow:0 4px 16px #123b520d}
main .brandtile:focus-visible{outline:3px solid #00748e;outline-offset:3px}
@media(max-width:480px){main .brandwall{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}main .brandtile{min-height:184px;padding-inline:10px}main .brandtile-logo{inset-inline:12px}main .brandtile-name,main .gbt-brand-feature h3.brandtile-name{margin:0;font-size:12px}}

/* Keep the same name baseline when a featured logo has no role caption. */
main .brandtile-name:last-child{margin-bottom:27px}
main .brandtile[hidden]{display:none!important}
main .gbt-brand-feature-head{border:1px solid var(--gbt-refresh-line);margin-bottom:14px;width:100%}

.cat-wrap .shop-card{border-color:#dce5e5;border-radius:9px}
.cat-wrap .shop-card:hover{border-color:#8ebcc9;box-shadow:0 8px 24px #1741520d}
.cat-wrap .shop-img{background:#f6f8f5}
.cat-wrap .shop-img.has-photo{background:#fff}
.cat-wrap .shop-use,.cat-wrap .shop-sec{color:var(--gbt-refresh-muted)}
.cat-wrap .shop-foot .shop-details{background:#eff8f9;color:#123b52;border-color:#b7d4dd}
.cat-wrap .shop-foot .shop-details:hover{background:#d8f0f4;color:#123b52;border-color:#3d8b9f}

/* Homepage: a light introduction keeps the tyre itself at the centre. */
.gbx{
  --ink:var(--gbt-refresh-navy);
  --muted:var(--gbt-refresh-muted);
  --line:var(--gbt-refresh-line);
  color:var(--gbt-refresh-ink);
}
.gbx .gbx-hero{
  background:linear-gradient(115deg,#fbfcfa 4%,#f0f8f8 58%,#e3f3f6 100%);
  color:var(--gbt-refresh-ink);
  border-bottom:1px solid var(--gbt-refresh-line);
}
.gbx .gbx-hero h1{color:var(--gbt-refresh-navy)}
.gbx .gbx-hero h1 em{color:#00748e}
.gbx .gbx-hero .gbx-kicker{color:var(--gbt-refresh-link)}
.gbx .gbx-hero .gbx-lede{color:var(--gbt-refresh-muted)}
.gbx .gbx-hero .gbx-btn.outline{
  color:var(--gbt-refresh-navy);
  border-color:#9cb9c5;
  background:#ffffffb3;
}
.gbx .gbx-hero-meta{color:var(--gbt-refresh-muted);border-color:#cbdde3}
.gbx .gbx-hero-meta strong{color:var(--gbt-refresh-navy)}
.gbx .gbx-scene:after{background:#24465325;filter:blur(22px)}
.gbx .gbx-fallback{box-shadow:0 12px 40px #1b485210;filter:drop-shadow(5px 12px 10px #16344220)}
.gbx .gbx-model-identity{color:var(--gbt-refresh-navy)}
.gbx .gbx-model-identity a{color:var(--gbt-refresh-link);border-color:#aacbd4}
.gbx .gbx-model-tag{color:#436372}
/* These three inherited declarations are already !important in landing.css. */
.gbx .gbx-explorer-note,.gbx .gbx-model-disclaimer{color:var(--gbt-refresh-muted)!important}
.gbx .gbx-feature-instruction{color:var(--gbt-refresh-navy)!important}
.gbx .gbx-feature-instruction span{color:var(--gbt-refresh-muted)}
.gbx .gbx-tabs{background:#ffffff8c;border-color:#c5dce3}
.gbx .gbx-tabs button{color:#38535f}
.gbx .gbx-tabs button[aria-selected=true]{background:#cdeff5;color:#123b52;box-shadow:0 1px 3px #1f52611a}
.gbx .gbx-selection p{color:var(--gbt-refresh-muted)}
.gbx .gbx-selection a{color:var(--gbt-refresh-link)}
.gbx .gbx-feature-explore{border-color:#cbdde3}
.gbx .gbx-feature-explore .gbx-feature-button{background:#fff;border-color:#bed4dd;color:#294956}
.gbx .gbx-feature-explore .gbx-feature-button:hover,.gbx .gbx-feature-explore .gbx-feature-button[aria-pressed=true]{background:#dcf2f5;border-color:#2085a0;color:#123b52}
.gbx .gbx-feature-number{border-color:#4a93a6;background:#f1fbfc;color:#006782}
.gbx [data-feature-panel]{background:#fff;border-color:#b5d1da;box-shadow:0 7px 20px #1b485208}
.gbx .gbx-model-tools button,.gbx .gbx-view-switch button{background:#fff;color:#294956;border-color:#a8c6d2}
.gbx .gbx-model-tools button:hover,.gbx .gbx-model-tools button[aria-pressed=true],.gbx .gbx-view-switch button[aria-pressed=true]{background:#d8f1f5;color:#123b52;border-color:#2085a0}

/* Alternate neutral and tinted areas instead of repeating dark blue bands. */
.gbx .gbx-searchband{background:#fff}
.gbx .gbx-brands{background:var(--gbt-refresh-paper)}
.gbx .gbx-depots{background:#f5f8f7}
.gbx .gbx-final{background:linear-gradient(110deg,#fff 0%,#f0f9f9 100%)}
.gbx .gbx-operations{background:var(--gbt-refresh-paper);color:var(--gbt-refresh-ink);border-block:1px solid #e3e7e5}
.gbx .gbx-op-copy .gbx-kicker{color:var(--gbt-refresh-link)}
.gbx .gbx-op-copy h2,.gbx .gbx-op-points strong{color:var(--gbt-refresh-navy)}
.gbx .gbx-op-copy p,.gbx .gbx-op-points span{color:var(--gbt-refresh-muted)}
.gbx .gbx-op-points li{border-color:#d5dfdf}
.gbx .gbx-op-copy .gbx-btn.light{background:var(--gbt-refresh-cyan);color:#052d43}
.gbx .gbx-op-copy .gbx-btn.light:hover{background:#32c9ec}
.gbx .calc .calc-head{background:#edf5f6;border-bottom:1px solid #d7e6e8}
.gbx .calc .calc-head h3{color:var(--gbt-refresh-navy)}
.gbx .calc .calc-head .pill{background:#d5ebee;color:#315766}
.gbx .gbx-brandfilters button[aria-pressed=true],.gbx .gbx-size-demo button[aria-pressed=true],.gbx .gbx-depot-buttons button[aria-pressed=true]{background:#d8f0f4;border-color:#32869c;color:#123b52}

/* Calculator results share one light surface on the homepage, tools and guides.
 * Set both halves of each colour pair: the original dark output rules and the
 * general table striping must not leave pale text on a pale cell background.
 * Extra homepage specificity also wins against its later embedded stylesheet.
 */
.calc .calc-head .pill{color:#eaf2f7}
:is(.calc,.gbx .calc) .calc-out{background:#f3f8fb;color:var(--gbt-refresh-ink);border-top-color:#cbdde3}
:is(.calc,.gbx .calc) .calc-out .out-label{color:var(--gbt-refresh-muted)}
:is(.calc,.gbx .calc) .calc-out .out-value{color:var(--gbt-refresh-navy);overflow-wrap:anywhere}
:is(.calc,.gbx .calc) .calc-out .out-detail,
:is(.calc,.gbx .calc) .calc-out .out-detail p{color:var(--gbt-refresh-muted)}
:is(.calc,.gbx .calc) .calc-out .out-detail strong{color:var(--gbt-refresh-navy)}
:is(.calc,.gbx .calc) .calc-out a{color:var(--gbt-refresh-link);text-decoration:underline;text-underline-offset:3px}
:is(.calc,.gbx .calc) .calc-out table{background:transparent;width:100%}
:is(.calc,.gbx .calc) .calc-out tr,
:is(.calc,.gbx .calc) .calc-out tr:hover{background:transparent}
:is(.calc,.gbx .calc) .calc-out th,
:is(.calc,.gbx .calc) .calc-out td{background:transparent;border-bottom-color:#cbdde3;padding:9px 8px;white-space:normal}
:is(.calc,.gbx .calc) .calc-out th{color:var(--gbt-refresh-navy)}
:is(.calc,.gbx .calc) .calc-out td{color:var(--gbt-refresh-ink)}
:is(.calc,.gbx .calc) .calc-out tbody tr:nth-child(even) :is(th,td){background:#fff}

/* Match the contact/account form action to the readable cyan site buttons. */
.formblock :is(.wpcf7,.gform_wrapper) :is(input[type=submit],button[type=submit]){background:#00aadb;color:#052d43}
.formblock :is(.wpcf7,.gform_wrapper) :is(input[type=submit],button[type=submit]):hover{background:#32c9ec;color:#052d43}

/* Product pages: let the photograph and specifications carry the page. */
.tp-main{color:var(--gbt-refresh-ink)}
.tp-main .tp-product-hero{background:linear-gradient(120deg,#f8f8f4 0%,#fff 62%,#edf7f8 100%);border-color:var(--gbt-refresh-line)}
.tp-main .tp-directory-head{background:var(--gbt-refresh-paper);border-color:var(--gbt-refresh-line)}
.tp-main .tp-intro,.tp-main .tp-feature-card p{color:var(--gbt-refresh-muted)}
.tp-main .tp-card-brand{color:var(--gbt-refresh-link)}
.tp-main .tp-feature-card{background:#f8f9f6;border-color:#e1e7e4}
.tp-main .tp-variant-form{background:#f5f7f6;border-color:#dce5e5}
.tp-main .tp-card-image{background:#f8f9f6;border-color:#e7ebe8}
.tp-main .tp-enquiry-strip{background:#edf7f8}
.tp-main .tp-table-scroll thead{background:#e9f1f3;color:var(--gbt-refresh-navy)}
.tp-main .tp-table-scroll thead th{background:#e9f1f3;color:var(--gbt-refresh-navy);border-color:#c9dde4}
.tp-main :is(button,a).btn-primary{background:var(--gbt-refresh-cyan);color:#052d43;border-color:var(--gbt-refresh-cyan)}
.tp-main :is(button,a).btn-primary:hover{background:#32c9ec;color:#052d43;border-color:#32c9ec}
.tp-main .tp-pagination a[aria-current]{background:#d8f0f4;color:#123b52;border-color:#32869c}

@media print{
  .gbx .gbx-hero,.gbx .gbx-operations,.tp-main .tp-product-hero,.tp-main .tp-directory-head{background:#fff}
}

/* Homepage brand carousel uses the shared brand tile presentation. */
.gbx .gbt-brand-carousel .gbt-carousel-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;margin-bottom:20px}
.gbx .gbt-brand-carousel .gbx-brandfilters{margin:0}
.gbx .gbt-carousel-controls{display:flex;align-items:center;gap:9px;margin-left:auto}
.gbx .gbt-carousel-status{min-width:136px;margin-right:8px;color:var(--gbt-refresh-muted);font-size:13px;text-align:right;font-variant-numeric:tabular-nums}
.gbx .gbt-carousel-arrow{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;padding:0;border:1px solid #a8c6d2;border-radius:50%;background:#fff;color:var(--gbt-refresh-navy);font-size:22px;line-height:1}
.gbx .gbt-carousel-arrow:hover:not(:disabled){background:#d8f0f4;border-color:#32869c}
.gbx .gbt-carousel-arrow:disabled{opacity:.35;cursor:default}
.gbx .gbt-brand-track{position:relative;display:grid;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:calc((100% - 56px)/5);gap:14px;align-items:stretch;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:8px;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#a8c6d2 transparent;padding:8px;margin:-8px}
.gbx .gbt-brand-track>.brandtile{scroll-snap-align:start;min-width:0;min-height:184px;text-decoration:none}
.gbx .gbt-brand-track>.brandtile[hidden],.gbx [data-carousel-controls][hidden]{display:none!important}
.gbx .gbt-brand-track:focus-visible{outline:2px solid #00748e;outline-offset:4px;border-radius:8px}
.gbx .gbt-brand-carousel .gbx-brandnote{margin-top:20px}
@media(max-width:1000px){.gbx .gbt-brand-track{grid-auto-columns:calc((100% - 28px)/3)}}
@media(max-width:740px){.gbx .gbt-brand-track{grid-auto-columns:calc((100% - 14px)/2)}.gbx .gbt-carousel-toolbar{gap:16px}.gbx .gbt-carousel-controls{width:100%;justify-content:flex-end}.gbx .gbt-carousel-status{margin-right:auto;text-align:left}}

/* Continuous loops hide the scrollbar seam and retain native touch scrolling. */
.gbx .gbt-brand-track.is-circulating{scroll-snap-type:none;scroll-behavior:auto;overflow-anchor:none;scrollbar-width:none}
.gbx .gbt-brand-track.is-circulating::-webkit-scrollbar{display:none}
.gbx .gbt-carousel-toggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;min-width:94px;padding:8px 13px;border:1px solid #a8c6d2;border-radius:24px;background:#fff;color:var(--gbt-refresh-navy);font-size:13px;line-height:1.3}
.gbx .gbt-carousel-toggle:hover{background:#d8f0f4;border-color:#32869c}
.gbx .gbt-carousel-toggle[aria-pressed=true]{background:#d8f0f4;border-color:#32869c}
@media(max-width:740px){.gbx .gbt-carousel-controls{flex-wrap:wrap}.gbx .gbt-carousel-status{flex-basis:100%;min-width:0}}