/*
Theme Name: Diesel Heaters 4U
Theme URI: https://dieselheaters4u.co.uk/
Author: World WebLogic
Author URI: https://worldweblogic.com/
Description: Custom WooCommerce theme for Diesel Heaters 4U – UK diesel heater specialist. Includes 21 Elementor widgets (hero slider, category cards, products, FAQ, forms…) so every page can be edited in Elementor. After activating, go to Appearance → Theme Setup.
Version: 1.1.0
Requires at least: 6.2
Tested up to: 6.8
Requires PHP: 7.4
WC requires at least: 8.0
WC tested up to: 9.9
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dieselheaters4u
Tags: e-commerce, woocommerce, custom-menu, custom-logo, featured-images, full-width-template
*/

/* =========================================================
   DIESEL HEATERS 4U — HOMEPAGE
   Design & Develop by World WebLogic
   ========================================================= */
:root{
  --navy:#021c34;
  --navy-2:#001f3e;
  --navy-3:#0a2a4c;
  --footer:#011a30;
  --red:#e31b23;
  --red-dark:#c4141b;
  --blue:#1f6fe5;
  --text:#18202b;
  --muted:#5b6574;
  --border:#e3e7ee;
  --soft:#f3f6fa;
  --radius:6px;
  --container:1440px;
}
:root{color-scheme:only light}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Poppins',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;color:var(--text);background:#fff;font-size:14px;line-height:1.5;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
ul{list-style:none}
button,input,select{font-family:inherit;font-size:inherit}
.container{max-width:var(--container);margin:0 auto;padding:0 24px}
.ico{width:1em;height:1em;display:inline-block;flex:none;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}
.ico.fill{fill:currentColor;stroke:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;font-size:13px;border-radius:4px;padding:11px 22px;cursor:pointer;border:1.5px solid transparent;transition:background .2s,color .2s,border-color .2s;white-space:nowrap}
.btn .ico{font-size:15px}
.btn-red{background:var(--red);color:#fff;border-color:var(--red)}
.btn-red:hover{background:var(--red-dark);border-color:var(--red-dark)}
.btn-outline{border-color:#fff;color:#fff;background:transparent}
.btn-outline:hover{background:#fff;color:var(--navy)}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:14px}
.section-head h2{font-size:22px;font-weight:700;color:var(--navy);position:relative;padding-bottom:6px;line-height:1.25}
.section-head h2::after{content:"";position:absolute;left:0;bottom:0;width:46px;height:2px;background:var(--red)}
.view-all{color:var(--red);font-weight:600;font-size:13px;display:inline-flex;align-items:center;gap:6px;padding-bottom:6px}
.view-all:hover{text-decoration:underline}

/* ===================== TOP BAR ===================== */
.topbar{background:var(--navy);color:#e3e9f2;font-size:12px}
.topbar .container{display:flex;justify-content:space-between;align-items:center;height:38px;gap:20px}
.topbar .group{display:flex;gap:40px;align-items:center}
.topbar span{display:inline-flex;align-items:center;gap:9px;white-space:nowrap}
.topbar .ico{font-size:15px;color:#fff}

/* ===================== HEADER ===================== */
.header{background:#fff;border-bottom:1px solid var(--border)}
.header .container{display:flex;align-items:center;justify-content:space-between;gap:36px;height:88px}
.logo img{height:62px;width:auto}
.search{flex:1;max-width:520px;display:flex;border:1px solid #d5dbe4;border-radius:4px;overflow:hidden;margin-left:30px}
.search input{flex:1;min-width:0;border:0;background:#fff;padding:11px 16px;font-size:12px;outline:none;color:var(--text)}
.search button{width:50px;border:0;background:var(--red);color:#fff;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.search button:hover{background:var(--red-dark)}
.header-actions{display:flex;align-items:center}
.account{display:flex;align-items:center;gap:12px;padding-right:22px;border-right:1px solid var(--border)}
.account .ico{font-size:28px;color:var(--navy);stroke-width:1.6}
.account strong{display:block;font-size:13px;font-weight:600;color:var(--navy);line-height:1.2}
.account small{font-size:11px;color:var(--muted)}
.icon-link{display:flex;flex-direction:column;align-items:center;font-size:10px;color:var(--muted);position:relative;padding:0 22px;line-height:1.3}
.icon-link .ico{font-size:26px;color:var(--navy);stroke-width:1.6;margin-bottom:3px}
.hdr-cart{display:flex;align-items:center;gap:6px}
.hdr-cart .icon-link{padding-right:8px}
.badge{position:absolute;top:-6px;right:2px;background:var(--red);color:#fff;font-size:10px;min-width:17px;height:17px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:600}
.cart-total{font-weight:600;color:var(--navy);font-size:14px}
.menu-toggle{display:none;background:none;border:0;font-size:28px;color:var(--navy);cursor:pointer;padding:4px}

/* language switcher */
.lang{position:relative;margin-right:22px}
.lang-btn{display:flex;align-items:center;gap:6px;border:1px solid var(--border);background:#fff;border-radius:4px;padding:7px 10px;font-size:12.5px;font-weight:600;color:var(--navy);cursor:pointer}
.lang-btn .ico{font-size:17px}
.lang-btn .ico.sm{font-size:12px}
.lang-list{position:absolute;right:0;top:calc(100% + 6px);min-width:170px;background:#fff;border:1px solid var(--border);border-radius:6px;box-shadow:0 14px 34px rgba(2,28,52,.16);padding:6px 0;opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s;z-index:80}
.lang.open .lang-list{opacity:1;visibility:visible;transform:none}
.lang-list button{display:flex;width:100%;align-items:center;gap:10px;border:0;background:none;padding:8px 14px;font-size:13px;color:var(--text);cursor:pointer;text-align:left}
.lang-list button b{width:24px;font-size:11px;color:var(--muted)}
.lang-list button:hover,.lang-list button.on{background:var(--soft);color:var(--red)}
/* hide Google Translate's own bar */
#google_translate_element,.goog-te-banner-frame,.skiptranslate>iframe,#goog-gt-tt,.goog-te-balloon-frame,.VIpgJd-ZVi9od-ORHb-OEVmcd,.VIpgJd-ZVi9od-aZ2wEe-wOHMyf{display:none!important}
body{top:0!important}
font[style]{background:none!important;box-shadow:none!important}
.topbar a.wa-top{display:inline-flex;align-items:center;gap:8px;color:#fff;font-weight:500}
.topbar a.wa-top .ico{color:#25d366}
/* floating WhatsApp */
.wa-float{position:fixed;right:22px;bottom:22px;z-index:200;display:flex;align-items:center;gap:10px}
.wa-float a{width:58px;height:58px;border-radius:50%;background:#25d366;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 24px rgba(0,0,0,.25);transition:transform .2s}
.wa-float a:hover{transform:scale(1.07)}
.wa-float a .ico{font-size:32px}
.wa-float .wa-tip{background:#fff;color:var(--navy);font-size:12.5px;font-weight:600;padding:8px 12px;border-radius:6px;box-shadow:0 6px 18px rgba(0,0,0,.15);white-space:nowrap}
.wa-pulse{position:absolute;right:0;bottom:0;width:58px;height:58px;border-radius:50%;background:#25d366;opacity:.5;animation:wa 2s infinite;z-index:-1}
@keyframes wa{0%{transform:scale(1);opacity:.5}100%{transform:scale(1.6);opacity:0}}

/* ===================== NAV + DROPDOWNS ===================== */
.nav{background:#fff;border-bottom:1px solid var(--border);position:relative;z-index:50}
.nav .container{display:flex;align-items:center;justify-content:space-between;height:48px;gap:24px}
.allcat-wrap{position:relative}
.all-cat{background:var(--red);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:30px;padding:9px 14px;border-radius:4px;font-weight:600;font-size:13px;min-width:200px;border:0;cursor:pointer}
.all-cat .left{display:flex;align-items:center;gap:8px}
.all-cat .ico{font-size:17px}
.nav-menu{display:flex;flex:1;min-width:0;justify-content:space-between;gap:12px;padding:0 10px;height:100%}
.nav-menu>li{position:relative;display:flex;align-items:center}
.nav-menu>li>a{font-size:13px;font-weight:600;color:var(--navy);display:flex;align-items:center;gap:5px;white-space:nowrap;height:100%;transition:color .2s}
.nav-menu>li>a .ico{font-size:13px;transition:transform .2s}
.nav-menu>li:hover>a,.nav-menu>li:focus-within>a{color:var(--red)}
.nav-menu>li:hover>a .ico{transform:rotate(180deg)}
.special{background:var(--red);color:#fff;font-weight:600;font-size:13px;padding:9px 20px;border-radius:4px;display:flex;align-items:center;gap:8px;white-space:nowrap}
.special:hover{background:var(--red-dark)}
.special .ico{font-size:15px}

/* dropdown panels */
.dd{position:absolute;top:100%;left:-14px;min-width:250px;background:#fff;border:1px solid var(--border);border-top:3px solid var(--red);border-radius:0 0 6px 6px;box-shadow:0 18px 40px rgba(2,28,52,.16);padding:10px 0;opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s;z-index:60}
.nav-menu>li:hover>.dd,.nav-menu>li:focus-within>.dd,.nav-menu>li.open>.dd{opacity:1;visibility:visible;transform:none}
.dd a{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 18px;font-size:13px;color:var(--text);transition:.15s}
.dd a:hover{background:var(--soft);color:var(--red);padding-left:22px}
.dd .dd-title{display:block;font-size:12px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--navy);padding:6px 18px 6px;margin-top:4px}
.dd .dd-all{border-top:1px solid var(--border);margin-top:6px;padding-top:10px;color:var(--red);font-weight:600}
.dd.mega{display:grid;grid-template-columns:repeat(3,minmax(200px,1fr));min-width:680px;padding:14px 6px}
.dd.mega.two{grid-template-columns:repeat(2,minmax(210px,1fr));min-width:470px}
.dd.mega .dd-all{grid-column:1/-1}
.nav-menu>li:nth-last-child(-n+3)>.dd{left:auto;right:-14px}

/* all categories panel */
.allcat-panel{position:absolute;top:calc(100% + 6px);left:0;width:270px;background:#fff;border:1px solid var(--border);border-radius:6px;box-shadow:0 18px 40px rgba(2,28,52,.18);padding:8px 0;opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s;z-index:70}
.allcat-wrap:hover .allcat-panel,.allcat-wrap.open .allcat-panel{opacity:1;visibility:visible;transform:none}
.allcat-panel>li{position:relative}
.allcat-panel>li>a{display:flex;justify-content:space-between;align-items:center;padding:10px 18px;font-size:13px;font-weight:500;color:var(--navy)}
.allcat-panel>li>a .ico{font-size:14px;color:#9aa3b1}
.allcat-panel>li:hover>a{background:var(--soft);color:var(--red)}
.allcat-panel .fly{position:absolute;left:100%;top:-9px;min-width:250px;background:#fff;border:1px solid var(--border);border-radius:6px;box-shadow:0 18px 40px rgba(2,28,52,.16);padding:8px 0;opacity:0;visibility:hidden;transition:.15s}
.allcat-panel>li:hover>.fly{opacity:1;visibility:visible}
.allcat-panel .fly a{display:block;padding:8px 18px;font-size:13px;color:var(--text)}
.allcat-panel .fly a:hover{background:var(--soft);color:var(--red)}

/* ===================== HERO ===================== */
.hero{position:relative;height:340px;overflow:hidden;background:linear-gradient(180deg,#0c2944 0%,#04203b 45%,#021a31 100%)}
.hero-photo{position:absolute;top:0;right:0;bottom:0;width:56%;min-width:640px;background:url('assets/images/hero-banner.jpg') right center/cover no-repeat;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.6) 12%,#000 24%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.6) 12%,#000 24%)}
.hero .container{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:center;color:#fff}
/* hero slider */
.hero .slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .8s ease,visibility .8s}
.hero .slide.active{opacity:1;visibility:visible;z-index:1}
.hero .slide .container>*{transform:translateY(14px);opacity:0;transition:transform .7s ease .15s,opacity .7s ease .15s}
.hero .slide.active .container>*{transform:none;opacity:1}
.s-prod{background:linear-gradient(90deg,#021a31 0%,#04203b 55%,#0b2a49 100%)}
.s-prod::before{content:"";position:absolute;inset:0;z-index:-1;background:url('assets/images/hero-banner.jpg') right center/cover no-repeat;opacity:.16}
.s-prod::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#021a31 0%,rgba(2,26,49,.85) 40%,rgba(2,26,49,.2) 100%)}
.spot{position:absolute;right:7%;top:0;bottom:0;margin:auto 0;width:430px;height:270px;display:flex;align-items:center;justify-content:center}
.spot::before{content:"";position:absolute;inset:-70px -90px;background:radial-gradient(ellipse at center,#ffffff 0%,#ffffff 30%,#eef4fa 48%,rgba(238,244,250,0) 70%)}
.spot img{position:relative;max-width:88%;max-height:88%;object-fit:contain;mix-blend-mode:multiply}
.spot .tag{position:absolute;right:-6px;top:4px;background:var(--red);color:#fff;font-weight:700;font-size:13px;padding:8px 14px;border-radius:30px;box-shadow:0 8px 18px rgba(227,27,35,.35);z-index:2}
.brand-badge{display:inline-flex;align-self:flex-start;background:#fff;border-radius:4px;padding:6px 12px;margin-bottom:12px}
.brand-badge img{height:22px;width:auto}
.s-prod p{max-width:520px}
.hero .price-line{font-size:15px;margin:-10px 0 22px;color:#dfe6f0}
.hero .price-line b{color:#fff;font-size:22px;margin-left:4px}
.h-nav{position:absolute;right:24px;bottom:18px;z-index:5;display:flex;gap:8px}
.h-nav button{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:rgba(2,26,49,.45);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.2s}
.h-nav button:hover{background:var(--red);border-color:var(--red)}
.h-nav .ico{font-size:17px}
.h-nav .prev .ico{transform:rotate(180deg)}
.h-dots{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);z-index:5;display:flex;gap:8px}
.h-dots button{width:9px;height:9px;border-radius:50%;border:0;background:rgba(255,255,255,.5);cursor:pointer;padding:0;transition:.25s}
.h-dots button.on{background:var(--red);width:26px;border-radius:5px}
.eyebrow{letter-spacing:5px;font-size:12px;font-weight:500;margin-bottom:10px;color:#dfe6f0}
.hero h1{font-size:47px;line-height:1.12;font-weight:700;margin-bottom:14px;letter-spacing:-.3px}
.hero h1 span{color:var(--red)}
.hero p{font-size:14.5px;max-width:600px;margin-bottom:26px;color:#f0f4f9;line-height:1.55}
.hero-btns{display:flex;gap:34px}
.hero-btns .btn{padding:12px 34px;font-size:14px;min-width:240px}

/* ===================== FEATURES STRIP ===================== */
.features{background:#fff;border-bottom:1px solid var(--border)}
.features .container{display:grid;grid-template-columns:repeat(5,1fr);padding-top:18px;padding-bottom:18px}
.feature{display:flex;align-items:center;gap:16px;padding:2px 26px;border-right:1px solid var(--border)}
.feature:first-child{padding-left:20px}
.feature:last-child{border-right:0}
.feature>.ico{font-size:34px;color:var(--red);stroke-width:1.7}
.feature h4{font-size:13.5px;font-weight:600;color:var(--navy);line-height:1.3}
.feature p{font-size:11.5px;color:var(--muted)}
.tp{display:flex;align-items:center;gap:2px;margin-top:4px}
.tp i{width:18px;height:18px;background:#00b67a;display:flex;align-items:center;justify-content:center}
.tp i .ico{font-size:12px;color:#fff}
.tp span{font-size:11px;font-weight:600;margin-left:7px;display:flex;align-items:center;gap:3px;color:#191919}
.tp span .ico{font-size:13px;color:#00b67a}

/* ===================== CATEGORIES ===================== */
.categories{padding:16px 0 8px}
.cat-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
/* product-photo cards (Webasto / Eberspächer images from eBay shop) */
.cat-card .cat-img{position:absolute;top:0;left:0;right:0;height:72%;background:linear-gradient(180deg,#cfdff0 0%,#eaf2fa 55%,#f7fafd 100%);isolation:isolate;display:flex;align-items:center;justify-content:center}
.cat-card .cat-img img{position:static;width:100%;height:100%;object-fit:contain;padding:14px 16px 34px;mix-blend-mode:multiply}
.cat-card{position:relative;height:250px;border-radius:5px;overflow:hidden;background:var(--navy);display:block;box-shadow:0 4px 14px rgba(2,28,52,.12)}
.cat-card img{position:absolute;top:0;left:0;width:100%;height:72%;object-fit:cover;transition:transform .5s}
.cat-card:hover img{transform:scale(1.06)}
.cat-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(2,28,52,.55) 52%,rgba(2,28,52,.96) 72%,var(--navy) 100%)}
.cat-info{position:absolute;left:16px;right:14px;bottom:16px;z-index:2;color:#fff;display:flex;justify-content:space-between;align-items:flex-end;gap:10px}
.cat-info h3{font-size:17px;font-weight:500;margin-bottom:3px;line-height:1.25}
.cat-info p{font-size:12.5px;color:#dbe3ee;line-height:1.4}
.circle-arrow{flex:none;width:32px;height:32px;border-radius:50%;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;margin-bottom:6px;transition:transform .2s}
.circle-arrow .ico{font-size:16px}
.cat-card:hover .circle-arrow{transform:translateX(3px)}

/* ===================== FINDER ===================== */
.finder-wrap{padding:8px 0 14px}
.finder{position:relative;border-radius:5px;overflow:hidden;padding:30px 40px 30px;min-height:205px;border:1px solid #dfe8f3;
  background:linear-gradient(180deg,#e9f3fc 0%,#f2f7fd 55%,#e8f1fa 100%)}
.finder::before{content:"";position:absolute;right:0;top:0;bottom:0;width:40%;background:radial-gradient(ellipse at 70% 55%,#ffffff 0%,rgba(255,255,255,.6) 40%,transparent 70%)}
.finder-prod{position:absolute;right:28px;top:50%;transform:translateY(-50%);height:88%;max-width:30%;object-fit:contain;mix-blend-mode:multiply;z-index:1}
.finder-content{position:relative;z-index:2;max-width:72%}
.finder h2{font-size:33px;font-weight:700;color:var(--text);margin-bottom:2px;letter-spacing:-.3px}
.finder>.finder-content>p{color:#3d4654;font-size:13px;margin-bottom:24px}
.finder-form{display:flex;gap:12px;flex-wrap:wrap}
.select-box{flex:1;min-width:170px;display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--border);border-radius:4px;padding:0 14px;height:48px;box-shadow:0 2px 6px rgba(2,28,52,.05)}
.select-box .ico{font-size:22px;color:var(--navy)}
.select-box select{flex:1;min-width:0;border:0;outline:none;background:transparent;font-size:12px;color:var(--text);cursor:pointer;height:100%;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23021c34' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right center;padding-right:18px}
.finder-form .btn{height:48px;padding:0 24px;font-size:13px}

/* ===================== PRODUCTS ===================== */
.products{padding:6px 0 16px}
.slider{position:relative}
.track{--per:6;display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - (var(--per) - 1)*14px)/var(--per));gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:4px 1px 6px}
.track::-webkit-scrollbar{display:none}
.track .dh-card{scroll-snap-align:start}
.s-arrow{position:absolute;top:42%;transform:translateY(-50%);z-index:5;width:38px;height:38px;border-radius:50%;border:1px solid var(--border);background:#fff;color:var(--navy);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 6px 16px rgba(2,28,52,.14);transition:.2s}
.s-arrow:hover{background:var(--red);color:#fff;border-color:var(--red)}
.s-arrow .ico{font-size:18px}
.s-arrow.prev{left:-16px}.s-arrow.next{right:-16px}
.s-arrow.prev .ico{transform:rotate(180deg)}
.s-dots{display:flex;justify-content:center;gap:7px;margin-top:12px}
.s-dots button{width:8px;height:8px;border-radius:50%;border:0;background:#cdd5e0;cursor:pointer;padding:0;transition:.2s}
.s-dots button.on{background:var(--red);width:22px;border-radius:4px}
.p-brand{font-size:10.5px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
.dh-card{border:1px solid var(--border);border-radius:5px;padding:12px 14px 14px;position:relative;background:#fff;display:flex;flex-direction:column;transition:box-shadow .25s,transform .25s}
.dh-card:hover{box-shadow:0 10px 26px rgba(2,28,52,.1);transform:translateY(-3px)}
.wish{position:absolute;top:10px;right:10px;background:#fff;border:0;color:#7c8594;font-size:19px;cursor:pointer;z-index:2;padding:2px;line-height:0}
.wish:hover,.wish.on{color:var(--red)}
.wish.on .ico{fill:currentColor}
.dh-card .thumb{height:112px;display:flex;align-items:center;justify-content:center;margin:4px 0 12px}
.dh-card .thumb{isolation:isolate}
.dh-card .thumb img{max-height:112px;max-width:100%;width:auto;object-fit:contain;mix-blend-mode:multiply}
.dh-card h4{font-size:12.5px;font-weight:500;line-height:1.4;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:35px}
.dh-card h4 a:hover{color:var(--red)}
.price{color:var(--red);font-weight:700;font-size:17px;margin:2px 0 10px}
.dh-card .btn{width:100%;padding:8px 10px;font-size:12.5px;margin-top:auto}

/* ===================== SERVICE BANNERS ===================== */
.service-banners{display:grid;grid-template-columns:1.12fr 1fr 1fr;gap:4px}
.sb{position:relative;min-height:178px;background-color:var(--navy);background-repeat:no-repeat;background-size:auto 100%;overflow:hidden;display:flex;align-items:center}
.sb::before{content:"";position:absolute;inset:0}
.sb-1{background-position:left center}
.sb-2{background-position:left center}
.sb-3{background-position:right center}
.sb-1::before{background:linear-gradient(90deg,transparent 0%,transparent 24%,rgba(2,28,52,.85) 33%,var(--navy) 38%)}
.sb-2::before{background:linear-gradient(90deg,transparent 0%,transparent 12%,rgba(2,28,52,.8) 20%,var(--navy) 26%)}
.sb-3::before{background:linear-gradient(90deg,var(--navy) 0%,var(--navy) 70%,rgba(2,28,52,.5) 78%,transparent 90%)}
.sb-inner{position:relative;z-index:2;display:flex;gap:16px;padding:20px 24px;color:#fff}
.sb-1 .sb-inner{margin-left:34%}
.sb-2 .sb-inner{margin-left:25%}
.sb-icon{flex:none;width:52px;height:52px;border-radius:6px;display:flex;align-items:center;justify-content:center;color:#fff}
.sb-icon .ico{font-size:26px}
.sb-icon.red{background:var(--red)}
.sb-icon.blue{background:var(--blue)}
.sb h3{font-size:16.5px;font-weight:600;margin-bottom:4px;white-space:nowrap}
.sb p{font-size:12.5px;color:#d6deea;margin-bottom:14px;max-width:270px;line-height:1.5}
.sb .btn{padding:8px 22px;font-size:12.5px}

/* ===================== BRANDS ===================== */
.brands{padding:16px 0 6px}
.brand-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.brand{border:1px solid var(--border);border-radius:5px;height:58px;display:flex;align-items:center;justify-content:center;padding:8px 18px;transition:box-shadow .25s,border-color .25s;background:#fff}
.brand:hover{box-shadow:0 6px 18px rgba(2,28,52,.08);border-color:#cfd7e3}
.brand img{height:32px;max-width:100%;width:auto;object-fit:contain}
.brand img.big{height:42px}

/* ===================== ARTICLES ===================== */
.articles{padding:10px 0 16px}
.article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.article{display:flex;gap:18px;align-items:flex-start}
.article .a-img{flex:none;width:182px;height:96px;border-radius:3px;overflow:hidden;background:var(--soft)}
.article .a-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.article:hover .a-img img{transform:scale(1.07)}
.a-img.prod-img{background:#fff;border:1px solid var(--border)}
.a-img.prod-img img{object-fit:contain;padding:6px}
.article h4{font-size:13px;font-weight:600;color:var(--text);line-height:1.38;margin-bottom:6px}
.article p{font-size:12px;color:var(--muted);margin-bottom:6px;line-height:1.45}
.read-more{color:var(--red);font-weight:600;font-size:12.5px;display:inline-flex;gap:6px;align-items:center}
.read-more .ico{font-size:14px}

/* ===================== NEWSLETTER ===================== */
.newsletter{background:var(--navy-2)}
.newsletter .container{display:flex;align-items:center;gap:24px;padding-top:13px;padding-bottom:13px}
.nl-text{display:flex;align-items:center;gap:18px;color:#fff;flex:1}
.nl-text>.ico{font-size:38px;stroke-width:1.4}
.nl-text h3{font-size:18px;font-weight:600;line-height:1.25}
.nl-text p{font-size:11.5px;color:#c9d3e2}
.nl-form{display:flex;flex:0 1 490px;min-width:0}
.nl-form input{flex:1;min-width:0;width:100%;border:0;padding:11px 16px;font-size:12px;border-radius:3px 0 0 3px;outline:none}
.nl-form button{border:0;background:var(--red);color:#fff;padding:0 30px;font-weight:600;font-size:13px;border-radius:0 3px 3px 0;cursor:pointer;flex:none}
.nl-form button:hover{background:var(--red-dark)}
.socials{display:flex;gap:18px;align-items:center}
.socials a{color:#fff;font-size:21px;transition:color .2s;display:flex}
.socials a:hover{color:var(--red)}
.newsletter .socials{margin-left:40px}

/* ===================== FOOTER ===================== */
.footer{background:var(--footer);color:#cfd8e5;padding:26px 0 20px;border-top:1px solid rgba(255,255,255,.08)}
.footer-grid{display:grid;grid-template-columns:1.45fr .9fr 1fr 1.05fr 1.2fr;gap:28px}
.footer-logo img{height:56px;width:auto;margin-bottom:14px}
.footer .about p{font-size:12px;line-height:1.65;margin-bottom:14px;max-width:285px}
.footer .about .socials{gap:16px}
.footer .about .socials a{font-size:21px}
.footer h5{color:#fff;font-size:13px;font-weight:600;margin-bottom:9px}
.footer ul li{margin-bottom:3px}
.footer ul a{font-size:12px;transition:color .2s}
.footer ul a:hover{color:#fff}
.contact-col{border-left:1px solid rgba(255,255,255,.14);padding-left:38px}
.contact-item{display:flex;gap:16px;font-size:12px;margin-bottom:10px;line-height:1.5}
.contact-item>.ico{color:#fff;font-size:17px;margin-top:2px}
.contact-item a{text-decoration:underline}
.copyright{background:var(--footer);color:#cfd8e5;font-size:12px;border-top:1px solid rgba(255,255,255,.12)}
.copyright .container{display:flex;align-items:center;justify-content:space-between;height:52px;gap:20px}
.copyright b{color:#fff;font-weight:500}
.payments{display:flex;gap:8px}
.pay{background:#fff;border-radius:4px;width:46px;height:28px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;font-family:Arial,sans-serif;letter-spacing:-.2px}
.pay.visa{color:#1a1f71;font-style:italic;font-size:13px}
.pay.mc{position:relative}
.pay.mc i{width:15px;height:15px;border-radius:50%;display:block}
.pay.mc i:first-child{background:#eb001b;margin-right:-6px}
.pay.mc i:last-child{background:#f79e1b;opacity:.9}
.pay.pp{color:#003087;font-style:italic;font-size:10.5px}
.pay.pp b{color:#009cde}
.pay.ap{color:#000;font-size:8.5px;font-weight:700}
.pay.gp{color:#5f6368;font-size:11px;font-weight:600}

/* ===================== PHONE / PC IN DARK MODE =====================
   Header turns navy + white logo, so the logo is always visible */
@media (prefers-color-scheme: dark){
  .header{background:var(--navy);border-bottom:1px solid rgba(255,255,255,.12)}
  .account,.account .ico,.account strong,.icon-link,.icon-link .ico,.cart-total,.menu-toggle{color:#fff}
  .account small,.icon-link{color:#c9d3e2}
  .account{border-right-color:rgba(255,255,255,.15)}
  .lang-btn{background:transparent;border-color:rgba(255,255,255,.3);color:#fff}
  .search{border-color:transparent}
}

/* ===================== RESPONSIVE ===================== */
@media(max-width:1280px){
  .nav-menu>li>a{font-size:12px}
  .all-cat{min-width:180px;gap:16px}
  .track{--per:4}
  .cat-grid{grid-template-columns:repeat(3,1fr)}
  .hero h1{font-size:42px}
  .feature{padding:2px 14px}
  .sb h3{white-space:normal}
}
@media(max-width:1060px){
  .topbar .group:first-child span:nth-child(n+2){display:none}
  .search{margin-left:0}
  .menu-toggle{display:block}
  .nav .container{flex-wrap:wrap;height:auto;padding-top:8px;padding-bottom:8px}
  .allcat-wrap{display:none}
  .nav-menu{display:none;flex-direction:column;gap:0;width:100%;flex:1 1 100%;order:3;padding:6px 0;height:auto}
  .special{flex:1;justify-content:center}
  .nav.open .nav-menu{display:flex}
  .nav-menu>li{flex-direction:column;align-items:stretch;border-bottom:1px solid var(--border)}
  .nav-menu>li>a{padding:12px 4px;justify-content:space-between;font-size:14px}
  .dd,.dd.mega,.dd.mega.two{position:static;display:none;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;border-top:0;min-width:0;padding:0 0 10px 10px;grid-template-columns:1fr}
  .nav-menu>li.open>.dd{display:block}
  .nav-menu>li:hover>.dd{display:none}
  .nav-menu>li.open:hover>.dd{display:block}
  .special{margin-left:auto}
  .features .container{grid-template-columns:repeat(3,1fr);row-gap:16px}
  .feature,.feature:first-child{border-right:0;padding:0}
  .track{--per:3}
  .cat-grid{grid-template-columns:repeat(3,1fr)}
  .finder-content{max-width:100%}
  .finder::before,.finder-prod{display:none}
  .service-banners{grid-template-columns:1fr}
  .brand-grid{grid-template-columns:repeat(3,1fr)}
  .article-grid{grid-template-columns:1fr;gap:18px}
  .newsletter .container{flex-wrap:wrap}
  .nl-form{flex:1 1 100%}
  .newsletter .socials{margin-left:0}
  .footer-grid{grid-template-columns:1fr 1fr}
  .contact-col{border-left:0;padding-left:0}
}
@media(max-width:760px){
  .search{display:none}
}
@media(max-width:640px){
  .container{padding:0 16px}
  .topbar .group:last-child{display:none}
  .header .container{height:68px;gap:10px}
  .logo img{height:34px}
  .lang{margin-right:6px}
  .lang-btn{padding:6px 7px}
  .lang-btn .lbl-full{display:none}
  .wa-float{right:14px;bottom:14px}
  .wa-float .wa-tip{display:none}
  .wa-float a,.wa-pulse{width:52px;height:52px}
  .account{border:0;padding-right:4px}
  .account div,.icon-link.wl,.cart-total{display:none}
  .icon-link{padding:0 8px}
  .special{padding:9px 14px}
  .hero{height:600px}
  .spot{right:0;left:0;top:auto;bottom:62px;margin:0 auto;width:300px;height:175px}
  .spot::before{inset:-40px -40px}
  .spot .tag{font-size:12px;padding:6px 11px}
  .s-prod .container{justify-content:flex-start;padding-top:34px}
  .s-prod::after{background:linear-gradient(180deg,#021a31 0%,rgba(2,26,49,.9) 55%,rgba(2,26,49,.5) 100%)}
  .hero .price-line{margin:-6px 0 16px}
  .h-nav{display:none}
  .h-dots{bottom:22px}
  .hero-photo{width:100%;min-width:0;-webkit-mask-image:none;mask-image:none;background-position:65% center}
  .s-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,26,49,.88) 0%,rgba(2,26,49,.6) 60%,rgba(2,26,49,.4) 100%)}
  .hero h1{font-size:32px}
  .hero h1 br,.hero p br{display:none}
  .hero p{font-size:14px}
  .hero-btns{flex-direction:column;gap:12px;align-items:stretch}
  .s-prod .hero-btns{flex-direction:row}
  .s-prod .hero-btns .btn{flex:1;padding:12px 10px;font-size:13px}
  .s-prod p{display:none}
  .hero-btns .btn{min-width:0}
  .features .container{grid-template-columns:1fr;row-gap:14px}
  .section-head h2{font-size:19px}
  .view-all{font-size:12px}
  .cat-grid{grid-template-columns:1fr 1fr;gap:10px}
  .features .container{padding-left:16px;padding-right:16px}
  .feature{display:grid;grid-template-columns:40px 1fr;gap:14px;align-items:center}
  .feature>.ico{justify-self:center}
  .cat-card{height:200px}
  .cat-info{left:12px;right:10px;bottom:12px}
  .cat-info h3{font-size:15px}
  .cat-info p{font-size:11px}
  .circle-arrow{width:26px;height:26px}
  .finder{padding:22px 16px}
  .finder h2{font-size:24px}
  .select-box{flex:1 1 100%}
  .finder-form .btn{width:100%}
  .track{--per:2;gap:10px;grid-auto-columns:calc((100% - 10px)/2)}
  .s-arrow{display:none}
  .sb-1 .sb-inner{margin-left:30%}
  .sb-2 .sb-inner{margin-left:20%}
  .sb-inner{padding:18px 16px;gap:12px}
  .sb-icon{width:42px;height:42px}
  .brand-grid{grid-template-columns:1fr 1fr}
  .article .a-img{width:42%;height:88px}
  .footer-grid{grid-template-columns:1fr}
  .copyright .container{flex-direction:column;height:auto;padding-top:14px;padding-bottom:14px;text-align:center;gap:10px}
}

/* =========================================================
   SHOP PAGES: category listing, product page, basket
   ========================================================= */
#view-page{min-height:60vh}
.page-banner{background:linear-gradient(90deg,#021a31 0%,#04203b 55%,#0b2a49 100%);color:#fff;position:relative;overflow:hidden}
.page-banner::after{content:"";position:absolute;inset:0;background:url('assets/images/hero-banner.jpg') right center/cover no-repeat;opacity:.13}
.page-banner .container{position:relative;z-index:1;padding-top:26px;padding-bottom:28px}
.crumbs{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:12px;color:#c9d3e2;margin-bottom:10px}
.crumbs a:hover{color:#fff;text-decoration:underline}
.crumbs .ico{font-size:12px;opacity:.7}
.page-banner h1{font-size:32px;font-weight:700;line-height:1.2;margin-bottom:6px}
.page-banner p{font-size:13.5px;color:#d6deea;max-width:720px}
.page-banner .count{display:inline-block;margin-top:12px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);padding:4px 12px;border-radius:30px;font-size:12px}

.shop{display:grid;grid-template-columns:262px 1fr;gap:28px;padding-top:26px;padding-bottom:44px;align-items:start}
.shop>div{min-width:0}
.sidebar .box{border:1px solid var(--border);border-radius:6px;padding:16px 16px 12px;margin-bottom:16px;background:#fff}
.sidebar h3{font-size:13.5px;font-weight:700;color:var(--navy);margin-bottom:10px;text-transform:uppercase;letter-spacing:.4px}
.cat-tree>li{border-bottom:1px solid #eef1f5}
.cat-tree>li:last-child{border-bottom:0}
.cat-tree a{display:flex;justify-content:space-between;gap:8px;padding:7px 0;font-size:13px;color:var(--text)}
.cat-tree>li>a{font-weight:600;color:var(--navy)}
.cat-tree a:hover,.cat-tree a.on{color:var(--red)}
.cat-tree a span{color:#97a0ad;font-weight:400;font-size:12px}
.cat-tree .subs{padding:0 0 6px 12px;margin-left:2px;border-left:2px solid #eef1f5}
.cat-tree .subs a{padding:5px 0;font-size:12.5px}
.chk{display:flex;gap:9px;align-items:center;font-size:13px;padding:5px 0;cursor:pointer;color:var(--text)}
.chk input{accent-color:var(--red);width:15px;height:15px}
.chk span{margin-left:auto;color:#97a0ad;font-size:12px}
.clear-f{font-size:12px;color:var(--red);font-weight:600;background:none;border:0;cursor:pointer;padding:4px 0}
.side-help{background:var(--navy);color:#fff;border:0!important}
.side-help h3{color:#fff}
.side-help p{font-size:12.5px;color:#c9d3e2;margin-bottom:12px}
.side-help .btn{width:100%;background:#25d366;border-color:#25d366;color:#fff}

.toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.toolbar .res{font-size:13px;color:var(--muted)}
.toolbar .res b{color:var(--navy)}
.toolbar .right{display:flex;gap:10px;align-items:center}
.toolbar select{border:1px solid var(--border);border-radius:4px;padding:8px 10px;font-size:12.5px;background:#fff;color:var(--text);cursor:pointer}
.f-close{display:none;width:100%;margin-bottom:12px;border:0;background:var(--navy);color:#fff;border-radius:4px;padding:11px;font-weight:600;font-size:13px;cursor:pointer}
.f-toggle{display:none;align-items:center;gap:6px;border:1px solid var(--border);background:#fff;border-radius:4px;padding:8px 12px;font-size:12.5px;font-weight:600;color:var(--navy);cursor:pointer}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.chip{border:1px solid var(--border);border-radius:30px;padding:6px 14px;font-size:12.5px;color:var(--navy);background:#fff;transition:.15s;white-space:nowrap}
.chip:hover{border-color:var(--red);color:var(--red)}
.chip.on{background:var(--red);border-color:var(--red);color:#fff}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.grid .dh-card .thumb{height:150px}
.grid .dh-card .thumb img{max-height:150px}
.p-cond{position:absolute;left:10px;top:10px;font-size:10.5px;font-weight:700;letter-spacing:.3px;background:#fff3cd;color:#8a6100;border-radius:3px;padding:2px 7px;z-index:2}
.pager{display:flex;justify-content:center;gap:6px;margin-top:24px;flex-wrap:wrap}
.pager button{min-width:38px;height:38px;border:1px solid var(--border);background:#fff;border-radius:4px;font-weight:600;color:var(--navy);cursor:pointer}
.pager button.on,.pager button:hover{background:var(--red);border-color:var(--red);color:#fff}
.empty{border:1px dashed #cfd7e3;border-radius:8px;padding:40px 20px;text-align:center;color:var(--muted)}
.empty h3{color:var(--navy);margin-bottom:6px}

/* product page */
.pdp{display:grid;grid-template-columns:1.05fr 1fr;gap:44px;padding-top:28px;padding-bottom:20px;align-items:start}
.gallery .main{position:relative;border:1px solid var(--border);border-radius:8px;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;background:#fff;overflow:hidden;isolation:isolate;cursor:zoom-in}
.gallery .main img{width:100%;height:100%;object-fit:contain;padding:24px;mix-blend-mode:multiply;transition:transform .3s}
.gallery .main.zoom img{transform:scale(1.8)}
.thumbs{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.thumbs button{width:78px;height:78px;border:2px solid var(--border);border-radius:6px;background:#fff;padding:4px;cursor:pointer;isolation:isolate}
.thumbs button img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.thumbs button.on{border-color:var(--red)}
.info .tags{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.tag{font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;border-radius:3px;padding:4px 9px}
.tag.tb{background:var(--navy);color:#fff}
.tag.new{background:#e6f6ec;color:#137a3a}
.tag.used{background:#fff3cd;color:#8a6100}
.info h1{font-size:25px;line-height:1.3;color:var(--navy);font-weight:700;margin-bottom:8px}
.info .pn{font-size:12.5px;color:var(--muted);margin-bottom:16px}
.info .pn b{color:var(--text)}
.info .pprice{font-size:32px;font-weight:700;color:var(--red);line-height:1}
.info .vat{font-size:12px;color:var(--muted);margin:6px 0 16px}
.info .lead{font-size:14px;color:#3d4654;line-height:1.65;margin-bottom:18px}
.keyspecs{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;margin-bottom:20px;padding:14px 16px;background:var(--soft);border-radius:6px}
.keyspecs div{font-size:12.5px;color:var(--muted)}
.keyspecs b{display:block;color:var(--navy);font-size:13px}
.buy{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.qty{display:flex;border:1px solid #cfd7e3;border-radius:4px;overflow:hidden;height:48px}
.qty button{width:40px;border:0;background:#fff;font-size:18px;cursor:pointer;color:var(--navy)}
.qty input{width:44px;border:0;text-align:center;font-weight:600;font-size:15px;color:var(--navy);background:#fff}
.buy .btn{height:48px;padding:0 26px;font-size:14px;flex:1;min-width:170px}
.btn-navy{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn-navy:hover{background:#0a2a4c}
.wa-enq{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:46px;border-radius:4px;border:1.5px solid #25d366;color:#128c46;font-weight:600;font-size:13.5px;margin-bottom:20px}
.wa-enq .ico{font-size:20px;color:#25d366}
.wa-enq:hover{background:#25d366;color:#fff}.wa-enq:hover .ico{color:#fff}
.assure{display:grid;grid-template-columns:1fr 1fr;gap:12px;border-top:1px solid var(--border);padding-top:18px}
.assure div{display:flex;gap:10px;align-items:center;font-size:12.5px;color:var(--muted)}
.assure b{display:block;color:var(--navy);font-size:13px}
.assure .ico{font-size:26px;color:var(--red);stroke-width:1.7}
.tabs{margin-top:26px;border:1px solid var(--border);border-radius:8px;overflow:hidden}
.tab-btns{display:flex;background:var(--soft);border-bottom:1px solid var(--border);overflow-x:auto}
.tab-btns button{border:0;background:none;padding:14px 22px;font-weight:600;font-size:13.5px;color:var(--muted);cursor:pointer;border-bottom:3px solid transparent;white-space:nowrap}
.tab-btns button.on{color:var(--navy);border-bottom-color:var(--red);background:#fff}
.tab-panel{padding:22px 24px;font-size:14px;line-height:1.7;color:#3d4654}
.tab-panel ul{list-style:disc;padding-left:20px;margin-top:10px}
.spec-table{width:100%;border-collapse:collapse;font-size:13.5px}
.spec-table th,.spec-table td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--border);vertical-align:top}
.spec-table th{width:34%;color:var(--navy);background:var(--soft);font-weight:600}
.related{padding:28px 0 44px}

/* basket drawer + toast */
.drawer-bg{position:fixed;inset:0;background:rgba(2,20,40,.5);z-index:300;opacity:0;visibility:hidden;transition:.25s}
.drawer{position:fixed;top:0;right:0;bottom:0;width:390px;max-width:92vw;background:#fff;z-index:301;transform:translateX(100%);transition:transform .3s ease;display:flex;flex-direction:column}
body.cart-open .drawer{transform:none}
body.cart-open .drawer-bg{opacity:1;visibility:visible}
.drawer-h{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--border)}
.drawer-h h3{font-size:17px;color:var(--navy)}
.drawer-h button{border:0;background:none;font-size:26px;cursor:pointer;color:var(--navy);line-height:1}
.drawer-items{flex:1;overflow:auto;padding:8px 20px}
.ci{display:grid;grid-template-columns:64px 1fr auto;gap:12px;padding:14px 0;border-bottom:1px solid var(--border);align-items:center}
.ci .im{width:64px;height:64px;border:1px solid var(--border);border-radius:4px;isolation:isolate;display:flex;align-items:center;justify-content:center}
.ci .im img{max-width:100%;max-height:100%;mix-blend-mode:multiply}
.ci h5{font-size:12.5px;font-weight:500;line-height:1.35;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ci .q{font-size:12px;color:var(--muted);margin-top:3px}
.ci .r{text-align:right}
.ci .r b{display:block;color:var(--red);font-size:14px}
.ci .r button{border:0;background:none;color:var(--muted);font-size:11.5px;cursor:pointer;text-decoration:underline;margin-top:4px}
.drawer-f{border-top:1px solid var(--border);padding:16px 20px 20px}
.drawer-f .sub{display:flex;justify-content:space-between;font-size:15px;font-weight:600;color:var(--navy);margin-bottom:12px}
.drawer-f .btn{width:100%;height:46px;margin-bottom:8px}
.drawer-f small{display:block;text-align:center;color:var(--muted);font-size:11.5px}
.drawer-empty{text-align:center;color:var(--muted);padding:50px 10px}
.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,30px);background:var(--navy);color:#fff;padding:12px 18px;border-radius:6px;font-size:13px;font-weight:500;z-index:400;opacity:0;transition:.3s;display:flex;gap:10px;align-items:center;box-shadow:0 10px 26px rgba(0,0,0,.25)}
.toast.show{opacity:1;transform:translate(-50%,0)}
.toast .ico{color:#25d366;font-size:18px}
.info-page{padding:50px 0 70px;text-align:center}
.info-page p{color:var(--muted);max-width:560px;margin:0 auto 20px}

@media(max-width:1280px){.grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:1060px){
  .shop{grid-template-columns:1fr}
  .f-toggle{display:inline-flex}
  .f-close{display:block}
  .sidebar{position:fixed;top:0;left:0;bottom:0;width:300px;max-width:88vw;background:#fff;z-index:301;overflow:auto;padding:16px;transform:translateX(-100%);transition:transform .3s;box-shadow:10px 0 30px rgba(0,0,0,.15)}
  body.filters-open .sidebar{transform:none}
  body.filters-open .drawer-bg{opacity:1;visibility:visible}
  .pdp{grid-template-columns:1fr;gap:24px}
}
@media(max-width:640px){
  .page-banner h1{font-size:24px}
  .grid{grid-template-columns:1fr 1fr;gap:10px}
  .grid .dh-card .thumb{height:118px}
  .grid .dh-card .thumb img{max-height:118px}
  .toolbar .res{width:100%}
  .chips{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
  .chips::-webkit-scrollbar{display:none}
  .info h1{font-size:20px}
  .info .pprice{font-size:27px}
  .keyspecs,.assure{grid-template-columns:1fr}
  .buy .btn{min-width:0}
  .tab-panel{padding:16px}
  .drawer{width:100%}
}

/* =========================================================
   INTERNAL PAGES
   ========================================================= */
.btn-outline.dark{border-color:var(--navy);color:var(--navy)}
.btn-outline.dark:hover{background:var(--navy);color:#fff}
.btn-outline.dark .ico{transform:rotate(180deg)}
.cp{display:grid;grid-template-columns:1fr 290px;gap:40px;padding-top:34px;padding-bottom:40px;align-items:start}
.cp-wide{padding-top:34px;padding-bottom:50px}
.cp-side{position:sticky;top:20px}
.cp-side .box{border:1px solid var(--border);border-radius:6px;padding:18px;margin-bottom:16px;background:#fff}
.cp-side h3{font-size:13.5px;font-weight:700;color:var(--navy);margin-bottom:10px;text-transform:uppercase;letter-spacing:.4px}
.side-links li{border-bottom:1px solid #eef1f5}
.side-links li:last-child{border-bottom:0}
.side-links a{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 0;font-size:13.5px;color:var(--text)}
.side-links a .ico{font-size:13px;color:#a3abb7}
.side-links a:hover,.side-links a.on{color:var(--red)}
.side-links a.on{font-weight:600}
.side-call{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:10px;color:#fff;font-weight:600;font-size:14px}
.prose{font-size:14.5px;line-height:1.75;color:#3d4654;min-width:0}
.prose h2{font-size:21px;color:var(--navy);margin:28px 0 10px;line-height:1.3}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:16px;color:var(--navy);margin:18px 0 6px}
.prose p{margin-bottom:12px}
.prose ul{list-style:disc;padding-left:22px;margin-bottom:14px}
.prose ul li{margin-bottom:5px}
.prose a{color:var(--red);font-weight:500}
.prose a:hover{text-decoration:underline}
.prose .spec-table{margin:6px 0 14px}
.prose .related{padding-top:34px;padding-bottom:0}
.muted-note{font-size:12.5px;color:var(--muted);font-style:italic}
.steps-list{counter-reset:s;list-style:none;padding:0;margin:8px 0 18px}
.steps-list li{counter-increment:s;position:relative;padding:0 0 14px 46px;min-height:34px}
.steps-list li::before{content:counter(s);position:absolute;left:0;top:0;width:32px;height:32px;border-radius:50%;background:var(--red);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:14px}
.callout{display:flex;gap:14px;align-items:flex-start;background:#eef5fd;border-left:4px solid var(--blue);border-radius:6px;padding:16px 18px;margin:22px 0;font-size:14px;color:var(--text)}
.callout>.ico{font-size:26px;color:var(--blue);flex:none}
.callout.warn{background:#fff4f4;border-left-color:var(--red)}
.callout.warn>.ico{color:var(--red)}
.callout a{color:var(--red);font-weight:600}
.faq{display:flex;flex-direction:column;gap:10px;margin-bottom:10px}
.faq details{border:1px solid var(--border);border-radius:6px;background:#fff}
.faq summary{list-style:none;cursor:pointer;padding:15px 18px;font-weight:600;color:var(--navy);display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:14.5px}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ico{flex:none;transition:transform .2s;color:var(--red)}
.faq details[open] summary .ico{transform:rotate(180deg)}
.faq details[open] summary{border-bottom:1px solid var(--border)}
.faq details>div{padding:14px 18px;font-size:14px;line-height:1.7;color:#3d4654}
/* forms */
.form-card{border:1px solid var(--border);border-radius:8px;padding:24px;background:#fff;margin-bottom:18px}
.form-card h2{font-size:20px;color:var(--navy);margin-bottom:4px}
.form-card>p{font-size:13.5px;color:var(--muted);margin-bottom:16px}
.dh-form .fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px;margin-bottom:14px}
.dh-form .fld.full{grid-column:1/-1}
.dh-form label{display:block;font-size:12.5px;font-weight:600;color:var(--navy);margin-bottom:6px}
.dh-form label i{color:var(--red);font-style:normal}
.dh-form input,.dh-form select,.dh-form textarea{width:100%;border:1px solid #cfd7e3;border-radius:4px;padding:11px 12px;font-size:13.5px;background:#fff;color:var(--text);outline:none;transition:border-color .2s}
.dh-form input:focus,.dh-form select:focus,.dh-form textarea:focus{border-color:var(--navy)}
.dh-form .err{border-color:var(--red);background:#fff6f6}
.dh-form .btn{padding:12px 26px;font-size:14px}
.fnote{font-size:12px;color:var(--muted);margin-bottom:14px}
.fnote a{color:var(--red)}
.fmsg{margin-top:12px;font-size:13.5px;font-weight:500}
.fmsg.good{color:#137a3a}.fmsg.bad{color:var(--red)}
/* about */
.eyebrow-red{color:var(--red);font-weight:700;font-size:12px;letter-spacing:2px}
.about-hero{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center;margin-bottom:34px}
.about-hero h2{font-size:30px;color:var(--navy);line-height:1.25;margin:8px 0 14px}
.about-hero p{color:#3d4654;line-height:1.75;margin-bottom:12px;font-size:14.5px}
.about-img{border-radius:10px;overflow:hidden;aspect-ratio:4/3;box-shadow:0 18px 40px rgba(2,28,52,.18)}
.about-img img{width:100%;height:100%;object-fit:cover}
.stats{display:grid;grid-template-columns:repeat(4,1fr);background:var(--navy);border-radius:8px;color:#fff;margin-bottom:40px}
.stats div{padding:24px 20px;text-align:center;border-right:1px solid rgba(255,255,255,.12)}
.stats div:last-child{border-right:0}
.stats b{display:block;font-size:28px;color:#fff}
.stats span{font-size:12.5px;color:#c9d3e2}
.center-h{text-align:center;font-size:24px;color:var(--navy);margin-bottom:20px}
.why{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:40px}
.why-c{border:1px solid var(--border);border-radius:8px;padding:24px 20px;text-align:center}
.why-c>.ico{font-size:40px;color:var(--red);stroke-width:1.6;margin-bottom:10px}
.why-c h3{font-size:16px;color:var(--navy);margin-bottom:6px}
.why-c p{font-size:13px;color:var(--muted);line-height:1.6}
.who{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:40px}
.who-c{position:relative;border-radius:8px;overflow:hidden;aspect-ratio:4/3;display:block;background:var(--navy)}
.who-c img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.who-c:hover img{transform:scale(1.06)}
.who-c::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(2,28,52,.92))}
.who-c span{position:absolute;left:16px;right:16px;bottom:14px;z-index:1;color:#fff;font-weight:600;font-size:16px;display:flex;justify-content:space-between;align-items:center}
.cta-band{display:flex;justify-content:space-between;align-items:center;gap:20px;background:linear-gradient(90deg,#021a31,#0b2a49);color:#fff;border-radius:8px;padding:26px 30px;flex-wrap:wrap}
.cta-band h3{font-size:20px}.cta-band p{color:#c9d3e2;font-size:13.5px}
.cta-band .btn{background:#25d366;border-color:#25d366;padding:13px 24px}
/* contact */
.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:30px;align-items:start}
.contact-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
.cc{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--border);border-radius:8px;padding:16px;font-size:13px;color:var(--muted);line-height:1.55;background:#fff;transition:border-color .2s}
a.cc:hover{border-color:var(--red)}
.cc.full{grid-column:1/-1}
.cc>.ico{font-size:24px;color:var(--red);flex:none;margin-top:2px}
.cc.wa>.ico{color:#25d366}
.cc b{display:block;color:var(--navy);font-size:14px}
.map-box{height:230px;border-radius:8px;background:linear-gradient(135deg,#e9f1fa,#d5e3f1);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--navy);border:1px solid var(--border)}
.map-box>.ico{font-size:40px;color:var(--red)}
.map-box span{font-size:13px;color:var(--muted)}
.map-box small{font-size:11px;color:#97a0ad;margin-top:6px}
/* tech support */
.ts-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:30px}
.ts-c{border:1px solid var(--border);border-radius:8px;padding:20px;display:block;transition:.2s;background:#fff}
.ts-c:hover{border-color:var(--red);box-shadow:0 10px 24px rgba(2,28,52,.08)}
.ts-c>.ico{font-size:30px;color:var(--red);margin-bottom:8px}
.ts-c h3{margin:0 0 4px!important}
.ts-c p{font-size:13.5px;margin-bottom:8px!important;color:var(--muted)}
.ts-c span{color:var(--red);font-weight:600;font-size:13px;display:inline-flex;gap:6px;align-items:center}
.guide-cards{display:flex;flex-direction:column;gap:14px;margin-bottom:26px}
.guide-c{display:grid;grid-template-columns:200px 1fr;gap:18px;border:1px solid var(--border);border-radius:8px;overflow:hidden;background:#fff;transition:.2s}
.guide-c:hover{box-shadow:0 10px 24px rgba(2,28,52,.08)}
.guide-c img{width:100%;height:100%;object-fit:cover;min-height:130px}
.guide-c>div{padding:16px 16px 16px 0}
.guide-c h3{margin:2px 0 4px!important}
.guide-c p{font-size:13.5px;margin-bottom:6px!important}
.tagline{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--red)}
.checklist{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
.checklist div{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;background:var(--soft);border-radius:6px;padding:12px 14px;line-height:1.5}
.checklist .ico{color:#137a3a;font-size:18px;flex:none;margin-top:1px}
.wd td{vertical-align:middle}
.wd-btn{display:inline-flex;align-items:center;gap:6px;border:1px solid #25d366;color:#128c46!important;border-radius:4px;padding:6px 12px;font-size:12.5px;font-weight:600;white-space:nowrap}
.wd-btn:hover{background:#25d366;color:#fff!important;text-decoration:none!important}
.svc-intro{display:grid;grid-template-columns:260px 1fr;gap:24px;align-items:start;margin-bottom:10px}
.svc-intro img{border-radius:8px;width:100%;aspect-ratio:1/1;object-fit:cover}
.ticks{list-style:none!important;padding:0!important}
.ticks li{position:relative;padding-left:26px}
.ticks li::before{content:"";position:absolute;left:2px;top:7px;width:12px;height:7px;border-left:2px solid #137a3a;border-bottom:2px solid #137a3a;transform:rotate(-45deg)}
.ticks.small{margin-top:14px;font-size:13px;color:var(--muted)}
.status-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:10px}
.status-steps div{border:1px solid var(--border);border-radius:8px;padding:16px;text-align:center;background:#fff}
.status-steps .ico{font-size:30px;color:var(--red);display:block;margin:0 auto 8px}
.status-steps b{display:block;color:var(--navy);font-size:13.5px;margin-bottom:4px;line-height:1.4}
.status-steps span{font-size:12.5px;color:var(--muted);line-height:1.5;display:block}
.track-box{border:1px solid var(--border);border-radius:8px;padding:24px;margin-bottom:30px}
.track-box h2{margin-top:0!important}
.track-result{display:flex;gap:14px;align-items:center;background:var(--soft);border-radius:6px;padding:16px;margin-top:16px}
.track-result>.ico{font-size:30px;color:var(--red)}
.track-result b{display:block;color:var(--navy)}
.track-result span{font-size:13px}
.acct{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.acct .dh-form .btn{width:100%}
.small-link{display:inline-block;margin-top:12px;font-size:13px;color:var(--red)}
/* blog */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.post{border:1px solid var(--border);border-radius:8px;overflow:hidden;background:#fff;display:block;transition:.2s}
.post:hover{box-shadow:0 12px 28px rgba(2,28,52,.1);transform:translateY(-3px)}
.post-img{aspect-ratio:16/10;overflow:hidden;background:var(--soft)}
.post-img img{width:100%;height:100%;object-fit:cover}
.post-b{padding:18px}
.post-b h3{font-size:17px;color:var(--navy);margin:6px 0 8px;line-height:1.35}
.post-b p{font-size:13.5px;color:var(--muted);margin-bottom:10px}
.post-article .art-img{width:100%;max-height:380px;object-fit:cover;border-radius:8px;margin-bottom:16px}
.share{border-top:1px solid var(--border);margin-top:24px;padding-top:14px;font-size:13px;display:flex;gap:12px;align-items:center}
.share a{display:inline-flex;gap:6px;align-items:center;color:#128c46!important}
/* basket & checkout */
.cart-wrap{display:grid;grid-template-columns:1fr 340px;gap:28px;align-items:start}
.cart-table{border:1px solid var(--border);border-radius:8px;overflow:hidden}
.ct-head,.ct-row{display:grid;grid-template-columns:1fr 110px 130px 110px;gap:14px;align-items:center;padding:14px 18px}
.ct-head{background:var(--soft);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--navy)}
.ct-row{border-top:1px solid var(--border)}
.ct-prod{display:flex;gap:14px;align-items:center}
.ct-prod .im{width:76px;height:76px;flex:none;border:1px solid var(--border);border-radius:6px;display:flex;align-items:center;justify-content:center;isolation:isolate;background:#fff}
.ct-prod .im img{max-width:90%;max-height:90%;mix-blend-mode:multiply}
.ct-prod a{font-size:13.5px;font-weight:500;color:var(--text);line-height:1.4}
.ct-prod a:hover{color:var(--red)}
.ct-prod small{display:block;font-size:11.5px;color:var(--muted);margin-top:3px}
.ct-prod button{border:0;background:none;color:var(--red);font-size:12px;cursor:pointer;padding:0;margin-top:4px;text-decoration:underline}
.ct-price{font-size:14px;color:var(--text)}
.ct-tot{font-weight:700;color:var(--navy)}
.qty.sm{height:38px;width:max-content}
.qty.sm button{width:32px}
.qty.sm input{width:36px;font-size:14px}
.ct-foot{border-top:1px solid var(--border);padding:14px 18px}
.summary{border:1px solid var(--border);border-radius:8px;padding:22px;background:var(--soft);position:sticky;top:20px}
.summary h3{font-size:18px;color:var(--navy);margin-bottom:14px}
.sl{display:flex;justify-content:space-between;gap:10px;font-size:13.5px;padding:8px 0;color:var(--muted)}
.sl b{color:var(--navy)}
.sl.tot{border-top:1px solid #d6dde7;margin-top:6px;padding-top:14px;font-size:16px;color:var(--navy);font-weight:700}
.sl.tot b{color:var(--red);font-size:20px}
.summary .btn{width:100%;height:48px;margin-top:14px;font-size:14px}
.sum-trust{display:flex;gap:6px;align-items:center;justify-content:center;font-size:11.5px;color:var(--muted);margin-top:10px;text-align:center}
.sum-trust .ico{color:#137a3a}
.sum-trust a{color:var(--red)}
.sum-item{display:grid;grid-template-columns:52px 1fr auto;gap:10px;align-items:center;font-size:12.5px;padding:8px 0;border-bottom:1px solid #e1e7ef}
.sum-item .im{position:relative;width:52px;height:52px;background:#fff;border:1px solid var(--border);border-radius:5px;display:flex;align-items:center;justify-content:center;isolation:isolate}
.sum-item .im img{max-width:88%;max-height:88%;mix-blend-mode:multiply}
.sum-item .im i{position:absolute;top:-7px;right:-7px;background:var(--navy);color:#fff;font-style:normal;font-size:10.5px;width:19px;height:19px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.sum-item span{line-height:1.35;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.form-card form[data-form=checkout]>.btn{display:none}
.opt{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--border);border-radius:6px;padding:14px;margin-bottom:10px;cursor:pointer}
.opt input{accent-color:var(--red);margin-top:4px}
.opt b{display:block;color:var(--navy);font-size:14px}
.opt small{font-size:12.5px;color:var(--muted)}
.pay-logos{display:flex;gap:8px;margin-top:6px;flex-wrap:wrap}
.pay-logos .pay{border:1px solid var(--border)}
.drawer-f .btn-outline{background:#fff}

@media(max-width:1060px){
  .cp{grid-template-columns:1fr}
  .cp-side{position:static}
  .about-hero,.contact-grid,.cart-wrap{grid-template-columns:1fr}
  .why,.who{grid-template-columns:1fr 1fr}
  .stats{grid-template-columns:1fr 1fr}
  .stats div:nth-child(2){border-right:0}
  .stats div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.12)}
  .blog-grid{grid-template-columns:1fr 1fr}
  .status-steps{grid-template-columns:1fr 1fr}
  .summary{position:static}
}
@media(max-width:640px){
  .dh-form .fgrid,.contact-cards,.acct,.ts-cards,.checklist{grid-template-columns:1fr}
  .why,.who,.blog-grid{grid-template-columns:1fr}
  .about-hero h2{font-size:24px}
  .guide-c{grid-template-columns:1fr}
  .guide-c>div{padding:0 16px 16px}
  .guide-c img{height:160px}
  .svc-intro{grid-template-columns:1fr}
  .svc-intro img{aspect-ratio:16/9}
  .status-steps{grid-template-columns:1fr}
  .ct-head{display:none}
  .ct-row{grid-template-columns:1fr 1fr;gap:10px}
  .ct-prod{grid-column:1/-1}
  .ct-row>[data-lbl]::before{content:attr(data-lbl);display:block;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:3px}
  .ct-row>.ct-tot{grid-column:1/-1}
  .form-card{padding:18px}
  .wd th:nth-child(3),.wd td:nth-child(3){display:none}
  .cta-band{padding:22px}
}
.prose .dh-card h4 a{color:var(--text);font-weight:500}
.prose .dh-card h4 a:hover{color:var(--red);text-decoration:none}
.prose .view-all,.prose .read-more{color:var(--red)}
.prose .btn{text-decoration:none!important}
.prose .btn-red{color:#fff}
.cp-side .box.side-help{background:var(--navy);border-color:var(--navy)}

/* =========================================================
   WORDPRESS + WOOCOMMERCE
   ========================================================= */
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important}
.skip-link:focus{clip:auto;clip-path:none;height:auto;width:auto;left:10px;top:10px;z-index:999;background:#fff;color:var(--navy);padding:10px 16px;border-radius:4px}
.hp{position:absolute!important;left:-9999px!important;opacity:0;height:0;width:0}
.site-main{display:block}
.front-content>p:empty{display:none}
.topbar a{color:inherit}
.nav-menu>li.current>a{color:var(--red)}
.nav-menu>li>a .ico+.ico{display:none}
.footer-links li{margin-bottom:3px}
.footer-links a{font-size:12px;transition:color .2s}
.footer-links a:hover{color:#fff}
.fc-name{font-weight:500;color:#fff}
.page-banner.slim .container{padding-top:16px;padding-bottom:16px}
.page-banner.slim .crumbs{margin:0}
.crumbs a{color:#c9d3e2}
.entry-content>*:first-child{margin-top:0}
.alignwide{max-width:100%}
.wp-block-image img{height:auto}
img{height:auto}
.map-box{height:260px;overflow:hidden;padding:0}
.map-box iframe{width:100%;height:100%;border:0;display:block}
.fmsg.big{display:flex;gap:10px;align-items:center;padding:12px 14px;border-radius:6px;margin-bottom:16px;font-size:14px}
.fmsg.big.good{background:#e6f6ec}
.fmsg.big.bad{background:#fff1f1}
.fmsg .ico{font-size:20px}
.prose ul.products{padding-left:0;list-style:none}
.prose .dh-card h4 a{color:var(--text);font-weight:500}
.cta-band .btn-red{background:#25d366;border-color:#25d366}
.brand-badge{display:inline-flex}

/* ---------- product grids ---------- */
ul.products,.woocommerce ul.products,.woocommerce-page ul.products{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:0 0 10px!important;padding:0;list-style:none}
.shop-main ul.products{grid-template-columns:repeat(4,minmax(0,1fr))}
ul.products::before,ul.products::after{display:none!important}
.woocommerce ul.products li.product.dh-card,.woocommerce-page ul.products li.product.dh-card,ul.products li.dh-card{float:none!important;width:auto!important;margin:0!important;padding:12px 14px 14px!important;list-style:none;position:relative;text-align:left}
ul.products.track{display:grid!important;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc((100% - (var(--per) - 1)*14px)/var(--per));overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:4px 1px 6px!important;margin:0!important}
ul.products.track::-webkit-scrollbar{display:none}
ul.products.track{--per:6}
.dh-card .thumb{display:flex!important;align-items:center;justify-content:center;height:150px;margin:4px 0 12px;isolation:isolate;background:#fff}
.dh-card .thumb img{max-height:150px!important;width:auto!important;max-width:100%;object-fit:contain;margin:0!important;mix-blend-mode:multiply;box-shadow:none!important}
.products-sec .dh-card .thumb,.products-sec .dh-card .thumb img{height:112px;max-height:112px!important}
.dh-card .price{display:block;color:var(--red)!important;font-weight:700;font-size:17px!important;margin:2px 0 10px!important}
.dh-card .price del{color:#97a0ad;font-size:13px;font-weight:500;margin-right:6px}
.dh-card .price ins{text-decoration:none}
.woocommerce .dh-card a.button,.dh-card a.button,.dh-card .btn{display:flex!important;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:auto!important;background:var(--red)!important;color:#fff!important;border:1.5px solid var(--red)!important;border-radius:4px!important;padding:9px 10px!important;font-size:12.5px!important;font-weight:600!important;line-height:1.4!important;font-family:inherit}
.woocommerce .dh-card a.button:hover{background:var(--red-dark)!important}
.dh-card a.button.loading{opacity:.6}
.dh-card a.button.loading::after{display:none!important}
.dh-card a.button.added::after{display:none!important}
.dh-card .added_to_cart{display:none!important}
.dh-card{display:flex!important;flex-direction:column}
.dh-card .onsale{display:none}

/* ---------- shop page ---------- */
.shop-main{min-width:0}
.toolbar .woocommerce-result-count{margin:0!important;font-size:13px;color:var(--muted)}
.toolbar .woocommerce-ordering{margin:0!important}
.toolbar .woocommerce-ordering select{border:1px solid var(--border);border-radius:4px;padding:8px 10px;font-size:12.5px;background:#fff;color:var(--text);cursor:pointer;font-family:inherit}
a.chk{display:flex;gap:9px;align-items:center;font-size:13px;padding:5px 0;color:var(--text)}
a.chk:hover{color:var(--red)}
.box-ico{width:15px;height:15px;border:1.5px solid #9aa3b1;border-radius:3px;flex:none;position:relative;background:#fff}
a.chk.radio .box-ico{border-radius:50%}
a.chk.on .box-ico{background:var(--red);border-color:var(--red)}
a.chk.on .box-ico::after{content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
a.chk.radio.on .box-ico::after{left:3px;top:3px;width:6px;height:6px;border:0;border-radius:50%;background:#fff;transform:none}
a.clear-f{display:inline-block;margin:-6px 0 16px}
.woocommerce nav.woocommerce-pagination{margin-top:24px}
.woocommerce nav.woocommerce-pagination ul{border:0!important;display:flex;justify-content:center;gap:6px}
.woocommerce nav.woocommerce-pagination ul li{border:0!important;overflow:visible}
.woocommerce nav.woocommerce-pagination ul li a,.woocommerce nav.woocommerce-pagination ul li span{min-width:38px;height:38px;border:1px solid var(--border)!important;border-radius:4px;display:flex!important;align-items:center;justify-content:center;font-weight:600;color:var(--navy);padding:0 10px!important}
.woocommerce nav.woocommerce-pagination ul li span.current,.woocommerce nav.woocommerce-pagination ul li a:hover{background:var(--red)!important;border-color:var(--red)!important;color:#fff!important}
.woocommerce-info,.woocommerce-message,.woocommerce-error,.woocommerce-noreviews,p.no-comments{border-top-color:var(--red)!important;background:var(--soft)!important;font-size:14px}
.woocommerce-message::before,.woocommerce-info::before{color:var(--red)!important}
.woocommerce-message .button,.woocommerce-info .button{background:var(--navy)!important;color:#fff!important}

/* ---------- single product ---------- */
.single-wrap{padding-bottom:30px}
.single-wrap div.product{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:20px 44px;padding-top:28px;align-items:start}
.woocommerce .single-wrap div.product div.images,.woocommerce .single-wrap div.product div.summary{float:none!important;width:100%!important;margin:0!important;min-width:0;max-width:100%}
.single-wrap div.product .woocommerce-tabs,.single-wrap div.product .related,.single-wrap div.product .up-sells{grid-column:1/-1}
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper{border:1px solid var(--border);border-radius:8px;overflow:hidden;background:#fff}
.woocommerce div.product div.images .woocommerce-product-gallery__image img{object-fit:contain;aspect-ratio:1/1;padding:20px;background:#fff}
.woocommerce div.product div.images .flex-control-thumbs{display:flex;gap:10px;margin-top:12px!important;flex-wrap:wrap}
.woocommerce div.product div.images .flex-control-thumbs li{width:78px!important;float:none!important;margin:0!important}
.woocommerce div.product div.images .flex-control-thumbs li img{border:2px solid var(--border);border-radius:6px;padding:4px;background:#fff;opacity:1!important;aspect-ratio:1/1;object-fit:contain}
.woocommerce div.product div.images .flex-control-thumbs li img.flex-active{border-color:var(--red)}
.woocommerce div.product div.images .woocommerce-product-gallery__trigger{background:#fff;border:1px solid var(--border);top:12px;right:12px}
.woocommerce div.product .product_title{font-size:25px;line-height:1.3;color:var(--navy);font-weight:700;margin:0 0 8px}
.summary .tags{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.summary .pn{font-size:12.5px;color:var(--muted);margin-bottom:14px}
.summary .pn b{color:var(--text)}
.woocommerce div.product .summary p.price,.woocommerce div.product .summary span.price{color:var(--red)!important;font-size:32px!important;font-weight:700;margin:4px 0 16px}
.summary .woocommerce-product-details__short-description{font-size:14px;color:#3d4654;line-height:1.65;margin-bottom:18px}
.summary .stock{font-weight:600;font-size:13px}
.woocommerce div.product form.cart{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px!important}
.woocommerce div.product form.cart::before,.woocommerce div.product form.cart::after{display:none}
.woocommerce div.product form.cart .quantity{display:flex;border:1px solid #cfd7e3;border-radius:4px;overflow:hidden;height:48px;margin:0!important;float:none!important}
.woocommerce .quantity .qty{width:48px;border:0;text-align:center;font-weight:600;font-size:15px;color:var(--navy);height:100%;-moz-appearance:textfield}
.woocommerce .quantity .qty::-webkit-inner-spin-button{-webkit-appearance:none}
.q-btn{width:38px;border:0;background:#fff;font-size:18px;cursor:pointer;color:var(--navy)}
.woocommerce div.product form.cart .button,.woocommerce div.product form.cart .single_add_to_cart_button{height:48px;padding:0 26px!important;font-size:14px!important;flex:1;min-width:170px;background:var(--red)!important;border-radius:4px!important;font-weight:600!important;float:none!important}
.woocommerce div.product form.cart .button:hover{background:var(--red-dark)!important}
.buy-ebay{height:48px;padding:0 26px;flex:1;min-width:150px}
.woocommerce div.product .woocommerce-tabs{margin-top:16px;border:1px solid var(--border);border-radius:8px;overflow:hidden}
.woocommerce div.product .woocommerce-tabs ul.tabs{display:flex;background:var(--soft);border-bottom:1px solid var(--border);margin:0!important;padding:0!important;overflow-x:auto}
.woocommerce div.product .woocommerce-tabs ul.tabs::before,.woocommerce div.product .woocommerce-tabs ul.tabs li::before,.woocommerce div.product .woocommerce-tabs ul.tabs li::after{display:none!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li{background:none!important;border:0!important;border-radius:0!important;margin:0!important;padding:0!important;border-bottom:3px solid transparent!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{padding:14px 22px!important;font-weight:600!important;font-size:13.5px;color:var(--muted)!important;white-space:nowrap}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{background:#fff!important;border-bottom-color:var(--red)!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{color:var(--navy)!important}
.woocommerce div.product .woocommerce-tabs .panel{padding:22px 24px;margin:0!important;font-size:14px;line-height:1.7;color:#3d4654}
.woocommerce div.product .woocommerce-tabs .panel ul{list-style:disc;padding-left:20px;margin:8px 0 12px}
.woocommerce table.shop_attributes{border:0!important;font-size:13.5px}
.woocommerce table.shop_attributes th,.woocommerce table.shop_attributes td{border:0!important;border-bottom:1px solid var(--border)!important;padding:10px 12px!important;font-style:normal!important}
.woocommerce table.shop_attributes th{width:34%;color:var(--navy);background:var(--soft)!important;font-weight:600}
.woocommerce table.shop_attributes td p{margin:0;padding:0}
.single-wrap .related{padding:28px 0 20px}
.single-wrap .related>h2{font-size:22px;font-weight:700;color:var(--navy);position:relative;padding-bottom:6px;margin-bottom:14px;display:inline-block}
.single-wrap .related>h2::after{content:"";position:absolute;left:0;bottom:0;width:46px;height:2px;background:var(--red)}

/* ---------- basket drawer (mini cart) ---------- */
.drawer-body{flex:1;overflow:auto;display:flex;flex-direction:column}
.drawer .widget_shopping_cart_content{display:flex;flex-direction:column;flex:1;padding:6px 20px 20px}
.drawer ul.woocommerce-mini-cart{list-style:none;margin:0;padding:0;flex:1}
.drawer ul.woocommerce-mini-cart li{position:relative;display:block;padding:14px 26px 14px 76px!important;border-bottom:1px solid var(--border);min-height:92px;font-size:12.5px;line-height:1.4}
.drawer ul.woocommerce-mini-cart li a:not(.remove){font-weight:500;color:var(--text);display:block}
.drawer ul.woocommerce-mini-cart li img{position:absolute;left:0;top:14px;width:64px!important;height:64px;object-fit:contain;border:1px solid var(--border);border-radius:4px;padding:3px;float:none!important;margin:0!important;background:#fff}
.drawer ul.woocommerce-mini-cart li .quantity{display:block;color:var(--muted);margin-top:4px}
.drawer ul.woocommerce-mini-cart li .quantity .amount{color:var(--red);font-weight:700}
.drawer ul.woocommerce-mini-cart li a.remove{position:absolute;right:0;top:12px;left:auto!important;color:var(--muted)!important;font-size:18px;width:22px;height:22px;line-height:20px;text-align:center;border-radius:50%}
.drawer ul.woocommerce-mini-cart li a.remove:hover{background:var(--red);color:#fff!important}
.drawer .woocommerce-mini-cart__total{display:flex;justify-content:space-between;font-size:15px;font-weight:600;color:var(--navy);margin:14px 0 12px;padding-top:12px}
.drawer .woocommerce-mini-cart__buttons{display:flex;flex-direction:column-reverse;gap:8px;margin:0}
.drawer .woocommerce-mini-cart__buttons a{display:flex;align-items:center;justify-content:center;height:46px;border-radius:4px;font-weight:600;font-size:13.5px;margin:0!important;border:1.5px solid var(--navy);color:var(--navy);background:#fff}
.drawer .woocommerce-mini-cart__buttons a.checkout{background:var(--red);border-color:var(--red);color:#fff}
.drawer .woocommerce-mini-cart__empty-message{text-align:center;color:var(--muted);padding:50px 10px}

/* ---------- cart / checkout / account (classic) ---------- */
.woo-page{padding-top:30px}
.woocommerce table.shop_table{border:1px solid var(--border)!important;border-radius:8px!important;border-collapse:separate;font-size:14px}
.woocommerce table.shop_table th{background:var(--soft);color:var(--navy);font-size:12px;text-transform:uppercase;letter-spacing:.5px;padding:14px 16px!important}
.woocommerce table.shop_table td{padding:14px 16px!important;border-top:1px solid var(--border)!important}
.woocommerce table.shop_table img{width:72px!important;border:1px solid var(--border);border-radius:6px;padding:4px;background:#fff}
.woocommerce table.shop_table td.product-name a{color:var(--text);font-weight:500}
.woocommerce a.remove{color:var(--red)!important}
.woocommerce a.remove:hover{background:var(--red);color:#fff!important}
.woocommerce .cart-collaterals .cart_totals{float:none;width:100%;max-width:420px;margin-left:auto;background:var(--soft);border:1px solid var(--border);border-radius:8px;padding:22px}
.woocommerce .cart-collaterals .cart_totals h2{font-size:18px;color:var(--navy);margin-bottom:12px}
.woocommerce .cart_totals table.shop_table{border:0!important;background:transparent}
.woocommerce .cart_totals table.shop_table th{background:transparent;text-transform:none;letter-spacing:0;font-size:13.5px}
.woocommerce .cart_totals .order-total .amount{color:var(--red);font-size:20px}
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit{background:var(--navy);color:#fff;border-radius:4px;font-weight:600;padding:12px 22px;font-family:inherit}
.woocommerce a.button:hover,.woocommerce button.button:hover{background:#0a2a4c;color:#fff}
.woocommerce a.button.alt,.woocommerce button.button.alt,.woocommerce a.checkout-button,.woocommerce #place_order{background:var(--red)!important;color:#fff!important;font-size:15px!important;padding:15px 24px!important}
.woocommerce a.button.alt:hover,.woocommerce button.button.alt:hover,.woocommerce #place_order:hover{background:var(--red-dark)!important}
.woocommerce button.button:disabled,.woocommerce button.button:disabled[disabled]{background:#9aa3b1;color:#fff;padding:12px 22px}
.woocommerce form .form-row label{font-size:12.5px;font-weight:600;color:var(--navy);margin-bottom:5px}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce form .form-row select,.woocommerce-cart table.cart td.actions .coupon .input-text,.select2-container--default .select2-selection--single{border:1px solid #cfd7e3!important;border-radius:4px!important;padding:11px 12px!important;font-size:13.5px;background:#fff;min-height:44px;font-family:inherit}
.select2-container--default .select2-selection--single .select2-selection__rendered{line-height:20px!important;padding:0!important}
.select2-container--default .select2-selection--single .select2-selection__arrow{height:42px!important}
.woocommerce form .form-row input.input-text:focus,.woocommerce form .form-row textarea:focus{border-color:var(--navy)!important;outline:none}
.woocommerce-checkout h3,#order_review_heading{font-size:19px;color:var(--navy);margin:0 0 14px}
.woocommerce-checkout #customer_details{margin-bottom:24px}
.woocommerce-checkout #order_review{background:var(--soft);border:1px solid var(--border);border-radius:8px;padding:20px}
.woocommerce-checkout #payment{background:#fff!important;border:1px solid var(--border);border-radius:6px}
.woocommerce-checkout #payment div.payment_box{background:var(--soft)!important}
.woocommerce-checkout #payment div.payment_box::before{border-bottom-color:var(--soft)!important}
.woocommerce-account .woocommerce-MyAccount-navigation ul{list-style:none;padding:0;margin:0;border:1px solid var(--border);border-radius:8px;overflow:hidden}
.woocommerce-account .woocommerce-MyAccount-navigation li a{display:block;padding:12px 16px;border-bottom:1px solid var(--border);color:var(--text);font-size:14px}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,.woocommerce-account .woocommerce-MyAccount-navigation li a:hover{background:var(--soft);color:var(--red);font-weight:600}
.woocommerce-account .u-columns .u-column1,.woocommerce-account .u-columns .u-column2{border:1px solid var(--border);border-radius:8px;padding:24px}
.woocommerce-account .u-columns h2{font-size:20px;color:var(--navy);margin-bottom:12px}
.woocommerce form.login,.woocommerce form.register,.woocommerce form.checkout_coupon,.track_order{border:0!important;padding:0!important;margin:0!important}
.track-box form.track_order .form-row{width:100%;float:none}
.track-box form.track_order p:first-child{display:none}
.track-box .button{background:var(--red)!important}
.woocommerce-order-details,.woocommerce-customer-details{margin-top:24px}
.woocommerce .blockUI.blockOverlay{background:rgba(255,255,255,.6)!important}

/* ---------- blog pagination ---------- */
.pager-wrap .nav-links,.navigation.pagination .nav-links{display:flex;justify-content:center;gap:6px;margin-top:26px}
.page-numbers{min-width:38px;height:38px;border:1px solid var(--border);border-radius:4px;display:inline-flex;align-items:center;justify-content:center;font-weight:600;color:var(--navy);padding:0 10px}
.page-numbers.current,a.page-numbers:hover{background:var(--red);border-color:var(--red);color:#fff}

@media(max-width:1280px){
  ul.products,.woocommerce ul.products,.woocommerce-page ul.products,.shop-main ul.products{grid-template-columns:repeat(3,minmax(0,1fr))}
  ul.products.track{--per:4}
}
@media(max-width:1060px){
  .single-wrap div.product{grid-template-columns:minmax(0,1fr);gap:20px}
  ul.products.track{--per:3}
  .woocommerce .col2-set .col-1,.woocommerce .col2-set .col-2{float:none;width:100%}
}
@media(max-width:640px){
  ul.products,.woocommerce ul.products,.woocommerce-page ul.products,.shop-main ul.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  ul.products.track{--per:2;gap:10px;grid-auto-columns:calc((100% - 10px)/2)}
  .woocommerce ul.products li.product.dh-card{padding:10px!important}
  .dh-card .thumb,.dh-card .thumb img{height:118px;max-height:118px!important}
  .woocommerce div.product .product_title{font-size:20px}
  .woocommerce div.product .summary p.price{font-size:27px!important}
  .woocommerce div.product .woocommerce-tabs .panel{padding:16px}
  .woocommerce table.shop_table_responsive tr td{padding:10px 12px!important}
  .woocommerce-cart table.cart td.actions .coupon{display:flex;flex-direction:column;gap:8px}
  .woocommerce-cart table.cart td.actions .coupon .input-text{width:100%!important}
}
.is-search .post-img img{object-fit:contain;background:#fff;padding:14px}
.woocommerce-account .u-columns{display:grid;grid-template-columns:1fr 1fr;gap:24px}.woocommerce-account .u-columns::before,.woocommerce-account .u-columns::after{display:none}.woocommerce-account .u-columns .col-1,.woocommerce-account .u-columns .col-2{float:none!important;width:auto!important}
.woocommerce-account form.login .button,.woocommerce-account form.register .button{background:var(--red)!important;margin-top:6px}
@media(max-width:760px){.woocommerce-account .u-columns{grid-template-columns:1fr}}
.woocommerce-account .u-columns .input-text{width:100%!important}.woocommerce-account .woocommerce-privacy-policy-text{font-size:12.5px;color:var(--muted)}
.woocommerce-checkout .newsletter h3{color:#fff;margin:0}
.woocommerce .single-wrap div.product div.images{overflow:hidden}
/* Elementor: Shortcode widgets hold full-width theme sections */
.elementor-widget-shortcode{margin-bottom:0!important;margin-block-end:0!important}
.elementor-section.elementor-section-full_width>.elementor-container{max-width:none}
.elementor-widget-shortcode .elementor-shortcode>p:empty{display:none}
.woocommerce-cart table.cart .quantity input.qty{width:64px;height:40px;border:1px solid #cfd7e3!important;border-radius:4px;text-align:center;font-weight:600;padding:0 4px}
.dh4u-empty-note{padding:18px;border:2px dashed #cfd7e3;border-radius:8px;color:#5b6573;font-size:14px;text-align:center;background:#f7f9fc}
/* ELEMENTOR-OVERRIDES-START */
/* Elementor resets img/a/iframe styles inside .elementor – restore the theme look (generated). */
.elementor .svc-intro img{border-radius:8px}
.elementor .cat-card{box-shadow:rgba(2, 28, 52, 0.12) 0px 4px 14px}
.elementor .cat-card .cat-img img,.elementor .article .a-img img,.elementor .about-img img,.elementor .who-c img,.elementor .guide-c img{height:100%}
.elementor .products-sec .dh-card .thumb img{height:112px}
.elementor .brand-badge img{height:22px}
.elementor .brand img{height:32px;max-width:100%}
.elementor .brand img.big{height:42px}
.elementor .cat-card img{height:72%}
.elementor .finder-prod{height:88%;max-width:30%}
.elementor .dh-card .thumb img{max-width:100%;box-shadow:none !important}
.elementor .spot img{max-width:88%}
.elementor .map-box iframe{width:100%;border:0px}
@media (max-width: 640px){.elementor .dh-card .thumb img{height:118px}}
@media (max-width: 640px){.elementor .guide-c img{height:160px}}
.elementor .dh-card .thumb img{max-width:100%}
/* ELEMENTOR-OVERRIDES-END */
/* Elementor sections made by Theme Setup flow like normal page content (margins between blocks as in the design) */
.elementor-section.dh4u-flow .elementor-widget-wrap{display:block!important}
.dh4u-flow .elementor-widget:not(:last-child){margin-block-end:0;margin-bottom:0}
.dh4u-flow .elementor-widget-wrap>.elementor-element:first-child>.elementor-widget-container>:first-child{margin-top:0}
.prose .dh4u-flow .elementor-element:not(:first-child)>.elementor-widget-container>h2:first-child{margin-top:28px}
/* Elementor's default kit colours/fonts must not change the theme look */
body .elementor-widget-text-editor{color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit}
body .elementor-widget-heading .elementor-heading-title{font-family:inherit;color:var(--navy)}
body .elementor-widget-button .elementor-button{font-family:inherit;background-color:var(--red)}
.dh4u-flow .elementor-widget-text-editor>.elementor-widget-container>:last-child{margin-bottom:0}