/*
Theme Name: Victorian Trailers
Theme URI: https://victoriantrailers.com.au/
Author: Smart Tech Melbourne
Description: Dark, glass-style WooCommerce theme for a trailer dealer: full-width banner with side boxes, mega menu built from product categories, product page with optional extras, rego, plug, build time and pickup yard carried into the cart and order. Edit the banner, yards and contact details in Appearance > Customize > Victorian Trailers.
Version: 1.0.0
Requires at least: 6.3
Tested up to: 6.8
Requires PHP: 7.4
WC requires at least: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: victorian-trailers
Tags: e-commerce, dark, custom-menu, custom-logo, featured-images, theme-options
*/

/* The design itself is in assets/css/site.css. This file styles the parts that only exist in WordPress. */

.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.admin-bar .hdr{top:32px}
@media (max-width:782px){.admin-bar .hdr{top:46px}}
@media (max-width:600px){.admin-bar .hdr{top:0}}

/* ---------- main menu (wp_nav_menu markup) ---------- */
.nav .menu{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center}
.nav .menu>li{position:relative}
.nav .menu>li.has-mega{position:static}
.nav .sub-menu{position:absolute;left:0;top:100%;z-index:45;display:block;min-width:210px;margin:0;padding:8px;list-style:none;background:rgba(8,18,33,.62);-webkit-backdrop-filter:blur(22px) saturate(1.5);backdrop-filter:blur(22px) saturate(1.5);border:1px solid var(--line-2);border-radius:12px;box-shadow:0 24px 50px -20px rgba(0,0,0,.8);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .2s,transform .2s var(--ease),visibility .2s}
.nav .has-drop:hover>.sub-menu,.nav .has-drop:focus-within>.sub-menu{opacity:1;visibility:visible;transform:none}
.nav .sub-menu li>a{display:block;padding:9px 12px;border-radius:8px;font-size:14.5px}
.nav .sub-menu li>a::after{display:none}
.nav .sub-menu li>a:hover{background:rgba(30,143,255,.14)}
.nav .current-menu-item>a,.nav .current-menu-ancestor>a{color:var(--accent-hi)}
.nav .current-menu-item>a::after,.nav .current-menu-ancestor>a::after{transform:scaleX(1)}

