/*
Theme Name: JDM Engine World
Theme URI: https://jdmengineworld.com
Author: JDM Engine World Inc.
Description: JDM auto parts storefront theme for JDM Engine World Inc. — Queens Village, NY. WooCommerce-powered shop, single stylesheet, no inline styles. Bundles the full 763-product catalogue with an importer that optimises every product image before it enters the media library — see IMPORT-README.md and WOOCOMMERCE-SETTINGS.md.
Version: 1.9.1
Requires PHP: 7.4
Requires Plugins: woocommerce
Text Domain: jdm-engine-world
*/

/* ===================== Tokens ===================== */
:root{
  --red:#e2211c;
  --red-dark:#c11814;
  --red-darker:#9f1310;
  --black:#0d0d0d;
  --black-2:#111111;
  --black-3:#161616;
  --pure-black:#000000;
  --ink:#1a1a1a;
  --ink-700:#333333;
  --gray-700:#555555;
  --gray-600:#666666;
  --gray-500:#767676;
  --gray-450:#8a8a8a;
  --gray-400:#9a9a9a;
  --gray-300:#b9b9b9;
  --gray-200:#cfcfcf;
  --border:#e7e7e7;
  --border-2:#eeeeee;
  --border-3:#dddddd;
  --border-4:#cccccc;
  --off-white:#f5f5f4;
  --tile-bg:#f2f2f2;
  --panel-bg:#fafafa;

  --font-display:'Oswald',sans-serif;
  --font-body:'Barlow',sans-serif;

  --container:1380px;
  --container-narrow:1200px;
  --container-med:1100px;

  --radius-pill:999px;
  --shadow-card:0 8px 24px rgba(0,0,0,0.12);
  --shadow-panel:0 18px 50px rgba(0,0,0,0.3);
}

