/* ============================================================================
   STELCO Storefront — custom styles.
   All colours/fonts reference theme.json tokens (--wp--preset--*), so editing
   theme.json reskins everything. Keep component styling here; tokens in theme.json.
   ============================================================================ */

:root{
  --c-navy:var(--wp--preset--color--navy);
  --c-brand:var(--wp--preset--color--brand);
  --c-brand-dark:var(--wp--preset--color--brand-dark);
  --c-amber:var(--wp--preset--color--amber);
  --c-live:var(--wp--preset--color--live);
  --c-canvas:var(--wp--preset--color--canvas);
  --c-surface:var(--wp--preset--color--surface);
  --c-surface-2:var(--wp--preset--color--surface-2);
  --c-line:var(--wp--preset--color--line);
  --c-ink:var(--wp--preset--color--ink);
  --c-ink-2:var(--wp--preset--color--ink-2);
  --c-muted:var(--wp--preset--color--muted);
  --f-display:var(--wp--preset--font-family--display);
  --f-body:var(--wp--preset--font-family--body);
  --f-mono:var(--wp--preset--font-family--mono);
  --wrap:1280px;
}
body{ background:var(--c-canvas); color:var(--c-ink); }
/* Responsive safety net: never allow a horizontal scrollbar; media stays fluid. */
html,body{ max-width:100%; overflow-x:hidden; }
img,video,iframe{ max-width:100%; height:auto; }
svg{ max-width:100%; }
*,*::before,*::after{ box-sizing:border-box; }
.stelco-mono{ font-family:var(--f-mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; margin:0; }
.stelco-muted{ color:var(--c-muted); font-size:.84rem; line-height:1.7; }
.t-amber{ color:var(--c-amber); }

/* ---------- Header (matches demo: logo · search pill · quote · cart) ---------- */
.stelco-header{ position:sticky; top:0; z-index:50; box-shadow:0 1px 0 rgba(15,27,45,.05); }
.stelco-mainbar{ border-bottom:1px solid var(--c-line); }
.stelco-mainbar-inner{ max-width:var(--wrap)!important; margin:0 auto; padding:.9rem 1.5rem; display:flex!important; align-items:center; gap:1.5rem; flex-wrap:nowrap!important; }

/* Logo: navy S mark + two-line wordmark */
.stelco-logo{ display:flex; align-items:center; gap:.65rem; text-decoration:none; flex:0 0 auto; }
.stelco-logo-mark{ display:grid; place-items:center; width:40px; height:40px; border-radius:10px; background:var(--c-navy); color:#fff; font-family:var(--f-display); font-weight:900; font-size:1.15rem; }
.stelco-logo-text{ line-height:1; }
.stelco-logo-text .ln1{ display:block; font-family:var(--f-display); font-weight:800; font-size:1.15rem; color:var(--c-ink); letter-spacing:-.01em; }
.stelco-logo-text .ln2{ display:block; font-family:var(--f-mono); font-size:.58rem; text-transform:uppercase; letter-spacing:.22em; color:var(--c-muted); margin-top:.25rem; }

/* Search: full-width pill, magnifier on the left, no button */
.stelco-search{ flex:1 1 auto; min-width:0; margin:0; }
.stelco-search .wp-block-search__inside-wrapper{ position:relative; border:1px solid var(--c-line); background:var(--c-canvas); border-radius:12px; padding-left:2.4rem; overflow:hidden; }
.stelco-search .wp-block-search__inside-wrapper::before{ content:""; position:absolute; left:.95rem; top:50%; transform:translateY(-50%); width:16px; height:16px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E") no-repeat center / contain; }
.stelco-search .wp-block-search__input{ border:0!important; background:transparent!important; padding:.7rem .9rem!important; font-size:.92rem; }
.stelco-search .wp-block-search__input:focus{ outline:none; box-shadow:none; }
.stelco-search .wp-block-search__button{ display:none!important; }

/* Action buttons */
.stelco-actions{ display:flex; align-items:center; gap:.6rem; flex:0 0 auto; }
.stelco-quote-btn{ display:inline-flex; align-items:center; border:1px solid var(--c-line-2); border-radius:10px; padding:.65rem 1.15rem; font-family:var(--f-mono); font-size:.7rem; font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:var(--c-ink); text-decoration:none; white-space:nowrap; }
.stelco-quote-btn:hover{ border-color:var(--c-brand); color:var(--c-brand); }
.stelco-cart{ display:inline-flex; align-items:center; gap:.5rem; background:var(--c-brand); color:#fff; border-radius:10px; padding:.65rem 1.15rem; font-family:var(--f-mono); font-size:.7rem; font-weight:600; text-transform:uppercase; letter-spacing:.05em; text-decoration:none; white-space:nowrap; }
.stelco-cart:hover{ background:var(--c-brand-dark); color:#fff; }
.stelco-cart svg{ width:18px; height:18px; }

@media(max-width:860px){
  .stelco-mainbar-inner{ flex-wrap:wrap!important; }
  .stelco-search{ order:3; flex:1 1 100%; }
  .stelco-quote-btn span, .stelco-logo-text .ln2{ display:none; }
}

/* ---------- Section scaffolding ---------- */
.stelco-section{ padding:4rem 0; }
.stelco-section-inner,.stelco-products{ max-width:var(--wrap); margin:0 auto; padding-left:1.25rem; padding-right:1.25rem; }
.stelco-sec-head{ margin-bottom:2rem; }
.stelco-sec-head .eyebrow{ font-family:var(--f-mono); font-size:.7rem; text-transform:uppercase; letter-spacing:.1em; color:var(--c-brand); margin:0 0 .4rem; }
.stelco-sec-head h2{ font-family:var(--f-display); font-weight:800; font-size:clamp(1.8rem,3vw,2.2rem); letter-spacing:-.01em; margin:0; }

/* ---------- HERO carousel ---------- */
/* Flush against the header (no gap) + clean solid navy base (no grid squares,
   no bright-blue mesh — image-less slides show this calm gradient). */
.stelco-header{ margin-bottom:0; }
main.stelco-main{ margin-top:0 !important; }
main.stelco-main > .stelco-hero:first-child{ margin-top:0; }
/* Neutral dark placeholder (NO blue) — shown only until a slide image is set.
   Upload a Featured Image on a Hero Slide and it fills this completely. */
.stelco-hero{ position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(0,1fr); background:linear-gradient(140deg,#1b1d22 0%,#26282e 58%,#1b1d22 100%); min-height:560px; margin-top:0; }
/* Legacy decorative overlays are no longer emitted; hide them if any remain. */
.stelco-hero .bpgrid,.stelco-hero .glowv,.stelco-hero .glow-amber,.stelco-hero .knb-mesh{ display:none !important; }
/* min-width:0 lets the grid-stacked slide shrink to the screen (grid items default
   to min-width:auto = content width, which was overflowing narrow phones). */
.stelco-hero .slide{ position:relative; grid-area:1 / 1; min-width:0; max-width:100%; opacity:0; pointer-events:none; transition:opacity .8s cubic-bezier(.16,1,.3,1); }
.stelco-hero .slide.active{ opacity:1; pointer-events:auto; }
.stelco-hero .knb{ position:absolute; inset:0; transform:scale(1); transition:transform 7.5s ease-out; }
.stelco-hero .slide.active .knb{ transform:scale(1.09); }
.bpgrid{ position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px); background-size:42px 42px; }
.glowv{ position:absolute; inset:0; background:radial-gradient(58% 58% at 84% 12%,rgba(255,158,0,.22),transparent 70%); }
.glow-amber{ position:absolute; inset:0; background:radial-gradient(55% 55% at 75% 30%,rgba(255,158,0,.28),transparent 70%); }
.stelco-hero-inner{ position:relative; width:100%; min-width:0; max-width:var(--wrap); margin:0 auto; min-height:500px; display:flex; align-items:center; padding:3.25rem 1.25rem; box-sizing:border-box; }
.stelco-hero-copy{ max-width:640px; min-width:0; width:100%; color:#fff; }
.hero-h,.stelco-hero-copy .hero-p{ overflow-wrap:break-word; word-wrap:break-word; }
.stelco-hero .anim{ opacity:0; transform:translateY(24px); transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1); }
.stelco-hero .slide.active .anim{ opacity:1; transform:none; }
.chip-amber,.chip-light{ display:inline-block; font-family:var(--f-mono); font-size:.7rem; text-transform:uppercase; letter-spacing:.06em; padding:.3rem .75rem; border-radius:99px; }
.chip-amber{ color:var(--c-amber); border:1px solid rgba(255,158,0,.4); background:rgba(255,158,0,.1); }
.chip-light{ color:#fff; border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.1); }
.hero-h{ font-family:var(--f-display); font-weight:900; font-size:clamp(1.9rem,4.8vw,3.6rem); line-height:1.05; letter-spacing:-.02em; margin:1.1rem 0 0; color:#fff; }
.hero-p{ max-width:34rem; margin:1.25rem 0 0; font-size:.95rem; line-height:1.7; color:rgba(255,255,255,.72); }
.hero-cta{ margin-top:2rem; display:flex; flex-wrap:wrap; gap:.75rem; }
.btn-amber,.btn-ghost,.btn-white{ font-family:var(--f-mono); font-size:.75rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em; padding:.85rem 1.5rem; border-radius:8px; text-decoration:none; transition:all .25s; display:inline-block; }
.btn-amber{ background:var(--c-amber); color:var(--c-navy); }
.btn-amber:hover{ filter:brightness(1.05); }
.btn-ghost{ border:1px solid rgba(255,255,255,.25); color:#fff; }
.btn-ghost:hover{ background:rgba(255,255,255,.1); }
.btn-white{ background:#fff; color:var(--c-brand); }
.stelco-hero .prev,.stelco-hero .next{ position:absolute; top:50%; transform:translateY(-50%); z-index:20; width:44px; height:44px; display:grid; place-items:center; border-radius:50%; border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.1); color:#fff; cursor:pointer; backdrop-filter:blur(4px); font-size:1.2rem; }
.stelco-hero .prev{ left:1rem; } .stelco-hero .next{ right:1rem; }
.stelco-hero .prev:hover,.stelco-hero .next:hover{ background:rgba(255,255,255,.2); }
.stelco-dots{ position:absolute; bottom:1.5rem; left:50%; transform:translateX(-50%); z-index:20; display:flex; gap:.5rem; }
.stelco-dots .dot{ width:28px; height:4px; border:0; border-radius:99px; background:rgba(255,255,255,.35); cursor:pointer; transition:background .3s,width .3s; }
.stelco-dots .dot.on{ background:var(--c-amber); width:46px; }
.hero-prog{ position:absolute; left:0; bottom:0; height:3px; width:100%; background:rgba(255,255,255,.12); }
.hero-prog span{ display:block; height:100%; width:0; background:var(--c-amber); }
@media(max-width:600px){ .stelco-hero .prev,.stelco-hero .next{ display:none; } }
/* ---- Hero responsive typography + layout ---- */
@media(max-width:900px){
  .stelco-hero-inner{ min-height:440px; padding:2.75rem 1.25rem; }
  .stelco-hero-copy{ max-width:none; }
  .hero-p{ font-size:.9rem; }
}
@media(max-width:600px){
  .stelco-hero-inner{ min-height:auto; padding:2.25rem 1.15rem; }
  .stelco-hero .chip-amber,.stelco-hero .chip-light{ font-size:.58rem; padding:.28rem .6rem; }
  .hero-h{ font-size:clamp(1.5rem,7vw,2.15rem); line-height:1.1; margin-top:1rem; }
  .hero-p{ font-size:.85rem; margin-top:.9rem; line-height:1.55; }
  .hero-cta{ width:100%; gap:.55rem; margin-top:1.4rem; }
  .hero-cta > a{ flex:1 1 100%; text-align:center; padding:.85rem 1rem; }
}
@media(max-width:380px){
  .hero-h{ font-size:1.5rem; }
  .stelco-hero-inner{ padding:1.9rem 1rem; }
}
/* Uploaded slide image (Featured Image on a Hero Slide) — fills the slide, with
   a left-weighted scrim so the white copy stays legible over any photo. */
.stelco-hero .knb-img{ position:absolute; inset:0; overflow:hidden; }
.stelco-hero .knb-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.stelco-hero .knb-scrim{ position:absolute; inset:0; background:linear-gradient(90deg,rgba(12,12,14,.82) 0%,rgba(12,12,14,.55) 42%,rgba(12,12,14,.12) 100%); }

/* ---------- Promo banner (backend-managed, stelco/promo-banner) ---------- */
.stelco-promo{ position:relative; display:block; width:min(1240px,calc(100% - 2.5rem)); margin:2rem auto; border-radius:18px; overflow:hidden; text-decoration:none; box-shadow:0 18px 44px -22px rgba(10,31,61,.55); min-height:96px; }
.st-promo-navy{ background:linear-gradient(110deg,#081a33 0%,#0a2350 55%,#0064ff 100%); }
.st-promo-brand{ background:linear-gradient(110deg,#0050cc,#0064ff 60%,#3b82ff); }
.st-promo-amber{ background:linear-gradient(110deg,#b45309,#d97706 55%,#ff9e00); }
.stelco-promo .st-promo-bg{ position:absolute; inset:0; }
.stelco-promo .st-promo-bg img{ width:100%; height:100%; object-fit:cover; display:block; }
.stelco-promo .st-promo-scrim{ position:absolute; inset:0; background:linear-gradient(90deg,rgba(6,15,31,.85),rgba(6,15,31,.55) 55%,rgba(6,15,31,.25)); }
.stelco-promo .st-promo-in{ position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; padding:1.35rem clamp(1.25rem,4vw,2.5rem); }
.stelco-promo .st-promo-eyebrow{ display:block; font-family:var(--f-mono); font-size:.6rem; font-weight:600; text-transform:uppercase; letter-spacing:.14em; color:var(--c-amber); margin-bottom:.35rem; }
.stelco-promo .st-promo-h{ display:block; font-family:var(--f-display); font-size:clamp(1.15rem,2.4vw,1.55rem); font-weight:800; letter-spacing:-.01em; color:#fff; line-height:1.1; }
.stelco-promo .st-promo-sub{ display:block; font-family:var(--f-mono); font-size:.72rem; letter-spacing:.02em; color:rgba(255,255,255,.8); margin-top:.4rem; }
.stelco-promo .st-promo-cta{ flex:0 0 auto; display:inline-flex; align-items:center; gap:.5rem; background:var(--c-amber); color:var(--c-navy); border-radius:11px; padding:.7rem 1.25rem; font-family:var(--f-mono); font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; box-shadow:0 8px 22px -8px rgba(255,158,0,.7); transition:transform .15s; }
.stelco-promo:hover .st-promo-cta{ transform:translateX(3px); }
@media(max-width:620px){ .stelco-promo .st-promo-cta{ width:100%; justify-content:center; } }

/* ---------- Authorised brands strip (backend-managed, stelco/brands-banner) ---------- */
.stelco-brands{box-sizing:border-box;width:min(1240px,calc(100% - 2.5rem));margin:2.5rem auto;padding:1.9rem clamp(1.25rem,4vw,2.5rem);border-radius:20px;position:relative;overflow:hidden;background:linear-gradient(160deg,#f7faff,#eef3ff 60%,#e6eeff);border:1px solid var(--c-line)}
.stelco-brands::before{content:"";position:absolute;top:-60px;right:-40px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(0,100,255,.14),transparent 70%);pointer-events:none}
.stelco-brands .sb-head{position:relative;text-align:center;margin-bottom:1.5rem}
.stelco-brands .sb-eyebrow{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--f-mono);font-size:.62rem;font-weight:600;text-transform:uppercase;letter-spacing:.14em;color:var(--c-brand)}
.stelco-brands .sb-head h2{margin:.55rem 0 0;font-family:var(--f-display);font-size:clamp(1.2rem,2.4vw,1.65rem);font-weight:800;letter-spacing:-.01em;color:var(--c-ink)}
.stelco-brands .sb-head .t-live{color:var(--c-brand)}
.stelco-brands .sb-row{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem}
.stelco-brands .sb-tile{position:relative;overflow:hidden;border-radius:16px;background:#fff;border:1px solid rgba(15,27,45,.07);box-shadow:0 10px 26px -18px rgba(15,27,45,.4);transition:transform .25s,box-shadow .25s}
.stelco-brands .sb-tile:hover{transform:translateY(-6px);box-shadow:0 26px 50px -24px rgba(15,27,45,.5)}
.stelco-brands .sb-tile a{display:flex;align-items:center;gap:1rem;padding:1rem 1.15rem;text-decoration:none}
.stelco-brands .sb-tile .logo{flex:0 0 auto;width:64px;height:64px;border-radius:13px;overflow:hidden;display:grid;place-items:center;background:#fff;box-shadow:0 4px 12px -6px rgba(15,27,45,.4)}
.stelco-brands .sb-tile .logo img{width:100%;height:100%;object-fit:contain;display:block}
.stelco-brands .sb-tile .logo .bf-mark{font-family:var(--f-display);font-weight:800;font-size:.9rem;color:var(--c-ink)}
.stelco-brands .sb-tile .meta b{display:block;font-family:var(--f-display);font-size:1rem;font-weight:800;color:var(--c-ink);line-height:1.1}
.stelco-brands .sb-tile .meta small{display:block;font-family:var(--f-mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.08em;color:var(--c-muted);margin-top:.35rem}
@media(max-width:760px){.stelco-brands .sb-row{grid-template-columns:1fr}}

/* ---------- Trust bar ---------- */
.stelco-trustbar{ border-bottom:1px solid var(--c-line); background:var(--c-canvas); }
.stelco-trustbar-inner{ max-width:var(--wrap); margin:0 auto; padding:1rem 1.25rem; display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:.75rem 2rem; font-family:var(--f-mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--c-muted); }
.stelco-trustbar .sep{ width:1px; height:14px; background:var(--c-line); }
@media(max-width:700px){ .stelco-trustbar .sep{ display:none; } }

/* ---------- Value strip ---------- */
.stelco-valuestrip{ border-bottom:1px solid var(--c-line); background:var(--c-surface); }
.stelco-valuestrip-inner{ max-width:var(--wrap); margin:0 auto; display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--c-line); }
.stelco-valuestrip .vp{ background:var(--c-surface); padding:1.5rem 1.25rem; }
.vp-ico{ display:grid; place-items:center; width:36px; height:36px; border-radius:8px; background:var(--c-surface-2); color:var(--c-brand); font-size:1.1rem; margin-bottom:.6rem; }
.stelco-valuestrip h3{ font-family:var(--f-body); font-size:.9rem; font-weight:700; margin:0; }
.stelco-valuestrip p{ font-size:.8rem; color:var(--c-muted); line-height:1.4; margin:.3rem 0 0; }
@media(max-width:780px){ .stelco-valuestrip-inner{ grid-template-columns:repeat(2,1fr); } }

/* ---------- Category grid ---------- */
.stelco-cat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.cat-card{ display:flex; flex-direction:column; padding:1.5rem; border:1px solid var(--c-line); border-radius:12px; background:var(--c-surface); text-decoration:none; color:var(--c-ink); transition:transform .3s,border-color .3s,box-shadow .3s; }
.cat-card:hover{ transform:translateY(-4px); border-color:rgba(0,100,255,.4); box-shadow:0 18px 40px -24px rgba(0,100,255,.45); }
.cat-ico{ display:grid; place-items:center; width:44px; height:44px; border-radius:10px; background:var(--c-surface-2); color:var(--c-brand); font-size:1.3rem; margin-bottom:2rem; }
.cat-card h3{ font-family:var(--f-display); font-size:1.1rem; font-weight:700; margin:0; line-height:1.2; }
.cat-card p{ font-family:var(--f-mono); font-size:.72rem; color:var(--c-muted); margin:.3rem 0 0; }
.cat-more{ margin-top:1rem; font-family:var(--f-mono); font-size:.72rem; color:var(--c-brand); opacity:0; transition:opacity .3s; }
.cat-card:hover .cat-more{ opacity:1; }
@media(max-width:780px){ .stelco-cat-grid{ grid-template-columns:repeat(2,1fr); } }

/* ---------- Featured products (WooCommerce) ---------- */
.stelco-products{ padding:4rem 1.25rem; }
.woocommerce ul.products li.product,.stelco-products ul.products li.product{ border:1px solid var(--c-line); border-radius:12px; background:var(--c-surface); padding:1rem; transition:transform .3s,border-color .3s,box-shadow .3s; }
.woocommerce ul.products li.product:hover{ transform:translateY(-4px); border-color:rgba(0,100,255,.4); box-shadow:0 20px 44px -26px rgba(15,27,45,.4); }
.woocommerce ul.products li.product .woocommerce-loop-product__title{ font-family:var(--f-body); font-size:.9rem; font-weight:600; }
.woocommerce ul.products li.product .price{ font-family:var(--f-display); font-weight:800; color:var(--c-ink); }
.woocommerce ul.products li.product .button{ background:var(--c-brand); color:#fff; border-radius:8px; font-family:var(--f-mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; }
.woocommerce ul.products li.product .button:hover{ background:var(--c-brand-dark); }

/* ---------- Quote band ---------- */
.stelco-quoteband{ background:var(--c-navy); }
.stelco-quoteband-inner{ max-width:var(--wrap); margin:0 auto; padding:4rem 1.25rem; display:flex; flex-wrap:wrap; gap:2rem; align-items:center; justify-content:space-between; }
.stelco-quoteband h2{ font-family:var(--f-display); font-weight:900; font-size:clamp(1.8rem,4vw,2.5rem); line-height:1.1; letter-spacing:-.01em; color:#fff; margin:0; }
.stelco-quoteband p{ max-width:32rem; margin:.9rem 0 0; color:rgba(255,255,255,.7); font-size:.95rem; line-height:1.6; }

/* ---------- Footer ---------- */
.stelco-footer{ border-top:1px solid var(--c-line); padding:3.5rem 1.25rem; }
.stelco-footer .stelco-footer-cols{ max-width:var(--wrap); margin:0 auto; }
.stelco-foot-h{ font-family:var(--f-mono); font-size:.7rem; text-transform:uppercase; letter-spacing:.12em; color:var(--c-ink); margin:0 0 1rem; }
.stelco-foot-list{ list-style:none; padding:0; margin:0; }
.stelco-foot-list li{ margin:0 0 .6rem; }
.stelco-foot-list a{ color:var(--c-muted); text-decoration:none; font-size:.84rem; }
.stelco-foot-list a:hover{ color:var(--c-brand); }
/* Footer columns are editable Navigation blocks (stelco/menus). Match the old list look. */
.stelco-foot-nav{ --wp--style--block-gap:.6rem; }
.stelco-foot-nav ul.wp-block-navigation__container,.stelco-foot-nav .wp-block-navigation__container{ flex-direction:column!important; gap:.6rem!important; align-items:flex-start; }
.stelco-foot-nav .wp-block-navigation-item__content{ color:var(--c-muted); text-decoration:none; font-size:.84rem; padding:0; }
.stelco-foot-nav .wp-block-navigation-item__content:hover{ color:var(--c-brand); }
/* Footer badges row (app-store + payment/tax images, stelco/footer-badges block) */
.stelco-foot-badges-row{ margin-top:2.5rem; padding-top:1.75rem; border-top:1px solid var(--c-line); display:flex; flex-wrap:wrap; gap:1.5rem 2.5rem; align-items:flex-end; justify-content:space-between; }
.stelco-foot-badges .fb-head{ display:block; font-family:var(--f-mono); font-size:.62rem; text-transform:uppercase; letter-spacing:.12em; color:var(--c-ink); margin:0 0 .65rem; }
.stelco-foot-badges .fb-items{ display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; }
.stelco-foot-badges .fb-item{ display:inline-flex; transition:transform .15s,opacity .15s; }
.stelco-foot-badges .fb-item:hover{ transform:translateY(-2px); opacity:.9; }
.stelco-foot-badges .fb-item img{ display:block; width:auto; border-radius:6px; }
.stelco-foot-badges--app .fb-item img{ height:42px; }
.stelco-foot-badges--payment .fb-item img,.stelco-foot-badges--social .fb-item img,.stelco-foot-badges--other .fb-item img{ height:34px; border-radius:4px; }
@media(max-width:640px){ .stelco-foot-badges-row{ gap:1.5rem; } }
.stelco-foot-copy{ max-width:var(--wrap); margin:3rem auto 0; padding-top:1.5rem; border-top:1px solid var(--c-line); color:var(--c-muted); }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  .stelco-hero .slide{ transition:none; } .stelco-hero .knb{ transition:none; transform:none; }
  .stelco-hero .anim{ opacity:1!important; transform:none!important; }
}

/* ============================================================================
   v1.0 — Catalog nav, search, full WooCommerce styling, scroll-reveal.
   ============================================================================ */

/* Catalog / menu nav bar */
.stelco-catnav-bar{ border-top:1px solid var(--c-line); background:var(--c-surface); }
.stelco-catnav-bar > .wp-block-navigation{ max-width:var(--wrap); margin:0 auto; padding:0 1.5rem; }
.stelco-catnav{ gap:0!important; }
.stelco-catnav .wp-block-navigation-item__content{ font-family:var(--f-body); font-size:.85rem; font-weight:500; color:var(--c-ink-2); padding:.85rem 1rem; border-bottom:2px solid transparent; text-decoration:none; }
.stelco-catnav .wp-block-navigation-item:first-child .wp-block-navigation-item__content{ padding-left:0; }
.stelco-catnav .wp-block-navigation-item__content:hover{ color:var(--c-brand); border-bottom-color:var(--c-brand); }
.stelco-catnav .current-menu-item > .wp-block-navigation-item__content{ color:var(--c-brand); border-bottom-color:var(--c-brand); }

/* WooCommerce result-count + sorting dropdown (fix broken default) */
.woocommerce .woocommerce-result-count{ font-family:var(--f-mono); font-size:.76rem; color:var(--c-muted); margin:0; padding-top:.5rem; }
.woocommerce .woocommerce-ordering{ margin-bottom:1.5rem; }
.woocommerce .woocommerce-ordering select, .woocommerce-ordering select.orderby{ border:1px solid var(--c-line-2); border-radius:8px; padding:.55rem 2.2rem .55rem .85rem; font-family:var(--f-body); font-size:.85rem; line-height:1.2; background:var(--c-surface); color:var(--c-ink); max-width:100%; -webkit-appearance:none; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%2364748b' stroke-width='2'%3E%3Cpath d='M2 4l4 4 4-4'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .7rem center; }

/* Search bar */
.stelco-search .wp-block-search__inside-wrapper{ border:1px solid var(--c-line-2); border-radius:8px; background:var(--c-canvas); overflow:hidden; }
.stelco-search .wp-block-search__input{ border:0; background:transparent; padding:.6rem .8rem; font-size:.9rem; }
.stelco-search .wp-block-search__input:focus{ outline:none; box-shadow:none; }
.stelco-search .wp-block-search__button{ background:var(--c-brand); color:#fff; margin:0; border-radius:0; font-family:var(--f-mono); font-size:.7rem; text-transform:uppercase; letter-spacing:.06em; padding:0 1rem; }
.stelco-search .wp-block-search__button:hover{ background:var(--c-brand-dark); }

/* Buttons (global + WooCommerce) */
.wp-block-button.is-style-ghost .wp-block-button__link{ background:transparent; color:var(--c-ink); border:1px solid var(--c-line-2); }
.wp-block-button.is-style-amber .wp-block-button__link{ background:var(--c-amber); color:var(--c-navy); }
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce .button, .wc-block-components-button{ background:var(--c-brand)!important; color:#fff!important; border-radius:8px!important; font-family:var(--f-mono)!important; font-size:.72rem!important; font-weight:600!important; text-transform:uppercase!important; letter-spacing:.06em!important; border:0!important; }
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce .button:hover{ background:var(--c-brand-dark)!important; }
.woocommerce .button.alt, .woocommerce #place_order{ background:var(--c-amber)!important; color:var(--c-navy)!important; }

/* Shop / archive product grid (match demo cards) */
.woocommerce ul.products{ display:grid!important; grid-template-columns:repeat(4,1fr); gap:1.25rem; margin:0; }
.woocommerce ul.products li.product{ float:none!important; width:auto!important; margin:0!important; display:flex; flex-direction:column; border:1px solid var(--c-line); border-radius:12px; background:var(--c-surface); padding:0; overflow:hidden; transition:transform .3s, border-color .3s, box-shadow .3s; }
.woocommerce ul.products li.product:hover{ transform:translateY(-4px); border-color:rgba(0,100,255,.4); box-shadow:0 20px 44px -26px rgba(15,27,45,.4); }
.woocommerce ul.products li.product a img{ margin:0; border-bottom:1px solid var(--c-line); background:var(--c-surface-2); }
.woocommerce ul.products li.product .woocommerce-loop-product__title{ padding:.9rem 1rem 0; font-family:var(--f-body); font-size:.9rem; font-weight:600; color:var(--c-ink); }
.woocommerce ul.products li.product .price{ padding:.4rem 1rem 0; font-family:var(--f-display); font-weight:800; color:var(--c-ink); display:block; }
.woocommerce ul.products li.product .price del{ color:var(--c-muted); font-weight:400; font-size:.85em; }
.woocommerce ul.products li.product .button, .woocommerce ul.products li.product .added_to_cart{ margin:.8rem 1rem 1rem; text-align:center; }
.woocommerce span.onsale{ background:var(--c-amber); color:var(--c-navy); font-family:var(--f-mono); font-size:.65rem; text-transform:uppercase; letter-spacing:.06em; border-radius:99px; min-height:auto; min-width:auto; padding:.25rem .6rem; }
@media(max-width:1024px){ .woocommerce ul.products{ grid-template-columns:repeat(3,1fr); } }
@media(max-width:780px){ .woocommerce ul.products{ grid-template-columns:repeat(2,1fr); } }

/* Single product */
.woocommerce div.product .product_title{ font-family:var(--f-display); font-weight:800; letter-spacing:-.01em; }
.woocommerce div.product p.price, .woocommerce div.product span.price{ color:var(--c-ink); font-family:var(--f-display); font-weight:800; font-size:1.8rem; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{ border-bottom-color:var(--c-brand); }
.woocommerce .quantity .qty{ border:1px solid var(--c-line-2); border-radius:8px; padding:.5rem; font-family:var(--f-mono); }
.woocommerce div.product form.cart .button{ padding:.9rem 1.75rem; }

/* Cart */
.woocommerce table.shop_table{ border:1px solid var(--c-line); border-radius:12px; border-collapse:separate; border-spacing:0; overflow:hidden; background:var(--c-surface); }
.woocommerce table.shop_table th{ font-family:var(--f-mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--c-ink); background:var(--c-surface-2); padding:1rem; }
.woocommerce table.shop_table td{ padding:1rem; border-top:1px solid var(--c-line); }
.woocommerce a.remove{ color:var(--c-muted)!important; }
.woocommerce a.remove:hover{ background:var(--c-amber)!important; color:var(--c-navy)!important; }
.woocommerce .cart_totals h2{ font-family:var(--f-display); font-weight:800; }
.woocommerce .cart-collaterals .cart_totals, .woocommerce-checkout #order_review{ border:1px solid var(--c-line); border-radius:12px; background:var(--c-surface); padding:1.5rem; }

/* Checkout / forms */
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce form .form-row select, .select2-container .select2-selection{ border:1px solid var(--c-line-2)!important; border-radius:8px!important; padding:.7rem .8rem!important; font-size:.9rem; background:var(--c-surface); }
.woocommerce form .form-row input.input-text:focus{ border-color:var(--c-brand)!important; outline:none; }
.woocommerce-checkout h3{ font-family:var(--f-display); font-weight:800; }

/* My account */
.woocommerce-account .woocommerce-MyAccount-navigation ul{ border:1px solid var(--c-line); border-radius:12px; overflow:hidden; list-style:none; padding:0; }
.woocommerce-account .woocommerce-MyAccount-navigation li{ border-bottom:1px solid var(--c-line); }
.woocommerce-account .woocommerce-MyAccount-navigation li a{ display:block; padding:.8rem 1rem; font-family:var(--f-mono); font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; color:var(--c-ink-2); text-decoration:none; }
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{ background:var(--c-brand); color:#fff; }

/* Notices */
.woocommerce-message, .woocommerce-info, .woocommerce-error{ border-top:3px solid var(--c-brand); border-radius:8px; background:var(--c-surface-2); font-size:.9rem; }
.woocommerce-error{ border-top-color:#dc2626; }
.woocommerce-message{ border-top-color:var(--c-live); }

/* Breadcrumb / pagination */
.woocommerce .woocommerce-breadcrumb{ font-family:var(--f-mono); font-size:.72rem; color:var(--c-muted); }
/* Space the pager away from the product grid (was hugging the last card row). */
.woocommerce nav.woocommerce-pagination{ clear:both; margin:2.75rem 0 1rem; padding-top:2rem; border-top:1px solid var(--c-line); }
.stelco-shop-grid nav.woocommerce-pagination{ margin-top:2.75rem!important; }
.woocommerce nav.woocommerce-pagination ul{ border:0; gap:.4rem; display:flex; margin:0; }
.woocommerce nav.woocommerce-pagination ul li{ border:0; }
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span{ border:1px solid var(--c-line); border-radius:8px; font-family:var(--f-mono); font-size:.8rem; padding:.5rem .8rem; min-width:2.4rem; min-height:2.4rem; display:inline-flex; align-items:center; justify-content:center; box-sizing:border-box; }
.woocommerce nav.woocommerce-pagination ul li span.current{ background:var(--c-brand); color:#fff; border-color:var(--c-brand); }

/* Scroll reveal (gated by JS so content never hides on failure) */
html.stelco-js .sreveal{ opacity:0; transform:translateY(22px); transition:opacity .6s cubic-bezier(.16,1,.3,1), transform .6s cubic-bezier(.16,1,.3,1); }
html.stelco-js .sreveal.is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ html.stelco-js .sreveal{ opacity:1; transform:none; } }

/* ============================================================================
   v1.0.1 — Product card cleanup (covers classic .products, wc-block-grid, and
   Product Collection block markup). Kills blue underlines + oversized buttons.
   ============================================================================ */

/* No underlines on product/card/nav links anywhere in the shop */
.woocommerce a, .wc-block-grid a, .wc-block-components-product-name,
.wp-block-woocommerce-product-template a, .products-block-post-template a{ text-decoration:none!important; }

/* Product titles → ink, clean, display font; hover = brand (no underline) */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.wc-block-grid__product-title,
.wc-block-components-product-name,
.wp-block-post-title{
  color:var(--c-ink)!important; font-family:var(--f-body)!important; font-weight:600!important;
  font-size:.9rem!important; line-height:1.35!important; text-decoration:none!important;
}
.woocommerce ul.products li.product a:hover .woocommerce-loop-product__title,
.wc-block-grid__product-link:hover .wc-block-grid__product-title{ color:var(--c-brand)!important; }

/* Block-grid card shell to match the demo cards */
.wc-block-grid__products{ display:grid!important; grid-template-columns:repeat(4,1fr); gap:1.25rem; list-style:none; margin:0; padding:0; }
.wc-block-grid__product{ display:flex!important; flex-direction:column; border:1px solid var(--c-line); border-radius:12px; background:var(--c-surface); padding:1rem; margin:0!important; text-align:left; transition:transform .3s, border-color .3s, box-shadow .3s; }
.wc-block-grid__product:hover{ transform:translateY(-4px); border-color:rgba(0,100,255,.4); box-shadow:0 20px 44px -26px rgba(15,27,45,.4); }
.wc-block-grid__product-image{ margin-bottom:.75rem; }
.wc-block-grid__product-price{ font-family:var(--f-display)!important; font-weight:800!important; color:var(--c-ink)!important; display:block; margin:.35rem 0 .75rem; }
@media(max-width:1024px){ .wc-block-grid__products{ grid-template-columns:repeat(3,1fr); } }
@media(max-width:780px){ .wc-block-grid__products{ grid-template-columns:repeat(2,1fr); } }

/* Compact, tasteful add-to-cart buttons (kill the "huge blue" look) */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart,
.wc-block-grid__product .wp-block-button__link,
.wc-block-grid__product-add-to-cart .button,
.wp-block-woocommerce-product-template .wp-block-button__link{
  display:inline-block!important; width:auto!important; margin:0!important;
  padding:.5rem .9rem!important; font-size:.7rem!important; line-height:1.2!important;
  border-radius:8px!important; background:var(--c-brand)!important; color:#fff!important;
}
.wc-block-grid__product .wc-block-grid__product-add-to-cart{ margin-top:auto; }

/* Tidy the section heading spacing the block adds */
.stelco-products .wc-block-grid, .stelco-products .wp-block-woocommerce-product-collection{ margin-top:1.5rem; }

/* ============================================================================
   v1.0.2 — Demo-style product card (classic loop + injected badges/specs).
   ============================================================================ */
.woocommerce ul.products li.product{ position:relative; padding:0; }
.woocommerce ul.products li.product > a:first-of-type,
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link{ display:block; position:relative; }
.woocommerce ul.products li.product img{ border-radius:0; }

/* badges over the image */
.woocommerce ul.products li.product .pc-stock{ position:absolute; top:.6rem; left:.6rem; z-index:2; display:inline-flex; align-items:center; gap:.4rem; background:rgba(255,255,255,.92); backdrop-filter:blur(4px); border-radius:99px; padding:.25rem .6rem; font-family:var(--f-mono); font-size:.62rem; text-transform:uppercase; letter-spacing:.04em; }
.woocommerce ul.products li.product .pc-stock i{ width:6px; height:6px; border-radius:50%; display:inline-block; }
.pc-stock.pc-in{ color:var(--c-live); } .pc-stock.pc-in i{ background:var(--c-live); }
.pc-stock.pc-order{ color:var(--c-amber); } .pc-stock.pc-order i{ background:var(--c-amber); }
.pc-stock.pc-out{ color:var(--c-muted); } .pc-stock.pc-out i{ background:var(--c-muted); }
.woocommerce ul.products li.product .pc-brand{ position:absolute; top:.6rem; right:.6rem; z-index:2; background:var(--c-navy); color:#fff; border-radius:6px; padding:.2rem .5rem; font-family:var(--f-mono); font-size:.6rem; text-transform:uppercase; letter-spacing:.04em; }

/* inner padding for text below image */
.woocommerce ul.products li.product .woocommerce-loop-product__title{ padding:.9rem 1rem 0; }
.woocommerce ul.products li.product .pc-specs{ display:flex; flex-wrap:wrap; gap:.4rem; padding:.6rem 1rem 0; }
.woocommerce ul.products li.product .pc-specs span{ border:1px solid var(--c-line); background:var(--c-canvas); color:var(--c-ink-2); border-radius:4px; padding:.15rem .4rem; font-family:var(--f-mono); font-size:.62rem; }
.woocommerce ul.products li.product .price{ padding:.6rem 1rem 0; }
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart{ margin:.8rem 1rem 1rem!important; }

/* Consistent SQUARE product media + left-aligned card text (match demo) */
.woocommerce ul.products li.product{ text-align:left; }
.woocommerce ul.products li.product a img,
.woocommerce ul.products li.product img.attachment-woocommerce_thumbnail{
  aspect-ratio:1/1!important; width:100%!important; height:auto!important;
  object-fit:contain!important; background:var(--c-surface-2); padding:1.25rem; margin:0!important;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .pc-specs{ text-align:left; }
.woocommerce ul.products li.product .woocommerce-loop-product__title{ text-transform:none!important; padding-top:.3rem!important; }

/* Category eyebrow above the title */
.woocommerce ul.products li.product .pc-cat{ display:block; padding:.9rem 1rem 0; font-family:var(--f-mono); font-size:.62rem; text-transform:uppercase; letter-spacing:.08em; color:var(--c-brand); }

/* Content/doc pages (Legal, Delivery, About) */
.stelco-doc{ padding:3.5rem 1.5rem 4.5rem; }
.stelco-doc h1{ margin-bottom:1.25rem; }
.stelco-doc h2{ margin-top:2.25rem; margin-bottom:.6rem; font-size:1.35rem; }
.stelco-doc p, .stelco-doc li{ color:var(--c-ink-2); line-height:1.75; }
.stelco-doc ul{ padding-left:1.2rem; }
.stelco-doc li{ margin:.35rem 0; }

/* ============================================================================
   v1.0.3 — Refined product card: subtle media, no blue links, smaller type,
   proper pill badges. This block overrides earlier card rules.
   ============================================================================ */
.woocommerce ul.products li.product{ position:relative; border:1px solid var(--c-line); border-radius:14px; background:var(--c-surface); overflow:hidden; padding:0!important; }

/* Media — clean square, neutral (not blue) bg, modest padding */
.woocommerce ul.products li.product > a img,
.woocommerce ul.products li.product img.attachment-woocommerce_thumbnail{
  aspect-ratio:1/1!important; object-fit:contain!important; width:100%!important; height:auto!important;
  background:#f8fafc!important; padding:1.1rem!important; margin:0!important; display:block; border:0!important; border-bottom:1px solid var(--c-line)!important;
}

/* Kill all blue/underlined links inside the card */
.woocommerce ul.products li.product a,
.woocommerce ul.products li.product a:hover{ color:var(--c-ink)!important; text-decoration:none!important; }

/* Stock pill (was showing as plain text) */
.pc-stock{ position:absolute!important; top:.7rem; left:.7rem; z-index:3; display:inline-flex!important; align-items:center; gap:.4rem; background:#fff; box-shadow:0 1px 4px rgba(15,27,45,.14); border-radius:999px; padding:.28rem .6rem; font-family:var(--f-mono); font-size:.6rem; font-weight:500; text-transform:uppercase; letter-spacing:.04em; line-height:1; }
.pc-stock i{ width:6px; height:6px; border-radius:50%; display:inline-block; }
.pc-stock.pc-in{ color:#15803d; } .pc-stock.pc-in i{ background:#16a34a; }
.pc-stock.pc-order{ color:#b45309; } .pc-stock.pc-order i{ background:var(--c-amber); }
.pc-stock.pc-out{ color:#64748b; } .pc-stock.pc-out i{ background:#94a3b8; }
.pc-brand{ position:absolute!important; top:.7rem; right:.7rem; z-index:3; background:var(--c-navy); color:#fff!important; border-radius:6px; padding:.2rem .45rem; font-family:var(--f-mono); font-size:.56rem; text-transform:uppercase; letter-spacing:.04em; }

/* Text — smaller, neutral, tidy padding */
.woocommerce ul.products li.product .pc-cat{ display:block; padding:.85rem .9rem 0!important; font-family:var(--f-mono); font-size:.58rem; text-transform:uppercase; letter-spacing:.08em; color:var(--c-muted)!important; }
.woocommerce ul.products li.product .woocommerce-loop-product__title{ padding:.25rem .9rem 0!important; font-family:var(--f-body)!important; font-size:.82rem!important; font-weight:600!important; line-height:1.35!important; color:var(--c-ink)!important; text-transform:none!important; }
.woocommerce ul.products li.product .pc-specs{ padding:.5rem .9rem 0!important; gap:.35rem; }
.woocommerce ul.products li.product .pc-specs span{ font-size:.58rem; padding:.12rem .38rem; }
.woocommerce ul.products li.product .price{ padding:.5rem .9rem 0!important; font-family:var(--f-display)!important; font-weight:700!important; font-size:1rem!important; color:var(--c-ink)!important; }
.woocommerce ul.products li.product .price .woocommerce-Price-amount{ font-size:1rem; color:var(--c-ink); }
.woocommerce ul.products li.product .price del{ font-size:.8rem; opacity:.6; }
.woocommerce ul.products li.product .price ins{ text-decoration:none; }

/* Compact button */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart{ display:inline-block!important; width:auto!important; margin:.7rem .9rem .9rem!important; padding:.5rem .85rem!important; font-size:.62rem!important; border-radius:8px!important; }

/* ============================================================================
   v1.0.4 — Single product page: clean, modern, smaller type (match demo).
   ============================================================================ */
.woocommerce div.product{ font-size:.95rem; }
.woocommerce div.product .product_title{ font-family:var(--f-display)!important; font-size:1.7rem!important; font-weight:800!important; letter-spacing:-.01em; line-height:1.15; text-transform:none!important; margin:0 0 .5rem!important; color:var(--c-ink); }

/* Price — smaller, tax note subtle on its own line */
.woocommerce div.product p.price, .woocommerce div.product span.price{ font-family:var(--f-display)!important; font-weight:700!important; font-size:1.5rem!important; color:var(--c-ink)!important; margin:.25rem 0 1.1rem!important; }
.woocommerce div.product p.price .woocommerce-Price-amount{ font-size:1.5rem; }
.woocommerce div.product p.price small.includes_tax,
.woocommerce div.product .price .tax_label,
.woocommerce div.product p.price small{ display:block; font-family:var(--f-mono); font-size:.6rem; font-weight:400; text-transform:uppercase; letter-spacing:.06em; color:var(--c-muted); margin-top:.25rem; }

/* No underlines anywhere on product / breadcrumb / meta */
.woocommerce a, .woocommerce-breadcrumb a, .woocommerce div.product .product_meta a{ text-decoration:none!important; color:var(--c-ink-2); }
.woocommerce a:hover{ color:var(--c-brand); }
.woocommerce-breadcrumb{ font-family:var(--f-mono); font-size:.7rem; color:var(--c-muted); margin-bottom:1.5rem; letter-spacing:.03em; }

/* Short description */
.woocommerce div.product .woocommerce-product-details__short-description{ color:var(--c-ink-2); line-height:1.7; font-size:.92rem; }
.woocommerce div.product .woocommerce-product-details__short-description p{ margin:0 0 .8rem; }

/* Variation select + quantity */
.woocommerce div.product form.cart .variations td.value select,
.woocommerce div.product form.cart select{ border:1px solid var(--c-line-2)!important; border-radius:8px!important; padding:.6rem .8rem!important; font-size:.9rem; min-height:auto; background:var(--c-surface); }
.woocommerce div.product form.cart .variations th{ font-family:var(--f-mono); font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; color:var(--c-ink); }
.woocommerce .quantity .qty{ border:1px solid var(--c-line-2)!important; border-radius:8px!important; padding:.55rem!important; width:4rem; font-family:var(--f-mono); text-align:center; }
.woocommerce div.product form.cart .button, .woocommerce .single_add_to_cart_button{ padding:.8rem 1.6rem!important; font-size:.72rem!important; border-radius:8px!important; }

/* Product meta (SKU / category) */
.woocommerce div.product .product_meta{ font-family:var(--f-mono); font-size:.72rem; color:var(--c-muted); border-top:1px solid var(--c-line); padding-top:1rem; margin-top:1.5rem; }
.woocommerce div.product .product_meta > span{ display:block; margin:.25rem 0; }

/* TABS — flatten WooCommerce's boxes into clean underline tabs */
.woocommerce div.product .woocommerce-tabs{ margin-top:2.5rem; }
.woocommerce div.product .woocommerce-tabs ul.tabs{ padding:0!important; margin:0 0 1.5rem!important; border-bottom:1px solid var(--c-line); display:flex; gap:.25rem; }
.woocommerce div.product .woocommerce-tabs ul.tabs::before{ display:none!important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li{ background:transparent!important; border:0!important; border-radius:0!important; margin:0!important; padding:0!important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after{ display:none!important; border:0!important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a{ display:block; padding:.7rem 1rem!important; font-family:var(--f-mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--c-muted)!important; border-bottom:2px solid transparent; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{ color:var(--c-brand)!important; border-bottom-color:var(--c-brand); }
.woocommerce div.product .woocommerce-tabs .panel{ padding:0!important; color:var(--c-ink-2); line-height:1.7; font-size:.92rem; }
.woocommerce div.product .woocommerce-tabs .panel h2{ font-family:var(--f-display); font-size:1.2rem; font-weight:800; color:var(--c-ink); }
/* Specifications table — clean divider rows (no gray fill column), per demo */
.woocommerce table.shop_attributes,
.woocommerce table.woocommerce-product-attributes{ border:0!important; width:100%; max-width:640px; border-collapse:collapse; margin:.25rem 0 0; }
.woocommerce table.shop_attributes tr,
.woocommerce table.woocommerce-product-attributes tr{ border-bottom:1px solid var(--c-line)!important; background:transparent!important; }
.woocommerce table.shop_attributes th,
.woocommerce table.woocommerce-product-attributes th{ width:38%; text-align:left!important; vertical-align:top; background:transparent!important; border:0!important; padding:.7rem 1rem .7rem 0!important; font-family:var(--f-mono); font-size:.72rem; font-weight:500; text-transform:capitalize; letter-spacing:0; color:var(--c-muted)!important; }
.woocommerce table.shop_attributes td,
.woocommerce table.woocommerce-product-attributes td{ background:transparent!important; border:0!important; padding:.7rem 0!important; font-style:normal!important; font-family:var(--f-body); font-size:.88rem; color:var(--c-ink)!important; }
.woocommerce table.shop_attributes td p,
.woocommerce table.woocommerce-product-attributes td p{ margin:0; }

/* ============================================================================
   v1.0.5 — Single product layout pieces (eyebrow, spec strip, buy-box).
   ============================================================================ */
.woocommerce div.product .sp-cat{ display:block; font-family:var(--f-mono); font-size:.66rem; text-transform:uppercase; letter-spacing:.08em; color:var(--c-brand); margin-bottom:.5rem; }
.woocommerce div.product .sp-specs{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--c-line); border:1px solid var(--c-line); border-radius:10px; overflow:hidden; margin:1.25rem 0 1.5rem; }
.woocommerce div.product .sp-spec{ background:var(--c-surface); padding:.75rem .5rem; text-align:center; }
.woocommerce div.product .sp-spec .v{ display:block; font-family:var(--f-mono); font-size:1.05rem; font-weight:600; color:var(--c-ink); }
.woocommerce div.product .sp-spec .l{ display:block; font-family:var(--f-mono); font-size:.56rem; text-transform:uppercase; letter-spacing:.04em; color:var(--c-muted); margin-top:.25rem; }
.woocommerce div.product .sp-buybox{ border:1px solid var(--c-line); border-radius:14px; background:var(--c-surface); padding:1.5rem; margin-top:.5rem; }
.woocommerce div.product .sp-buybox p.price{ margin:0 0 1rem!important; }
@media(max-width:600px){ .woocommerce div.product .sp-specs{ grid-template-columns:repeat(2,1fr); } }

/* ============================================================================
   v1.0.6 — Tabs in a bordered card + Related products (match product1.png).
   ============================================================================ */
.woocommerce div.product .woocommerce-tabs{ border:1px solid var(--c-line); border-radius:14px; background:var(--c-surface); padding:1.5rem 1.75rem; margin-top:2.5rem; }
.woocommerce div.product .woocommerce-tabs ul.tabs{ margin:0 0 1.25rem!important; }
.woocommerce div.product .woocommerce-tabs .panel ul{ padding-left:1.1rem; }
.woocommerce div.product .woocommerce-tabs .panel li{ margin:.3rem 0; color:var(--c-ink-2); }
.woocommerce .related.products, .woocommerce .upsells.products{ margin-top:3rem; }
.woocommerce .related.products > h2, .woocommerce .upsells.products > h2{ font-family:var(--f-display); font-size:1.5rem; font-weight:800; color:var(--c-ink); margin-bottom:1.25rem; }

/* ============================================================================
   v1.0.7 — Product controls: quantity stepper, variation dropdown, buttons.
   ============================================================================ */

/* Spec strip: inline so few attributes don't stretch lopsided */
.woocommerce div.product .sp-specs{ display:inline-flex!important; flex-wrap:wrap; }
.woocommerce div.product .sp-spec{ min-width:96px; }

/* Variation rows + "Choose an option" dropdown */
.woocommerce div.product form.cart .variations{ border:0!important; margin:0 0 1.25rem!important; width:auto; }
.woocommerce div.product form.cart .variations tr{ display:flex; flex-direction:column; gap:.45rem; }
.woocommerce div.product form.cart .variations th.label{ font-family:var(--f-mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--c-ink); padding:0; text-align:left; }
.woocommerce div.product form.cart .variations td.value{ padding:0; }
.woocommerce div.product form.cart .variations select{ width:100%; max-width:340px; border:1px solid var(--c-line-2); border-radius:10px; padding:.75rem 2.4rem .75rem .9rem; font-size:.92rem; color:var(--c-ink); background-color:var(--c-surface); -webkit-appearance:none; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%2364748b' stroke-width='2'%3E%3Cpath d='M2 4l4 4 4-4'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .9rem center; }
.woocommerce div.product .reset_variations{ display:inline-block; margin-top:.5rem; font-family:var(--f-mono); font-size:.7rem; color:var(--c-muted); text-decoration:none; }

/* Cart form: align quantity + buttons on one row */
.woocommerce div.product form.cart{ display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; margin-top:.5rem; }
.woocommerce div.product form.cart .quantity{ margin:0!important; }

/* Quantity stepper (−/+ injected by shop.js) */
.woocommerce .stelco-qty{ display:inline-flex!important; align-items:center; border:1px solid var(--c-line-2); border-radius:10px; overflow:hidden; background:var(--c-surface); }
.woocommerce .stelco-qty .qty{ border:0!important; border-radius:0!important; width:3rem!important; height:2.75rem; text-align:center; box-shadow:none!important; background:transparent!important; font-family:var(--f-mono); -moz-appearance:textfield; }
.woocommerce .stelco-qty .qty::-webkit-outer-spin-button, .woocommerce .stelco-qty .qty::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.stelco-qty-btn{ width:2.6rem; height:2.75rem; border:0; background:transparent; color:var(--c-ink); font-size:1.15rem; line-height:1; cursor:pointer; display:grid; place-items:center; transition:background .2s,color .2s; }
.stelco-qty-btn:hover{ background:var(--c-surface-2); color:var(--c-brand); }
.stelco-qty-btn.minus{ border-right:1px solid var(--c-line); }
.stelco-qty-btn.plus{ border-left:1px solid var(--c-line); }

/* Add to Cart — primary */
.woocommerce div.product form.cart .button,
.woocommerce .single_add_to_cart_button{ padding:.85rem 1.9rem!important; font-size:.75rem!important; border-radius:10px!important; background:var(--c-brand)!important; color:#fff!important; height:auto; line-height:1.2; }
.woocommerce div.product form.cart .button:hover,
.woocommerce .single_add_to_cart_button:hover{ background:var(--c-brand-dark)!important; }
.woocommerce .single_add_to_cart_button.disabled,
.woocommerce .single_add_to_cart_button.wc-variation-selection-needed{ background:var(--c-surface-2)!important; color:var(--c-muted)!important; opacity:1!important; cursor:not-allowed; }

/* Add to Quote / Request a Quote — secondary outline (broad selector net for RFQ plugins) */
.add_to_quote, .add_to_quote a, .add-to-quote, .single_add_to_quote_button,
a.wcmq_add_to_quote, .gpls-rfq-add-to-quote, .gpls_rfq_add_to_quote_btn,
.yith-ywraq-add-button a, [class*="rfq"] a.button, .raq-button{
	display:inline-block!important; background:transparent!important; color:var(--c-ink)!important;
	border:1px solid var(--c-line-2)!important; border-radius:10px!important; padding:.85rem 1.75rem!important;
	font-family:var(--f-mono)!important; font-size:.72rem!important; font-weight:600!important;
	text-transform:uppercase!important; letter-spacing:.05em!important; text-decoration:none!important; box-shadow:none!important;
}
.add_to_quote:hover, .add_to_quote a:hover, .single_add_to_quote_button:hover{ border-color:var(--c-brand)!important; color:var(--c-brand)!important; background:transparent!important; }

/* ============================================================================
   v1.0.8 — Everything in clean white cards (match demo).
   ============================================================================ */
/* Gallery → white card */
.woocommerce div.product .woocommerce-product-gallery,
.woocommerce div.product div.images{ background:var(--c-surface)!important; border:1px solid var(--c-line); border-radius:14px; padding:1.5rem; margin:0; }
.woocommerce div.product .woocommerce-product-gallery__image img{ border-radius:8px; }
.woocommerce div.product .flex-control-thumbs{ margin-top:1rem; gap:.6rem; display:flex; }
.woocommerce div.product .flex-control-thumbs li{ width:64px!important; }
.woocommerce div.product .flex-control-thumbs img{ border:1px solid var(--c-line); border-radius:8px; padding:.25rem; background:var(--c-surface); }
.woocommerce div.product .flex-control-thumbs img.flex-active{ border-color:var(--c-brand); }

/* Buy-box: complete card with trust footer */
.woocommerce div.product .sp-buybox{ box-shadow:0 1px 3px rgba(15,27,45,.04); }
.woocommerce div.product .sp-trust{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:.5rem; margin-top:1.1rem; padding-top:1rem; border-top:1px solid var(--c-line); font-family:var(--f-mono); font-size:.68rem; letter-spacing:.02em; color:var(--c-muted); }
.woocommerce div.product .sp-trust .ok{ color:var(--c-live); }

/* Spec strip sits in its own subtle card spacing */
.woocommerce div.product .sp-specs{ box-shadow:0 1px 3px rgba(15,27,45,.03); }

/* Give the two columns breathing room like the demo */
.woocommerce div.product{ gap:2.5rem; }
@media(min-width:769px){ .woocommerce div.product .woocommerce-product-gallery{ width:48%; } .woocommerce div.product .summary{ width:48%; } }

/* ============================================================================
   v1.0.9 — Responsive container padding (fix content touching screen edges).
   ============================================================================ */
/* Contain the full-bleed (100vw) sections' horizontal overflow with `clip` on
   .wp-site-blocks. `clip` (unlike hidden/auto) does NOT create a scroll container,
   so it neither breaks the sticky header nor clips the full-bleed hero (which
   reaches the viewport edge). Never use overflow on html/body — that breaks sticky. */
.wp-site-blocks{ overflow-x:clip; }
.woocommerce, .woocommerce-page{ box-sizing:border-box; }

/* Constrain + pad WooCommerce content on every page type */
.woocommerce-products-header,
.woocommerce-breadcrumb,
.woocommerce .woocommerce-notices-wrapper,
body.archive .woocommerce,
body.post-type-archive .woocommerce,
body.tax-product_cat .woocommerce,
body.tax-product_tag .woocommerce,
body.single-product .woocommerce,
body.woocommerce-cart .woocommerce,
body.woocommerce-checkout .woocommerce,
body.woocommerce-account .woocommerce{
	max-width:1280px;
	margin-left:auto; margin-right:auto;
	padding-left:clamp(1rem, 4vw, 1.5rem);
	padding-right:clamp(1rem, 4vw, 1.5rem);
}
.woocommerce-products-header{ padding-top:2rem; }
.woocommerce-products-header .woocommerce-products-header__title{ font-family:var(--f-display); font-weight:800; }

/* Content/doc pages already padded via .stelco-doc; ensure main never bleeds */
.stelco-main{ box-sizing:border-box; }

/* Responsive product grid down to phones */
@media(max-width:1024px){ .woocommerce ul.products{ grid-template-columns:repeat(3,1fr); } }
@media(max-width:760px){ .woocommerce ul.products{ grid-template-columns:repeat(2,1fr); gap:1rem; } }
@media(max-width:430px){ .woocommerce ul.products{ grid-template-columns:repeat(2,1fr); gap:.7rem; } }

/* Single product stacks cleanly on tablet/phone */
@media(max-width:768px){
	.woocommerce div.product .woocommerce-product-gallery,
	.woocommerce div.product .summary{ width:100%!important; }
	.woocommerce div.product{ gap:1.5rem; }
	.woocommerce div.product .sp-specs{ display:flex!important; width:100%; }
	.woocommerce div.product .sp-spec{ flex:1 1 0; }
}

/* ============================================================================
   v1.1.0-layout — Two clean white cards (gallery + whole summary). Robust:
   the entire summary column is one card, so nothing spills out.
   ============================================================================ */
.woocommerce div.product .summary{ background:var(--c-surface)!important; border:1px solid var(--c-line); border-radius:14px; padding:1.75rem 1.75rem 1.5rem!important; box-shadow:0 1px 3px rgba(15,27,45,.04); }

/* Eyebrow + title spacing inside the card */
.woocommerce div.product .summary .sp-cat{ margin-bottom:.4rem; }
.woocommerce div.product .summary .product_title{ margin-top:0!important; }

/* Price — force smaller/clean regardless of variation markup */
.woocommerce div.product .summary p.price,
.woocommerce div.product .summary .price{ font-family:var(--f-display)!important; font-weight:700!important; font-size:1.5rem!important; color:var(--c-ink)!important; margin:.4rem 0 1.1rem!important; line-height:1.15; }
.woocommerce div.product .summary .price bdi,
.woocommerce div.product .summary .price .woocommerce-Price-amount{ font-size:1.5rem!important; }
.woocommerce div.product .summary .price del{ font-size:1rem!important; opacity:.55; }
.woocommerce div.product .summary .price small,
.woocommerce div.product .summary .price .tax_label{ display:block; font-size:.6rem!important; font-weight:400!important; text-transform:uppercase; letter-spacing:.06em; color:var(--c-muted); margin-top:.3rem; }

/* Description spacing */
.woocommerce div.product .summary .woocommerce-product-details__short-description{ margin:0 0 1.25rem; }

/* Action area: options → qty+cart → quote, tidy and full-width */
.woocommerce div.product .summary form.cart{ margin:0 0 .25rem; }
.add_to_quote, .add_to_quote a{ margin-top:.75rem!important; }

/* Trust footer inside the card */
.woocommerce div.product .summary .sp-trust{ border-top:1px solid var(--c-line); margin-top:1.25rem; padding-top:1rem; }

/* Product meta inside the card, subtle */
.woocommerce div.product .summary .product_meta{ margin-top:1.25rem; }

/* ============================================================================
   v1.2.0 — Shop/category listing with filter sidebar (match depo.png).
   ============================================================================ */
.stelco-shop .woocommerce-breadcrumb{ padding-top:1.5rem; }
.stelco-shop-head{ margin:.5rem 0 1.5rem; }
/* Top breathing room below the (flush) header on shop/category pages. The
   flush-header rules zero the main's margin-top, and the WooCommerce breadcrumbs
   BLOCK renders as .wp-block-woocommerce-breadcrumbs (not the classic
   .woocommerce-breadcrumb above), so pad the shop main itself. Home stays flush
   because this is scoped to .stelco-shop, not bare .stelco-main. */
main.stelco-main.stelco-shop{ padding-top:1.75rem; }
@media(max-width:600px){ main.stelco-main.stelco-shop{ padding-top:1.1rem; } }
.stelco-shop-title{ font-family:var(--f-display); font-weight:800; font-size:clamp(1.8rem,3vw,2.4rem); letter-spacing:-.01em; margin:0; }
.stelco-shop-desc{ color:var(--c-muted); margin:.5rem 0 0; font-size:.95rem; }

.stelco-shop-cols{ gap:2rem!important; align-items:flex-start!important; margin:0; }
.stelco-filters{ flex:0 0 260px!important; }
.stelco-filters-h{ font-family:var(--f-mono)!important; font-size:.78rem!important; font-weight:600!important; text-transform:uppercase; letter-spacing:.06em; color:var(--c-ink); margin:0 0 1rem!important; }
.stelco-filters .wp-block-woocommerce-filter-wrapper{ background:var(--c-surface); border:1px solid var(--c-line); border-radius:12px; padding:1.1rem 1.25rem; margin:0 0 1rem; }
.stelco-filters .wc-block-components-filter-title-placeholder,
.stelco-filters h3, .stelco-filters .wc-block-stock-filter__title{ font-family:var(--f-mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--c-ink); }
.stelco-filters .wc-block-components-checkbox__label,
.stelco-filters label{ font-size:.85rem; color:var(--c-ink-2); }

/* Result count + sort row above the grid (WooCommerce default elements) */
.stelco-shop-grid .woocommerce-result-count{ float:none; display:inline-block; margin:0; }
.stelco-shop-grid .woocommerce-ordering{ float:none; display:inline-block; }
.stelco-shop-grid form.woocommerce-ordering{ margin:0 0 1.5rem; }
.stelco-shop-grid .woocommerce-notices-wrapper{ width:100%; }

/* Sidebar collapses under the grid on smaller screens */
@media(max-width:880px){
	.stelco-shop-cols{ flex-direction:column!important; }
	.stelco-filters{ flex-basis:auto!important; width:100%; }
	.stelco-filters .wp-block-woocommerce-filter-wrapper{ display:inline-block; width:auto; margin-right:1rem; vertical-align:top; }
}

/* ============================================================================
   v1.2.1 — Featured/shop cards refined to match derr.png:
   4 per row, lighter weights, clean price (no tax/unit clutter).
   ============================================================================ */
/* 4 per row on desktop (featured + shop), keeps responsive steps below */
.woocommerce ul.products,
.stelco-products ul.products{ grid-template-columns:repeat(4,1fr)!important; }
@media(max-width:1100px){ .woocommerce ul.products, .stelco-products ul.products{ grid-template-columns:repeat(3,1fr)!important; } }
@media(max-width:760px){ .woocommerce ul.products, .stelco-products ul.products{ grid-template-columns:repeat(2,1fr)!important; } }

/* Title — body font, medium weight (override heading boldness) */
.woocommerce ul.products li.product .woocommerce-loop-product__title{
	font-family:var(--f-body)!important; font-weight:600!important; font-size:.88rem!important;
	line-height:1.4!important; color:var(--c-ink)!important; letter-spacing:0!important;
}

/* Price — clean, medium weight; hide tax/unit suffix clutter in the grid */
.woocommerce ul.products li.product .price{
	font-family:var(--f-display)!important; font-weight:700!important; font-size:1.05rem!important;
	color:var(--c-ink)!important; margin:0!important;
}
.woocommerce ul.products li.product .price .woocommerce-Price-amount,
.woocommerce ul.products li.product .price bdi{ font-size:1.05rem!important; font-weight:700; }
.woocommerce ul.products li.product .price .woocommerce-price-suffix,
.woocommerce ul.products li.product .price small{ display:none!important; }
.woocommerce ul.products li.product .price del{ font-size:.8rem!important; font-weight:400!important; opacity:.5; }
.woocommerce ul.products li.product .price ins{ text-decoration:none; }

/* Category eyebrow lighter */
.woocommerce ul.products li.product .pc-cat{ font-weight:500!important; }

/* ============================================================================
   v1.2.3 — FIX single-product overlap. WooCommerce floats the gallery; we
   replace floats with a clean flex layout so columns never overlap and the
   buttons stay inside the summary card.
   ============================================================================ */
.woocommerce div.product{ display:flex!important; flex-wrap:wrap; gap:2.5rem; align-items:flex-start; }
.woocommerce div.product::before,
.woocommerce div.product::after{ content:none!important; display:none!important; } /* kill clearfix */

.woocommerce div.product > .woocommerce-product-gallery{ float:none!important; clear:none!important; width:auto!important; flex:1 1 0; max-width:48%; margin:0!important; }
.woocommerce div.product > .summary{ float:none!important; clear:none!important; width:auto!important; flex:1 1 0; max-width:48%; margin:0!important; }

/* These sections go full-width on their own rows below the two columns */
.woocommerce div.product > .woocommerce-tabs,
.woocommerce div.product > .related,
.woocommerce div.product > .upsells,
.woocommerce div.product > .woocommerce-product-gallery + .clear,
.woocommerce div.product > .product_meta{ flex:1 1 100%!important; width:100%!important; max-width:100%!important; }

@media(max-width:768px){
	.woocommerce div.product{ gap:1.5rem; }
	.woocommerce div.product > .woocommerce-product-gallery,
	.woocommerce div.product > .summary{ max-width:100%!important; flex:1 1 100%!important; }
}

/* ============================================================================
   v1.2.4 — Smaller, lighter title + price inside the summary card.
   ============================================================================ */
.woocommerce div.product .summary .product_title{
	font-size:1.35rem!important; font-weight:600!important; line-height:1.3!important;
	letter-spacing:-.005em!important; margin:0 0 .4rem!important;
}
.woocommerce div.product .summary p.price,
.woocommerce div.product .summary .price{
	font-size:1.25rem!important; font-weight:600!important; margin:.3rem 0 1rem!important;
}
.woocommerce div.product .summary .price .woocommerce-Price-amount,
.woocommerce div.product .summary .price bdi{ font-size:1.25rem!important; font-weight:600!important; }
.woocommerce div.product .summary .price del{ font-size:.95rem!important; font-weight:400!important; }

/* ============================================================================
   v1.2.5 — FIX uneven first row. WooCommerce's clearfix ::before/::after on
   ul.products become phantom grid cells (pushing row 1 to 3). Remove them.
   ============================================================================ */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.stelco-products ul.products::before,
.stelco-products ul.products::after{ content:none!important; display:none!important; }
.woocommerce ul.products li.product.first,
.woocommerce ul.products li.product.last{ clear:none!important; width:auto!important; margin:0!important; float:none!important; }

/* ============================================================================
   v1.2.6 — Filter sidebar card polish (one card per filter: Stock, Brand, Color…).
   ============================================================================ */
.stelco-filters .wp-block-woocommerce-filter-wrapper .wp-block-heading,
.stelco-filters .wp-block-woocommerce-filter-wrapper h3,
.stelco-filters .wc-block-components-filter-title{
	font-family:var(--f-mono)!important; font-size:.72rem!important; font-weight:600!important;
	text-transform:uppercase; letter-spacing:.05em; color:var(--c-ink)!important; margin:0 0 .85rem!important;
}
.stelco-filters .wc-block-checkbox-list,
.stelco-filters .wc-block-components-checkbox-list{ font-size:.85rem; }
.stelco-filters .wc-block-components-checkbox__label,
.stelco-filters label{ color:var(--c-ink-2); font-size:.85rem; }
.stelco-filters input[type="checkbox"],
.stelco-filters .wc-block-components-checkbox__input{ accent-color:var(--c-brand); }
.stelco-filters .wc-block-components-checkbox{ margin:.45rem 0; }
.stelco-filters .wc-block-components-filter-reset-button,
.stelco-filters .wc-block-components-clear-button{ font-family:var(--f-mono); font-size:.7rem; color:var(--c-brand); }
/* count badges next to options */
.stelco-filters .wc-filter-element-label-list-count,
.stelco-filters .wc-block-components-filter-element-label__count{ color:var(--c-muted-2,#94a3b8); font-family:var(--f-mono); font-size:.72rem; }

/* Price range filter — branded slider + clean inputs */
.stelco-filters .wc-block-price-filter,
.stelco-filters .wp-block-woocommerce-price-filter{ --range-color:var(--c-brand); }
.stelco-filters .wc-block-price-filter__range-text,
.stelco-filters .wc-block-components-price-slider__range-text{ font-family:var(--f-mono); font-size:.78rem; color:var(--c-ink-2); margin-bottom:.7rem; }
.stelco-filters .wc-block-components-price-slider__range-input-progress{ --range-color:var(--c-brand); background:var(--c-brand); }
.stelco-filters .wc-block-price-slider__range-input-wrapper,
.stelco-filters .wc-block-components-price-slider__range-input-wrapper{ background:var(--c-line); border-radius:99px; }
.stelco-filters input.wc-block-price-filter__amount,
.stelco-filters .wc-block-components-price-slider__amount input,
.stelco-filters .wc-block-price-slider__amount{ border:1px solid var(--c-line-2)!important; border-radius:8px!important; padding:.5rem .6rem!important; font-family:var(--f-mono); font-size:.8rem; background:var(--c-surface); }
.stelco-filters .wc-block-components-price-slider__controls{ gap:.5rem; margin-top:.75rem; }
.stelco-filters .wc-block-components-filter-submit-button,
.stelco-filters .wc-block-price-filter__button{ background:var(--c-brand)!important; color:#fff!important; border-radius:8px!important; font-family:var(--f-mono); font-size:.68rem; text-transform:uppercase; letter-spacing:.04em; padding:.5rem .9rem!important; }
.stelco-filters .wc-block-components-price-slider__thumb,
.stelco-filters .wc-block-price-slider__thumb{ background:var(--c-brand); border-color:var(--c-brand); }

/* ============================================================================
   v1.2.8 — Related / Up-sell cards strictly match demorelat.png:
   brand tag + title + spec chips + price ONLY. No stock pill, no eyebrow,
   no Add/Select button. Left-aligned, bordered cards (4 per row).
   ============================================================================ */
.related.products li.product .pc-stock,
.related.products li.product .pc-cat,
.related.products li.product .button,
.related.products li.product .add_to_cart_button,
.related.products li.product .added_to_cart,
.related.products li.product .star-rating,
.up-sells.products li.product .pc-stock,
.up-sells.products li.product .pc-cat,
.up-sells.products li.product .button,
.up-sells.products li.product .add_to_cart_button,
.up-sells.products li.product .added_to_cart,
.up-sells.products li.product .star-rating{ display:none!important; }

/* clean price (no tax/unit clutter) + tidy bottom spacing since no button */
.related.products li.product .price,
.up-sells.products li.product .price{ padding:.5rem .9rem 1rem!important; text-align:left!important; }
.related.products li.product .price .woocommerce-price-suffix,
.related.products li.product .price small,
.up-sells.products li.product .price .woocommerce-price-suffix,
.up-sells.products li.product .price small{ display:none!important; }

/* left-aligned title like the demo */
.related.products li.product, .up-sells.products li.product{ text-align:left!important; }
.related.products li.product .woocommerce-loop-product__title,
.up-sells.products li.product .woocommerce-loop-product__title{ text-align:left!important; }

/* "Related products" heading like the demo */
.related.products > h2, .up-sells.products > h2{ text-align:left!important; }

/* ============================================================================
   v1.3.3 — Related cards: force white card + lighter/smaller fonts.
   (Covers classic .related.products and block-based related markup.)
   ============================================================================ */
.related.products li.product,
.up-sells.products li.product,
.wp-block-woocommerce-related-products li.product{
	border:1px solid var(--c-line)!important; border-radius:12px!important;
	background:var(--c-surface)!important; padding:0!important; overflow:hidden;
}
.related.products li.product .woocommerce-loop-product__title,
.up-sells.products li.product .woocommerce-loop-product__title{
	font-family:var(--f-body)!important; font-weight:600!important; font-size:.88rem!important;
	color:var(--c-ink)!important; padding:.9rem .9rem 0!important; line-height:1.4!important;
}
.related.products li.product .price,
.up-sells.products li.product .price{
	font-family:var(--f-display)!important; font-weight:600!important; font-size:1rem!important;
	color:var(--c-ink)!important; padding:.4rem .9rem 1rem!important;
}
.related.products li.product .price .woocommerce-Price-amount,
.up-sells.products li.product .price .woocommerce-Price-amount{ font-size:1rem!important; font-weight:600!important; }

/* ============================================================================
   v1.4.1 — WooCommerce BLOCK product cards (.wc-block-product) used by the
   Product Collection / Related Products blocks on this site, + mobile padding.
   ============================================================================ */
.wp-block-woocommerce-product-template{ display:grid!important; grid-template-columns:repeat(4,1fr); gap:1.25rem; list-style:none!important; margin:0!important; padding:0!important; }
.wc-block-product{ border:1px solid var(--c-line)!important; border-radius:12px!important; background:var(--c-surface)!important; padding:0!important; overflow:hidden; text-align:left!important; list-style:none; margin:0!important; transition:transform .3s, border-color .3s, box-shadow .3s; }
.wc-block-product:hover{ transform:translateY(-4px); border-color:rgba(0,100,255,.4); box-shadow:0 20px 44px -26px rgba(15,27,45,.4); }
.wc-block-product .wp-block-woocommerce-product-image,
.wc-block-product .wc-block-components-product-image{ margin:0!important; background:#f8fafc; }
.wc-block-product .wp-block-woocommerce-product-image img{ aspect-ratio:1/1; object-fit:contain; width:100%; padding:1rem; }
.wc-block-product .wp-block-post-title,
.wc-block-product .wc-block-components-product-name{ font-family:var(--f-body)!important; font-weight:600!important; font-size:.88rem!important; line-height:1.4!important; color:var(--c-ink)!important; padding:.9rem .9rem 0!important; margin:0!important; text-decoration:none!important; }
.wc-block-product .wp-block-post-title a,
.wc-block-product .wc-block-components-product-name{ color:var(--c-ink)!important; text-decoration:none!important; }
.wc-block-product .wp-block-woocommerce-product-price,
.wc-block-product .wc-block-components-product-price{ font-family:var(--f-display)!important; font-weight:600!important; font-size:1rem!important; color:var(--c-ink)!important; padding:.4rem .9rem .9rem!important; }
.wc-block-product .wp-block-woocommerce-product-button .wp-block-button__link{ margin:0 .9rem .9rem!important; font-size:.7rem!important; padding:.5rem .85rem!important; }
@media(max-width:1024px){ .wp-block-woocommerce-product-template{ grid-template-columns:repeat(3,1fr); } }
@media(max-width:760px){ .wp-block-woocommerce-product-template{ grid-template-columns:repeat(2,1fr); } }

/* ---- Mobile padding everywhere (block templates have zero root padding) ---- */
@media(max-width:781px){
	.stelco-main, .stelco-shop, .wp-block-woocommerce-single-product,
	.wp-block-woocommerce-product-collection, .wp-block-woocommerce-related-products,
	.woocommerce-products-header, .stelco-doc{ padding-left:1rem!important; padding-right:1rem!important; box-sizing:border-box; }
	.stelco-mainbar-inner{ padding-left:1rem!important; padding-right:1rem!important; }
}

/* ============================================================================
   v1.5.0 — BLOCK single product matched to the demo (product.html).
   NOTE: the buy-box CARD + title now live in the inline PDP critical CSS
   (functions.php), targeting the real `main .wp-block-columns.alignwide` layout.
   The dead `.wp-block-woocommerce-single-product` wrapper rules were purged in
   v1.7.0 — this site renders the PDP as a plain Columns block, not that wrapper.
   ============================================================================ */
/* Price — smaller, clean; tax suffix as a tiny muted line */
.wp-block-woocommerce-product-price,
.wp-block-woocommerce-product-price .price{ font-family:var(--f-display)!important; font-size:1.4rem!important; font-weight:600!important; color:var(--c-ink)!important; }
.wp-block-woocommerce-product-price .woocommerce-Price-amount{ font-size:1.4rem!important; font-weight:600!important; }
.wp-block-woocommerce-product-price .woocommerce-price-suffix{ display:block; font-family:var(--f-mono); font-size:.6rem; text-transform:uppercase; letter-spacing:.06em; color:var(--c-muted); font-weight:400; margin-top:.25rem; }

/* Tabs (product-details block) → bordered card like the demo */
.wp-block-woocommerce-product-details .woocommerce-tabs,
.wp-block-woocommerce-product-details.woocommerce-tabs{ border:1px solid var(--c-line); border-radius:14px; background:var(--c-surface); padding:1.5rem 1.75rem; margin-top:2.5rem; }
.wp-block-woocommerce-product-details .woocommerce-tabs ul.tabs{ border-bottom:1px solid var(--c-line); display:flex; gap:.25rem; padding:0 0 0 !important; }
.wp-block-woocommerce-product-details .woocommerce-tabs ul.tabs li a{ text-transform:none!important; letter-spacing:0!important; font-family:var(--f-mono); font-size:.85rem; color:var(--c-muted)!important; padding:.7rem 1rem!important; border-bottom:2px solid transparent; }
.wp-block-woocommerce-product-details .woocommerce-tabs ul.tabs li.active a{ color:var(--c-brand)!important; border-bottom-color:var(--c-brand); }
.wp-block-woocommerce-product-details .woocommerce-tabs .panel > h2:first-child{ display:none!important; }

/* ============================================================================
   v1.6.0 — Horizontal padding at EVERY width (fixes tablet/medium edge-touching).
   ============================================================================ */
.stelco-main, .stelco-shop, .stelco-doc,
.woocommerce-products-header,
.wp-block-woocommerce-single-product,
.wp-block-woocommerce-product-collection,
.wp-block-woocommerce-related-products,
body.woocommerce-page > .wp-site-blocks .woocommerce,
body.archive .woocommerce, body.tax-product_cat .woocommerce,
body.post-type-archive-product .woocommerce{
	padding-left:clamp(1rem, 4vw, 1.5rem)!important;
	padding-right:clamp(1rem, 4vw, 1.5rem)!important;
	box-sizing:border-box;
}
/* Keep the constrained max-width centered */
.stelco-main, .stelco-shop{ max-width:1300px; margin-left:auto; margin-right:auto; }

/* ============================================================================
   v1.6.1 — Product Collection (related/upsell) grid. WooCommerce forces
   `.wc-block-product-template.is-flex-container.columns-5` (2 classes). Beat it
   with a higher-specificity grid so related shows clean 4-up cards.
   ============================================================================ */
ul.wc-block-product-template.wp-block-woocommerce-product-template,
.wp-block-woocommerce-product-template.is-flex-container,
.wc-block-product-template.columns-5{
	display:grid!important; grid-template-columns:repeat(4,1fr)!important; gap:1.25rem!important;
	margin:0!important; padding:0!important; list-style:none!important;
}
.wc-block-product-template .wc-block-product,
.wc-block-product-template li.wc-block-product{ width:auto!important; max-width:none!important; margin:0!important; flex:none!important; }
@media(max-width:1024px){ ul.wc-block-product-template.wp-block-woocommerce-product-template, .wp-block-woocommerce-product-template.is-flex-container, .wc-block-product-template.columns-5{ grid-template-columns:repeat(3,1fr)!important; } }
@media(max-width:760px){ ul.wc-block-product-template.wp-block-woocommerce-product-template, .wp-block-woocommerce-product-template.is-flex-container, .wc-block-product-template.columns-5{ grid-template-columns:repeat(2,1fr)!important; } }

/* ============================================================================
   v1.6.2 — Full-bleed home sections + cart overflow fix.
   ============================================================================ */
/* Hero, trust bar, value strip, quote band span the full viewport width */
.stelco-hero, .stelco-quoteband, .stelco-trustbar, .stelco-valuestrip{
	width:100vw!important; max-width:100vw!important;
	margin-left:calc(50% - 50vw)!important; margin-right:calc(50% - 50vw)!important;
	border-radius:0!important;
}
/* Cart page: keep the RFQ "Quote Cart" + tables inside the layout */
.woocommerce-cart .woocommerce,
.woocommerce-cart .entry-content{ max-width:1300px; margin:0 auto; box-sizing:border-box; }
.woocommerce-cart table.shop_table,
.woocommerce-cart .cart-collaterals,
.gpls-rfq-wrapper, [class*="gpls"], [class*="quote-cart"]{ max-width:100%!important; box-sizing:border-box; }
.woocommerce-cart table.cart{ width:100%; display:table; }
.woocommerce-cart .woocommerce-cart-form__contents{ overflow-x:auto; }

/* ============================================================================
   v1.2.9 — Tabs match demodescription.png: title-case labels, no redundant
   in-panel heading, generous body text.
   ============================================================================ */
.woocommerce div.product .woocommerce-tabs ul.tabs li a{ text-transform:none!important; letter-spacing:0!important; font-size:.85rem!important; }
.woocommerce div.product .woocommerce-tabs .panel > h2:first-child{ display:none!important; }
.woocommerce div.product .woocommerce-tabs .panel p{ margin:0 0 1rem; color:var(--c-ink-2); line-height:1.75; }
.woocommerce div.product .woocommerce-tabs .panel ul{ margin:.5rem 0 1.25rem; padding-left:1.1rem; }
.woocommerce div.product .woocommerce-tabs .panel ul li{ margin:.35rem 0; color:var(--c-ink-2); }

/* ============================================================================
   v1.3.2 — Listing header (no duplicate title), sort to the right, price slider.
   ============================================================================ */
/* Result count left · sort dropdown right */
.stelco-shop-grid .woocommerce-result-count{ float:left!important; margin:0 0 1.25rem!important; font-family:var(--f-mono); font-size:.76rem; color:var(--c-muted); }
.stelco-shop-grid .woocommerce-ordering{ float:right!important; margin:0 0 1.25rem!important; }
.stelco-shop-grid ul.products{ clear:both!important; }

/* Price slider — branded thumbs (kill the black native circles) */
.stelco-filters input[type="range"]{ -webkit-appearance:none; appearance:none; background:transparent; }
.stelco-filters input[type="range"]::-webkit-slider-thumb{ -webkit-appearance:none; width:16px; height:16px; border-radius:50%; background:var(--c-brand); border:2px solid #fff; box-shadow:0 1px 4px rgba(0,0,0,.25); cursor:pointer; }
.stelco-filters input[type="range"]::-moz-range-thumb{ width:16px; height:16px; border-radius:50%; background:var(--c-brand); border:2px solid #fff; cursor:pointer; }
.stelco-filters .wc-block-components-price-slider__range-input-progress{ background:var(--c-brand)!important; }
.stelco-filters .wc-block-components-price-slider{ padding:0 .25rem; }
.stelco-filters .wc-block-components-price-slider__range-text,
.stelco-filters .wc-block-price-filter__range-text{ display:flex; justify-content:space-between; font-family:var(--f-mono); font-size:.76rem; color:var(--c-ink-2); }
.stelco-filters .wc-block-components-price-slider__amount{ border:1px solid var(--c-line-2)!important; border-radius:8px!important; font-family:var(--f-mono); font-size:.8rem; padding:.45rem .5rem!important; }

/* ============================================================================
   v1.6.7 — FINAL card title + price treatment (authoritative, last in file).
   Toned down per repeated request: light weight, muted colour, smaller size.
   Covers every card variant: classic [products] loop (Featured/Shop), block
   product-collection cards (Featured/Related blocks), related/upsell, grid.
   This block is LAST so it wins source order over all earlier weight:700/800.
   ============================================================================ */

/* --- Card TITLE: light, smaller, softer ink (not bold/dark) --- */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.related.products li.product .woocommerce-loop-product__title,
.up-sells.products li.product .woocommerce-loop-product__title,
.wc-block-product .wc-block-components-product-title,
.wc-block-product .wp-block-post-title,
.wc-block-product .wc-block-grid__product-title,
.wc-block-grid__product-title{
	font-family:var(--f-body)!important;
	font-weight:500!important;
	font-size:.82rem!important;
	line-height:1.45!important;
	color:var(--c-ink-2)!important;
	letter-spacing:0!important;
	text-transform:none!important;
}

/* --- Card PRICE: thin, light colour, smaller (the repeated ask) --- */
.woocommerce ul.products li.product .price,
.related.products li.product .price,
.up-sells.products li.product .price,
.wc-block-product .wp-block-woocommerce-product-price,
.wc-block-product .wc-block-components-product-price,
.wc-block-grid__product-price{
	font-family:var(--f-display)!important;
	font-weight:500!important;
	font-size:.8rem!important;
	line-height:1.3!important;
	color:var(--c-ink-2)!important;
	margin:0!important;
}
.woocommerce ul.products li.product .price .woocommerce-Price-amount,
.woocommerce ul.products li.product .price bdi,
.related.products li.product .price .woocommerce-Price-amount,
.up-sells.products li.product .price .woocommerce-Price-amount,
.wc-block-product .wp-block-woocommerce-product-price .woocommerce-Price-amount,
.wc-block-product .wc-block-components-product-price .wc-block-components-product-price__value,
.wc-block-grid__product-price .woocommerce-Price-amount{
	font-weight:500!important;
	font-size:.8rem!important;
	color:var(--c-ink-2)!important;
}
/* price ranges (variable products): smaller still + tighter so "MVR x – MVR y"
   fits one line in a 4-up card instead of wrapping. */
.woocommerce ul.products li.product .price,
.related.products li.product .price,
.up-sells.products li.product .price,
.wc-block-product .wp-block-woocommerce-product-price,
.wc-block-product .wc-block-components-product-price{ letter-spacing:-.01em!important; }
.woocommerce ul.products li.product .price del,
.wc-block-product .wp-block-woocommerce-product-price del,
.wc-block-product .wc-block-components-product-price del{ font-weight:400!important; font-size:.74rem!important; color:var(--c-muted)!important; opacity:1; }
.woocommerce ul.products li.product .price ins,
.wc-block-product .wp-block-woocommerce-product-price ins,
.wc-block-product .wc-block-components-product-price ins{ text-decoration:none!important; }
/* hide tax/unit suffix clutter inside cards */
.woocommerce ul.products li.product .price .woocommerce-price-suffix,
.woocommerce ul.products li.product .price small,
.wc-block-product .wp-block-woocommerce-product-price small{ display:none!important; }

/* ============================================================================
   v1.7.2 — Related products heading (block product-collection) — larger,
   display font, with breathing room above/below per demo.
   ============================================================================ */
.wp-block-woocommerce-product-collection{ margin-top:3.5rem!important; }
.wp-block-woocommerce-product-collection > h2.wp-block-heading,
.wp-block-woocommerce-product-collection h2.wp-block-heading,
.wp-block-woocommerce-related-products h2{
	font-family:var(--f-display)!important;
	font-size:1.6rem!important;
	font-weight:800!important;
	line-height:1.2!important;
	letter-spacing:-.01em!important;
	color:var(--c-ink)!important;
	margin:0 0 1.75rem!important;
	padding-top:.5rem;
}

/* ============================================================================
   v1.7.3 — My Account: logged-out login / register forms as clean cards,
   matching account.html. (Page content must be the [woocommerce_my_account]
   shortcode / "My Account" block — the old WPBakery [vcex_login_form] content
   can't render without Total active.)
   ============================================================================ */
.woocommerce-account .u-columns{ display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; align-items:start; }
@media(max-width:768px){ .woocommerce-account .u-columns{ grid-template-columns:1fr; } }
.woocommerce-account .u-column1,
.woocommerce-account .u-column2{ width:auto!important; float:none!important; }
.woocommerce-account .u-columns h2{ font-family:var(--f-display); font-size:1.35rem; font-weight:800; color:var(--c-ink); margin:0 0 1rem; }

/* Each form → white card */
.woocommerce-account form.login,
.woocommerce-account form.register{ border:1px solid var(--c-line)!important; border-radius:14px; background:var(--c-surface); padding:1.75rem!important; box-shadow:0 1px 3px rgba(15,27,45,.04); }

/* Fields */
.woocommerce-account .woocommerce form .form-row{ display:block; margin:0 0 1rem; }
.woocommerce-account .woocommerce form .form-row label{ display:block; font-family:var(--f-mono); font-size:.66rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--c-muted); margin:0 0 .4rem; }
.woocommerce-account .woocommerce form .form-row input.input-text,
.woocommerce-account .woocommerce form .form-row input[type="text"],
.woocommerce-account .woocommerce form .form-row input[type="email"],
.woocommerce-account .woocommerce form .form-row input[type="password"]{ width:100%; box-sizing:border-box; border:1.5px solid #cbd5e1!important; border-radius:10px; padding:.8rem .9rem; font-family:var(--f-body); font-size:.92rem; color:var(--c-ink); background:#fff; }
.woocommerce-account .woocommerce form .form-row input.input-text:focus{ outline:none; border-color:var(--c-brand)!important; box-shadow:0 0 0 3px rgba(0,100,255,.12); }

/* Buttons → brand fill */
.woocommerce-account form.login button,
.woocommerce-account form.register button,
.woocommerce-account .woocommerce-Button{ background:var(--c-brand)!important; color:#fff!important; border:0!important; border-radius:10px!important; padding:.85rem 1.5rem!important; font-family:var(--f-mono)!important; font-size:.72rem!important; font-weight:600!important; text-transform:uppercase!important; letter-spacing:.05em!important; cursor:pointer; }
.woocommerce-account form.login button:hover,
.woocommerce-account form.register button:hover{ background:var(--c-brand-dark)!important; }

/* "Remember me" + lost password row */
.woocommerce-account form.login .woocommerce-form-login__rememberme{ font-family:var(--f-body); font-size:.85rem; color:var(--c-ink-2); }
.woocommerce-account form.login .lost_password{ font-family:var(--f-mono); font-size:.72rem; }
.woocommerce-account form.login .lost_password a{ color:var(--c-brand); text-decoration:none; }

/* ============================================================================
   v1.7.4 — CART page rebuilt to the checkout.html visual language:
   two columns (items | sticky order-summary card), clean rows, brand button.
   Classic [woocommerce_cart] markup: form.woocommerce-cart-form + .cart-collaterals.
   ============================================================================ */
/* Two columns via FLOAT (only the two columns are floated — far safer than
   gridding the whole container, which scattered the RFQ "Quote Cart" plugin's
   extra children and broke the page). Stacks on tablet/mobile. */
.woocommerce-cart .woocommerce{ max-width:1280px; margin-left:auto; margin-right:auto; }
.woocommerce-cart .woocommerce::after{ content:""; display:table; clear:both; }
@media(min-width:901px){
	.woocommerce-cart .woocommerce{ overflow:hidden; } /* contain the floats */
	.woocommerce-cart form.woocommerce-cart-form{ float:left; width:58%; margin:0; box-sizing:border-box; }
	.woocommerce-cart .cart-collaterals{ float:right; width:34%; margin:0; box-sizing:border-box; } /* ~8% gutter between the two cards */
	.woocommerce-cart .cart-collaterals .cart_totals{ width:100%; max-width:none; margin:0; }
}
@media(max-width:900px){
	.woocommerce-cart form.woocommerce-cart-form{ width:100%; margin:0 0 1.5rem; }
	.woocommerce-cart .cart-collaterals{ width:100%; float:none; }
	.woocommerce-cart .cart-collaterals .cart_totals{ width:100%; max-width:100%; margin:0; }
}

/* Items as SEPARATE CARDS with vertical gaps (matches cart.html demo).
   The classic cart is a <table>; we make the table/rows render as block cards. */
.woocommerce-cart table.shop_table.cart{ border:0!important; background:transparent!important; display:block; width:100%; border-collapse:separate; }
.woocommerce-cart table.shop_table.cart thead{ display:none!important; }
.woocommerce-cart table.shop_table.cart tbody{ display:block; }
.woocommerce-cart table.shop_table.cart tr.cart_item{
	display:grid!important;
	grid-template-columns:84px 1fr auto;
	grid-template-areas:"thumb name remove" "thumb qty subtotal";
	column-gap:1.1rem; row-gap:.85rem; align-items:center;
	border:1px solid var(--c-line)!important; border-radius:16px; background:var(--c-surface);
	padding:1.1rem 1.25rem; margin:0 0 1rem; box-shadow:0 1px 3px rgba(15,27,45,.03);
}
.woocommerce-cart table.shop_table.cart tr.cart_item td{ border:0!important; padding:0!important; }
.woocommerce-cart table.shop_table.cart td.product-thumbnail{ grid-area:thumb; }
.woocommerce-cart table.shop_table.cart td.product-thumbnail img{ width:84px; height:84px; object-fit:contain; border:1px solid var(--c-line); border-radius:12px; background:var(--c-surface-2); padding:.4rem; }
.woocommerce-cart table.shop_table.cart td.product-name{ grid-area:name; align-self:center; }
.woocommerce-cart table.shop_table.cart td.product-name,
.woocommerce-cart table.shop_table.cart td.product-name a{ font-family:var(--f-body)!important; font-weight:500!important; font-size:.9rem!important; color:var(--c-ink-2)!important; text-decoration:none; line-height:1.4; }
.woocommerce-cart table.shop_table.cart td.product-name a:hover{ color:var(--c-brand)!important; }
.woocommerce-cart table.shop_table.cart td.product-remove{ grid-area:remove; justify-self:end; align-self:start; }
/* Remove: trash icon instead of the × cross */
.woocommerce-cart td.product-remove a.remove{ display:inline-block!important; width:22px; height:22px; font-size:0!important; line-height:0; border-radius:6px; background:no-repeat center / 17px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18M8 6V4h8v2m-9 0 1 14h8l1-14'/%3E%3C/svg%3E"); }
.woocommerce-cart td.product-remove a.remove:hover{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23e5484d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18M8 6V4h8v2m-9 0 1 14h8l1-14'/%3E%3C/svg%3E")!important; color:transparent!important; }
.woocommerce-cart table.shop_table.cart td.product-quantity{ grid-area:qty; justify-self:start; align-self:center; }
.woocommerce-cart table.shop_table.cart td.product-subtotal{ grid-area:subtotal; justify-self:end; align-self:center; font-family:var(--f-display)!important; font-weight:600!important; font-size:1rem!important; color:var(--c-ink-2)!important; }
/* per-unit price shown small + muted under the name (it has no grid area → place inline w/ name) */
.woocommerce-cart table.shop_table.cart td.product-price{ display:none; }
/* The coupon/update row is NOT an item card */
.woocommerce-cart table.shop_table.cart tr:not(.cart_item){ display:block; }
.woocommerce-cart table.shop_table.cart td.actions{ display:block; padding:.5rem 0 0!important; border:0!important; }
@media(max-width:600px){
	/* item card: thumb left (spans), name top-right, qty + subtotal on a row below */
	.woocommerce-cart table.shop_table.cart tr.cart_item{ grid-template-columns:60px 1fr auto; grid-template-areas:"thumb name remove" "thumb qty subtotal"; column-gap:.85rem!important; row-gap:.7rem!important; padding:1rem!important; }
	.woocommerce-cart table.shop_table.cart td.product-thumbnail img{ width:60px; height:60px; }
	.woocommerce-cart table.shop_table.cart td.product-name,
	.woocommerce-cart table.shop_table.cart td.product-name a{ font-size:.85rem!important; }
	.woocommerce-cart table.shop_table.cart td.product-subtotal{ font-size:.95rem!important; }
	/* coupon + update stack full-width */
	.woocommerce-cart .actions .coupon{ display:flex!important; flex-wrap:wrap; gap:.5rem; width:100%; }
	.woocommerce-cart .actions .coupon input#coupon_code{ flex:1 1 100%; box-sizing:border-box; }
	.woocommerce-cart .actions .coupon button{ flex:1 1 auto; }
	.woocommerce-cart .actions button[name="update_cart"].stelco-show{ width:100%; margin-top:.5rem; }
}
.woocommerce-cart td.product-remove a.remove{}
.woocommerce-cart td.product-remove a.remove:hover{ color:#e5484d!important; background:transparent!important; }

/* Coupon + update row */
.woocommerce-cart .actions{ padding:1rem 0 0; }
.woocommerce-cart .actions .coupon input#coupon_code{ border:1.5px solid #cbd5e1!important; border-radius:10px; padding:.7rem .9rem; font-family:var(--f-body); }
.woocommerce-cart .actions .coupon button,
.woocommerce-cart .actions button[name="update_cart"]{ border-radius:10px!important; font-family:var(--f-mono); font-size:.7rem!important; text-transform:uppercase; letter-spacing:.05em; padding:.7rem 1.1rem!important; }
.woocommerce-cart .actions .coupon button{ background:var(--c-navy)!important; color:#fff!important; }
.woocommerce-cart .actions button[name="update_cart"]{ background:transparent!important; color:var(--c-ink)!important; border:1.5px solid #cbd5e1!important; }

/* Order-summary card (sticky) per demo */
.woocommerce-cart .cart_totals{ position:sticky; top:1.5rem; border:1px solid var(--c-line); border-radius:16px; background:var(--c-surface); padding:1.5rem; box-shadow:0 1px 3px rgba(15,27,45,.04); }
.woocommerce-cart .cart_totals h2{ font-family:var(--f-mono); font-size:.74rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--c-ink); margin:0 0 1rem; }
.woocommerce-cart .cart_totals table{ border:0!important; margin:0; }
.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td{ border:0!important; border-top:1px solid var(--c-line)!important; padding:.75rem 0!important; background:transparent!important; font-size:.9rem; }
.woocommerce-cart .cart_totals tr:first-child th,
.woocommerce-cart .cart_totals tr:first-child td{ border-top:0!important; }
.woocommerce-cart .cart_totals th{ font-family:var(--f-body); font-weight:500; color:var(--c-muted); text-align:left; }
.woocommerce-cart .cart_totals td{ font-family:var(--f-mono); color:var(--c-ink); text-align:right; }
.woocommerce-cart .cart_totals .order-total th{ font-family:var(--f-mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--c-muted); }
.woocommerce-cart .cart_totals .order-total td{ font-family:var(--f-display)!important; font-size:1.2rem!important; font-weight:600!important; color:var(--c-ink)!important; }
/* tax/GST breakdown line — light, small, muted (not bold) */
.woocommerce-cart .cart_totals .order-total td small,
.woocommerce-cart .cart_totals .order-total td .includes_tax,
.woocommerce-cart .cart_totals small.includes_tax,
.woocommerce-cart .cart_totals .tax-total td{ display:block; font-family:var(--f-mono)!important; font-size:.62rem!important; font-weight:400!important; color:var(--c-muted)!important; margin-top:.3rem; line-height:1.4; }
/* Proceed to checkout → full-width brand button */
.woocommerce-cart .wc-proceed-to-checkout{ padding:1.25rem 0 0; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button{ display:block; width:100%; box-sizing:border-box; text-align:center; background:var(--c-brand)!important; color:#fff!important; border-radius:10px!important; padding:1rem 1.5rem!important; font-family:var(--f-mono)!important; font-size:.78rem!important; font-weight:600!important; text-transform:uppercase!important; letter-spacing:.05em!important; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover{ background:var(--c-brand-dark)!important; }

/* ---- Quantity stepper (shop.js .stelco-qty) — global, used on cart & shop ---- */
.woocommerce .quantity.stelco-qty,.stelco-qty{ display:inline-flex!important; align-items:stretch; border:1.5px solid #cbd5e1!important; border-radius:10px; overflow:hidden; background:#fff!important; width:auto!important; height:2.7rem; }
.stelco-qty input.qty{ border:0!important; background:transparent!important; box-shadow:none!important; outline:none!important; text-align:center; width:2.4rem!important; min-width:0; height:100%!important; padding:0!important; margin:0!important; font-family:var(--f-mono); font-size:.88rem; color:var(--c-ink); -moz-appearance:textfield; appearance:textfield; }
.stelco-qty input.qty::-webkit-outer-spin-button,.stelco-qty input.qty::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.stelco-qty .stelco-qty-btn{ -webkit-appearance:none!important; appearance:none!important; border:0!important; background:transparent!important; box-shadow:none!important; width:2.2rem; height:100%; font-size:1rem; line-height:1; color:var(--c-ink-2)!important; cursor:pointer; display:grid; place-items:center; padding:0!important; margin:0!important; }
.stelco-qty .stelco-qty-btn.minus{ border-right:1.5px solid #cbd5e1!important; }
.stelco-qty .stelco-qty-btn.plus{ border-left:1.5px solid #cbd5e1!important; }
.stelco-qty .stelco-qty-btn:hover{ color:var(--c-brand)!important; background:var(--c-canvas)!important; }

/* ============================================================================
   v1.7.6 — Search results as a GRID of image cards (was a plain text list).
   ============================================================================ */
.stelco-search-grid{ display:grid!important; grid-template-columns:repeat(4,1fr)!important; gap:1.5rem; margin-top:2rem; list-style:none; padding:0; }
@media(max-width:1100px){ .stelco-search-grid{ grid-template-columns:repeat(3,1fr)!important; } }
@media(max-width:760px){ .stelco-search-grid{ grid-template-columns:repeat(2,1fr)!important; } }
@media(max-width:460px){ .stelco-search-grid{ grid-template-columns:1fr!important; } }
.stelco-search-grid > li{ margin:0!important; }
.stelco-search-card{ display:flex; flex-direction:column; height:100%; border:1px solid var(--c-line); border-radius:14px; overflow:hidden; background:var(--c-surface); transition:transform .25s, box-shadow .25s, border-color .25s; }
.stelco-search-card:hover{ transform:translateY(-4px); border-color:rgba(0,100,255,.4); box-shadow:0 20px 44px -26px rgba(15,27,45,.4); }
.stelco-search-card .wp-block-post-featured-image{ margin:0; border-bottom:1px solid var(--c-line); background:var(--c-surface-2); }
.stelco-search-card .wp-block-post-featured-image img{ width:100%; height:100%; object-fit:contain; }
/* fallback box when a result has no image */
.stelco-search-card .wp-block-post-featured-image:empty{ display:block; aspect-ratio:4/3; background:var(--c-surface-2); }
.stelco-search-card-body{ padding:1rem 1.1rem 1.2rem; display:flex; flex-direction:column; gap:.5rem; flex:1; }
.stelco-search-card-title{ margin:0!important; font-family:var(--f-body)!important; font-size:.95rem!important; font-weight:600!important; line-height:1.35!important; }
.stelco-search-card-title a{ color:var(--c-ink)!important; text-decoration:none!important; }
.stelco-search-card-title a:hover{ color:var(--c-brand)!important; }
.stelco-search-card .wp-block-post-excerpt{ margin:0; }
.stelco-search-card .wp-block-post-excerpt__excerpt{ font-family:var(--f-body); font-size:.82rem; line-height:1.55; color:var(--c-muted); }
.stelco-search-card .wp-block-post-excerpt__more-text{ display:none; }
.stelco-search-pagination{ margin-top:2.5rem; display:flex; gap:.5rem; align-items:center; font-family:var(--f-mono); font-size:.8rem; }
.stelco-search-pagination a,.stelco-search-pagination .current{ padding:.4rem .7rem; border:1px solid var(--c-line); border-radius:8px; text-decoration:none; color:var(--c-ink-2); }
.stelco-search-pagination .current{ background:var(--c-brand); color:#fff; border-color:var(--c-brand); }

/* ============================================================================
   v1.7.9 — Product description bullet points → small brand circle markers.
   Header Account link removed; gallery double-border fixed (see inline PDP CSS).
   ============================================================================ */
.woocommerce div.product .woocommerce-tabs .panel ul,
.woocommerce-Tabs-panel ul,
.woocommerce div.product .woocommerce-product-details__short-description ul{ list-style:none!important; padding-left:0!important; margin:.75rem 0 1.25rem!important; }
.woocommerce div.product .woocommerce-tabs .panel ul li,
.woocommerce-Tabs-panel ul li,
.woocommerce div.product .woocommerce-product-details__short-description ul li{ position:relative!important; padding-left:1.4rem!important; margin:.45rem 0!important; color:var(--c-ink-2); line-height:1.6; list-style:none!important; }
.woocommerce div.product .woocommerce-tabs .panel ul li::before,
.woocommerce-Tabs-panel ul li::before,
.woocommerce div.product .woocommerce-product-details__short-description ul li::before{ content:""!important; position:absolute; left:.2rem; top:.62em; width:7px; height:7px; border-radius:50%; background:var(--c-brand); }

/* ============================================================================
   v1.8.0 — Modern empty states (404 + search no-results) and a clean, centered
   My Account login.
   ============================================================================ */
.stelco-empty-wrap{ padding-top:4rem!important; padding-bottom:5rem!important; text-align:center; }
.stelco-empty{ max-width:560px; margin:0 auto; text-align:center; }
.stelco-empty-badge{ display:grid; place-items:center; width:76px; height:76px; margin:0 auto 1.5rem; border-radius:20px; background:var(--c-surface); border:1px solid var(--c-line); color:var(--c-brand); box-shadow:0 10px 30px -16px rgba(15,27,45,.4); }
.stelco-empty-code{ font-family:var(--f-display); font-size:clamp(3.5rem,12vw,6rem); font-weight:900; line-height:1; letter-spacing:-.03em; background:linear-gradient(135deg,var(--c-navy),var(--c-brand)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; margin-bottom:.75rem; }
.stelco-empty-title{ font-family:var(--f-display); font-size:1.6rem; font-weight:800; color:var(--c-ink); margin:0 0 .6rem; }
.stelco-empty-text{ font-family:var(--f-body); font-size:.95rem; line-height:1.65; color:var(--c-muted); margin:0 auto 1.75rem; max-width:42ch; }
.stelco-empty-search{ max-width:480px; margin:0 auto 1.75rem; }
.stelco-empty-actions{ justify-content:center; }
.stelco-empty-btn{ display:inline-block; background:var(--c-brand); color:#fff!important; border-radius:10px; padding:.85rem 1.6rem; font-family:var(--f-mono); font-size:.74rem; font-weight:600; text-transform:uppercase; letter-spacing:.05em; text-decoration:none; }
.stelco-empty-btn:hover{ background:var(--c-brand-dark); }

/* Clean, centered login when registration is OFF (only form.login renders) */
.woocommerce-account:not(.logged-in) .woocommerce{ max-width:460px; margin-left:auto; margin-right:auto; }
.woocommerce-account .woocommerce > h2:first-of-type{ font-family:var(--f-display); font-size:1.6rem; font-weight:800; text-align:center; margin:0 0 1.5rem; }
.woocommerce-account form.login{ margin:0; }
.woocommerce-account form.login .woocommerce-form-login__submit{ width:100%; }

/* ============================================================================
   v1.8.1 — Colour variations as modern swatch circles + a bulletproof,
   horizontal quantity stepper (global, covers shop.js .stelco-qty AND
   WooCommerce's own .wc-block-components-quantity-selector).
   ============================================================================ */
/* Colour swatches (built by variation-buttons.js for colour attributes) */
.stelco-swatches{ display:flex!important; flex-wrap:wrap; gap:.7rem; margin:.2rem 0 0; align-items:flex-start; }
.stelco-swatch{ display:inline-flex!important; flex-direction:column; align-items:center; gap:.4rem; cursor:pointer; background:none!important; border:0!important; padding:0!important; box-shadow:none!important; }
.stelco-swatch .dot{ width:34px; height:34px; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 1.5px #cbd5e1; transition:box-shadow .15s, transform .15s; }
.stelco-swatch:hover .dot{ box-shadow:0 0 0 1.5px var(--c-brand); transform:translateY(-1px); }
.stelco-swatch.is-active .dot{ box-shadow:0 0 0 2.5px var(--c-brand); }
.stelco-swatch .lbl{ font-family:var(--f-mono); font-size:.58rem; text-transform:uppercase; letter-spacing:.04em; color:var(--c-muted); }
.stelco-swatch.is-active .lbl{ color:var(--c-ink); font-weight:600; }

/* Quantity stepper — force a single horizontal row everywhere, no wrap */
.stelco-qty,
.woocommerce .quantity.stelco-qty,
.wc-block-components-quantity-selector,
.woocommerce-variation-add-to-cart .wc-block-components-quantity-selector{
	display:inline-flex!important; flex-direction:row!important; flex-wrap:nowrap!important;
	align-items:stretch!important; width:auto!important; max-width:none!important;
	white-space:nowrap; vertical-align:middle; border:1.6px solid #94a3b8!important;
	border-radius:10px!important; overflow:hidden; background:#fff!important; height:3rem!important;
}
.stelco-qty input.qty,
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__input{
	flex:0 0 auto!important; width:2.6rem!important; min-width:2.6rem!important; height:100%!important;
	border:0!important; background:transparent!important; box-shadow:none!important; outline:none!important;
	text-align:center; padding:0!important; margin:0!important; font-family:var(--f-mono); font-size:.9rem;
	-moz-appearance:textfield; appearance:textfield; order:2;
}
.stelco-qty .stelco-qty-btn,
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button{
	flex:0 0 auto!important; width:2.3rem!important; min-width:2.3rem!important; height:100%!important;
	border:0!important; background:transparent!important; box-shadow:none!important; opacity:1!important;
	display:grid!important; place-items:center; padding:0!important; margin:0!important;
	font-size:1.05rem; line-height:1; color:var(--c-ink-2)!important; cursor:pointer;
	-webkit-appearance:none!important; appearance:none!important;
}
.stelco-qty .stelco-qty-btn.minus,
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button--minus{ border-right:1.6px solid #cbd5e1!important; order:1; }
.stelco-qty .stelco-qty-btn.plus,
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button--plus{ border-left:1.6px solid #cbd5e1!important; order:3; }
.stelco-qty input.qty::-webkit-outer-spin-button,.stelco-qty input.qty::-webkit-inner-spin-button,
.wc-block-components-quantity-selector input::-webkit-outer-spin-button,.wc-block-components-quantity-selector input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }

/* v1.8.2 — checkout button arrow to match cart.html demo */
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button::after{ content:" \2192"; }

/* v1.8.3 — Cart page title ("Quote Cart") + spacing */
.woocommerce-cart .wp-block-post-title,
.woocommerce-cart h1.wp-block-post-title{ font-family:var(--f-display)!important; font-size:2rem!important; font-weight:800!important; line-height:1.15!important; color:var(--c-ink)!important; margin:0 0 .4rem!important; padding-top:1rem; }
.woocommerce-cart .woocommerce-notices-wrapper{ margin-bottom:1rem; }
.woocommerce-cart .entry-content,
.woocommerce-cart .wp-block-post-content{ margin-top:1.5rem!important; }

/* v1.8.4 — Cart line-item brand eyebrow + spec chips + roomier padding */
.woocommerce-cart table.shop_table.cart tr.cart_item{ padding:1.3rem 1.5rem; column-gap:1.4rem; row-gap:1rem; }
.woocommerce-cart table.shop_table.cart td.product-name{ display:flex!important; flex-direction:column; gap:.45rem; padding-right:.5rem!important; }
.woocommerce-cart .ci-brand{ font-family:var(--f-mono); font-size:.6rem; text-transform:uppercase; letter-spacing:.07em; color:var(--c-muted); line-height:1; }
.woocommerce-cart .ci-name a{ font-family:var(--f-body)!important; font-weight:500!important; font-size:.92rem!important; color:var(--c-ink-2)!important; text-decoration:none; line-height:1.35; }
.woocommerce-cart .ci-name a:hover{ color:var(--c-brand)!important; }
.woocommerce-cart .ci-specs{ display:flex; flex-wrap:wrap; gap:.4rem; }
.woocommerce-cart .ci-specs span{ border:1px solid var(--c-line); background:var(--c-canvas); color:var(--c-ink-2); border-radius:5px; padding:.14rem .45rem; font-family:var(--f-mono); font-size:.6rem; line-height:1.3; }
/* a touch more breathing room around the thumbnail + qty */
.woocommerce-cart table.shop_table.cart td.product-thumbnail{ padding:.1rem!important; }
.woocommerce-cart table.shop_table.cart td.product-quantity{ padding-top:.2rem!important; }

/* v1.8.5 — CART quantity stepper: force −/N/+ into ONE unified horizontal box.
   High-specificity + cart-scoped so it beats WooCommerce's native input border/margin
   (which was leaving the number in its own box with gaps beside the −/+). */
.woocommerce-cart td.product-quantity .quantity,
.woocommerce-cart td.product-quantity .stelco-qty,
.woocommerce-cart td.product-quantity .wc-block-components-quantity-selector{
	display:inline-flex!important; flex-direction:row!important; flex-wrap:nowrap!important;
	align-items:stretch!important; gap:0!important; width:auto!important; max-width:none!important;
	height:2.9rem!important; padding:0!important; margin:0!important;
	border:1.6px solid #94a3b8!important; border-radius:10px!important; overflow:hidden!important;
	background:#fff!important; box-shadow:none!important;
}
.woocommerce-cart td.product-quantity input.qty,
.woocommerce-cart td.product-quantity .wc-block-components-quantity-selector__input{
	flex:0 0 auto!important; order:2; width:2.8rem!important; min-width:2.8rem!important; height:100%!important;
	border:0!important; border-radius:0!important; outline:none!important; box-shadow:none!important;
	margin:0!important; padding:0!important; text-align:center!important; background:transparent!important;
	font-family:var(--f-mono); font-size:.9rem; color:var(--c-ink); -moz-appearance:textfield; appearance:textfield;
}
.woocommerce-cart td.product-quantity input.qty::-webkit-outer-spin-button,
.woocommerce-cart td.product-quantity input.qty::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.woocommerce-cart td.product-quantity .stelco-qty-btn,
.woocommerce-cart td.product-quantity .wc-block-components-quantity-selector__button{
	flex:0 0 auto!important; width:2.4rem!important; min-width:2.4rem!important; height:100%!important;
	border:0!important; background:transparent!important; box-shadow:none!important; opacity:1!important;
	display:grid!important; place-items:center!important; margin:0!important; padding:0!important;
	font-size:1.05rem; line-height:1; color:var(--c-ink-2)!important; cursor:pointer; -webkit-appearance:none!important; appearance:none!important;
}
.woocommerce-cart td.product-quantity .stelco-qty-btn.minus,
.woocommerce-cart td.product-quantity .wc-block-components-quantity-selector__button--minus{ border-right:1.6px solid #cbd5e1!important; order:1; }
.woocommerce-cart td.product-quantity .stelco-qty-btn.plus,
.woocommerce-cart td.product-quantity .wc-block-components-quantity-selector__button--plus{ border-left:1.6px solid #cbd5e1!important; order:3; }
.woocommerce-cart td.product-quantity .stelco-qty-btn:hover,
.woocommerce-cart td.product-quantity .wc-block-components-quantity-selector__button:hover{ color:var(--c-brand)!important; background:var(--c-canvas)!important; }

/* v1.9.8 — Cart page: title + content share ONE centered 1280 container so the
   "Quote Cart" heading lines up with the cards (was stuck far left). */
.woocommerce-cart .woocommerce,
.woocommerce-cart .wp-block-post-title,
.woocommerce-cart .wp-block-post-content,
.woocommerce-cart .entry-content{
	box-sizing:border-box!important;
	max-width:1280px!important;
	margin-left:auto!important;
	margin-right:auto!important;
	padding-left:clamp(1rem,4vw,2rem)!important;
	padding-right:clamp(1rem,4vw,2rem)!important;
}
/* Force the title to the same centered 1280 box (beats core alignwide + any theme rule) */
body.woocommerce-cart h1.wp-block-post-title,
body.woocommerce-cart .wp-block-post-title{ display:block!important; float:none!important; width:auto!important; max-width:1280px!important; margin-left:auto!important; margin-right:auto!important; box-sizing:border-box!important; padding-left:clamp(1rem,4vw,2rem)!important; padding-right:clamp(1rem,4vw,2rem)!important; text-align:left!important; }
/* avoid double padding/width when the cart container is nested in the content wrapper */
.woocommerce-cart .wp-block-post-content .woocommerce,
.woocommerce-cart .entry-content .woocommerce{ padding-left:0!important; padding-right:0!important; max-width:none!important; }

/* ============================================================================
   v1.9.1 — "Added to cart" notice: remove the dark border, soft green panel;
   VIEW CART badge → dark-green text, padded pill, dark-green hover (not blue).
   ============================================================================ */
.woocommerce-notices-wrapper .wc-block-components-notice-banner,
.wc-block-store-notices .wc-block-components-notice-banner,
.woocommerce-message,.woocommerce-info{
	border:0!important; border-left:4px solid var(--c-live)!important; outline:0!important;
	background:#f0fdf4!important; border-radius:12px!important; color:var(--c-ink-2)!important;
	box-shadow:0 1px 3px rgba(15,27,45,.04)!important;
}
.wc-block-components-notice-banner.is-success{ background:#f0fdf4!important; }
.wc-block-components-notice-banner__content{ color:var(--c-ink-2)!important; }
/* VIEW CART badge inside the notice + the AJAX "View cart" link */
.wc-block-components-notice-banner a,
.woocommerce-message a.button,
.woocommerce-message a.wc-forward,
.woocommerce a.added_to_cart,
a.wc-forward.button{
	display:inline-block!important; background:#dcfce7!important; color:#15803d!important;
	border:1px solid #86efac!important; border-radius:99px!important;
	padding:.4rem 1rem!important; margin:0!important;
	font-family:var(--f-mono)!important; font-size:.66rem!important; font-weight:600!important;
	text-transform:uppercase!important; letter-spacing:.05em!important; text-decoration:none!important;
	line-height:1.3!important; white-space:nowrap;
}
.wc-block-components-notice-banner a:hover,
.woocommerce-message a.button:hover,
.woocommerce-message a.wc-forward:hover,
.woocommerce a.added_to_cart:hover,
a.wc-forward.button:hover{ background:#15803d!important; color:#fff!important; border-color:#15803d!important; }

/* ============================================================================
   v1.9.3 — Price filter: Min (left) and Max (right) INLINE on one row, sized
   to fit the narrow sidebar (was stacked / was overflowing).
   ============================================================================ */
.stelco-filters .wp-block-woocommerce-price-filter,
.stelco-filters .wc-block-price-filter,
.stelco-filters .wc-block-components-price-slider{ box-sizing:border-box; max-width:100%; padding:0!important; overflow:hidden; }
.stelco-filters .wc-block-components-price-slider__controls,
.stelco-filters .wc-block-price-filter__controls{ display:flex!important; flex-direction:row!important; flex-wrap:nowrap!important; justify-content:space-between!important; align-items:center; gap:.6rem!important; margin-top:.85rem!important; }
.stelco-filters .wc-block-components-price-slider__amount,
.stelco-filters input.wc-block-price-filter__amount,
.stelco-filters .wc-block-components-price-slider__amount input,
.stelco-filters .wc-block-price-slider__amount{
	flex:0 1 auto!important; width:auto!important; max-width:48%!important; min-width:0!important;
	box-sizing:border-box!important; font-size:.74rem!important; padding:.5rem .45rem!important; text-align:center;
}
/* Min hugs the left, Max hugs the FAR right of the slider row */
.stelco-filters .wc-block-components-price-slider__amount--min{ margin-right:auto!important; text-align:left!important; }
.stelco-filters .wc-block-components-price-slider__amount--max{ margin-left:auto!important; text-align:right!important; }
.stelco-filters .wc-block-components-price-slider__controls > :last-child{ margin-left:auto!important; }
/* range-text labels (Min price / Max price) also inline, spread apart */
.stelco-filters .wc-block-components-price-slider__range-text{ display:flex!important; flex-direction:row!important; justify-content:space-between!important; gap:.5rem; }
.stelco-filters .wc-block-components-price-slider__range-text .wc-block-components-price-slider__range-text-min{ text-align:left; }
.stelco-filters .wc-block-components-price-slider__range-text .wc-block-components-price-slider__range-text-max{ text-align:right; }

/* ============================================================================
   v1.9.4 — page-title consistency, VIEW CART badge padding, hide Update Cart.
   ============================================================================ */
/* All page titles (Quote Request, Quote Cart, etc.) share one look */
body.page .wp-block-post-title,
body.woocommerce-cart .wp-block-post-title{ font-family:var(--f-display)!important; font-size:2rem!important; font-weight:800!important; line-height:1.15!important; color:var(--c-ink)!important; }
/* VIEW CART badge — more padding + a little breathing room from the message */
.wc-block-components-notice-banner a,
.woocommerce-message a.button,
.woocommerce-message a.wc-forward,
a.wc-forward.button{ padding:.55rem 1.25rem!important; margin-left:.85rem!important; }
/* Update Cart: hidden until a quantity changes (JS adds .stelco-show), then it appears */
.woocommerce-cart .actions button[name="update_cart"]{ display:none!important; }
.woocommerce-cart .actions button[name="update_cart"].stelco-show{ display:inline-block!important; opacity:1!important; background:var(--c-brand)!important; color:#fff!important; border:0!important; }

/* ============================================================================
   v1.9.6 — Categories filter card (replaces the Availability checkbox card).
   ============================================================================ */
.stelco-filters .stelco-cat-filter .stelco-filter-h{ font-family:var(--f-mono); font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--c-ink); margin:0 0 .75rem; }
.stelco-filters .wc-block-product-categories,
.stelco-filters .wp-block-woocommerce-product-categories{ margin:0; }
.stelco-filters .wc-block-product-categories-list,
.stelco-filters ul.wc-block-product-categories-list{ list-style:none!important; margin:0!important; padding:0!important; }
/* Row = name (left) + count (right) INLINE. The count is a sibling of the <a>,
   so we flex the LI (not the link) — that's why it was dropping below before. */
.stelco-filters .wc-block-product-categories-list-item{ display:flex!important; align-items:center!important; justify-content:space-between!important; gap:.5rem; margin:0!important; padding:.5rem .55rem!important; border-radius:8px; list-style:none!important; transition:background .15s; }
.stelco-filters .wc-block-product-categories-list-item:hover{ background:var(--c-canvas); }
.stelco-filters .wc-block-product-categories-list-item > a{ flex:1 1 auto; min-width:0; display:flex; align-items:center; gap:.4rem; font-family:var(--f-body); font-size:.86rem; font-weight:500; color:var(--c-ink-2)!important; text-decoration:none; }
.stelco-filters .wc-block-product-categories-list-item:hover > a{ color:var(--c-brand)!important; }
/* chevron icon on the right edge */
.stelco-filters .wc-block-product-categories-list-item::after{ content:"›"; order:9; color:var(--c-muted); font-size:1rem; line-height:1; margin-left:.15rem; }
.stelco-filters .wc-block-product-categories-list-item-count{ order:8; flex:0 0 auto; font-family:var(--f-mono); font-size:.64rem; color:var(--c-muted); background:var(--c-canvas); border:1px solid var(--c-line); border-radius:99px; padding:.08rem .5rem; }
/* Hide the "Uncategorized" row (it has no place in a B2B filter) */
.stelco-filters .wc-block-product-categories-list-item:has(a[href*="/uncategorized"]){ display:none!important; }
/* nested children indent */
.stelco-filters .wc-block-product-categories-list .wc-block-product-categories-list{ flex-basis:100%; margin-left:.6rem!important; border-left:1px solid var(--c-line); padding-left:.4rem!important; }

/* v1.9.7 — top-level category filter list (stelco/category-filter block) */
.stelco-filters .stelco-cats-list{ list-style:none!important; margin:0!important; padding:0!important; }
.stelco-filters .stelco-cats-list li{ margin:0!important; padding:0!important; list-style:none!important; }
.stelco-filters .stelco-cats-list a{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding:.55rem .6rem; border-radius:8px; font-family:var(--f-body); font-size:.88rem; font-weight:500; color:var(--c-ink-2)!important; text-decoration:none; transition:background .15s,color .15s; }
.stelco-filters .stelco-cats-list a:hover{ background:var(--c-canvas); color:var(--c-brand)!important; }
.stelco-filters .stelco-cats-list a.is-current{ background:rgba(0,100,255,.08); color:var(--c-brand)!important; font-weight:600; }
.stelco-filters .stelco-cats-list .cnt{ font-family:var(--f-mono); font-size:.64rem; color:var(--c-muted); background:var(--c-canvas); border:1px solid var(--c-line); border-radius:99px; padding:.05rem .45rem; }
.stelco-filters .stelco-cats-list a.is-current .cnt{ border-color:var(--c-brand); color:var(--c-brand); }

/* ============================================================================
   v1.9.9 — Category/shop archive product grid (with filter sidebar):
   3 columns on large, 2 on medium/small, 1 on mobile.
   ============================================================================ */
.stelco-shop-grid ul.products,
body.tax-product_cat .stelco-shop-grid ul.products,
body.post-type-archive-product .stelco-shop-grid ul.products{ grid-template-columns:repeat(3,1fr)!important; }
@media(max-width:1024px){
	.stelco-shop-grid ul.products,
	body.tax-product_cat .stelco-shop-grid ul.products,
	body.post-type-archive-product .stelco-shop-grid ul.products{ grid-template-columns:repeat(2,1fr)!important; }
}
@media(max-width:600px){
	.stelco-shop-grid ul.products,
	body.tax-product_cat .stelco-shop-grid ul.products,
	body.post-type-archive-product .stelco-shop-grid ul.products{ grid-template-columns:1fr!important; }
}

/* ============================================================================
   v2.0.1 — Price filter: Min (left) / Max (right) on ONE row, each as a stacked
   block (value over label). Max hugs the far right, right-aligned. Covers the
   block price-slider variants (controls + range-text) and the classic widget.
   ============================================================================ */
.stelco-filters .wc-block-components-price-slider__range-text,
.stelco-filters .wc-block-components-price-slider__controls,
.stelco-filters .wc-block-price-filter__controls,
.stelco-filters .price_slider_amount{
	display:flex!important; flex-direction:row!important; flex-wrap:nowrap!important;
	justify-content:space-between!important; align-items:flex-start!important;
	width:100%!important; gap:.75rem!important; box-sizing:border-box; text-align:left;
}
/* each side becomes a small stacked column (value on top, label below) */
.stelco-filters .wc-block-components-price-slider__range-text > *,
.stelco-filters .wc-block-components-price-slider__controls > *,
.stelco-filters .wc-block-price-filter__controls > *{ display:flex!important; flex-direction:column; min-width:0; }
/* MIN → left edge, left-aligned */
.stelco-filters [class*="range-text-min"],
.stelco-filters [class*="__amount--min"],
.stelco-filters [class*="price-slider__amount--min"]{ align-items:flex-start!important; text-align:left!important; margin-right:auto!important; }
/* MAX → far right, right-aligned (value + label line up vertically on the right) */
.stelco-filters [class*="range-text-max"],
.stelco-filters [class*="__amount--max"],
.stelco-filters [class*="price-slider__amount--max"]{ align-items:flex-end!important; text-align:right!important; margin-left:auto!important; }

/* ============================================================================
   v2.0.6 — Brands filter card (wordmark/logo + name) + header mega-menu support.
   ============================================================================ */
.stelco-filters .stelco-brand-filter .stelco-filter-h{ font-family:var(--f-mono); font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--c-ink); margin:0 0 .75rem; }
.stelco-brands-list{ display:grid!important; grid-template-columns:1fr 1fr; gap:.5rem; list-style:none!important; margin:0!important; padding:0!important; }
.stelco-brands-list li{ margin:0!important; padding:0!important; list-style:none!important; }
.stelco-brands-list a{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.35rem; min-height:64px; padding:.6rem .4rem; border:1px solid var(--c-line); border-radius:10px; background:#fff; text-decoration:none; transition:transform .15s,border-color .15s,box-shadow .15s; }
.stelco-brands-list a:hover{ transform:translateY(-2px); border-color:rgba(0,100,255,.35); box-shadow:0 12px 26px -18px rgba(15,27,45,.4); }
.stelco-brands-list .bf-mark{ font-family:var(--f-display); font-weight:800; font-size:1rem; line-height:1; letter-spacing:-.01em; }
.stelco-brands-list .bf-mark.abb{ color:#ff000f; letter-spacing:.02em; }
.stelco-brands-list .bf-mark.hager{ color:#0a1f3d; text-transform:lowercase; }
.stelco-brands-list .bf-mark.hager b{ color:#e2001a; }
.stelco-brands-list .bf-mark.schneider{ color:#3dcd58; font-size:.92rem; }
.stelco-brands-list .bf-mark-img{ max-height:26px; width:auto; }
.stelco-brands-list .bn{ font-family:var(--f-body); font-size:.68rem; color:var(--c-muted); }

/* ============================================================================
   v2.1.5 — Uniform fonts on the CART page. Standardise labels/values to the
   body font (was a mix of mono + display + body); display kept only for the
   page title and the grand total for hierarchy.
   ============================================================================ */
.woocommerce-cart .cart_totals h2,
.woocommerce-cart .cart_totals th,
.woocommerce-cart .cart_totals td,
.woocommerce-cart .cart_totals .order-total th,
.woocommerce-cart .cart_totals .order-total td small,
.woocommerce-cart .cart_totals .includes_tax,
.woocommerce-cart .actions .coupon input,
.woocommerce-cart .actions .coupon button,
.woocommerce-cart .actions button[name="update_cart"],
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce-cart table.shop_table.cart thead th,
.woocommerce-cart table.shop_table.cart td.product-name,
.woocommerce-cart table.shop_table.cart td.product-name a,
.woocommerce-cart table.shop_table.cart td.product-subtotal,
.woocommerce-cart .ci-brand,
.woocommerce-cart .ci-specs span{ font-family:var(--f-body)!important; }
/* keep the page title and the grand-total number in the display face */
.woocommerce-cart .wp-block-post-title,
.woocommerce-cart .cart_totals .order-total td{ font-family:var(--f-display)!important; }

/* ============================================================================
   v2.1.9 — Modern mesh-gradient hero backgrounds (replaces flat dark blue).
   Layered colour glows on a deep base; subtle drift. White text stays readable.
   ============================================================================ */
.stelco-hero .knb-mesh{ position:absolute; inset:0; background-size:160% 160%; animation:heroDrift 18s ease-in-out infinite; }
/* Slide 1 — blue + cyan + warm spark */
.stelco-hero .knb-mesh.m1{
	background-image:
		radial-gradient(60% 90% at 12% 18%, rgba(0,100,255,.55), transparent 60%),
		radial-gradient(55% 80% at 88% 28%, rgba(34,200,230,.40), transparent 58%),
		radial-gradient(50% 70% at 72% 88%, rgba(255,158,0,.20), transparent 55%),
		linear-gradient(135deg,#06122b,#0a2350 70%,#0b2f6b);
}
/* Slide 2 — vivid electric blue */
.stelco-hero .knb-mesh.m2{
	background-image:
		radial-gradient(60% 85% at 18% 22%, rgba(43,130,255,.65), transparent 60%),
		radial-gradient(55% 80% at 84% 72%, rgba(0,80,204,.6), transparent 58%),
		radial-gradient(45% 60% at 62% 8%, rgba(120,180,255,.45), transparent 55%),
		linear-gradient(135deg,#062a6e,#0a1f3d 75%,#0a2f7a);
}
/* Slide 3 — blue with amber + a hint of red (brand secondary) */
.stelco-hero .knb-mesh.m3{
	background-image:
		radial-gradient(60% 85% at 16% 28%, rgba(0,100,255,.5), transparent 60%),
		radial-gradient(55% 75% at 86% 76%, rgba(255,158,0,.38), transparent 56%),
		radial-gradient(45% 60% at 78% 14%, rgba(224,17,43,.22), transparent 52%),
		linear-gradient(135deg,#0a1f3d,#11264d 70%,#1a2e57);
}
@keyframes heroDrift{0%,100%{background-position:0% 0%}50%{background-position:100% 100%}}
@media(prefers-reduced-motion:reduce){.stelco-hero .knb-mesh{animation:none}}

/* ============================================================================
   v2.2.0 — Footer: 2 columns on tablet/mobile (was one long stacked column).
   ============================================================================ */
@media(max-width:781px){
	.stelco-footer-cols{ display:grid!important; grid-template-columns:1fr 1fr!important; gap:1.75rem 1.25rem!important; }
	.stelco-footer-cols > .wp-block-column{ flex-basis:auto!important; width:auto!important; margin:0!important; }
	.stelco-footer-cols > .wp-block-column:first-child{ grid-column:1 / -1; } /* brand/intro spans full width */
}
@media(max-width:420px){
	.stelco-footer-cols{ grid-template-columns:1fr!important; }
}

/* ============================================================================
   v2.2.2 — Mobile-friendly filters: collapsible "Filters" accordion on mobile,
   always-open on desktop; sidebar goes full-width when stacked.
   ============================================================================ */
.stelco-filters .stelco-filter-acc{ border:0; margin:0; }
.stelco-filters .stelco-filter-acc > summary{ list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:.5rem; font-family:var(--f-mono); font-size:.82rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--c-ink); padding:.9rem 1.1rem; border:1px solid var(--c-line); border-radius:12px; background:var(--c-surface); }
.stelco-filters .stelco-filter-acc > summary::-webkit-details-marker,
.stelco-filters .stelco-filter-acc > summary::marker{ display:none; content:""; }
.stelco-filters .stelco-filter-acc .acc-caret{ transition:transform .2s; color:var(--c-muted); }
.stelco-filters .stelco-filter-acc[open] > summary .acc-caret{ transform:rotate(180deg); }
.stelco-filters .stelco-filter-acc-body{ display:flex; flex-direction:column; gap:1.1rem; margin-top:1rem; }
/* card look for each filter block */
.stelco-filters .stelco-filter-acc-body > .wp-block-woocommerce-filter-wrapper,
.stelco-filters .stelco-filter-acc-body > .stelco-cat-filter,
.stelco-filters .stelco-filter-acc-body > .stelco-brand-filter{ border:1px solid var(--c-line); border-radius:14px; background:var(--c-surface); padding:1.1rem; box-shadow:0 1px 3px rgba(15,27,45,.04); }
/* Medium + large (>=768px): filters ALWAYS open, no toggle (not removed!) */
@media(min-width:768px){
	.stelco-filters .stelco-filter-acc > summary{ display:none; }
	.stelco-filters .stelco-filter-acc-body{ display:flex!important; margin-top:0; }
}
/* Tablet (768-900): columns stack but the filters stay open, full-width */
@media(max-width:900px){
	.stelco-shop-cols{ display:block!important; }
	.stelco-shop-cols > .stelco-filters{ flex-basis:auto!important; width:100%!important; max-width:none!important; margin:0 0 1.5rem!important; }
	.stelco-shop-cols > .stelco-shop-grid{ width:100%!important; flex-basis:auto!important; }
}

/* ============================================================================
   v2.2.4 — Nicer SALE badge: rounded red→coral gradient pill with soft glow.
   ============================================================================ */
.woocommerce span.onsale,
.woocommerce .wc-block-components-product-sale-badge,
.wc-block-components-product-sale-badge{
	background:linear-gradient(135deg,#e0112b,#ff5a5f)!important;
	color:#fff!important; border:0!important;
	font-family:var(--f-mono)!important; font-weight:700!important; font-size:.6rem!important;
	letter-spacing:.09em!important; text-transform:uppercase!important; line-height:1!important;
	border-radius:99px!important; padding:.34rem .68rem!important;
	min-height:0!important; min-width:0!important; height:auto!important; width:auto!important;
	box-shadow:0 7px 16px -6px rgba(224,17,43,.6)!important;
}
/* Loop/shop cards: pin top-left, just under the stock pill so they never overlap */
.woocommerce ul.products li.product span.onsale{
	position:absolute!important; top:2.6rem; left:.6rem; right:auto; z-index:3; margin:0!important;
}
/* Block product grids (featured / related): top-left corner */
.wc-block-product .wc-block-components-product-sale-badge{
	position:absolute; top:.7rem; left:.7rem; z-index:3;
}
.wc-block-product{ position:relative; }
/* Single product gallery: top-left of the image card */
.woocommerce div.product span.onsale{
	position:absolute!important; top:1rem; left:1rem; right:auto; z-index:4; margin:0!important;
}

/* ============================================================================
   v2.2.5 — Uniform product-tab fonts (Description / Specifications / Delivery).
   Forces every tab link to the same family, size, weight & transform.
   ============================================================================ */
.woocommerce div.product .woocommerce-tabs ul.tabs li a,
.wp-block-woocommerce-product-details .woocommerce-tabs ul.tabs li a,
.wp-block-woocommerce-product-details ul.tabs li a,
.woocommerce-tabs ul.wc-tabs li a,
.woocommerce-tabs ul.tabs li a{
	font-family:var(--f-mono)!important;
	font-size:.8rem!important;
	font-weight:600!important;
	text-transform:uppercase!important;
	letter-spacing:.05em!important;
	font-style:normal!important;
}

/* ============================================================================
   v2.2.9 — Header sticky + flush: no gap above OR below the header.
   IMPORTANT: do NOT put overflow:clip/hidden on html/body/.wp-site-blocks —
   that turns them into a scroll container and BREAKS position:sticky.
   ============================================================================ */
html{ margin-top:0!important; }
body.custom-background, body{ margin:0!important; }
.wp-site-blocks{ padding-top:0!important; margin-top:0!important; }
.wp-site-blocks > :first-child{ margin-top:0!important; }
/* sticky header — the REAL sticky element is the template-part wrapper
   (.wp-block-template-part), whose parent is the tall .wp-site-blocks.
   Sticking the inner .stelco-header alone fails because its wrapper is only
   as tall as the header. */
.wp-site-blocks > header,
.wp-site-blocks > header.wp-block-template-part{ position:sticky!important; top:0!important; z-index:100!important; margin:0!important; }
.stelco-header{ position:static; top:0; z-index:100; margin:0!important; }
/* no gap below the header either */
.wp-site-blocks > main,
.wp-site-blocks > .stelco-main,
body .stelco-main{ margin-top:0!important; }
.stelco-main > :first-child,
.stelco-hero{ margin-top:0!important; }

/* ============================================================================
   v2.3.2 — Responsive hero/slider: scale height + type down on smaller screens.
   ============================================================================ */
@media(max-width:1024px){
	.stelco-hero, .stelco-hero-inner{ min-height:460px!important; }
	.stelco-hero-inner{ padding:3rem 1.5rem!important; }
}
@media(max-width:768px){
	.stelco-hero, .stelco-hero-inner{ min-height:400px!important; }
	.stelco-hero-inner{ padding:2.5rem 1.25rem!important; }
	.stelco-hero .hero-h{ font-size:clamp(1.7rem,7vw,2.4rem)!important; line-height:1.1!important; }
	.stelco-hero .hero-p{ font-size:.95rem!important; }
}
@media(max-width:560px){
	.stelco-hero, .stelco-hero-inner{ min-height:340px!important; }
	.stelco-hero-inner{ padding:2rem 1.1rem!important; }
	.stelco-hero .hero-h{ font-size:clamp(1.5rem,8vw,2rem)!important; }
	.stelco-hero .hero-cta{ display:flex; flex-wrap:wrap; gap:.6rem; }
	.stelco-hero .hero-cta a{ flex:1 1 auto; text-align:center; }
	.stelco-hero .prev, .stelco-hero .next{ display:none!important; } /* hide arrows on phones, keep dots/swipe */
}

/* ============================================================================
   v2.3.3 — Shop archive: align the result-count/sort bar with the filter card
   top, give it a consistent height, and even out the product grid gaps/heights.
   ============================================================================ */
/* Both columns start at the same top */
.stelco-shop-cols{ align-items:flex-start!important; }
/* Result-count (left) + sorting (right) on one aligned bar, fixed height */
.stelco-shop-grid .woocommerce-result-count{ float:left; margin:0 0 1.4rem!important; height:44px; display:flex; align-items:center; }
.stelco-shop-grid .woocommerce-ordering{ float:right; margin:0 0 1.4rem!important; height:44px; display:flex; align-items:center; }
.stelco-shop-grid .woocommerce-ordering select,
.stelco-shop-grid .woocommerce-ordering .orderby{ height:44px!important; display:flex; align-items:center; }
.stelco-shop-grid ul.products{ clear:both!important; }
/* Even, consistent product grid: equal gaps + cards stretch to equal height per row */
.stelco-shop-grid ul.products{ gap:1.4rem!important; align-items:stretch!important; }
.stelco-shop-grid ul.products li.product{ height:100%!important; display:flex!important; flex-direction:column; margin:0!important; }
.stelco-shop-grid ul.products li.product .button,
.stelco-shop-grid ul.products li.product .added_to_cart{ margin-top:auto!important; } /* buttons line up at the bottom */

/* ============================================================================
   v2.3.4 — Top-align the result/sort bar with the filter card (kill stray top
   spacing & empty notices wrapper in the grid column).
   ============================================================================ */
.stelco-shop-cols{ align-items:flex-start!important; }
.stelco-shop-cols > .stelco-filters,
.stelco-shop-cols > .stelco-shop-grid{ margin-top:0!important; padding-top:0!important; }
/* remove any empty notices wrapper that pushes the result bar down */
.stelco-shop-grid .woocommerce-notices-wrapper:empty{ display:none!important; margin:0!important; }
.stelco-shop-grid .woocommerce-notices-wrapper{ margin:0!important; }
/* first thing in each column starts flush */
.stelco-shop-grid > :first-child,
.stelco-shop-grid .woocommerce-result-count,
.stelco-filters > :first-child,
.stelco-filters .stelco-filter-acc,
.stelco-filters .stelco-filter-acc-body > :first-child{ margin-top:0!important; }
/* result-count + sort sit on the same line as the CATEGORIES card heading */
.stelco-shop-grid .woocommerce-result-count{ float:left; margin:0 0 1.4rem!important; height:40px; display:flex; align-items:center; }
.stelco-shop-grid .woocommerce-ordering{ float:right; margin:0 0 1.4rem!important; }

/* ============================================================================
   v2.3.6 — REAL cause of the offset: the legacy loop is wrapped in
   #primary.content-area > main.site-main > (empty) header.woocommerce-products-header.
   Those wrappers carry default top margin/padding that pushed the whole grid
   column down relative to the CATEGORIES card. Collapse them so the result/sort
   bar starts at the exact same Y as the filter card heading.
   ============================================================================ */
.stelco-shop-grid #primary,
.stelco-shop-grid .content-area,
.stelco-shop-grid main.site-main,
.stelco-shop-grid [data-block-name="woocommerce/legacy-template"]{
	margin:0!important; padding:0!important;
}
/* the products-header is empty (archive title intentionally disabled) — collapse it */
.stelco-shop-grid .woocommerce-products-header{
	margin:0!important; padding:0!important; min-height:0!important; border:0!important;
}
.stelco-shop-grid .woocommerce-products-header:empty,
.stelco-shop-grid header.woocommerce-products-header{ display:none!important; }
/* belt-and-braces: nothing above the result bar adds height */
.stelco-shop-grid main.site-main > :first-child{ margin-top:0!important; }

/* ============================================================================
   v2.7.1 — Small-screen responsive refinements (home + shop cards, grids).
   ============================================================================ */
@media(max-width:600px){
  /* Home category cards → single column on phones */
  .stelco-cat-grid{ grid-template-columns:1fr!important; gap:.75rem; }
  .cat-card{ padding:1.15rem; }
  .cat-ico{ margin-bottom:1rem; }
  /* Section rhythm tightens on phones */
  .stelco-section{ padding:2.5rem 0; }
  .stelco-sec-head{ margin-bottom:1.25rem; }
  .stelco-sec-head h2{ font-size:clamp(1.4rem,6vw,1.9rem); }
  /* Trust bar wraps cleanly */
  .stelco-trustbar-inner{ gap:.5rem 1rem; font-size:.66rem; }
}
@media(max-width:480px){
  /* Product cards → single column on the smallest phones, larger tap targets */
  .stelco-shop-grid ul.products,
  .woocommerce ul.products,
  .stelco-products ul.products{ grid-template-columns:1fr!important; gap:.85rem!important; }
  .woocommerce ul.products li.product .button,
  .woocommerce ul.products li.product .added_to_cart{ width:auto; }
  /* Quote band + section headings scale down */
  .stelco-quoteband-inner{ padding:2.5rem 1.15rem; }
}

/* ============================================================================
   v2.7.2 — Tablet header fills the width (logo left / actions right on the
   wrapped row; header CSS lives in parts/header.html) + restored top padding
   on shop/category pages (breadcrumbs block sat flush under the header).
   ============================================================================ */