/* header cart is a link here */
.hdr .cart{color:#fff;text-decoration:none}
.hdr .cart:hover{color:#fff}

/* WooCommerce adds a "View cart" link after AJAX adds; the toast covers that */
.added_to_cart{display:none!important}
.add.loading{opacity:.6;pointer-events:none}
.add.added::after{content:none}

/* ---------- page heroes, content ---------- */
.phero-sm{padding:30px 0}
.phero-sm h1{font-size:clamp(32px,3.6vw,52px)}
.areas-bar{background:var(--bg-2);padding:22px 0;border-bottom:1px solid var(--line)}
.areas-bar b{color:#fff;margin-right:6px}
.entry{max-width:900px}
.wrap.entry{max-width:min(1100px,100%)}
.entry h2{font-size:30px;margin:1.4em 0 .5em}
.entry h3{font-size:22px;margin:1.2em 0 .4em}
.entry p,.entry li{color:var(--text)}
.entry a{color:var(--accent-hi)}
.entry img{height:auto;border-radius:12px}
.entry table{width:100%;border-collapse:collapse}
.entry th,.entry td{padding:10px;border-bottom:1px solid var(--line);text-align:left}
.entry blockquote{margin:1.2em 0;padding:4px 0 4px 18px;border-left:3px solid var(--accent);color:var(--sub)}
.entry-img{margin-bottom:20px;width:100%;height:auto}
.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.post-card{border:1px solid var(--line-2);border-radius:14px;background:var(--surface);overflow:hidden}
.post-card .pic img{width:100%;aspect-ratio:16/10;object-fit:cover}
.post-card .body{padding:18px}
.post-card h2{font-size:20px;margin:4px 0 8px}
.post-card h2 a{color:#fff;text-decoration:none}
.nav-links{display:flex;gap:8px;margin-top:28px}
.nav-links .page-numbers{display:grid;place-items:center;min-width:42px;height:42px;padding:0 12px;border:1px solid var(--line-2);border-radius:999px;color:#fff;text-decoration:none}
.nav-links .current{background:var(--accent);border-color:var(--accent)}

/* ---------- shop filters ---------- */
.filters .fl{display:flex;justify-content:space-between;gap:8px;padding:7px 10px;margin:0 -10px;border-radius:8px;color:var(--text);text-decoration:none;font-size:15px}
.filters .fl span{color:var(--muted);font-size:13px}
.filters .fl:hover{background:rgba(30,143,255,.1);color:#fff}
.filters .fl.on{background:rgba(30,143,255,.16);color:#fff;font-weight:700;box-shadow:inset 3px 0 0 var(--accent)}
.filters .fl.check::before{content:"";flex:none;width:18px;height:18px;margin-right:2px;border:1px solid var(--line-2);border-radius:5px}
.filters .fl.check{justify-content:flex-start}
.filters .fl.check.on::before{background:var(--accent);border-color:var(--accent);box-shadow:inset 0 0 0 3px var(--surface)}
.filters .chips-row{display:flex;flex-wrap:wrap;gap:6px}
.filters .chip{min-height:34px;padding:0 12px;font-size:13px}
.filters .widget{margin-top:22px}
.woocommerce-result-count{margin:0;font-weight:600;color:var(--sub)}
.woocommerce-ordering{margin:0}
.woocommerce-ordering select{height:44px;border:1px solid var(--line-2);border-radius:10px;padding:0 10px;background:var(--surface);font:600 15px var(--body);color:#fff}
.woocommerce-pagination ul{display:flex;gap:8px;list-style:none;padding:0;margin:28px 0 0}
.woocommerce-pagination a,.woocommerce-pagination span{display:grid;place-items:center;min-width:42px;height:42px;padding:0 12px;border:1px solid var(--line-2);border-radius:999px;color:#fff;text-decoration:none}
.woocommerce-pagination .current{background:var(--accent);border-color:var(--accent)}
ul.products{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
ul.products li{display:flex}
ul.products li .card{flex:1}
.short{color:var(--sub)}
.short p{margin:0}

/* ---------- notices ---------- */
.woocommerce-notices-wrapper:empty{display:none}
.woocommerce-message,.woocommerce-error,.woocommerce-info,.wc-block-components-notice-banner{list-style:none;margin:0 0 20px;padding:14px 18px;border:1px solid var(--line-2);border-left:4px solid var(--accent);border-radius:12px;background:var(--surface);color:var(--text);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
.woocommerce-error{border-left-color:#ff6b6b}
.woocommerce-error li{margin:0}
.woocommerce-message .button,.woocommerce-info .button{order:2}

/* ---------- buttons WooCommerce prints ---------- */
.woocommerce .button,.woocommerce button.button,.woocommerce a.button,.woocommerce input.button,#place_order,.checkout-button,.wc-forward,.wc-block-components-button:not(.is-link){display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 22px;border:0;border-radius:999px;background:linear-gradient(180deg,#2c9bff,#1574e3);color:#fff!important;font:700 15px/1 var(--body);text-decoration:none;cursor:pointer;box-shadow:0 10px 24px -12px rgba(30,143,255,.9)}
.woocommerce .button:hover,#place_order:hover,.checkout-button:hover{box-shadow:var(--glow)}
.woocommerce .button:disabled,.woocommerce .button.disabled{opacity:.5;cursor:not-allowed}

/* ---------- forms (checkout, account, cart coupon) ---------- */
.woocommerce form .form-row{margin:0 0 14px}
.woocommerce form .form-row label{display:block;margin-bottom:6px;font-weight:600;color:#fff}
.woocommerce form .form-row .required{color:#ff6b6b;text-decoration:none}
.woocommerce input.input-text,.woocommerce textarea,.woocommerce select,.woocommerce form .form-row input:not([type=checkbox]):not([type=radio]),.select2-container .select2-selection--single,.wc-block-components-text-input input,.wc-block-components-textarea,.wc-blocks-components-select select{width:100%;min-height:46px;padding:10px 14px;border:1px solid var(--line-2);border-radius:10px;background:var(--surface-2);color:#fff;font:15px var(--body)}
.woocommerce input:focus,.woocommerce textarea:focus,.woocommerce select:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 4px rgba(30,143,255,.18)}
.select2-container .select2-selection--single{display:flex;align-items:center}
.select2-container--default .select2-selection--single .select2-selection__rendered{color:#fff;padding:0}
.select2-container--default .select2-selection--single .select2-selection__arrow{top:10px;right:8px}
.select2-dropdown{background:var(--surface-2);border-color:var(--line-2);color:#fff}
.select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--accent)}
.select2-search__field{background:var(--surface);color:#fff;border:1px solid var(--line-2)}
.woocommerce form .form-row-first,.woocommerce form .form-row-last{width:calc(50% - 8px);display:inline-block;vertical-align:top}
.woocommerce form .form-row-first{margin-right:12px}
.wc-block-components-text-input label,.wc-block-components-checkout-step__title,.wc-block-components-title{color:#fff!important}

/* ---------- cart ---------- */
.shop_table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--line-2);border-radius:14px;overflow:hidden;background:var(--surface)}
.shop_table th,.shop_table td{padding:14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle;color:var(--text)}
.shop_table thead th{background:var(--surface-2);color:#fff;font-size:14px;text-transform:uppercase;letter-spacing:.06em}
.shop_table tr:last-child td{border-bottom:0}
.shop_table .product-thumbnail img{width:84px;height:auto;border-radius:8px}
.shop_table .product-name a{color:#fff;font-weight:700;text-decoration:none}
.shop_table .product-remove a{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid var(--line-2);color:#ff8a8a!important;text-decoration:none}
.shop_table .quantity input{width:80px}
.shop_table .actions{text-align:right}
.shop_table .coupon{display:flex;gap:8px;float:left}
.shop_table .coupon input{flex:none;width:200px}
.variation{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;margin:8px 0 0;font-size:13px;color:var(--sub)}
.variation dt{color:#fff;font-weight:600}
.variation dd{margin:0}
.variation dd p{margin:0}
.cart-collaterals{display:flex;justify-content:flex-end;margin-top:28px}
.cart_totals{width:min(460px,100%)}
.cart_totals h2,#order_review_heading,.woocommerce-billing-fields h3,.woocommerce-additional-fields h3,.woocommerce-column__title,.woocommerce-order-details__title{font-size:24px;margin:0 0 14px}
.wc-proceed-to-checkout{margin-top:16px}
.wc-proceed-to-checkout .checkout-button{width:100%}
.cart-empty{font-size:18px}
.return-to-shop{margin-top:16px}

/* ---------- checkout ---------- */
.woocommerce-checkout #customer_details{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-bottom:28px}
#payment{margin-top:20px;padding:18px;border:1px solid var(--line-2);border-radius:14px;background:var(--surface)}
#payment .wc_payment_methods{list-style:none;margin:0 0 16px;padding:0}
#payment .wc_payment_method{padding:10px 0;border-bottom:1px solid var(--line)}
#payment .payment_box{margin-top:8px;padding:12px;border-radius:10px;background:var(--surface-2);color:var(--sub)}
#place_order{width:100%;margin-top:12px}
.woocommerce-privacy-policy-text,.woocommerce-terms-and-conditions-wrapper{color:var(--sub);font-size:14px}
.woocommerce-form-coupon-toggle .woocommerce-info,.woocommerce-form-login-toggle .woocommerce-info{justify-content:flex-start}
.woocommerce-order-overview{list-style:none;display:flex;flex-wrap:wrap;gap:24px;padding:18px;border:1px solid var(--line-2);border-radius:14px;background:var(--surface)}
.woocommerce-order-overview strong{display:block;color:#fff}

/* ---------- my account ---------- */
.woocommerce-account.logged-in .woocommerce{display:grid;grid-template-columns:240px minmax(0,1fr);gap:28px}
.woocommerce-account .woocommerce>.woocommerce-notices-wrapper{grid-column:1/-1}
.woocommerce-MyAccount-navigation ul{list-style:none;margin:0;padding:8px;border:1px solid var(--line-2);border-radius:14px;background:var(--surface)}
.woocommerce-MyAccount-navigation a{display:block;padding:10px 12px;border-radius:8px;color:var(--text);text-decoration:none}
.woocommerce-MyAccount-navigation .is-active a,.woocommerce-MyAccount-navigation a:hover{background:rgba(30,143,255,.16);color:#fff}
.woocommerce-account:not(.logged-in) .woocommerce{display:block}
.u-columns{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.woocommerce-form-login,.woocommerce-form-register{padding:22px;border:1px solid var(--line-2);border-radius:14px;background:var(--surface)}

/* ---------- WooCommerce cart/checkout blocks (if the site uses them) ---------- */
.wp-block-woocommerce-cart,.wp-block-woocommerce-checkout{color:var(--text)}
.wc-block-components-sidebar-layout .wc-block-components-main,.wc-block-components-sidebar{color:var(--text)}
.wc-block-components-totals-wrapper,.wc-block-components-order-summary{border-color:var(--line)!important}
.wc-block-components-product-name{color:#fff!important}

@media (max-width:900px){
	.posts,ul.products{grid-template-columns:repeat(2,minmax(0,1fr))}
	.woocommerce-checkout #customer_details,.woocommerce-account .woocommerce,.u-columns{grid-template-columns:1fr}
	.shop_table .coupon{float:none;margin-bottom:10px}
	.shop_table_responsive thead{display:none}
	.shop_table_responsive tr{display:block;border-bottom:1px solid var(--line)}
	.shop_table_responsive td{display:flex;justify-content:space-between;gap:12px;border-bottom:0;padding:8px 14px}
	.shop_table_responsive td::before{content:attr(data-title);font-weight:700;color:#fff}
	.shop_table_responsive td.product-remove::before,.shop_table_responsive td.product-thumbnail::before,.shop_table_responsive td.actions::before{content:none}
}
@media (max-width:640px){
	.posts{grid-template-columns:1fr}
	.woocommerce form .form-row-first,.woocommerce form .form-row-last{width:100%;margin-right:0}
}

/* WooCommerce's layout CSS adds clearfix pseudo-elements and 48% floats; inside these grids they would take a column */
.col2-set::before,.col2-set::after,.woocommerce-account .woocommerce::before,.woocommerce-account .woocommerce::after{display:none!important}
.woocommerce .col2-set .col-1,.woocommerce .col2-set .col-2,.woocommerce-page .col2-set .col-1,.woocommerce-page .col2-set .col-2{float:none;width:auto}
.woocommerce-account .woocommerce-MyAccount-navigation,.woocommerce-account .woocommerce-MyAccount-content{float:none;width:auto}
#order_review{padding:22px;border:1px solid var(--line-2);border-radius:14px;background:var(--surface)}
#order_review .shop_table{border:0;background:none}
.wc-item-meta{list-style:none;margin:8px 0 0;padding:0;font-size:13.5px;color:var(--sub)}
.wc-item-meta li{display:flex;gap:6px}
.wc-item-meta strong{color:#fff;font-weight:600}
.wc-item-meta p{margin:0;display:inline}
.woocommerce-customer-details address{padding:18px;border:1px solid var(--line-2);border-radius:14px;background:var(--surface);font-style:normal;line-height:1.7}

/* ---------- checkboxes and radios (the text-field rule skips them) ---------- */
.woocommerce input[type=checkbox],.woocommerce input[type=radio]{flex:none;width:18px;height:18px;min-height:0;margin:0;padding:0;accent-color:var(--accent);vertical-align:middle;box-shadow:none}
.woocommerce form .form-row label.checkbox,.woocommerce-form__label-for-checkbox{display:inline-flex!important;align-items:center;gap:10px;margin:0;font-weight:500!important;color:var(--text)!important;cursor:pointer}
#payment .wc_payment_method>label{display:inline-flex;align-items:center;gap:10px;margin-left:8px;font-weight:700;color:#fff}

/* ---------- cart, checkout, account pages ---------- */
.wrap.wc-page{max-width:min(1440px,100%)}
.woocommerce table.cart td.actions .coupon .input-text{float:none;width:220px;margin:0}
.woocommerce-cart .woocommerce{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,420px);gap:0 clamp(24px,2.4vw,40px);align-items:start}
.woocommerce-cart .woocommerce>*{grid-column:1/-1}
.woocommerce-cart .woocommerce>.woocommerce-cart-form{grid-column:1}
.woocommerce-cart .woocommerce>.cart-collaterals{grid-column:2;margin-top:0;display:block;position:sticky;top:120px}
.woocommerce .cart-collaterals .cart_totals,.cart_totals{float:none;width:100%;padding:clamp(18px,1.6vw,26px);border:1px solid var(--line-2);border-radius:16px;background:var(--surface)}
.cart_totals .shop_table{border:0;background:none}
.cart_totals .shop_table th,.cart_totals .shop_table td{padding:12px 0}
.cart_totals .order-total td,.cart_totals .order-total th,#order_review .order-total td,#order_review .order-total th{font-size:18px;color:#fff}

.woocommerce-checkout form.checkout{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,460px);grid-template-rows:auto auto 1fr;gap:0 clamp(24px,2.4vw,40px);align-items:start}
form.checkout .woocommerce-NoticeGroup{grid-column:1/-1;grid-row:1}
form.checkout #customer_details{grid-column:1;grid-row:2/span 2;display:flex;flex-direction:column;gap:20px;margin:0}
form.checkout #customer_details>div{padding:clamp(18px,1.6vw,28px);border:1px solid var(--line-2);border-radius:16px;background:var(--surface)}
form.checkout #order_review_heading{grid-column:2;grid-row:2;margin:0 0 12px}
form.checkout #order_review{grid-column:2;grid-row:3;position:sticky;top:120px}
form.checkout .woocommerce-billing-fields h3,form.checkout .woocommerce-additional-fields h3{margin-top:0}
#order_review .shop_table th,#order_review .shop_table td{padding:12px 4px}
#order_review .product-name{color:#fff;font-weight:600}
.woocommerce-terms-and-conditions-wrapper .form-row{margin:14px 0 0}

/* ---------- shop: hero stats, filter bar, filter panel, grid / list ---------- */
.shop-hero .kick{margin:14px 0 6px}
.shop-hero h1{text-transform:uppercase;letter-spacing:-.01em}
.shop-hero p{max-width:62ch}
.sh-stats{display:flex;flex-wrap:wrap;gap:clamp(18px,2.4vw,44px);margin-top:clamp(16px,1.6vw,26px)}
.sh-stats b{display:block;font-size:clamp(20px,1.5vw,26px);font-weight:800;color:var(--accent-hi);line-height:1.1}
.sh-stats span{font-size:14px;color:var(--sub)}
.shop2{padding-top:clamp(20px,2vw,34px)}
.sbar{display:flex;align-items:center;gap:14px 18px;flex-wrap:wrap;padding:12px 14px;margin-bottom:14px;border:1px solid var(--line-2);border-radius:14px;background:var(--surface)}
.sbar-filter{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:0 16px;border:0;border-radius:10px;background:linear-gradient(180deg,#2c9bff,#1574e3);color:#fff;font:700 15px var(--body);cursor:pointer;box-shadow:0 10px 24px -12px rgba(30,143,255,.9)}
.sbar-filter svg{width:18px;height:18px}
.sbar-filter svg:last-child{width:14px;height:14px;transition:transform .25s var(--ease)}
.sbar-filter[aria-expanded=true] svg:last-child{transform:rotate(180deg)}
.sbar-filter .n{display:grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:#fff;color:#1574e3;font-size:12.5px}
.sbar-count .woocommerce-result-count{font-weight:500}
.sbar-right{display:flex;align-items:center;gap:14px;margin-left:auto;flex-wrap:wrap}
.sbar-show,.sbar-sort{display:flex;align-items:center;gap:8px;margin:0;color:var(--sub);font-size:14.5px}
.sbar select{height:44px;min-width:70px;border:1px solid var(--line-2);border-radius:10px;padding:0 10px;background:var(--surface-2);font:600 15px var(--body);color:#fff}
.sbar-view{display:flex;border:1px solid var(--line-2);border-radius:10px;overflow:hidden}
.sbar-view button{display:grid;place-items:center;width:44px;height:42px;border:0;background:transparent;color:var(--sub);cursor:pointer}
.sbar-view button svg{width:18px;height:18px}
.sbar-view button[aria-pressed=true]{background:var(--accent);color:#fff}
.fpanel{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px clamp(20px,2vw,36px);padding:clamp(18px,1.6vw,26px);margin-bottom:22px;border:1px solid var(--line-2);border-radius:14px;background:var(--surface)}
.fpanel[hidden]{display:none}
.fcol{min-width:0;margin:0}
.fcol h3{margin:0 0 12px;padding-bottom:10px;border-bottom:2px solid var(--accent);font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:#fff}
.fscroll{max-height:230px;overflow:auto;padding-right:6px;scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}
.fsizes{display:grid;grid-template-columns:1fr 1fr;gap:0 10px;align-content:start}
.fck{display:flex;align-items:center;gap:10px;padding:7px 0;color:var(--text);text-decoration:none;font-size:15px}
.fck::before{content:"";flex:none;width:18px;height:18px;border:1px solid var(--line-2);border-radius:5px;background:var(--surface-2);transition:background .2s,border-color .2s}
.fck span{margin-left:auto;font-size:13px;color:var(--muted)}
.fck:hover{color:#fff}
.fck:hover::before{border-color:var(--accent)}
.fck.on{color:#fff;font-weight:700}
.fck.on::before{border-color:var(--accent);background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center/12px no-repeat}
.frange{position:relative;height:28px;margin:4px 9px 6px;--a:0%;--b:100%}
.frange::before,.frange::after{content:"";position:absolute;top:12px;height:4px;border-radius:4px}
.frange::before{left:0;right:0;background:var(--line-2)}
.frange::after{left:var(--a);right:calc(100% - var(--b));background:var(--accent)}
.frange input{position:absolute;left:-9px;top:0;width:calc(100% + 18px);height:28px;margin:0;background:none;pointer-events:none;-webkit-appearance:none;appearance:none;z-index:1}
.frange input::-webkit-slider-runnable-track{background:none;border:0}
.frange input::-moz-range-track{background:none;border:0}
.frange input::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid var(--accent);box-shadow:0 0 0 4px rgba(30,143,255,.2);pointer-events:auto;cursor:grab}
.frange input::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#fff;border:3px solid var(--accent);pointer-events:auto;cursor:grab}
.fprice-out{margin:4px 0 12px;color:var(--sub)}
.fprice-out b{color:#fff}
.fprice .btn{width:100%;justify-content:center;border:0;cursor:pointer}
.freset{display:inline-block;margin-top:10px;color:var(--accent-hi);font-size:14px}
.fclear{margin-top:16px;width:100%;justify-content:center}

/* shop cards (TDU layout): category line, title, tick list, was/now price | Add to Cart */
.card .specs span:nth-child(n+4){display:none}
.card .specs span:nth-child(3)::after{content:none}
.card-shop .media::after{display:none}
.card-shop .pic{aspect-ratio:1.6}
.card-shop .pct{position:absolute;left:0;top:0;z-index:2;padding:6px 12px 6px 10px;border-radius:0 0 12px 0;background:linear-gradient(180deg,#ff4d5e,#e0263b);color:#fff;font:800 13px/1 var(--body);box-shadow:0 0 14px rgba(255,45,70,.6)}
.card-shop .pct.new{background:linear-gradient(180deg,#2c9bff,#1574e3);box-shadow:0 0 14px rgba(30,143,255,.6)}
.card-shop .body{padding:clamp(14px,1.1vw,20px);gap:8px}
.ccat{margin:0;color:var(--accent-hi);font-size:clamp(10.5px,.66vw,12px);font-weight:800;letter-spacing:.1em;text-transform:uppercase;line-height:1.5}
.card-shop h3{font-size:clamp(15px,.98vw,18px);font-weight:500;line-height:1.3}
.card-shop h3 a{-webkit-line-clamp:2}
.cspecs{list-style:none;margin:2px 0 0;padding:0;display:flex;flex-direction:column;gap:5px;font-size:clamp(13px,.8vw,14.5px);color:var(--sub)}
.cspecs li{position:relative;padding-left:20px;line-height:1.4}
.cspecs li::before{content:"\2713";position:absolute;left:0;top:0;color:#38d27a;font-weight:800}
.cspecs b{color:#fff;font-weight:700}
.cbuy{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-top:auto;padding-top:14px;border-top:1px solid var(--line)}
.cprice{display:flex;flex-direction:column;line-height:1.1}
.cprice s{color:var(--muted);font-size:13px}
.cprice b{color:#fff;font-size:clamp(19px,1.3vw,24px);font-weight:800}
.card-shop .add{flex:none;width:auto;align-self:auto;min-height:clamp(38px,2.5vw,44px);padding:0 clamp(14px,1.1vw,20px);border-radius:10px}
.grid.is-list{grid-template-columns:1fr}
.grid.is-list .card-shop{flex-direction:row}
.grid.is-list .card-shop .media{flex:0 0 clamp(260px,30%,440px)}
.grid.is-list .card-shop .pic{height:100%;min-height:230px;aspect-ratio:auto}
.grid.is-list .card-shop .body{padding:clamp(16px,1.4vw,26px)}
.grid.is-list .card-shop h3{font-size:clamp(16px,1.1vw,20px)}

@media (max-width:1100px){
	.fpanel{grid-template-columns:1fr 1fr}
	.woocommerce-checkout form.checkout,.woocommerce-cart .woocommerce{grid-template-columns:1fr}
	form.checkout #customer_details,form.checkout #order_review_heading,form.checkout #order_review,.woocommerce-cart .woocommerce>.woocommerce-cart-form,.woocommerce-cart .woocommerce>.cart-collaterals{grid-column:1;grid-row:auto;position:static}
	form.checkout #order_review_heading{margin-top:24px}
	.woocommerce-cart .woocommerce>.cart-collaterals{margin-top:24px}
}
@media (max-width:640px){
	.sbar{gap:10px}
	.sbar-right{display:contents}
	.sbar-filter{order:1}
	.sbar-view{order:2;margin-left:auto}
	.sbar-show{order:3}
	.sbar-sort{order:4;flex:1;min-width:0}
	.sbar-sort .woocommerce-ordering,.sbar-sort select{width:100%}
	.sbar-count{order:5;width:100%;font-size:14px}
	.sbar-show label,.sbar-sort>span{display:none}
	.fpanel{grid-template-columns:1fr}
	.fscroll{max-height:200px}
	.grid.is-list .card-shop{flex-direction:column}
	.grid.is-list .card-shop .media{flex:none}
	.grid.is-list .card-shop .pic{min-height:0;aspect-ratio:1.45}
	.woocommerce table.cart td.actions .coupon{flex-wrap:wrap}
	.woocommerce table.cart td.actions .coupon .input-text{width:100%}
	.sh-stats{gap:14px 26px}
	.sh-stats>div{flex:0 0 calc(50% - 13px)}
}
@media (prefers-reduced-motion:reduce){.sbar-filter svg:last-child{transition:none}}

/* ---------- header (TDU layout): promo strip, info strip, logo | category search | expert phone | cart | quote, then the menu bar ---------- */
.topbar{position:relative;z-index:51;font-size:clamp(12.5px,.78vw,14.5px)}
.tb-promo{background:linear-gradient(90deg,rgba(4,10,20,.92),rgba(10,32,68,.94) 50%,rgba(4,10,20,.92))}
.tb-promo .wrap{display:flex;align-items:center;justify-content:center;gap:12px;min-height:clamp(36px,2.4vw,44px);text-align:center}
/* "2% Price Beat" badge, as on TDU: yellow pill, dark extra-bold text, pulsing red glow */
.tb-pill{flex:none;padding:3px 9px;border-radius:5px;background:#ffc20e;color:#1c1c1c;font:900 14px/1.35 'Lato',sans-serif;letter-spacing:0;text-transform:uppercase;box-shadow:0 0 0 1px rgba(226,33,28,.6),0 0 11px rgba(226,33,28,.55),0 0 24px rgba(232,39,33,.28);animation:beat 2.6s ease-in-out infinite}
@keyframes beat{0%,100%{box-shadow:0 0 0 1px rgba(226,33,28,.6),0 0 11px rgba(226,33,28,.55),0 0 24px rgba(232,39,33,.28)}50%{box-shadow:0 0 0 1px rgba(226,33,28,.85),0 0 16px rgba(226,33,28,.8),0 0 34px rgba(232,39,33,.45)}}
@media (prefers-reduced-motion:reduce){.tb-pill{animation:none}}
.tb-txt{color:#fff;font-weight:600}
.tb-txt b{color:var(--accent-hi)}
.tb-promo a{flex:none;color:#fff;font-weight:700;text-underline-offset:3px}
.tb-promo a:hover{color:var(--accent-hi)}
.tb-info{background:rgba(4,10,20,.82);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.tb-info .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:clamp(32px,2.1vw,40px);color:var(--sub)}
.tb-addr{display:flex;align-items:center;gap:8px;min-width:0}
.tb-addr svg{flex:none;width:15px;height:15px;color:var(--accent)}
.tb-links{display:flex;align-items:center;gap:clamp(16px,1.6vw,30px);white-space:nowrap}
.tb-links a{color:#fff;font-weight:600;text-decoration:none}
.tb-links a:hover{color:var(--accent-hi)}
.tb-links .star{color:#f5b301}
.tb-links b{color:#f5b301}

.hdr2 .hdr-in{display:flex;align-items:center;gap:clamp(14px,1.4vw,28px);padding-top:clamp(10px,.9vw,16px);padding-bottom:clamp(10px,.9vw,16px)}
.hdr2 .logo{flex:none}
.hdr2 form.search2{flex:1;max-width:none;height:clamp(44px,2.9vw,52px);margin:0;padding:0;border-radius:12px;overflow:hidden;background:rgba(255,255,255,.05)}
.search2 select{flex:none;width:clamp(150px,10.5vw,210px);height:100%;padding:0 34px 0 14px;border:0;border-right:1px solid var(--line-2);background:rgba(255,255,255,.04) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239fb3cf' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 12px center/14px no-repeat;color:#fff;font:600 clamp(13px,.82vw,15px) var(--body);-webkit-appearance:none;appearance:none;cursor:pointer;outline:0}
.search2 select option{background:#0b1729;color:#fff}
.hdr2 form.search2 input{padding:0 16px}
.hdr2 form.search2 button[type=submit]{width:clamp(48px,3.4vw,62px);height:100%;border-radius:0;box-shadow:none}
.hdr2 form.search2 button[type=submit] svg{width:19px;height:19px}
.hdr-call{flex:none;display:flex;flex-direction:column;align-items:flex-end;line-height:1.15;text-decoration:none}
.hdr-call small{color:var(--sub);font-size:clamp(10px,.62vw,12px);font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.hdr-call b{color:var(--accent-hi);font-size:clamp(17px,1.2vw,23px);font-weight:800}
.hdr-call:hover b{color:#fff}
.hdr2 .cart{border-color:var(--line-2)}
.hdr-quote{flex:none;min-height:clamp(42px,2.8vw,50px);padding:0 clamp(18px,1.4vw,28px);border-radius:12px}
.hdr2 .burger{margin-left:auto}
.hdr-row2{padding-bottom:clamp(8px,.7vw,12px)}
.navbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 clamp(6px,.6vw,12px);border:1px solid var(--line-2);border-radius:14px;background:rgba(255,255,255,.035)}
.hdr2 .nav{margin:0}
.hdr2 .nav>ul,.hdr2 .nav .menu{justify-content:flex-start}
.hdr2 .loc{padding:4px 14px}
.hdr2.stuck .hdr-in{padding-top:8px;padding-bottom:8px}

@media (max-width:1240px){
	.hdr2 form.search{grid-column:auto;justify-self:auto}
	.hdr2 .nav{grid-column:auto;grid-row:auto;justify-self:auto}
	.hdr2 .loc span>a{display:none}
}
@media (max-width:1100px){
	.hdr-call{display:none}
	.tb-addr{display:none}
	.tb-info .wrap{justify-content:center}
}
@media (max-width:900px){
	.hdr2 .hdr-in{flex-wrap:wrap;gap:10px 12px}
	.hdr2 .cart{margin-left:auto}
	.hdr2 .burger{margin-left:0}
	.hdr-quote,.hdr-row2{display:none}
	.hdr2 form.search2{display:flex;order:5;flex-basis:100%;height:44px}
	.tb-info{display:none}
	.tb-txt b{display:none}
}
@media (max-width:640px){
	.tb-txt{display:none}
	.search2 select{display:none}
}

/* badge artwork images: match the drawn rosette's footprint */
.vt-rail .vt-badge{max-height:7vw;object-fit:contain}
.vt-rail .vt-badge-beat{width:3.7vw}
.vt-badges .vt-badge{max-height:110px;object-fit:contain}
.vt-badges .vt-badge-beat{width:clamp(84px,5.8vw,108px)}

/* ---------- custom dropdowns (theme.js builds them over .xbox, .sbar and header category selects) ---------- */
.dd{position:relative;display:inline-block;min-width:0}
.dd-native{position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;padding:0!important;border:0!important;opacity:0;pointer-events:none;clip:rect(0 0 0 0)}
.dd-btn{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;height:46px;padding:0 14px;border:1px solid var(--line-2);border-radius:10px;background:var(--surface-2);color:#fff;font:600 15px var(--body);text-align:left;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.dd-btn span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dd-btn::after{content:"";flex:none;width:14px;height:14px;background:var(--sub);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .25s var(--ease)}
.dd-btn:hover{border-color:rgba(30,143,255,.6)}
.dd.open .dd-btn{border-color:var(--accent);box-shadow:0 0 0 4px rgba(30,143,255,.18)}
.dd.open .dd-btn::after{transform:rotate(180deg);background:var(--accent-hi)}
.dd-list{position:absolute;left:0;top:calc(100% + 6px);z-index:60;min-width:100%;max-height:320px;overflow:auto;margin:0;padding:6px;list-style:none;background:rgba(8,18,33,.97);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid var(--line-2);border-radius:12px;box-shadow:0 24px 50px -16px rgba(0,0,0,.85),0 0 24px -12px rgba(30,143,255,.6);opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .18s,transform .2s var(--ease),visibility .18s;scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}
.dd-list:focus{outline:0}
.dd.open .dd-list{opacity:1;visibility:visible;transform:none}
.dd-list li{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 12px;border-radius:8px;color:var(--text);font-size:14.5px;white-space:nowrap;cursor:pointer}
.dd-list li.hi{background:rgba(30,143,255,.12);color:#fff}
.dd-list li[aria-selected=true]{background:rgba(30,143,255,.2);color:var(--accent-hi);font-weight:700}
.dd-list li[aria-selected=true]::after{content:"\2713";font-weight:800}
.xbox .dd{display:block;width:100%}
.sbar .dd-btn{height:44px}
.sbar-show .dd{min-width:78px}
.sbar-sort .dd{min-width:210px}
.sbar-sort .dd-list{left:auto;right:0}
.hdr2 form.search2{overflow:visible}
.search2 .dd{flex:none;width:clamp(150px,10.5vw,210px);height:100%}
.hdr2 form.search2 .dd-btn{display:flex;width:100%;height:100%;padding:0 14px;color:#fff;box-shadow:none;border:0;border-right:1px solid var(--line-2);border-radius:12px 0 0 12px;background:rgba(255,255,255,.04);font-size:clamp(13px,.82vw,15px)}
.search2 .dd.open .dd-btn{box-shadow:none}
.search2 .dd-list{min-width:250px}
.hdr2 form.search2 button[type=submit]{border-radius:0 12px 12px 0}
@media (max-width:640px){.search2 .dd{display:none}.sbar-sort .dd{min-width:0;width:100%}}
@media (prefers-reduced-motion:reduce){.dd-btn,.dd-btn::after,.dd-list{transition:none}}

/* shop cards on tablet and phone: 2 across, then 1; the button drops under the price if the card gets narrow */
.card-shop .cbuy{flex-wrap:wrap}
.card-shop .add{white-space:nowrap}
@media (max-width:900px){#shopGrid:not(.is-list){grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}}
@media (max-width:560px){#shopGrid:not(.is-list){grid-template-columns:1fr}}
/* one-column product page: Buy Now stays with Add to Cart, after the extras */
@media (max-width:900px){.pdp3 .btn-buy{order:2}}

/* buttons: TDU shape - 8px corners, extra-bold label (tags, chips and badges stay rounded) */
.btn,.woocommerce .button,.woocommerce button.button,.woocommerce a.button,.woocommerce input.button,#place_order,.checkout-button,.wc-forward,.wc-block-components-button:not(.is-link),
.hdr-quote,.sbar-filter,.card .add,.card-shop .add,.qty,.dr-yard button,.loc-set,.mbar .btn{border-radius:8px}
.btn,.woocommerce .button,#place_order,.checkout-button{font-weight:800}
.btn-buy{min-height:48px}
.pbuy .btn,.pbuy .qty{min-height:48px;height:48px}

/* floating Google reviews card (bottom left, like TDU) */
.grev{position:fixed;left:18px;bottom:18px;z-index:55;animation:grevIn .5s var(--ease) both .8s}
.grev[hidden]{display:none}
.grev-in{display:flex;align-items:center;gap:12px;padding:12px 18px 12px 14px;border-radius:12px;background:#fff;color:#1f2937;text-decoration:none;box-shadow:0 12px 30px -8px rgba(0,0,0,.6),0 0 0 1px rgba(0,0,0,.05)}
.grev-in:hover{box-shadow:0 14px 34px -8px rgba(0,0,0,.7),0 0 22px -6px rgba(30,143,255,.7)}
.grev-g{flex:none;width:34px;height:34px}
.grev-t{display:flex;flex-direction:column;gap:2px;font-size:14px;line-height:1.2;color:#4b5563}
.grev-t b{color:#111827;font-size:15px}
.grev-stars{position:relative;display:inline-block;width:max-content;font-size:14px;letter-spacing:2px;color:#d1d5db}
.grev-stars::before{content:"\2605\2605\2605\2605\2605"}
.grev-stars::after{content:"\2605\2605\2605\2605\2605";position:absolute;left:0;top:0;width:var(--r);overflow:hidden;white-space:nowrap;color:#fbbc04}
.grev-x{position:absolute;right:-8px;top:-8px;width:22px;height:22px;padding:0;border:1px solid #e5e7eb;border-radius:50%;background:#fff;color:#6b7280;font:700 14px/1 var(--body);cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.grev-x:hover{color:#111827}
@keyframes grevIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media (max-width:1599px){.grev{left:14px}}
@media (max-width:900px){.grev{display:none}}
@media (prefers-reduced-motion:reduce){.grev{animation:none}}

/* WooCommerce's own dropdowns (country / state at checkout, selectWoo): same look as the theme dropdowns */
.select2-container--default .select2-selection--single{height:46px;padding:0 40px 0 14px;border:1px solid var(--line-2);border-radius:10px;background:var(--surface-2);transition:border-color .2s,box-shadow .2s}
.select2-container--default .select2-selection--single:hover{border-color:rgba(30,143,255,.6)}
.select2-container--default.select2-container--open .select2-selection--single,.select2-container--default.select2-container--focus .select2-selection--single{border-color:var(--accent);box-shadow:0 0 0 4px rgba(30,143,255,.18)}
.select2-container--default .select2-selection--single .select2-selection__rendered{color:#fff;font:600 15px var(--body);line-height:44px}
.select2-container--default .select2-selection--single .select2-selection__arrow{top:0;right:12px;width:16px;height:100%}
.select2-container--default .select2-selection--single .select2-selection__arrow b{display:none}
.select2-container--default .select2-selection--single .select2-selection__arrow::after{content:"";position:absolute;left:1px;top:50%;width:14px;height:14px;margin-top:-7px;background:var(--sub);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .25s var(--ease)}
.select2-container--open .select2-selection--single .select2-selection__arrow::after{transform:rotate(180deg);background:var(--accent-hi)}
.select2-dropdown{padding:6px;background:rgba(8,18,33,.98)!important;border:1px solid var(--line-2)!important;border-radius:12px!important;box-shadow:0 24px 50px -16px rgba(0,0,0,.85),0 0 24px -12px rgba(30,143,255,.6);color:var(--text);overflow:hidden}
.select2-dropdown--below{margin-top:6px}
.select2-dropdown--above{margin-top:-6px}
.select2-search--dropdown{padding:2px 2px 8px}
.select2-container--default .select2-search--dropdown .select2-search__field{height:40px;padding:0 12px;border:1px solid var(--line-2);border-radius:8px;background:var(--surface-2);color:#fff;font:15px var(--body);outline:0}
.select2-container--default .select2-search--dropdown .select2-search__field:focus{border-color:var(--accent)}
.select2-container--default .select2-results>.select2-results__options{max-height:280px;scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}
.select2-container--default .select2-results__option{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:8px;color:var(--text);font-size:14.5px}
.select2-container--default .select2-results__option--highlighted[aria-selected],.select2-container--default .select2-results__option--highlighted[data-selected]{background:rgba(30,143,255,.12);color:#fff}
.select2-container--default .select2-results__option[aria-selected=true],.select2-container--default .select2-results__option[data-selected=true]{background:rgba(30,143,255,.2);color:var(--accent-hi);font-weight:700}
.select2-container--default .select2-results__option[aria-selected=true]::after,.select2-container--default .select2-results__option[data-selected=true]::after{content:"\2713";font-weight:800}
@media (prefers-reduced-motion:reduce){.select2-container--default .select2-selection--single .select2-selection__arrow::after{transition:none}}

/* tick boxes and radios: themed instead of the browser's grey squares */
.woocommerce input[type=checkbox],.xbox input[type=checkbox],.ct-form input[type=checkbox]{-webkit-appearance:none;appearance:none;flex:none;width:18px;height:18px;margin:0;border:1.5px solid var(--line-2);border-radius:5px;background:var(--surface-2);cursor:pointer;transition:background .15s,border-color .15s}
.woocommerce input[type=checkbox]:hover,.xbox input[type=checkbox]:hover,.ct-form input[type=checkbox]:hover{border-color:var(--accent)}
.woocommerce input[type=checkbox]:checked,.xbox input[type=checkbox]:checked,.ct-form input[type=checkbox]:checked{border-color:var(--accent);background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center/12px no-repeat;box-shadow:0 0 10px -2px rgba(30,143,255,.8)}
.woocommerce input[type=checkbox]:focus-visible,.xbox input[type=checkbox]:focus-visible,.ct-form input[type=checkbox]:focus-visible{outline:2px solid var(--accent-hi);outline-offset:2px}

/* ---------- fonts (TDU pairing): Quicksand for headings, menu, buttons and prices; Lato for text ---------- */
@font-face{font-family:'Lato';font-weight:400;font-style:normal;font-display:swap;src:url(assets/fonts/lato-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Lato';font-weight:700;font-style:normal;font-display:swap;src:url(assets/fonts/lato-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Lato';font-weight:900;font-style:normal;font-display:swap;src:url(assets/fonts/lato-latin-900-normal.woff2) format('woff2')}
@font-face{font-family:'Quicksand';font-weight:300 700;font-style:normal;font-display:swap;src:url(assets/fonts/quicksand-latin-wght-normal.woff2) format('woff2')}
:root{--body:'Lato','Segoe UI',system-ui,sans-serif;--head:'Quicksand','Lato','Segoe UI',system-ui,sans-serif}
h1,h2,h3,h4,.display,.h2,.nav li>a,.nav .sub-menu a,.mega a,.btn,.woocommerce .button,#place_order,.checkout-button,.hdr-quote,.sbar-filter,.add,
.card h3,.cprice b,.price b,.pline b,.hdr-call b,.kick,.ccat,.fcol h3,.sh-stats b,.dd-btn,.loc-name,.pcall b,.xh,.steps4 h3,.own-tag,.drawer a{font-family:var(--head)}
.display,h1{font-weight:700;letter-spacing:-.01em}
.pdp-info h1,.pdp-faq h2,.steps4-list .n,.badge,.pct{font-family:var(--head)}

/* ---------- "Own your trailer": rotating rainbow glow card, glowing button, steps that light up in turn ---------- */
@property --ga{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes ga{to{--ga:360deg}}
.steps4{position:relative;isolation:isolate;border-color:transparent;background:none}
.steps4::before,.steps4::after{content:"";position:absolute;border-radius:20px;pointer-events:none}
.steps4::before{inset:0;z-index:-2;background:conic-gradient(from var(--ga),#1e8fff,#38bdf8,#a855f7,#ff2d75,#ffc20e,#1e8fff);animation:ga 6s linear infinite}
.steps4::after{inset:1.5px;z-index:-1;border-radius:19px;background:radial-gradient(ellipse 60% 120% at 100% 0%,rgba(30,143,255,.14),transparent 60%),linear-gradient(180deg,#0d1b30,#070f1d)}

.steps4-intro .btn{border:2px solid transparent;background:linear-gradient(180deg,#2c9bff,#1574e3) padding-box,conic-gradient(from var(--ga),#7cc4ff,#a855f7,#ff2d75,#ffc20e,#7cc4ff) border-box;animation:ga 4s linear infinite,btnGlow 6s linear infinite}
@keyframes btnGlow{0%,100%{box-shadow:0 0 18px -2px rgba(30,143,255,.9)}25%{box-shadow:0 0 20px -2px rgba(168,85,247,.85)}50%{box-shadow:0 0 20px -2px rgba(255,45,117,.8)}75%{box-shadow:0 0 20px -2px rgba(255,194,14,.75)}}

.steps4-list .ring{transition:transform .3s var(--ease);animation:ringOn 4s ease-in-out infinite}
.steps4-list li:nth-child(2) .ring{animation-delay:1s}
.steps4-list li:nth-child(3) .ring{animation-delay:2s}
.steps4-list li:nth-child(4) .ring{animation-delay:3s}
@keyframes ringOn{0%,30%,100%{transform:none;border-color:var(--accent);box-shadow:0 0 0 6px rgba(30,143,255,.1),0 0 30px -4px rgba(30,143,255,.7)}12%{transform:scale(1.08);border-color:#7cc4ff;box-shadow:0 0 0 9px rgba(30,143,255,.2),0 0 46px 0 rgba(56,189,248,.95)}}
.steps4-list li:not(:last-child)::before{background:linear-gradient(90deg,transparent,#bfe3ff 50%,transparent) -40% 0/36% 100% no-repeat,linear-gradient(90deg,rgba(30,143,255,.7),rgba(30,143,255,.25));animation:spark 4s ease-in-out infinite}
.steps4-list li:nth-child(2)::before{animation-delay:1s}
.steps4-list li:nth-child(3)::before{animation-delay:2s}
@keyframes spark{0%,8%{background-position:-40% 0,0 0}30%,100%{background-position:140% 0,0 0}}
.steps4-list li:hover .ring{transform:translateY(-4px) scale(1.05)}

@media (prefers-reduced-motion:reduce){
	.steps4::before,.steps4-intro .btn,.steps4-list .ring,.steps4-list li::before{animation:none}
}
.steps4-intro .btn:hover{background:linear-gradient(180deg,#45a8ff,#1e8fff) padding-box,conic-gradient(from var(--ga),#7cc4ff,#a855f7,#ff2d75,#ffc20e,#7cc4ff) border-box}

/* "Add a Toolbox" on the product page (TDU layout): compact cards, photo on a light panel, price, full-width Add to Cart */
.tbx-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.tbx-card{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--line-2);border-radius:12px;background:linear-gradient(180deg,rgba(18,38,76,.6),rgba(9,20,42,.9));transition:border-color .25s,box-shadow .25s,transform .25s var(--ease)}
.tbx-card:hover{border-color:rgba(30,143,255,.6);box-shadow:0 0 24px -10px rgba(30,143,255,.8);transform:translateY(-2px)}
.tbx-pic{display:block;aspect-ratio:1.25;border-radius:8px;background:#0b1729;overflow:hidden}
.tbx-pic img{width:100%;height:100%;object-fit:cover}
.tbx-card h3{margin:4px 0 0;font-size:14.5px;font-weight:600;line-height:1.3}
.tbx-card h3 a{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:#fff;text-decoration:none}
.tbx-card h3 a:hover{color:var(--accent-hi)}
.tbx-price{display:flex;flex-direction:column;margin-top:auto;line-height:1.15}
.tbx-price s{color:var(--muted);font-size:12.5px}
.tbx-price b{color:var(--accent-hi);font:800 18px var(--head)}
.tbx-card .add{width:100%;min-height:38px;justify-content:center}
@media (max-width:1100px){.tbx-row{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* site map */
.sitemap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:clamp(24px,3vw,56px)}
.sitemap h2{font-size:22px;margin:0 0 12px}
.sitemap h3{font-size:17px;margin:18px 0 6px}
.sitemap h3 a{color:var(--accent-hi);text-decoration:none}
.sitemap ul{margin:0;padding-left:18px;color:var(--sub);columns:2;column-gap:28px}
.sitemap>div:first-child ul{columns:1}
.sitemap li{margin:4px 0;break-inside:avoid}
.sitemap li a{color:var(--text);text-decoration:none}
.sitemap li a:hover{color:#fff;text-decoration:underline}
@media (max-width:900px){.sitemap{grid-template-columns:1fr}.sitemap ul{columns:1}}

/* live search suggestions under the header search box */
.search2{position:relative}
.sugg{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:70;margin:0;padding:6px;list-style:none;background:rgba(8,18,33,.98);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid var(--line-2);border-radius:12px;box-shadow:0 24px 50px -16px rgba(0,0,0,.85),0 0 24px -12px rgba(30,143,255,.6);max-height:min(70vh,520px);overflow:auto}
.sugg[hidden]{display:none}
.sugg li[data-url]{display:flex;align-items:center;gap:14px;padding:8px 10px;border-radius:8px;cursor:pointer}
.sugg li[data-url]+li[data-url]{border-top:1px solid var(--line)}
.sugg li[data-url]:hover,.sugg li[aria-selected=true]{background:rgba(30,143,255,.14)}
.sugg img{flex:none;width:48px;height:40px;border-radius:6px;object-fit:cover;background:#0b1729}
.sugg-n{flex:1;min-width:0;color:#fff;font-size:14.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sugg-p{flex:none;display:flex;flex-direction:column;align-items:flex-end;color:var(--accent-hi);font:800 15px var(--head)}
.sugg-p s{color:var(--muted);font:500 12px var(--body)}
.sugg-none{padding:12px;color:var(--sub);font-size:14px}
.sugg-all button{width:100%;margin-top:4px;padding:10px;border:0;border-radius:8px;background:none;color:var(--accent-hi);font:700 14px var(--head);text-align:left;cursor:pointer}
.sugg-all button:hover{background:rgba(30,143,255,.1)}

.hdr2 form.search2 .sugg-all button{display:block;width:100%;height:auto;margin-top:4px;padding:10px;border-radius:8px;background:none;box-shadow:none;color:var(--accent-hi);font:700 14px var(--head);text-align:left}
.hdr2 form.search2 .sugg-all button:hover{background:rgba(30,143,255,.1)}
.vt-rail{z-index:56} /* above the header and mega menu, like TDU */
.mega-warranty img{flex:none;width:52px;height:52px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5))}

/* spec note (TDU style): dark panel, gold info icon, gold shield + "2% PRICE / BEAT GUARANTEE" */
.range-note{background:linear-gradient(90deg,#0d1a2e,#121c2c 60%,#1a1a14);border-color:rgba(255,194,14,.35);box-shadow:0 18px 40px -20px rgba(0,0,0,.9)}
.range-note .ic{border-color:#ffc20e;color:#ffc20e;background:rgba(255,194,14,.08)}
.range-badge svg{color:#ffc20e;filter:drop-shadow(0 0 8px rgba(255,194,14,.45))}
.range-badge b{color:#ffc20e;text-transform:uppercase}
.range-badge>span{color:#e8edf5;font-weight:600;text-transform:uppercase;letter-spacing:.02em}