/* Customer-facing polish. The catalogue, prices and checkout remain the source of truth. */
:root{--rhino-header-height:156px;--rhino-accent:#800000;--rhino-shadow:0 12px 32px #231a1710;--rhino-ease:cubic-bezier(.2,.75,.25,1)}
html{scroll-padding-top:calc(var(--rhino-header-height) + 16px)}
#vehicle-finder,#catalogue,#tyre-size-finder,#tyre-filter-panel,#wheel-vehicle-finder,#package-finder,#package-results,#contact,#services,#gallery,#tyre-tools-services,#tyre-product-spotlight,#tyre-our-brands,#popular-wheels,#calliper-painting,#suspension-quote{scroll-margin-top:16px}
.header{transition:box-shadow .22s ease}
html[data-rhino-scrolled] .header{box-shadow:0 7px 24px #19191912}
.header #main-nav a[aria-current="page"]{color:var(--rhino-accent)}
:where(.button,.finder-search,.service-learn,.alignment-offer-link,.header-cart,.header .menu-button,.chosen-tyre-size button,.selected-vehicle .change-vehicle){transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease}
:is(.button.primary,.finder-search,.service-learn){background-color:var(--rhino-accent)}
:is(.button.primary,.finder-search,.service-learn):hover:not(:disabled){background-color:#610000;box-shadow:0 5px 15px #8000001c}
:where(.button,.finder-search,.service-learn):active:not(:disabled){transform:translateY(1px)}
:where(a,button,input,select,textarea,summary):focus-visible{outline:3px solid #a20c18;outline-offset:4px}
.search-hub{background:linear-gradient(180deg,#fff 0%,#fcfbf9 100%)}
.search-hub-intro h2{font-size:clamp(24px,2.35vw,32px);letter-spacing:-.8px;line-height:1.2}
.search-card{background:#fff;border:1px solid #dedbd6;border-radius:8px;padding:20px;box-shadow:0 3px 12px #241c1704}
.search-card>h3{margin:-20px -20px 20px;padding:17px 15px;border-radius:7px 7px 0 0;background:#242426;letter-spacing:1.2px;font-size:14px}
.search-card .search-field select{min-height:46px;border-color:#aaa59e;font-size:14px}
.search-card .finder-tabs{gap:4px;border-bottom-color:var(--rhino-accent)}
.search-card .finder-tabs button{min-height:44px;font-size:13px;padding:10px 16px}
.search-card .finder-tabs button[aria-selected="true"]{background:var(--rhino-accent)}
.search-card .finder-search{min-height:48px;font-size:14px;letter-spacing:.4px;border-radius:4px}
.search-card .finder-search:disabled{background:#e8e5e1;color:#58534e;opacity:1;box-shadow:none}
.finder-range-note{font-size:14px;max-width:1000px}
.tyre-size-card,.wheel-vehicle-card{box-shadow:var(--rhino-shadow);border-radius:9px}
.tyre-size-card .tyre-finder-tabs button,.wheel-vehicle-card .button{transition:background-color .18s ease,box-shadow .18s ease}
.tyre-size-help,.wheel-vehicle-help{border-color:#ded7cf;background:#eeeae5;border-radius:9px}
.tyre-size-status,.wheel-vehicle-status{line-height:1.6}
.tyre-size-card select:focus,.wheel-vehicle-card select:focus,.search-card select:focus{border-color:#800000}
.product-card,.popular-wheel-card{border-color:#ded8d1;border-radius:8px;transition:border-color .2s ease,box-shadow .2s ease,transform .2s var(--rhino-ease)}
.product-card:focus-within,.popular-wheel-card:focus-within{border-color:#af6d6d;box-shadow:0 0 0 1px #af6d6d}
.product-grid .product-card .product-bottom button{min-height:44px}
.product-grid .product-card .product-bottom .add-to-cart{font-size:14px}
.product-grid .product-card .product-bottom .badge{line-height:1.5}
.empty-state{border-color:#cfc4bb;background:#f0ece6;padding:38px 24px}
.empty-state p{font-size:14px;line-height:1.7;max-width:460px}
.workshop-card{background:#fff;border:1px solid #dedbd6;border-radius:9px;overflow:hidden;box-shadow:0 4px 15px #22181105;transition:border-color .2s ease,box-shadow .2s ease,transform .2s var(--rhino-ease)}
.workshop-card h3{margin:19px 20px 12px;padding-bottom:13px}
.workshop-card p{margin:0 20px 20px}
.workshop-card .service-learn{margin:0 20px 22px;border-radius:4px}
.workshop-card>img{aspect-ratio:3/2}
.review-card{border-color:#d9d4ce;box-shadow:0 3px 16px #21180e04}
.reviews-summary,.reviews-source-note{color:#615d58}
.contact h2{font-size:clamp(34px,4vw,49px)}
.contact>div>div>p{font-size:15px;color:#d1cec7}
.contact-card h3{font-size:24px}
.contact-card p{font-size:14px;color:#d1cec7}
.contact-card a{font-size:15px;min-height:44px}
.contact-card{background:#ffffff04;border-color:#64645e}
.policy-links{color:#c9c5bd}
.staff-signin-link{color:#b5b0a8}
.footer-inner>span{font-size:12px;color:#bbb7ad}
.footer-inner>button{font-size:12px;color:#bbb7ad;min-height:44px}
.public-contact{bottom:calc(22px + env(safe-area-inset-bottom))}
.rp-launcher{bottom:calc(142px + env(safe-area-inset-bottom))}
/* A compact help dock avoids covering product controls on desktop. */
@media(min-width:601px){
 .public-contact{right:84px;bottom:calc(22px + env(safe-area-inset-bottom));flex-direction:row;gap:8px}
 .public-contact a{width:46px;min-height:46px;height:46px;padding:11px;gap:0;font-size:0!important;border-radius:50%}
 .public-contact svg{width:22px;height:22px}
 .rp-launcher{right:24px;bottom:calc(22px + env(safe-area-inset-bottom));width:50px;min-height:50px;height:50px;padding:12px;gap:0;border-radius:50%;font-size:0}
 .rp-launcher svg{width:24px;height:24px}
}

/* Optional compact shopping entry points; real links also work without JavaScript. */
.shop-starts{padding-top:30px;padding-bottom:30px}
.shop-starts-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:18px}
.shop-starts-heading :is(h1,h2){font-size:clamp(26px,2.8vw,34px);letter-spacing:-.8px;line-height:1.2;margin:0}
.shop-starts-heading p{font-size:14px;line-height:1.5;color:#615a53;margin:0}
.shop-starts-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.shop-start{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 15px;border:1px solid #d9d3cc;border-radius:8px;padding:23px;background:#fff;min-width:0;transition:box-shadow .2s ease,border-color .2s ease,transform .2s var(--rhino-ease)}
.shop-start strong{font-size:24px;letter-spacing:-.6px;color:#242222}
.shop-start>span{font-size:14px;color:#665e57;line-height:1.5}
.shop-start>b{grid-column:2;grid-row:1/3;display:grid;place-items:center;width:43px;height:43px;border-radius:50%;background:#f5e8e5;color:#800000;font-size:24px;font-weight:500}
.shop-start--primary{border-top:3px solid #800000}
html[data-page] .shop-starts,html[data-search-results] .shop-starts{display:none}

@media(hover:hover) and (pointer:fine){
 .product-card:hover,.popular-wheel-card:hover,.workshop-card:hover,.shop-start:hover{border-color:#c2928b;box-shadow:0 11px 30px #251d1710;transform:translateY(-3px)}
 .product-image img,.popular-wheel-photo img{transition:transform .35s var(--rhino-ease)}
 .product-card:hover .product-image img,.popular-wheel-card:hover .popular-wheel-photo img{transform:scale(1.025)}
}
@media(max-width:920px){
 .search-panels{gap:18px}
 .search-card{padding:17px}
 .search-card>h3{margin:-17px -17px 18px}
 .search-card .finder-tabs button{padding-left:11px;padding-right:11px}
}
@media(max-width:700px){
 .search-card{padding:20px}
 .search-card>h3{margin:-20px -20px 20px;font-size:15px}
 .search-card .search-field select{font-size:16px;min-height:50px}
 .search-card .finder-search{min-height:50px;font-size:15px}
 .search-card .finder-tabs button{font-size:14px;padding:11px 17px}
 .search-hub-intro{align-items:start;flex-direction:column;gap:12px}
 .search-hub-intro>span{font-size:13px;max-width:none;text-align:left;line-height:1.5}
 .finder-range-note{font-size:13px}
 .shop-starts{padding-top:24px;padding-bottom:24px}
 .shop-starts-heading{display:block;margin-bottom:16px}
 .shop-starts-heading :is(h1,h2){font-size:28px;margin-bottom:7px}
 .shop-starts-heading p{font-size:14px}
 .shop-starts-grid{grid-template-columns:1fr;gap:10px}
 .shop-start{min-height:91px;padding:16px 18px;gap:2px 14px}
 .shop-start strong{font-size:23px}
 .shop-start>span{font-size:14px}
 .shop-start>b{width:39px;height:39px;font-size:23px}
 .workshop-card h3{margin-left:20px;margin-right:20px}
 .contact-card p{font-size:13px;gap:15px;line-height:1.6}
}
@media(max-width:600px){
 .header .header-inner{height:76px;gap:8px}
 .header .brand{gap:7px}
 .header .logo-art{width:44px;height:52px}
 .header .brand strong{font-size:30px;letter-spacing:1px}
 .header .brand small{font-size:8px;letter-spacing:.1px;margin-top:6px}
 .header .header-contact{display:none}
 .shop-page .header .header-contact{display:flex;margin-left:auto}
 .header .header-cart{min-height:44px;gap:7px;padding:8px;margin-left:auto}
 .header .header-cart>span:not([data-cart-count]){display:none}
 .header-cart svg{width:22px;height:22px}
 .header-cart [data-cart-count]{min-width:22px;height:22px;font-size:11px}
 .header .menu-button{width:44px;min-height:44px;flex-shrink:0;padding:9px}
 .public-contact{left:14px;right:14px;bottom:calc(12px + env(safe-area-inset-bottom));display:grid;grid-template-columns:1fr 1fr;gap:8px}
 .public-contact a{min-height:46px;padding:11px 12px;border-radius:8px;font-size:13px;box-shadow:0 4px 20px #0002}
 .public-contact .public-contact-email{font-size:13px!important}
 .rp-launcher{bottom:calc(70px + env(safe-area-inset-bottom));min-height:44px;font-size:13px;padding:11px 15px}
 .toast{bottom:calc(76px + env(safe-area-inset-bottom));max-width:calc(100% - 28px);font-size:13px}
 body:not(.shop-page) .rhino-cart-toast{bottom:calc(76px + env(safe-area-inset-bottom))}
 .tyre-size-card select,.wheel-vehicle-card select{font-size:16px}
 .contact h2{font-size:35px}
 .contact-card{padding:22px}
 .contact-card h3{font-size:23px}
 footer{padding-bottom:128px}
}
@media(max-width:360px){
 .header .header-inner{padding-left:16px;padding-right:16px;gap:6px}
 .header .logo-art{width:40px;height:47px}
 .header .brand{gap:6px}
 .header .brand strong{font-size:27px}
 .header .brand small{font-size:7.4px;letter-spacing:0}
 .header .header-cart{padding:7px;gap:5px}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .header,.button,.finder-search,.service-learn,.alignment-offer-link,.header-cart,.header .menu-button,.chosen-tyre-size button,.selected-vehicle .change-vehicle,.product-card,.popular-wheel-card,.workshop-card,.shop-start,.product-image img,.popular-wheel-photo img{transition:none}
 .product-card:hover,.popular-wheel-card:hover,.workshop-card:hover,.shop-start:hover,.button:active,.finder-search:active,.service-learn:active,.product-card:hover .product-image img,.popular-wheel-card:hover .popular-wheel-photo img{transform:none}
}

/* The final steps use the same calm typography and clear controls. */
.shop-page .shop-panel,.shop-page .shop-summary,.shop-page .shop-receipt-card{border-radius:9px;border-color:#dcd7d2}
.shop-page .shop-panel{box-shadow:0 3px 14px #261c1203}
.shop-page .shop-panel-heading h2{font-size:20px;line-height:1.35}
.shop-page .shop-panel-heading>span{font-size:12px;color:#625c56;line-height:1.5}
.shop-page .shop-field-grid label{font-size:14px;color:#35302c}
.shop-page .shop-field-grid label>small{font-size:12px;color:#6c655e}
.shop-page .shop-field-grid input,.shop-page .shop-field-grid select,.shop-page .shop-coupon input{font-size:16px;min-height:48px;height:auto;border-color:#bfb7af;border-radius:5px;line-height:1.5}
.shop-page .shop-field-grid input::placeholder,.shop-page .shop-coupon input::placeholder{color:#7b736d}
.shop-page .shop-note,.shop-page .shop-summary-note{font-size:13px;color:#5c5650;line-height:1.7}
.shop-page .shop-payment-choice{padding:18px 16px;border-radius:7px;border-color:#cfc8c1;transition:border-color .18s ease,background-color .18s ease,box-shadow .18s ease}
.shop-page .shop-payment-choice strong{font-size:15px;line-height:1.5}
.shop-page .shop-payment-choice>span>span,.shop-page .shop-collection-choice>span>span{font-size:13px;color:#5d5751;line-height:1.7}
.shop-page .shop-payment-choice.selected{background:#fff8f6;border-color:#800000;box-shadow:0 0 0 1px #80000015}
.shop-page .shop-payment-choice:has(input:focus-visible){outline:3px solid #a20c18;outline-offset:3px}
.shop-page .shop-payment-choice input,.shop-page .shop-collection-choice input,.shop-page .shop-check input{width:20px;height:20px}
.shop-page .shop-check{font-size:14px;color:#49433e;line-height:1.7}
.shop-page .shop-check small{font-size:12px;color:#655d55}
.shop-page .shop-store-address>span,.shop-page .shop-store-address>a{font-size:14px;line-height:1.6}
.shop-page .shop-store-address>span{color:#625a52}
.shop-page .shop-button{min-height:48px;transition:background-color .18s ease,box-shadow .18s ease,border-color .18s ease}
.shop-page .shop-button.primary:hover:not(:disabled){background:#610000;box-shadow:0 5px 16px #80000018}
.shop-page .shop-place-order{min-height:54px;font-size:16px}
.shop-page .shop-text-button,.shop-page .shop-help-link{font-size:14px;min-height:44px}
.shop-page .shop-receipt-line{font-size:14px;line-height:1.6}
.shop-page .shop-receipt-line small{font-size:12px;color:#655d55}
.shop-page .shop-order-assurance strong{font-size:14px}
.shop-page .shop-order-assurance p{font-size:13px;color:#625a52}
.shop-page .shop-total-row{font-size:14px;color:#57504a}
.shop-page .shop-total-row.grand{font-size:20px;color:#222}
.shop-page .shop-total-row.tax{font-size:12px;color:#696159}
.shop-page footer .footer-inner>a:not(.brand){color:#c8c3ba;font-size:13px;min-height:44px;display:inline-flex;align-items:center}
.acc-card{border-radius:8px;transition:box-shadow .2s ease,border-color .2s ease,transform .2s var(--rhino-ease)}
@media(min-width:901px){.shop-page .shop-summary,.shop-page .shop-checkout-summary{top:calc(var(--rhino-header-height) + 20px)}}
@media(max-width:640px){
 .shop-page .shop-panel-heading h2{font-size:19px}
 .shop-page .shop-panel-heading>span{font-size:11px}
 .shop-page .shop-panel{padding:21px 18px}
 .shop-page .shop-field-grid{gap:18px}
 .shop-page .shop-quantity-control{width:132px}
 .shop-page .shop-quantity-control button{width:44px;height:44px}
 .shop-page .shop-quantity-control input{width:44px;height:44px;font-size:16px}
 .shop-page .shop-payment-choice{padding:17px 14px}
 .shop-page .shop-total-row.grand{font-size:19px}
 .acc-sidebar select,.acc-sidebar input{font-size:16px}
 .shop-page footer{padding-bottom:35px}
}
@media(prefers-reduced-motion:reduce){.shop-page .shop-payment-choice,.shop-page .shop-button,.acc-card{transition:none}}