/* ===================== Reset / base ===================== */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased;line-height:1.5}
h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd{margin:0}
img{max-width:100%;display:block}
a{color:var(--red);text-decoration:none}
a:hover{color:var(--red-dark);text-decoration:underline}
button{font-family:inherit;cursor:pointer}
input,select,textarea,button{font-family:inherit;font-size:1em}
*:focus-visible{outline:3px solid var(--red);outline-offset:2px}
ul{list-style:none;margin:0;padding:0}
.screen-reader-text{position:absolute;left:-9999px;top:0}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--red);color:#fff;padding:10px 16px;z-index:99;font-weight:600}
.skip-link:focus{left:8px;color:#fff}

@keyframes jdmarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.container{max-width:var(--container);margin:0 auto;padding:0 20px}
.container--narrow{max-width:var(--container-narrow)}
.container--med{max-width:var(--container-med)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:var(--radius-pill);border:0;cursor:pointer;font-family:var(--font-display);font-weight:600;letter-spacing:0.12em;font-size:0.85em;padding:15px 30px;text-decoration:none;white-space:nowrap}
.btn:hover{text-decoration:none}
.btn-red{background:var(--red);color:#fff}
.btn-red:hover{background:var(--red-dark);color:#fff}
.btn-outline{background:none;border:1px solid #444;color:#fff}
.btn-outline:hover{border-color:var(--red);color:var(--red)}
.btn-outline-dark{background:none;border:1px solid var(--ink);color:var(--ink)}
.btn-outline-dark:hover{background:var(--ink);color:#fff}
.btn-black{background:var(--black);color:#fff}
.btn-black:hover{background:#333;color:#fff}
.btn-sm{padding:9px 18px;font-size:0.8em}

.eyebrow{margin:0 0 8px;color:var(--red);font-family:var(--font-display);font-weight:600;letter-spacing:0.22em;font-size:0.75em;text-transform:uppercase}
.section-title{font-family:var(--font-display);font-weight:700;font-size:clamp(1.8em,3.5vw,2.6em);letter-spacing:0.02em;margin:0}

/* ===================== Announcement bar ===================== */
.announce-bar{background:var(--red);color:#fff;text-align:center;padding:8px 16px;font-size:0.8em;font-weight:600;letter-spacing:0.05em}
.announce-bar strong{font-style:italic;font-weight:700;text-transform:lowercase;font-size:1.15em}
.announce-bar .sep{margin:0 6px}

/* ===================== Header ===================== */
.site-header{background:var(--pure-black);color:#fff}
.header-bar{max-width:var(--container);margin:0 auto;padding:8px 20px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.site-logo-link{display:flex;align-items:center;flex:0 0 auto}
/* the_custom_logo() emits class="custom-logo", so both selectors are needed —
   targeting .site-logo alone left the logo at its natural size and pushed the
   nav onto its own row. max-width caps wide logos; object-fit stops the
   height cap from distorting them. */
.site-logo,.site-logo-link img,.custom-logo{height:58px;width:auto;max-width:170px;object-fit:contain}
.site-logo-text{font-family:var(--font-display);font-weight:700;color:#fff;font-size:1.3em;letter-spacing:0.03em}

.primary-nav{display:flex;align-items:center;justify-content:center;gap:0;flex-wrap:nowrap;flex:1;min-width:0}
.primary-nav .nav-item{position:relative}
.nav-item__link{background:none;border:0;color:#fff;font-family:var(--font-display);font-size:0.80em;font-weight:500;letter-spacing:0.02em;padding:10px 5px;cursor:pointer;white-space:nowrap;border-radius:var(--radius-pill);display:flex;align-items:center;gap:4px}
.nav-item__link:hover{color:var(--red);text-decoration:none}
.nav-item__caret{font-size:0.7em}
.nav-dropdown{position:absolute;top:100%;left:0;background:#111;border:1px solid #2a2a2a;min-width:180px;z-index:50;padding:6px 0;box-shadow:var(--shadow-panel);display:none}
.nav-item:hover .nav-dropdown,.nav-item:focus-within .nav-dropdown{display:block}
.nav-dropdown a{display:block;width:100%;text-align:left;background:none;border:0;color:#ddd;padding:8px 16px;font-size:0.85em;text-decoration:none;border-radius:var(--radius-pill)}
.nav-dropdown a:hover{background:var(--red);color:#fff}

.header-actions{display:flex;align-items:center;gap:10px;margin-left:auto;flex:0 0 auto}
.icon-btn{background:none;border:0;color:#fff;cursor:pointer;padding:6px;display:flex}
.icon-btn:hover{color:var(--red)}
.ebay-link{text-decoration:none;font-weight:700;font-size:1.15em;font-style:italic;letter-spacing:-0.02em;line-height:1}
.ebay-link span:nth-child(1){color:#e53238}.ebay-link span:nth-child(2){color:#0064d2}.ebay-link span:nth-child(3){color:#f5af02}.ebay-link span:nth-child(4){color:#86b817}
.phone-link{color:#fff;font-family:var(--font-display);font-weight:600;font-size:0.95em;letter-spacing:0.03em;text-decoration:none}
.phone-link:hover{color:var(--red)}
.cart-btn{background:none;border:1px solid #3a3a3a;border-radius:var(--radius-pill);color:#fff;padding:7px 14px;cursor:pointer;display:flex;align-items:center;gap:8px;font-size:0.85em}
.cart-btn:hover{border-color:var(--red);text-decoration:none}
.cart-btn__count{background:var(--red);border-radius:var(--radius-pill);min-width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;font-size:0.75em;font-weight:700}
.mobile-toggle{display:none;background:none;border:1px solid #3a3a3a;border-radius:var(--radius-pill);color:#fff;padding:9px 12px;cursor:pointer;flex-direction:column;gap:4px}
.mobile-toggle span{display:block;width:20px;height:2px;background:#fff}

.mobile-nav{background:#0c0c0c;border-top:1px solid #222;padding:8px 20px 16px;display:none;flex-direction:column}
.mobile-nav.is-open{display:flex}
.mobile-nav a{border-bottom:1px solid #1d1d1d;color:#eee;text-align:left;padding:13px 4px;font-family:var(--font-display);letter-spacing:0.05em;font-size:0.9em;text-decoration:none;display:block}

.search-band-wrap{background:var(--pure-black);padding:2px 20px 18px}
.search-band{max-width:980px;margin:0 auto;position:relative}
.search-band__row{display:flex;background:#fff;border-radius:var(--radius-pill);overflow:hidden;position:relative}
.search-band__row input{flex:1;border:0;padding:18px 26px;font-size:1.08em;outline-offset:-3px;min-width:0}
/* Rotating "Search for <brand>…" hint. Sits over the input because a
   placeholder attribute can't style one word differently. pointer-events:none
   keeps the caret and text selection behaving normally; the mousedown handler
   in theme.js forwards clicks to the field. */
.search-rotate{position:absolute;left:26px;top:50%;transform:translateY(-50%);font-size:1.08em;line-height:1;pointer-events:none;white-space:nowrap;max-width:calc(100% - 140px);overflow:hidden;text-overflow:ellipsis;transition:opacity .15s ease}
.search-rotate__lead,.search-rotate__tail{color:#8b8b8b}
.search-rotate__word{color:var(--red);font-weight:700}
.search-rotate.is-dim{opacity:.45}
.search-band__row button{border-radius:var(--radius-pill);background:#fff;border:0;color:#111;font-family:var(--font-display);font-weight:600;letter-spacing:0.1em;padding:0 26px;cursor:pointer;font-size:0.82em}
.search-band__row button:hover{color:var(--red)}

@media(max-width:1180px){
  .primary-nav{display:none!important}
  .mobile-toggle{display:inline-flex!important}
}
@media(max-width:640px){
  .ebay-link,.phone-link{display:none}
}

/* ===================== Search modal + suggestions ===================== */
.search-suggest{position:absolute;top:100%;left:14px;right:14px;z-index:60;background:#fff;border:1px solid var(--border-2);box-shadow:var(--shadow-panel);border-radius:0 0 10px 10px;overflow:hidden}
.search-suggest__brand,.search-suggest__product{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:0;border-bottom:1px solid #f0f0f0;padding:11px 16px;cursor:pointer;font-size:0.85em;background:#fafafa}
.search-suggest__product{background:none;gap:14px}
.search-suggest__brand:hover,.search-suggest__product:hover{background:#fdeceb}
.search-suggest__tag{background:var(--black);color:#fff;font-family:var(--font-display);font-size:0.66em;font-weight:600;letter-spacing:0.1em;padding:3px 10px;border-radius:var(--radius-pill)}
.search-suggest__head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--border-2);font-family:var(--font-display);font-weight:600;letter-spacing:0.1em;font-size:0.78em}
.search-suggest__thumb{flex:none;width:62px;height:46px;background:repeating-linear-gradient(45deg,#ececec 0 6px,#f7f7f7 6px 12px);background-size:cover;background-position:center;border-radius:4px}
.search-suggest__name{display:block;font-weight:600;line-height:1.35}
.search-suggest__meta{display:block;color:var(--gray-450);font-size:0.82em;margin-top:2px}
.search-suggest__price{font-family:var(--font-display);color:var(--ink);white-space:nowrap}

.search-modal{position:fixed;inset:0;z-index:95;display:flex;align-items:flex-start;justify-content:center;padding:8vh 16px 20px}
.search-modal.is-hidden{display:none}
.search-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,0.72);border:0;cursor:pointer}
.search-modal__panel{position:relative;width:100%;max-width:860px;background:#fff;border-top:4px solid var(--red);box-shadow:var(--shadow-panel);max-height:84vh;overflow:auto}
.search-modal__close{border-radius:var(--radius-pill);position:absolute;top:10px;right:10px;background:none;border:0;color:var(--gray-450);cursor:pointer;font-size:1.3em;padding:6px}
.search-modal__close:hover{color:var(--red)}
.search-modal__body{padding:30px 30px 22px}
.search-modal__label{margin:0 0 16px;font-family:var(--font-display);font-weight:600;letter-spacing:0.1em;font-size:0.85em}
.search-modal__bar{display:flex;border:1px solid var(--border-3);border-radius:var(--radius-pill);overflow:hidden;flex-wrap:wrap}
.search-modal__bar select{border:0;border-right:1px solid var(--border-2);background:var(--panel-bg);padding:0 16px;font-size:0.85em;min-height:50px}
.search-modal__bar input{flex:1;min-width:160px;border:0;padding:13px 18px;font-size:0.95em}
.search-modal__bar button{border-radius:var(--radius-pill);background:var(--red);border:0;color:#fff;font-family:var(--font-display);font-weight:600;letter-spacing:0.12em;padding:0 30px;cursor:pointer;font-size:0.82em;min-height:50px}
.search-modal__bar button:hover{background:var(--red-dark)}
.search-modal__brands-label{margin:0 0 10px;font-family:var(--font-display);font-weight:600;letter-spacing:0.1em;font-size:0.72em;color:var(--gray-500)}
.search-modal__brands{display:flex;gap:8px;overflow-x:auto;padding:0 30px 22px}
.search-modal__brand-chip{flex:none;background:var(--black);border:0;border-radius:var(--radius-pill);color:#fff;font-family:var(--font-display);font-weight:500;letter-spacing:0.1em;font-size:0.72em;padding:9px 20px}
.search-modal__brand-chip:hover{background:var(--red)}
.search-modal__recs{background:#f7f7f7;border-top:1px solid var(--border-2);padding:20px 30px 26px}
.search-modal__rec-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.search-modal__rec{border-radius:8px;overflow:hidden;background:#fff;border:1px solid var(--border);padding:0;text-align:left;display:flex;flex-direction:column}
.search-modal__rec:hover{border-color:var(--red)}
.search-modal__rec img{height:96px;width:100%;object-fit:cover}
.search-modal__rec-body{padding:10px 12px}
.search-modal__rec-name{display:block;font-size:0.72em;font-weight:600;line-height:1.35;color:var(--ink)}
.search-modal__rec-price{display:block;font-family:var(--font-display);font-weight:600;color:var(--red);margin-top:5px;font-size:0.85em}

/* ===================== Hero ===================== */
.hero{background:var(--black);color:#fff;position:relative;overflow:hidden}
.hero-bg{position:absolute;inset:0}
.hero-bg__slide{position:absolute;inset:0;background-size:cover;background-position:center;transition:opacity 1s;opacity:0}
.hero-bg__slide.is-active{opacity:1}
.hero-bg__scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,5,5,0.94) 0%,rgba(5,5,5,0.82) 38%,rgba(5,5,5,0.25) 75%,rgba(5,5,5,0.45) 100%)}
.hero-inner{position:relative;max-width:var(--container);margin:0 auto;min-height:640px;padding:70px 20px;display:flex;flex-wrap:wrap;gap:44px;align-items:center}
.hero-copy{flex:1 1 340px;max-width:620px}
.hero-title{margin:0 0 18px;font-family:var(--font-display);font-weight:700;font-size:clamp(2.4em,5.4vw,4.2em);line-height:1.02}
.hero-sub{margin:0 0 28px;color:var(--gray-300);max-width:52ch;line-height:1.6}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap}
.hero-stats{display:flex;gap:26px;flex-wrap:wrap;margin-top:34px;color:var(--gray-400);font-size:0.82em}
.hero-stats strong{color:#fff}
.hero-slidecopy{flex:1 1 320px;display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-end;gap:16px;align-self:flex-end;padding-bottom:8px}
.hero-slidecopy__text{text-align:right;max-width:440px}
.hero-slidecopy__title{margin:0;font-family:var(--font-display);font-weight:600;letter-spacing:0.08em;font-size:1.15em;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,0.8)}
.hero-slidecopy__sub{margin:5px 0 0;color:#e5e5e5;font-size:0.85em;text-shadow:0 2px 8px rgba(0,0,0,0.8)}
.hero-controls{display:flex;align-items:center;gap:10px}
.hero-arrow{border-radius:var(--radius-pill);width:42px;height:42px;background:rgba(0,0,0,0.55);border:1px solid rgba(255,255,255,0.3);color:#fff;cursor:pointer;font-size:1.05em}
.hero-arrow:hover{background:var(--red)}
.hero-dot{border-radius:var(--radius-pill);width:10px;height:10px;padding:0;border:1px solid #fff;background:rgba(255,255,255,0.35);cursor:pointer}
.hero-dot.is-active{background:var(--red)}

/* ===================== Brand marquee ===================== */
.brand-marquee{background:var(--red);overflow:hidden;padding:12px 0}
.marquee-track{display:flex;width:max-content;animation:jdmarquee 30s linear infinite}
.marquee-track--slow{animation-duration:40s}
.marquee-track--slower{animation-duration:45s}
.marquee-track--slowest{animation-duration:55s}
.marquee-wrap:hover .marquee-track{animation-play-state:paused}
.brand-chip{background:none;border:0;color:#fff;font-family:var(--font-display);font-weight:600;letter-spacing:0.2em;font-size:0.95em;padding:6px 34px;white-space:nowrap;text-decoration:none}
.brand-chip:hover{color:var(--black);text-decoration:none}

/* ===================== Sections ===================== */
.section{padding:64px 20px}
.section--tight{padding:60px 20px}
.section--dark{background:var(--black);color:#fff}
.section--off{background:var(--off-white)}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:26px}

.chip-row{display:flex;gap:8px;flex-wrap:wrap}
.chip{border-radius:var(--radius-pill);background:none;color:var(--gray-700);border:1px solid var(--border-3);padding:9px 18px;cursor:pointer;font-size:0.72em;font-weight:700;letter-spacing:0.08em;font-family:var(--font-body)}
.chip.is-active{background:var(--black);color:#fff;border-color:var(--black)}

/* ===================== Product grid / card ===================== */
.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:20px}
.product-grid--shop{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.product-card{background:#fff;border:1px solid var(--border);display:flex;flex-direction:column;height:100%;font-family:var(--font-body)}
.product-card__figure{position:relative;border:0;padding:0;cursor:pointer;height:170px;background:var(--tile-bg);display:flex;align-items:center;justify-content:center;overflow:hidden;width:100%}
.product-card__figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.product-card__placeholder{position:absolute;inset:0;background:repeating-linear-gradient(45deg,#ececec 0 10px,#f7f7f7 10px 20px);display:flex;align-items:center;justify-content:center;font-family:monospace;font-size:0.68em;color:var(--gray-450);letter-spacing:0.08em;text-align:center;padding:8px}
.product-card__badge{position:absolute;top:8px;left:8px;background:var(--red);color:#fff;font-family:var(--font-display);font-size:0.62em;font-weight:600;padding:3px 9px;letter-spacing:0.14em}
.product-card__oos{position:absolute;background:var(--black);color:#fff;font-family:var(--font-display);font-size:0.68em;font-weight:600;padding:5px 12px;letter-spacing:0.14em}
.product-card__body{padding:14px 14px 16px;display:flex;flex-direction:column;gap:10px;flex:1}
.product-card__name{border-radius:var(--radius-pill);background:none;border:0;padding:0;text-align:left;cursor:pointer;font-size:0.86em;font-weight:600;line-height:1.4;color:var(--ink);font-family:inherit;text-decoration:none;display:block}
.product-card__name:hover{color:var(--red);text-decoration:none}
.product-card__foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:10px}
.product-card__price{font-family:var(--font-display);font-weight:600;font-size:1.05em}
.product-card__add{background:var(--red);border:0;border-radius:var(--radius-pill);color:#fff;font-family:var(--font-display);font-size:0.7em;font-weight:600;letter-spacing:0.1em;padding:10px 18px;cursor:pointer}
.product-card__add:hover{background:var(--red-dark)}
.product-card__call{color:var(--gray-450);font-size:0.72em;font-weight:600}
.jdm-call-price{color:var(--gray-450);font-size:0.85em;font-weight:600}

.feat-tile{grid-column:span 2;grid-row:span 2;position:relative;background:var(--black);color:#fff;display:flex;flex-direction:column;justify-content:flex-end;min-height:520px;overflow:hidden}
.feat-tile__img{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0.85}
.feat-tile__scrim{position:absolute;inset:0;background:linear-gradient(transparent 30%,rgba(0,0,0,0.9))}
.feat-tile__badge{position:absolute;top:14px;left:14px;background:var(--red);color:#fff;font-family:var(--font-display);font-size:0.68em;font-weight:600;padding:5px 12px;letter-spacing:0.16em}
.feat-tile__body{position:relative;padding:22px}
.feat-tile__name{border-radius:var(--radius-pill);background:none;border:0;padding:0;text-align:left;cursor:pointer;color:#fff;font-family:var(--font-display);font-weight:600;font-size:1.25em;line-height:1.3;text-decoration:none;display:block}
.feat-tile__name:hover{color:var(--red);text-decoration:none}
.feat-tile__row{display:flex;align-items:center;gap:16px;margin-top:12px;flex-wrap:wrap}
.feat-tile__price{font-family:var(--font-display);font-weight:700;font-size:1.5em;color:var(--red)}

@media(max-width:640px){.feat-tile{grid-column:span 1;grid-row:span 1;min-height:360px}}

/* ===================== CTA banner ===================== */
.cta-banner{grid-column:1/-1;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:30px 34px;margin-top:20px}
.cta-banner__text{max-width:60ch}
.cta-banner__title{margin:0 0 6px;font-family:var(--font-display);font-weight:700;font-size:1.5em;letter-spacing:0.05em;line-height:1.2}
.cta-banner__sub{margin:0;font-size:0.9em;color:#ffd9d8;line-height:1.5}
.cta-banner__actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.cta-banner__phone{color:#fff;font-family:var(--font-display);font-weight:700;font-size:1.7em;text-decoration:none;white-space:nowrap}
.cta-banner__phone:hover{color:#fff;text-decoration:underline}

/* ===================== Reviews ===================== */
.reviews-marquee-wrap{overflow:hidden;margin:0 -20px}
.reviews-marquee{display:flex;width:max-content;gap:16px;padding:0 20px;animation:jdmarquee 40s linear infinite}
.reviews-marquee-wrap:hover .reviews-marquee{animation-play-state:paused}
.review-tile{width:300px;flex:none;background:var(--black-3);border:1px solid #262626;padding:20px;display:flex;flex-direction:column;gap:10px}
.stars{color:var(--red);letter-spacing:0.2em}
.review-tile blockquote{margin:0;color:#cfcfcf;font-size:0.88em;line-height:1.55}
.review-tile figcaption{margin-top:auto;font-weight:600;font-size:0.85em}
.review-tile figcaption span{color:#7a7a7a;font-weight:400}

.review-card{background:#fff;border:1px solid var(--border);margin:0;padding:22px;display:flex;flex-direction:column;gap:10px}
.review-card__head{display:flex;align-items:center;gap:12px}
.review-card__avatar{width:40px;height:40px;border-radius:var(--radius-pill);background:var(--black);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:600}
.review-card__name{margin:0;font-weight:600;font-size:0.9em}
.review-card__meta{margin:0;color:var(--gray-450);font-size:0.75em}
.review-card blockquote{margin:0;color:var(--gray-700);font-size:0.9em;line-height:1.6}

.reviews-summary{flex:0 1 280px;min-width:250px;background:var(--black);color:#fff;padding:28px;text-align:center}
.reviews-summary__score{font-family:var(--font-display);font-weight:700;font-size:3.4em;margin:0;line-height:1}
.reviews-summary__count{color:var(--gray-300);font-size:0.85em;margin:0 0 18px}

/* ===================== Video CTA ===================== */
.video-cta{text-align:center}
.video-cta__desc{color:var(--gray-400);margin:0 0 30px;font-size:0.92em}
.video-frame{position:relative;aspect-ratio:16/9;background:repeating-linear-gradient(45deg,#141414 0 14px,#1b1b1b 14px 28px);border:1px solid #2a2a2a;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}
.play-btn{border-radius:var(--radius-pill);width:86px;height:86px;background:var(--red);border:4px solid #fff;color:#fff;cursor:pointer;font-size:1.7em;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 36px rgba(226,33,28,0.45)}
.play-btn:hover{background:var(--red-dark)}
.video-frame__label{font-family:monospace;font-size:0.72em;color:var(--gray-500);letter-spacing:0.06em}
/* Real video: the <video> fills the frame and the branded button sits over it
   until playback starts, at which point the button is removed and the native
   controls take over. */
.video-frame--ready{background:#000;overflow:hidden}
.video-frame__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:#000}
.video-frame--ready .play-btn{position:relative;z-index:2;transition:transform .18s ease,opacity .18s ease}
.video-frame--ready:hover .play-btn{transform:scale(1.06)}
.video-frame--playing .play-btn{opacity:0;pointer-events:none}
/* Dim the poster slightly so the red button keeps its contrast on bright frames. */
.video-frame--ready::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,0.28);z-index:1;transition:opacity .18s ease}
.video-frame--playing::after{opacity:0;pointer-events:none}
@media(prefers-reduced-motion:reduce){
  .video-frame--ready .play-btn,.video-frame--ready::after{transition:none}
}

/* ===================== About ===================== */
.about-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:44px;align-items:center}
.about-copy p{color:var(--gray-700);line-height:1.7;margin:0 0 14px}
.about-media{min-height:320px;position:relative;border-radius:6px;overflow:hidden;background:var(--black-3)}
.about-media__slide{position:absolute;inset:0;background-size:cover;background-position:center;transition:opacity 0.7s;opacity:0}
.about-media__slide.is-active{opacity:1}
.about-media__dots{position:absolute;left:0;right:0;bottom:10px;display:flex;justify-content:center;gap:8px}
.about-media__dots button{border-radius:var(--radius-pill);width:9px;height:9px;padding:0;border:1px solid #fff;background:rgba(255,255,255,0.4);cursor:pointer}
.about-media__dots button.is-active{background:var(--red)}

.about-hero{background:var(--black);color:#fff;padding:70px 20px 56px}
.about-hero h1{font-family:var(--font-display);font-weight:700;font-size:clamp(2.2em,5vw,3.6em);line-height:1.05;margin:0 0 18px;max-width:16ch}
.about-hero p{color:var(--gray-300);line-height:1.65;margin:0;max-width:62ch}
.about-stats{max-width:var(--container-med);margin:44px auto 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1px;background:#262626;border:1px solid #262626}
.about-stats > div{background:var(--black);padding:24px;text-align:center}
.about-stats strong{font-family:var(--font-display);font-weight:700;font-size:2em;margin:0;color:var(--red);display:block}
.about-stats span{color:var(--gray-400);font-size:0.72em;margin:6px 0 0;letter-spacing:0.1em;display:block}
.about-runner-wrap{background:var(--black);overflow:hidden;padding:0 0 56px}
.about-runner{display:flex;width:max-content;gap:10px;animation:jdmarquee 55s linear infinite}
.about-runner-wrap:hover .about-runner{animation-play-state:paused}
.about-runner button{flex:none;width:280px;height:200px;border:0;cursor:pointer;padding:0;background-size:cover;background-position:center}
.about-runner button:hover{opacity:0.85}
.about-body{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:44px;align-items:start}
.about-body h2{font-family:var(--font-display);font-weight:600;font-size:1.7em;letter-spacing:0.03em;margin:0 0 16px}
.about-body p{color:var(--gray-700);line-height:1.75;margin:0 0 16px}
.about-steps{display:grid;gap:14px}
.about-step{display:flex;gap:16px;align-items:flex-start;border-left:3px solid var(--red);padding-left:16px}
.about-step__num{font-family:var(--font-display);font-weight:700;font-size:1.4em;color:var(--red)}
.about-step p:first-of-type{margin:0;font-weight:700;font-size:0.95em;color:var(--ink)}
.about-step p:last-of-type{margin:4px 0 0;color:#666;font-size:0.88em;line-height:1.6}
.about-cta{background:var(--red);color:#fff;text-align:center;padding:46px 20px}
.about-cta p{margin:0 0 4px;font-family:var(--font-display);font-weight:600;letter-spacing:0.1em;font-size:1.1em}
.about-cta a.phone{display:block;color:#fff;font-family:var(--font-display);font-weight:700;font-size:2.4em;text-decoration:none;margin-bottom:16px}

/* ===================== Gallery ===================== */
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.gallery-grid--shop{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.gallery-tile{aspect-ratio:1;border:0;cursor:pointer;padding:0;background-size:cover;background-position:center;width:100%}
.gallery-tile:hover{opacity:0.85}

.lightbox{position:fixed;inset:0;z-index:96;display:flex;align-items:center;justify-content:center;padding:24px}
.lightbox.is-hidden{display:none}
.lightbox__backdrop{position:absolute;inset:0;background:rgba(0,0,0,0.88);border:0;cursor:pointer}
.lightbox__img{position:relative;width:min(92vw,1000px);height:min(80vh,700px);background-size:contain;background-position:center;background-repeat:no-repeat;pointer-events:none}
.lightbox__nav{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:var(--radius-pill);background:rgba(255,255,255,0.12);border:1px solid rgba(255,255,255,0.3);color:#fff;cursor:pointer;font-size:1.2em}
.lightbox__nav:hover{background:var(--red)}
.lightbox__nav--prev{left:18px}
.lightbox__nav--next{right:18px}
.lightbox__close{position:absolute;top:18px;right:18px;width:42px;height:42px;border-radius:var(--radius-pill);background:rgba(255,255,255,0.12);border:1px solid rgba(255,255,255,0.3);color:#fff;cursor:pointer;font-size:1em}
.lightbox__close:hover{background:var(--red)}
.lightbox__counter{position:absolute;bottom:20px;left:0;right:0;text-align:center;color:var(--gray-200);font-size:0.8em;pointer-events:none}

/* ===================== Why-us marquee ===================== */
.why-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:40px}
.why-head p{margin:0;color:var(--gray-450);font-size:0.88em;max-width:44ch}
.why-marquee-wrap{overflow:hidden;margin:0 -20px}
.why-marquee{display:flex;width:max-content;gap:16px;padding:0 20px;animation:jdmarquee 45s linear infinite}
.why-marquee-wrap:hover .why-marquee{animation-play-state:paused}
.why-card{width:320px;flex:none;background:var(--black-3);border:1px solid #262626;border-top:3px solid var(--red);padding:26px 24px}
.why-card__num{font-family:var(--font-display);font-weight:700;font-size:1.9em;color:var(--red);line-height:1;display:block;margin-bottom:12px}
.why-card h3{font-family:var(--font-display);font-weight:600;font-size:1em;letter-spacing:0.06em;margin:0 0 10px;color:#fff}
.why-card p{color:var(--gray-400);font-size:0.86em;line-height:1.65;margin:0}

/* ===================== Instagram grid ===================== */
.ig-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}
.ig-tile{aspect-ratio:1;position:relative;background:repeating-linear-gradient(45deg,#ececec 0 10px,#f7f7f7 10px 20px);display:flex;align-items:center;justify-content:center;font-family:monospace;font-size:0.68em;color:var(--gray-450);text-align:center;padding:8px}

/* ===================== Contact CTA (bottom of home) ===================== */
.contact-cta{background:var(--black);color:#fff;text-align:center;padding:56px 20px}
.contact-cta h2{font-family:var(--font-display);font-weight:600;letter-spacing:0.08em;margin:0 0 6px;font-size:1.3em}
.contact-cta p{margin:0 0 4px;color:var(--gray-400);font-size:0.85em}
.contact-cta a.phone{display:block;color:#fff;font-family:var(--font-display);font-weight:700;font-size:2.6em;text-decoration:none;margin-bottom:20px}

/* ===================== Footer ===================== */
.site-footer{background:var(--black);color:#fff;padding:54px 20px 0}
.footer-grid{max-width:var(--container);margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:36px;padding-bottom:40px}
.footer-brand img{height:60px;margin-bottom:14px}
.footer-brand p{color:var(--gray-450);font-size:0.8em;margin:0 0 4px}
.footer-brand a.phone{color:#fff;font-family:var(--font-display);font-weight:700;font-size:1.7em;text-decoration:none}
.footer-socials{display:flex;gap:10px;margin-top:16px}
.footer-socials a{border-radius:var(--radius-pill);background:none;border:1px solid #333;color:var(--gray-200);padding:7px 14px;font-size:0.72em;letter-spacing:0.08em;text-decoration:none}
.footer-socials a:hover{border-color:var(--red);color:var(--red)}
.footer-nav{display:flex;flex-direction:column;gap:2px}
.footer-nav a{color:var(--gray-200);text-align:left;padding:6px 0;font-size:0.85em;letter-spacing:0.04em;text-decoration:none;display:block}
.footer-nav a:hover{color:var(--red)}
.footer-meta{font-size:0.85em;color:var(--gray-200);display:grid;gap:12px;align-content:start}
.footer-meta a{color:var(--gray-200)}
.payment-badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.payment-badges span{background:#fff;color:#111;font-size:0.56em;font-weight:700;padding:3px 7px;border-radius:3px;letter-spacing:0.03em;white-space:nowrap}
.footer-bottom{border-top:1px solid #222}
.footer-bottom__row{max-width:var(--container);margin:0 auto;padding:16px 20px;display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;font-size:0.75em;color:var(--gray-450)}
.footer-bottom__links{display:flex;gap:18px;flex-wrap:wrap}
.footer-bottom__links a{color:var(--gray-450);letter-spacing:0.06em;text-decoration:none}
.footer-bottom__links a:hover{color:var(--red)}

/* ===================== Shop layout (WooCommerce archive) ===================== */
.shop-hero{padding:44px 20px 0}
.shop-hero h1{font-family:var(--font-display);font-weight:700;font-size:clamp(2em,4.5vw,3.2em);letter-spacing:0.02em;margin:0 0 6px;text-transform:uppercase}
.shop-hero p{color:var(--gray-500);margin:0 0 28px;font-size:0.9em}
.shop-layout{display:flex;gap:34px;align-items:flex-start;flex-wrap:wrap;padding:0 20px 70px;max-width:var(--container);margin:0 auto}
.shop-filters{flex:0 1 220px;min-width:190px;display:flex;flex-direction:column;gap:26px}
.filter-group h2{font-family:var(--font-display);font-size:0.82em;font-weight:600;letter-spacing:0.1em;border-bottom:2px solid var(--ink);padding-bottom:8px;margin:0 0 12px}
.filter-check{display:flex;align-items:center;gap:9px;padding:5px 0;font-size:0.88em;cursor:pointer}
.filter-check input{accent-color:var(--red);width:16px;height:16px}
.clear-filters{border-radius:var(--radius-pill);background:none;border:1px solid var(--border-4);color:var(--gray-700);padding:9px;cursor:pointer;font-size:0.8em;letter-spacing:0.06em;text-align:center;text-decoration:none;display:block}
.clear-filters:hover{border-color:var(--red);color:var(--red)}
.shop-main{flex:1;min-width:280px}
.shop-toolbar{display:flex;justify-content:flex-end;margin-bottom:16px}
.shop-toolbar select{border:1px solid var(--border-3);padding:9px 12px;font-size:0.85em;background:#fff}
.shop-empty{text-align:center;color:var(--gray-500);padding:50px 0}
.shop-empty a{color:var(--red);text-decoration:underline}

/* ===================== Breadcrumb ===================== */
.jdm-breadcrumb{font-size:0.8em;color:var(--gray-450);margin-bottom:24px}
.jdm-breadcrumb a{color:var(--gray-450);text-decoration:none}
.jdm-breadcrumb a:hover{color:var(--red)}
.jdm-breadcrumb span[aria-hidden]{margin:0 4px}

/* ===================== Single product ===================== */
.product-single{max-width:var(--container-narrow);margin:0 auto;padding:36px 20px 70px}
.product-single__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:44px}
.product-single__media{min-height:380px;position:relative;background:var(--tile-bg);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;overflow:hidden}
.product-single__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.product-single__media .placeholder{font-family:monospace;font-size:0.72em;color:var(--gray-450);letter-spacing:0.08em}
.product-single h1{font-family:var(--font-display);font-weight:600;font-size:1.7em;line-height:1.25;margin:0 0 14px}
.product-single__price-row{display:flex;align-items:center;gap:14px;margin-bottom:18px;flex-wrap:wrap}
.product-single__price{font-family:var(--font-display);font-weight:700;font-size:2em;color:var(--red)}
.stock-badge{font-size:0.7em;font-weight:700;padding:5px 12px;letter-spacing:0.1em}
.stock-badge--in{background:#eaf7ea;color:#1c7a1c}
.stock-badge--out{background:var(--black);color:#fff}
.product-single dl{margin:0 0 22px;display:grid;grid-template-columns:auto 1fr;gap:8px 18px;font-size:0.88em}
.product-single dt{color:var(--gray-450)}
.product-single dd{margin:0;font-weight:600}
.qty-row{display:flex;gap:12px;align-items:stretch;flex-wrap:wrap;margin-bottom:14px}
.qty-stepper{display:flex;border:1px solid var(--border-4);align-items:center}
.qty-stepper button{border-radius:var(--radius-pill);background:none;border:0;width:40px;height:48px;font-size:1.1em;cursor:pointer}
.qty-stepper input{width:44px;text-align:center;font-weight:600;border:0;-moz-appearance:textfield}
.btn-add-cart{flex:1;min-width:180px;background:var(--red);border:0;border-radius:var(--radius-pill);color:#fff;font-family:var(--font-display);font-weight:600;letter-spacing:0.12em;padding:0 28px;height:48px;cursor:pointer;font-size:0.88em}
.btn-add-cart:hover{background:var(--red-dark)}
.pay-note{font-size:0.8em;color:var(--gray-500);margin:0 0 22px}
.product-single__desc{border-top:1px solid var(--border-2);padding-top:20px}
.product-single__desc h2{font-family:var(--font-display);font-size:0.92em;font-weight:600;letter-spacing:0.08em;margin:0 0 10px}
.product-single__desc p{color:var(--gray-700);font-size:0.9em;line-height:1.65;margin:0 0 14px}
.product-single__fine{color:var(--gray-450);font-size:0.8em;line-height:1.6;margin:0}
.product-single__fine a{color:var(--red);text-decoration:underline}
.related-products{max-width:var(--container-narrow);margin:0 auto;padding:0 20px 70px}
.related-products h2{font-family:var(--font-display);font-weight:600;font-size:1.4em;margin:0 0 20px}

/* ===================== Cart (WooCommerce native markup, JDM-skinned) ===================== */
.woocommerce-cart-form{margin-bottom:24px}
table.cart{width:100%;border-collapse:collapse}
table.cart th{text-align:left;font-family:var(--font-display);font-size:0.78em;letter-spacing:0.08em;padding:10px;border-bottom:2px solid var(--ink)}
table.cart td{padding:14px 10px;border-bottom:1px solid var(--border);vertical-align:middle}
table.cart td.product-thumbnail img{width:80px;height:62px;object-fit:cover}
table.cart td.product-name a{font-weight:600;font-size:0.9em;color:var(--ink);text-decoration:none}
table.cart td.product-price,table.cart td.product-subtotal{font-family:var(--font-display);font-weight:600;white-space:nowrap}
table.cart td.product-quantity .quantity input.qty{width:60px;padding:10px;border:1px solid var(--border-4);text-align:center}
table.cart td.product-remove a{color:var(--gray-450);font-size:1.1em;text-decoration:none}
table.cart td.product-remove a:hover{color:var(--red)}
table.cart td.actions .button{border-radius:var(--radius-pill);background:var(--black);color:#fff;padding:11px 22px;font-size:0.82em;font-weight:600;letter-spacing:0.05em;text-decoration:none;border:0;cursor:pointer}
.cart-collaterals{display:flex;justify-content:flex-end}
.cart_totals{flex:1;min-width:260px;max-width:380px;background:var(--black);color:#fff;padding:24px}
.cart_totals h2{font-family:var(--font-display);font-size:1em;font-weight:600;letter-spacing:0.1em;margin:0 0 18px}
.cart_totals table{width:100%;border-collapse:collapse}
.cart_totals th,.cart_totals td{padding:8px 0;border-bottom:1px solid #2a2a2a;font-size:0.9em;text-align:left}
.cart_totals .order-total th,.cart_totals .order-total td{font-family:var(--font-display);font-weight:700;border-bottom:0}
.wc-proceed-to-checkout a.checkout-button{display:block;width:100%;text-align:center;background:var(--red);border:0;border-radius:var(--radius-pill);color:#fff;font-family:var(--font-display);font-weight:600;letter-spacing:0.12em;padding:15px;cursor:pointer;font-size:0.88em;margin-top:10px;text-decoration:none}
.wc-proceed-to-checkout a.checkout-button:hover{background:var(--red-dark)}
.woocommerce-cart .cart-empty{text-align:center;padding:60px 20px;background:var(--off-white);margin:0 20px}
.woocommerce-cart .return-to-shop .button{border-radius:var(--radius-pill);background:var(--red);color:#fff;padding:14px 32px;font-family:var(--font-display);font-weight:600;letter-spacing:0.12em;font-size:0.85em;text-decoration:none;display:inline-block;margin-top:12px}

/* ===================== Checkout (WooCommerce native markup, JDM-skinned) ===================== */
.woocommerce-checkout .entry-content,.woocommerce-cart .entry-content,.woocommerce-account .entry-content{max-width:var(--container-med);margin:0 auto;padding:44px 20px 70px}
.woocommerce-checkout h1.entry-title,.woocommerce-cart h1.entry-title,.woocommerce-account h1.entry-title{max-width:var(--container-med);margin:44px auto 0;padding:0 20px;font-family:var(--font-display);font-weight:700;font-size:2.4em}
.woocommerce-checkout form.checkout{display:flex;gap:34px;align-items:flex-start;flex-wrap:wrap}
.woocommerce-checkout #customer_details{flex:2;min-width:300px}
.woocommerce-checkout h3{font-family:var(--font-display);font-size:1em;font-weight:600;letter-spacing:0.08em;margin:0 0 16px;text-transform:uppercase}
.woocommerce-checkout .form-row label{display:block;font-size:0.8em;font-weight:600;color:var(--gray-700);margin-bottom:5px}
.woocommerce-checkout .input-text,.woocommerce-checkout select,.woocommerce-checkout textarea{border:1px solid var(--border-4);padding:12px;font-size:1.05em;background:#fff;font-family:inherit;width:100%}
.woocommerce-checkout #order_review{flex:1;min-width:260px;background:var(--black);color:#fff;padding:24px}
.woocommerce-checkout #order_review table.shop_table{color:#fff;width:100%;border-collapse:collapse}
.woocommerce-checkout #order_review th,.woocommerce-checkout #order_review td{padding:8px 0;border-bottom:1px solid #1f1f1f;font-size:0.88em;text-align:left}
.woocommerce-checkout #order_review .order-total td,.woocommerce-checkout #order_review .order-total th{font-family:var(--font-display);font-weight:700;border-bottom:0}
.woocommerce-checkout ul.wc_payment_methods{list-style:none;margin:0 0 16px;padding:0}
.woocommerce-checkout ul.wc_payment_methods li{border:1px solid #e2e2e2;padding:14px 16px;margin-bottom:8px;background:var(--panel-bg)}
.woocommerce-checkout #place_order{width:100%;background:var(--red);border:0;border-radius:var(--radius-pill);color:#fff;font-family:var(--font-display);font-weight:600;letter-spacing:0.12em;padding:15px;cursor:pointer;font-size:0.88em}
.woocommerce-checkout #place_order:hover{background:var(--red-dark)}
.woocommerce-order-received .entry-content{max-width:620px;margin:0 auto;text-align:center;padding:40px 20px 70px}

/* ===================== My Account (WooCommerce native markup, JDM-skinned) ===================== */
/* The sidebar layout only applies once someone is signed in. WooCommerce
   reuses the same .woocommerce wrapper for the logged-out login form, so
   applying flex unconditionally turned the "Login" heading and the form into
   flex siblings and shunted the form to the right of an empty column. */
.woocommerce-account.logged-in .woocommerce{display:flex;gap:34px;align-items:flex-start;flex-wrap:wrap;max-width:var(--container-med);margin:0 auto;padding:0 20px 70px}
.woocommerce-account .woocommerce{max-width:var(--container-med);margin:0 auto;padding:0 20px 70px}

/* ---- logged out: a single centred card ---- */
.woocommerce-account:not(.logged-in) .woocommerce{max-width:480px}
.woocommerce-account .woocommerce-form-login,
.woocommerce-account .woocommerce-form-register,
.woocommerce-account .woocommerce-ResetPassword{
  border:1px solid var(--border-3,#cfcfcf);border-radius:4px;background:#fff;
  padding:32px 30px 28px;box-shadow:0 2px 14px rgba(0,0,0,0.05)}
.woocommerce-account:not(.logged-in) h2{
  font-family:var(--font-display);font-weight:700;font-size:1.5em;letter-spacing:0.05em;
  text-align:center;margin:0 0 22px}
.woocommerce-account .woocommerce-ResetPassword>p:first-child{margin-top:0;font-size:0.9em;color:var(--gray-600)}

/* ---- form controls ---- */
.woocommerce-account .woocommerce-form-row,
.woocommerce-account .form-row{display:flex;flex-direction:column;gap:7px;margin:0 0 18px}
.woocommerce-account .form-row label{
  font-size:0.88em;font-weight:600;color:var(--gray-700);display:block}
.woocommerce-account .required{color:var(--red);text-decoration:none;border:0}
.woocommerce-account .form-row .input-text,
.woocommerce-account .form-row input[type="text"],
.woocommerce-account .form-row input[type="email"],
.woocommerce-account .form-row input[type="tel"],
.woocommerce-account .form-row input[type="password"]{
  width:100%;box-sizing:border-box;background:#fff;color:var(--black);
  border:1px solid var(--border-3,#cfcfcf);border-radius:3px;
  padding:12px 14px;font-size:0.95em;line-height:1.4;
  transition:border-color .15s ease,box-shadow .15s ease}
.woocommerce-account .form-row .input-text:focus,
.woocommerce-account .form-row input:focus{
  outline:none;border-color:var(--red);box-shadow:0 0 0 3px rgba(226,33,28,0.13)}

/* WooCommerce's JS wraps password fields in <span class="password-input"> and
   appends an EMPTY <button class="show-password-input">. With no styling that
   empty button renders as a small grey box floating above the submit button —
   the stray bar visible on the unstyled page. Give it an icon and park it
   inside the field. The base rule stands alone so the button still looks
   deliberate even when the wrapper span isn't present. */
.woocommerce-account .show-password-input{
  width:26px;height:26px;padding:0;border:0;background:none;cursor:pointer;
  opacity:.5;transition:opacity .15s ease}
.woocommerce-account .show-password-input::after{content:"\1F441";font-size:15px;line-height:1}
.woocommerce-account .show-password-input:hover{opacity:.85}
.woocommerce-account .show-password-input.display-password{opacity:1}
.woocommerce-account .password-input{position:relative;display:block}
.woocommerce-account .password-input .input-text{padding-right:44px}
.woocommerce-account .password-input .show-password-input{
  position:absolute;right:10px;top:50%;transform:translateY(-50%)}

/* ---- remember me + submit ---- */
.woocommerce-account .woocommerce-form-login__rememberme{
  display:flex;align-items:center;gap:9px;font-size:0.86em;font-weight:400;
  color:var(--gray-700);margin:0 0 20px;cursor:pointer}
.woocommerce-account .woocommerce-form-login__rememberme input{
  width:17px;height:17px;accent-color:var(--red);margin:0}
.woocommerce-account .woocommerce-form-login .form-row:has(.woocommerce-form-login__submit){margin-bottom:14px}
.woocommerce-account button.woocommerce-button,
.woocommerce-account button.woocommerce-form-login__submit,
.woocommerce-account button.woocommerce-form-register__submit,
.woocommerce-account .woocommerce-Button{
  display:block;width:100%;border:0;cursor:pointer;
  border-radius:var(--radius-pill);background:var(--red);color:#fff;
  font-family:var(--font-display);font-weight:600;letter-spacing:0.08em;
  text-transform:uppercase;font-size:0.9em;padding:14px 26px;
  transition:background .15s ease}
.woocommerce-account button.woocommerce-button:hover,
.woocommerce-account button.woocommerce-form-login__submit:hover,
.woocommerce-account .woocommerce-Button:hover{background:var(--red-dark)}
.woocommerce-account .woocommerce-LostPassword{margin:16px 0 0;text-align:center;font-size:0.85em}
.woocommerce-account .woocommerce-LostPassword a{color:var(--gray-600);text-decoration:underline}
.woocommerce-account .woocommerce-LostPassword a:hover{color:var(--red)}
.woocommerce-account .woocommerce-privacy-policy-text{font-size:0.78em;color:var(--gray-600);line-height:1.5;margin:14px 0 0}

/* ---- the login / register column pair ---- */
/* Registration is currently off, so only column one renders and the card
   simply centres. If registration is switched on, this becomes two columns. */
.woocommerce-account #customer_login{display:grid;grid-template-columns:1fr;gap:26px}
.woocommerce-account #customer_login.col2-set:has(.u-column2){grid-template-columns:repeat(2,minmax(0,1fr))}
.woocommerce-account #customer_login>div{min-width:0}

/* ---- logged in: sidebar ---- */
.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3{
  font-family:var(--font-display);font-weight:700;letter-spacing:0.04em;margin:0 0 14px}
.woocommerce-account .woocommerce-MyAccount-content p{font-size:0.95em;line-height:1.65}
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address{
  border:1px solid var(--border-3,#cfcfcf);border-radius:4px;padding:18px;margin-bottom:18px}

@media(max-width:820px){
  .woocommerce-account #customer_login.col2-set:has(.u-column2){grid-template-columns:1fr}
  .woocommerce-account.logged-in .woocommerce{flex-direction:column;gap:22px}
  .woocommerce-MyAccount-navigation{flex:1 1 auto;width:100%}
  .woocommerce-MyAccount-navigation ul{flex-direction:row;flex-wrap:wrap}
}
@media(max-width:520px){
  .woocommerce-account .woocommerce-form-login,
  .woocommerce-account .woocommerce-form-register,
  .woocommerce-account .woocommerce-ResetPassword{padding:24px 20px 22px}
}

/* ---- notices ---- */
.woocommerce-account .woocommerce-error,
.woocommerce-account .woocommerce-message,
.woocommerce-account .woocommerce-info{
  list-style:none;margin:0 auto 20px;padding:13px 16px;font-size:0.86em;
  border-radius:4px;max-width:480px}
.woocommerce-account .woocommerce-error{background:#fdeceb;border:1px solid #f5b8b6;color:#a11512}
.woocommerce-account .woocommerce-message{background:#f0faf0;border:1px solid #bfe3bf;color:#1a5b1a}
.woocommerce-account .woocommerce-info{background:#eef4fb;border:1px solid #bcd4ec;color:#1b4a75}
.woocommerce-account .woocommerce-error a,
.woocommerce-account .woocommerce-message a{color:inherit;text-decoration:underline}
.woocommerce-MyAccount-navigation{flex:0 1 220px;min-width:190px}
.woocommerce-MyAccount-navigation ul{display:flex;flex-direction:column;gap:6px}
.woocommerce-MyAccount-navigation a{display:block;border-radius:var(--radius-pill);border:1px solid var(--border-4);color:var(--gray-700);padding:9px 18px;font-size:0.8em;letter-spacing:0.04em;text-decoration:none}
.woocommerce-MyAccount-navigation li.is-active a,.woocommerce-MyAccount-navigation a:hover{background:var(--black);color:#fff;border-color:var(--black)}
.woocommerce-MyAccount-content{flex:1;min-width:280px}
.woocommerce-MyAccount-content table.shop_table{width:100%;border-collapse:collapse;font-size:0.9em}
.woocommerce-MyAccount-content table.shop_table th,.woocommerce-MyAccount-content table.shop_table td{padding:10px;border-bottom:1px solid var(--border-2);text-align:left}
.woocommerce-MyAccount-content .button{display:inline-block;border-radius:var(--radius-pill);background:var(--red);color:#fff;padding:9px 18px;font-size:0.82em;font-weight:600;text-decoration:none}

/* ===================== Policies ===================== */
.policy-page{max-width:1000px;margin:0 auto;padding:44px 20px 70px}
.policy-page h1{font-family:var(--font-display);font-weight:700;font-size:2.6em;margin:0 0 22px}
.policy-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:30px}
.policy-tab{border-radius:var(--radius-pill);padding:11px 18px;cursor:pointer;font-size:0.82em;font-weight:600;letter-spacing:0.04em;text-decoration:none;border:1px solid var(--border-3);background:#fff;color:var(--gray-700)}
.policy-tab.is-active{background:var(--black);color:#fff;border-color:var(--black)}
.policy-page .entry-content h2{font-family:var(--font-display);font-size:1.05em;font-weight:600;letter-spacing:0.06em;border-left:3px solid var(--red);padding-left:12px;margin:0 0 12px 0;text-transform:uppercase}
.policy-page .entry-content p{color:var(--gray-700);font-size:0.92em;line-height:1.75;margin:0 0 12px;max-width:80ch}
.policy-page .entry-content{display:flex;flex-direction:column;gap:28px}

/* ===================== Contact page ===================== */
.contact-page{max-width:var(--container-med);margin:0 auto;padding:44px 20px 70px}
.contact-page h1{font-family:var(--font-display);font-weight:700;font-size:2.6em;margin:0 0 26px}
.contact-layout{display:flex;gap:40px;align-items:flex-start;flex-wrap:wrap}
.contact-form-col{flex:1.4;min-width:300px}
.contact-notice{background:#f0faf0;border:1px solid #bfe3bf;padding:18px;margin-bottom:20px;font-size:0.9em}
.contact-notice--error{background:#fdeceb;border:1px solid #f5b8b6;color:#a11512;padding:11px 14px;font-size:0.84em;border-radius:4px}
.contact-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px 22px}
/* The label wraps its own field, so it has to be a block or the input sits
   inline beside the text at its browser-default width. */
.field-label{display:flex;flex-direction:column;gap:7px;font-size:0.92em;color:var(--gray-700,#2a2a2a);font-weight:500}
.field-label input,.field-label select,.field-label textarea{
  width:100%;box-sizing:border-box;background:#fff;color:var(--black);
  border:1px solid var(--border-3,#cfcfcf);border-radius:3px;
  padding:12px 14px;font-size:0.95em;line-height:1.4;
  transition:border-color .15s ease,box-shadow .15s ease}
.field-label input:hover,.field-label select:hover,.field-label textarea:hover{border-color:#a8a8a8}
.field-label input:focus,.field-label select:focus,.field-label textarea:focus{
  outline:none;border-color:var(--red);box-shadow:0 0 0 3px rgba(226,33,28,0.13)}
.field-label input:invalid:not(:placeholder-shown){border-color:#e0a3a1}
.field-label textarea{min-height:150px;resize:vertical}
/* Native select arrows differ wildly between browsers; draw our own so the
   Brand field matches the text inputs beside it. */
.field-label select{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;cursor:pointer;padding-right:38px;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23555' stroke-width='1.8' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center}
.field-label ::placeholder{color:var(--gray-500,#9a9a9a);opacity:1}
.contact-fields .field-label--wide{grid-column:1/-1}
/* :has() only as a bonus for markup we don't control; the class above is what
   actually guarantees the message field spans the row. */
.contact-fields .field-label:has(textarea){grid-column:1/-1}
.contact-consent-row{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:22px}
.contact-consent-row .btn{padding:15px 40px;font-size:0.9em;letter-spacing:0.08em}
.consent-box{display:flex;align-items:center;gap:12px;border:1px solid var(--border-4);border-radius:4px;background:#f9f9f9;padding:13px 18px;box-shadow:0 1px 3px rgba(0,0,0,0.08)}
.consent-box input{width:22px;height:22px;accent-color:var(--red)}
.consent-box__mark{margin-left:auto;font-style:normal;font-size:0.68em;letter-spacing:0.12em;color:var(--gray-500,#8b8b8b);font-family:var(--font-display);font-weight:600}
/* Google's widget renders in a fixed-size iframe (302x76), so it gets its own
   box rather than being stretched to match the design's tickbox. */
.jdm-recaptcha{min-height:78px}
.jdm-recaptcha>div{max-width:100%}
.contact-rc-note{margin:10px 0 0;font-size:0.74em;color:var(--gray-600,#777);line-height:1.5}
.contact-rc-note a{color:inherit;text-decoration:underline}
@media(max-width:400px){
  /* below ~360px the widget would overflow its column */
  .jdm-recaptcha{transform:scale(.88);transform-origin:left top}
}
.contact-info{flex:1;min-width:260px;background:var(--black);color:#fff;padding:28px}
.contact-info h2{font-family:var(--font-display);font-size:1em;font-weight:600;letter-spacing:0.1em;margin:0 0 18px}
.contact-info dl{margin:0;display:grid;gap:14px;font-size:0.88em}
.contact-info dt{color:var(--gray-450);font-size:0.85em}
.contact-info dd{margin:4px 0 0;font-weight:600;line-height:1.5}
.contact-info dd a{color:#fff}
.contact-map{margin-top:20px;border-radius:4px;overflow:hidden}
.jdm-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ===================== Agent login / live chat console (static UI) ===================== */
.agent-login{max-width:420px;margin:0 auto;padding:70px 20px 90px}
.agent-login__panel{background:var(--black);color:#fff;padding:34px;border-top:4px solid var(--red)}
.agent-login__panel h1{font-family:var(--font-display);font-weight:700;font-size:1.5em;letter-spacing:0.06em;margin:0 0 4px}
.agent-login__panel p{color:var(--gray-450);font-size:0.82em;margin:0 0 22px}
.agent-login__fields{display:grid;gap:14px}
.agent-login__fields label{display:flex;flex-direction:column;gap:5px;font-size:0.78em;font-weight:600;color:var(--gray-400)}
.agent-login__fields input{border:1px solid #333;background:var(--black-3);color:#fff;padding:12px;font-size:1.1em}

.agent-console{max-width:var(--container);margin:0 auto;padding:30px 20px 70px}
.agent-console__head{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.agent-console__head h1{font-family:var(--font-display);font-weight:700;font-size:1.8em;margin:0}
.agent-console__body{display:flex;gap:0;border:1px solid #e2e2e2;min-height:560px;flex-wrap:wrap}
.agent-console__list{flex:0 1 320px;min-width:260px;border-right:1px solid #e2e2e2;background:var(--panel-bg);display:flex;flex-direction:column}
.agent-console__tabs{display:flex;border-bottom:1px solid #e2e2e2}
.agent-console__tabs button{flex:1;background:none;color:var(--gray-500);border:0;padding:12px;cursor:pointer;font-size:0.72em;font-weight:700;letter-spacing:0.08em}
.agent-console__tabs button.is-active{background:var(--black);color:#fff}
.agent-console__thread{flex:2;min-width:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--gray-400);font-size:0.88em}

/* ===================== Accessibility toolbar ===================== */
.a11y-widget{position:fixed;left:18px;bottom:18px;z-index:90;display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.a11y-fab{width:56px;height:56px;border-radius:var(--radius-pill);background:var(--red);border:3px solid #fff;color:#fff;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,0.35);display:flex;align-items:center;justify-content:center}
.a11y-fab:hover{background:var(--red-dark)}
.a11y-panel{width:290px;background:#fff;border:1px solid #ddd;box-shadow:var(--shadow-panel);border-radius:10px;overflow:hidden;font-family:var(--font-body)}
.a11y-panel.is-hidden{display:none}
.a11y-panel__head{background:var(--black);color:#fff;padding:14px 16px;display:flex;justify-content:space-between;align-items:center}
.a11y-panel__head span{font-family:var(--font-display);font-weight:600;letter-spacing:0.08em;font-size:0.85em}
.a11y-panel__head button{border-radius:var(--radius-pill);background:none;border:0;color:#fff;cursor:pointer;font-size:1.1em}
.a11y-panel__body{padding:14px 16px;display:grid;gap:8px}
.a11y-row-btns{display:flex;gap:8px}
.a11y-row-btns .btn-red{flex:1;padding:11px;border-radius:6px;font-family:var(--font-body);letter-spacing:normal}
.a11y-row-btns .btn-black{padding:11px 14px;border-radius:6px;font-family:var(--font-body);letter-spacing:normal}
.a11y-size-row{display:flex;align-items:center;justify-content:space-between;border:1px solid #eee;border-radius:6px;padding:9px 12px}
.a11y-size-row span{font-size:0.82em;font-weight:600}
.a11y-size-row div{display:flex;gap:6px}
.a11y-size-btn{border-radius:var(--radius-pill);border:1px solid var(--border-3);background:#fff;color:#333;padding:5px 10px;cursor:pointer;font-weight:700;font-size:0.8em}
.a11y-size-btn.is-active{border-color:var(--red);background:var(--red);color:#fff}
.a11y-toggle{display:flex;align-items:center;justify-content:space-between;background:none;border:1px solid #eee;border-radius:6px;padding:9px 12px;cursor:pointer;font-size:0.82em;font-weight:600;text-align:left;width:100%}
.a11y-toggle:hover{border-color:var(--red)}
.a11y-pill{width:36px;height:20px;border-radius:var(--radius-pill);background:#ccc;position:relative;display:inline-block;transition:background 0.15s;flex:none}
.a11y-pill.is-on{background:var(--red)}
.a11y-pill__knob{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:var(--radius-pill);background:#fff;transition:left 0.15s}
.a11y-pill.is-on .a11y-pill__knob{left:18px}
.a11y-foot{color:#9a9a9a;font-size:0.68em;margin:2px 0 0;text-align:center}

body.jdm-contrast{filter:contrast(1.35) saturate(1.1)}
body.jdm-spacing{letter-spacing:0.04em}
body.jdm-spacing *{line-height:1.8!important}
body.jdm-dyslexia,body.jdm-dyslexia *{font-family:Verdana,sans-serif!important}
body.jdm-pause-anim *{animation-play-state:paused!important}
body.jdm-links a,body.jdm-links button{text-decoration:underline}

/* ===================== Live chat widget ===================== */
.chat-widget{position:fixed;right:18px;bottom:18px;z-index:91;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.chat-fab{position:relative;width:56px;height:56px;border-radius:var(--radius-pill);background:var(--black);border:3px solid #fff;color:#fff;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,0.35);display:flex;align-items:center;justify-content:center}
.chat-fab:hover{background:var(--red)}
.chat-panel{width:330px;max-width:calc(100vw - 36px);height:470px;background:#fff;border:1px solid #ddd;border-radius:12px;box-shadow:var(--shadow-panel);display:flex;flex-direction:column;overflow:hidden;font-family:var(--font-body)}
.chat-panel.is-hidden{display:none}
.chat-panel__head{background:var(--black);color:#fff;padding:13px 14px;display:flex;align-items:center;gap:10px}
.chat-panel__avatar{width:34px;height:34px;border-radius:var(--radius-pill);background:var(--red);display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;flex:none}
.chat-panel__title{flex:1;min-width:0}
.chat-panel__title p:first-child{margin:0;font-family:var(--font-display);font-weight:600;font-size:0.85em;letter-spacing:0.05em}
.chat-panel__title p:last-child{margin:0;font-size:0.7em;color:#8fe28f}
.chat-panel__head button{border-radius:var(--radius-pill);background:none;border:0;color:#cfcfcf;cursor:pointer;font-size:1em;padding:4px}
.chat-panel__head button:hover{color:#fff}
.chat-pre{flex:1;padding:22px 18px;display:flex;flex-direction:column;gap:12px;background:#f7f7f7}
.chat-pre p{margin:0;font-size:0.88em;color:#333;line-height:1.5}
.chat-pre label{display:flex;flex-direction:column;gap:5px;font-size:0.76em;font-weight:600;color:var(--gray-700)}
.chat-pre input{border:1px solid #ddd;padding:11px;font-size:1.1em;background:#fff}
.chat-pre .note{margin:auto 0 0;font-size:0.66em;color:#9a9a9a;text-align:center}
.chat-live{flex:1;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:9px;background:#f7f7f7}
.chat-live.is-hidden,.chat-pre.is-hidden{display:none}
.chat-bubble-row{display:flex}
.chat-bubble-row.from-me{justify-content:flex-end}
.chat-bubble{max-width:78%;border-radius:12px;padding:9px 13px;font-size:0.84em;line-height:1.45;background:#fff;color:#222;border:1px solid #e5e5e5;border-bottom-left-radius:3px}
.chat-bubble-row.from-me .chat-bubble{background:var(--red);color:#fff;border:0;border-bottom-right-radius:3px;border-bottom-left-radius:12px}
.chat-bubble-meta{display:block;font-size:0.66em;opacity:0.65;margin-bottom:3px}
.chat-input-row{display:flex;gap:8px;padding:10px;border-top:1px solid #e5e5e5;background:#fff}
.chat-input-row input{flex:1;border:1px solid #ddd;border-radius:var(--radius-pill);padding:11px 16px;font-size:0.88em;min-width:0}
.chat-input-row button{background:var(--red);border:0;border-radius:var(--radius-pill);color:#fff;width:42px;height:42px;cursor:pointer;font-size:1.05em;flex:none}
.chat-input-row button:hover{background:var(--red-dark)}
.chat-footer{margin:0;background:#fff;color:#b5b5b5;font-size:0.6em;text-align:center;padding:0 0 7px}

/* ===================== WooCommerce generic overrides ===================== */
.woocommerce-notices-wrapper{max-width:var(--container-med);margin:20px auto 0;padding:0 20px}
.woocommerce-message,.woocommerce-info,.woocommerce-error{list-style:none;background:#f0faf0;border:1px solid #bfe3bf;padding:14px 18px;margin:0 0 16px;font-size:0.9em;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.woocommerce-error{background:#fdeceb;border-color:#f5b8b6;color:#a11512}
.woocommerce-info{background:#eef4fb;border-color:#bcd6ef}
.woocommerce-message a.button,.woocommerce-error a.button{border-radius:var(--radius-pill);background:var(--red);color:#fff;padding:9px 18px;font-size:0.82em;font-weight:600;text-decoration:none}
table.shop_table{width:100%;border-collapse:collapse}
.select2-container .select2-selection--single{height:44px!important;border:1px solid var(--border-4)!important;padding:6px 0}
/* Block, not flex-column: these labels sit above their input and contain an
   inline <span class="required">*</span>. As a flex column the asterisk was
   pushed onto a line of its own under every field label. */
.woocommerce-form-row label{display:block;font-size:0.8em;font-weight:600;color:var(--gray-700);margin-bottom:5px}
.woocommerce-form-row .input-text,.woocommerce-form-row select,.woocommerce-form-row textarea{border:1px solid var(--border-4);padding:12px;font-size:1.05em;width:100%}

/* ===================== Generic page (fallback) ===================== */
body:not(.woocommerce-cart):not(.woocommerce-checkout):not(.woocommerce-account) h1.entry-title{max-width:var(--container-med);margin:60px auto 20px;padding:0 20px;font-family:var(--font-display);font-weight:700;font-size:2.4em}
body:not(.woocommerce-cart):not(.woocommerce-checkout):not(.woocommerce-account) .entry-content{max-width:var(--container-med);margin:0 auto;padding:0 20px 70px}
.entry-content p{color:var(--gray-700);line-height:1.75;margin:0 0 14px}

/* ===================== Responsive ===================== */
/* Step the header down before anything wraps. The nav itself collapses to the
   hamburger at 1180px, so these two steps only need to cover 1180–1380 —
   below that the row is just logo + actions and has room to spare. */
@media(max-width:1320px){
  .site-logo,.site-logo-link img,.custom-logo{height:54px;max-width:140px}
  .nav-item__link{font-size:0.74em;padding:10px 4px}
  .header-actions{gap:8px}
  .phone-link{font-size:0.88em}
}
@media(max-width:1250px){
  .site-logo,.site-logo-link img,.custom-logo{height:50px;max-width:120px}
  .nav-item__link{font-size:0.70em;padding:9px 3px}
  .ebay-link{display:none}
}
@media(max-width:1180px){
  .site-logo,.site-logo-link img,.custom-logo{height:52px;max-width:190px}
  .nav-item__link{font-size:0.80em;padding:10px 5px}
}
@media(max-width:900px){
  .header-bar{gap:10px}
  .site-logo,.site-logo-link img,.custom-logo{height:46px;max-width:160px}
  .cart-item{flex-direction:column;align-items:flex-start}
  .cart-item__line{text-align:left}
}
@media(max-width:640px){
  .search-rotate{left:18px;font-size:0.95em;max-width:calc(100% - 110px)}
  .site-logo,.site-logo-link img,.custom-logo{height:40px;max-width:130px}
  .header-bar{padding:6px 14px}
  .search-band-wrap{padding:2px 14px 14px}
  .section,.section--tight{padding:44px 16px}
  .hero-inner{padding:44px 16px;min-height:auto}
  .cta-banner{padding:24px}
}