/*
Theme Name: Ham Sales Shop — Warm Neighborhood
Theme URI: https://hamsales.com/
Author: Ham Sales Shop build team
Description: Warm Neighborhood storefront theme for Ham Sales Shop. Terracotta, sage and cream design system for a bright, family-friendly grocery and household marketplace. Built for WooCommerce with accessibility and responsive merchandising in mind.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hamsales
Tags: e-commerce, grocery, accessibility-ready, custom-menu, featured-images, translation-ready
WC requires at least: 8.0
WC tested up to: 10.0
*/

/* =========================================================
   1. Design tokens — Warm Neighborhood
   ========================================================= */
:root{
  --primary:#B9573F;          /* terracotta - surfaces, large elements */
  --primary-ink:#A94B34;      /* terracotta - small text (AA on cream/white) */
  --primary-dark:#843A2B;
  --accent:#7F9B73;           /* sage */
  --accent-ink:#4F6A46;       /* sage - small text */
  --accent-soft:#E4EEDB;
  --bg:#FFF8F0;               /* cream */
  --surface:#FFFFFF;
  --surface-2:#FAFAF7;
  --ink:#4D2A23;
  --muted:#75665F;
  --line:rgba(20,32,29,.10);
  --line-soft:rgba(25,42,33,.07);
  --sale:#D92D20;
  --star:#A65F00;
  --footer:#0C1711;
  --footer-ink:#AEB8B1;
  --heading:Georgia,'Times New Roman',serif;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  --radius-lg:30px;
  --radius:24px;
  --radius-sm:15px;
  --shadow:0 8px 25px rgba(22,36,29,.06);
  --shadow-lg:0 18px 45px rgba(18,34,27,.14);
  --container:1240px;
  --focus:#843A2B;
  /* One button scale for the whole site. Every control resolves to --btn-h. */
  --btn-h:40px;
  --btn-h-icon:40px;
  --btn-px:18px;
  --btn-fs:14px;
  --btn-radius:10px;
  /* Payment marks sit just under the button scale so they read as
     information rather than as controls. */
  --pay-h:30px;
}

/* =========================================================
   2. Base
   ========================================================= */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:170px}
:target{scroll-margin-top:170px}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.5;font-size:16px;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--primary-ink);text-decoration:none}
a:hover,a:focus{text-decoration:underline}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4,h5{font-family:var(--heading);line-height:1.12;margin:0 0 .5em;letter-spacing:-.01em}
p{margin:0 0 1em}
ul,ol{margin:0 0 1em;padding-left:1.25em}
hr{border:0;border-top:1px solid var(--line);margin:2rem 0}
table{border-collapse:collapse;width:100%}
th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line)}
.container{width:min(var(--container),calc(100% - 48px));margin-inline:auto}
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal!important}
.screen-reader-text:focus{background:var(--surface);clip:auto!important;clip-path:none;color:var(--primary-dark);display:block;font-size:14px;font-weight:800;height:auto;left:16px;line-height:normal;padding:14px 22px;text-decoration:none;top:16px;width:auto;z-index:100000;border-radius:12px;box-shadow:var(--shadow-lg)}
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:6px}
.skip-link{position:absolute;left:-9999px}
.skip-link:focus{left:16px;top:16px;z-index:99999;background:#fff;color:var(--primary-dark);padding:14px 22px;border-radius:12px;font-weight:800;box-shadow:var(--shadow-lg)}

/* =========================================================
   3. Buttons and form controls
   ========================================================= */
.btn,.button,button.button,input[type="submit"],a.button,.wp-element-button,
.woocommerce #respond input#submit,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  height:var(--btn-h);min-height:var(--btn-h);padding:0 var(--btn-px);border-radius:var(--btn-radius);
  font-family:var(--sans);font-weight:800;font-size:var(--btn-fs);line-height:1;letter-spacing:.1px;
  border:1px solid transparent;background:var(--primary);color:#fff;cursor:pointer;white-space:nowrap;
  text-decoration:none;transition:background .16s ease,box-shadow .16s ease;
}
.btn:hover,.button:hover,button.button:hover,input[type="submit"]:hover,a.button:hover,
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover{background:var(--primary-dark);color:#fff;text-decoration:none}
.btn-primary,.woocommerce button.button.alt,.woocommerce a.button.alt,.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,.woocommerce button.button.alt:disabled{background:var(--primary);color:#fff;border-color:transparent}
.btn-primary:hover,.woocommerce button.button.alt:hover,.woocommerce a.button.alt:hover,.woocommerce input.button.alt:hover{background:var(--primary-dark);color:#fff}
.btn-ghost{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.62);color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.22);color:#fff}
.btn-outline{background:transparent;border-color:var(--primary);color:var(--primary-ink)}
.btn-outline:hover{background:var(--primary);color:#fff}
.btn-sm{padding:0 12px}
.btn-block{width:100%}
.btn-icon{width:var(--btn-h-icon);padding:0;flex:0 0 var(--btn-h-icon)}
button[disabled],.button[disabled]{opacity:.55;cursor:not-allowed}

input[type="text"],input[type="email"],input[type="url"],input[type="password"],input[type="search"],
input[type="number"],input[type="tel"],input[type="date"],textarea,select,.select2-container .select2-selection--single{
  width:100%;min-height:var(--btn-h);padding:9px 13px;border:1px solid var(--line);border-radius:var(--btn-radius);background:#fff;color:var(--ink);font-size:14px;
}
textarea{min-height:140px;padding-top:14px}
label{font-weight:700;font-size:14px;display:block;margin-bottom:6px}
.required,.woocommerce .required{color:#A3231A;text-decoration:none}
::placeholder{color:#8C7E77;opacity:1}

/* =========================================================
   4. Promo bar + header
   ========================================================= */
.promo{background:var(--primary-dark);color:#fff;font-size:13px;font-weight:700}
.promo .container{min-height:39px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding-block:6px}
.promo a{color:#fff;text-decoration:underline}
.promo .promo-support{opacity:.92;font-weight:600}

.site-header{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:60}
.admin-bar .site-header{top:32px}
.header-row{min-height:98px;display:grid;grid-template-columns:252px 1fr auto;align-items:center;gap:28px;padding-block:14px}
.site-header.is-compact .header-row{min-height:74px}
.site-logo img,.site-logo svg{width:244px;height:74px;object-fit:contain;object-position:left center;transition:height .16s ease}
.site-header.is-compact .site-logo img{height:56px}
.site-logo .site-title-text{font-family:var(--heading);font-size:26px;font-weight:700;color:var(--ink)}
.site-logo a{text-decoration:none}

.header-search{position:relative}
.header-search form{height:44px;border:2px solid var(--primary);border-radius:var(--btn-radius);display:grid;grid-template-columns:1fr auto;background:#fff;overflow:hidden;box-shadow:0 4px 14px rgba(15,81,50,.06)}
.header-search input[type="search"]{border:0;min-height:0;height:100%;border-radius:0;padding:0 20px;outline:none}
.header-search button{border:0;background:var(--primary);color:#fff;padding:0 20px;font-weight:800;border-radius:0;height:auto;min-height:0;font-size:var(--btn-fs)}
.header-search button:hover{background:var(--primary-dark)}
.search-suggest{position:absolute;left:0;right:0;top:calc(100% + 8px);background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-lg);padding:10px;z-index:70;max-height:60vh;overflow:auto}
.search-suggest[hidden]{display:none}
.search-suggest h4{font-family:var(--sans);font-size:11px;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted);margin:10px 12px 6px}
.search-suggest a,.search-suggest button.suggest-term{display:flex;gap:12px;align-items:center;width:100%;text-align:left;padding:9px 12px;border-radius:12px;color:var(--ink);background:none;border:0;font-weight:600;font-size:14px;min-height:0;justify-content:flex-start;cursor:pointer}
.search-suggest a:hover,.search-suggest a:focus,.search-suggest button.suggest-term:hover,.search-suggest button.suggest-term:focus{background:var(--accent-soft);text-decoration:none}
.search-suggest img{width:44px;height:44px;object-fit:contain;background:var(--surface-2);border-radius:10px;flex:0 0 44px}
.search-suggest .s-meta{display:block;font-weight:600;font-size:12px;color:var(--muted)}
.search-suggest .s-empty{padding:14px 12px;color:var(--muted);font-size:14px}

.header-actions{display:flex;justify-content:flex-end;align-items:center;gap:14px}
.header-action{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:800;color:var(--ink);padding:6px;border-radius:14px;background:none;border:0;cursor:pointer;text-decoration:none}
.header-action:hover{text-decoration:none;background:var(--surface-2)}
.action-icon{width:40px;height:40px;border-radius:14px;background:var(--accent-soft);display:flex;align-items:center;justify-content:center;font-size:19px;flex:0 0 40px;position:relative;color:var(--accent-ink)}
.header-action small{display:block;font-weight:600;color:var(--muted);font-size:12px}
.action-count{position:absolute;top:-6px;right:-6px;background:var(--primary);color:#fff;min-width:20px;height:20px;border-radius:999px;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;padding:0 5px}
.header-action-label{text-align:left;line-height:1.25}

.menu-toggle{display:none}

/* Department navigation */
.site-nav{border-top:1px solid var(--line-soft);background:var(--surface)}
.nav-row{min-height:55px;display:flex;align-items:center;gap:26px;font-weight:800;font-size:14px}
.nav-row > ul{list-style:none;display:flex;align-items:center;gap:26px;margin:0;padding:0}
.nav-row a{color:var(--ink)}
.nav-row a:hover{color:var(--primary-ink)}
.nav-row .menu-item-deals > a,.nav-row a.deal{color:#B42318}
.nav-spacer{margin-left:auto}
.delivery-note{color:var(--primary-ink);font-size:13px;font-weight:700;display:flex;align-items:center;gap:6px}

.departments-toggle{background:var(--primary);color:#fff;border-radius:var(--btn-radius);padding:0 var(--btn-px);border:0;font-weight:800;font-size:var(--btn-fs);display:inline-flex;align-items:center;gap:8px;cursor:pointer;height:var(--btn-h);min-height:var(--btn-h)}
.departments-toggle:hover{background:var(--primary-dark)}
.departments-toggle[aria-expanded="true"]{background:var(--primary-dark)}

.mega{position:absolute;left:0;right:0;background:var(--surface);border-top:1px solid var(--line);box-shadow:var(--shadow-lg);z-index:65;padding:0}
.mega[hidden]{display:none}
.mega-inner{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:18px 22px;padding:22px 0 24px;max-height:min(66vh,520px);overflow:auto;overscroll-behavior:contain}
.mega-col h3{font-family:var(--sans);font-size:13px;margin:0 0 7px;display:flex;align-items:center;gap:7px}
.mega-col h3 a{color:var(--ink)}
.mega-col ul{list-style:none;margin:0;padding:0}
.mega-col li{margin:0 0 3px}
.mega-col li a{font-size:13px;color:var(--muted);font-weight:600}
.mega-col li a:hover{color:var(--primary-ink)}
.mega-foot{border-top:1px solid var(--line);padding:12px 0 16px;display:flex;gap:20px;flex-wrap:wrap;font-size:13px;font-weight:800}

/* Mobile drawer */
.drawer{position:fixed;inset:0;z-index:200;display:none}
.drawer.is-open{display:block}
.drawer-backdrop{position:absolute;inset:0;background:rgba(12,23,17,.5)}
.drawer-panel{position:absolute;top:0;bottom:0;left:0;width:min(380px,88vw);background:var(--surface);overflow-y:auto;padding:20px;box-shadow:var(--shadow-lg)}
.drawer-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.drawer-close{background:var(--surface-2);border:0;border-radius:12px;width:42px;height:42px;font-size:20px;cursor:pointer;min-height:0;padding:0;color:var(--ink)}
.drawer nav ul{list-style:none;margin:0 0 18px;padding:0}
.drawer nav li{border-bottom:1px solid var(--line-soft)}
.drawer nav a{display:block;padding:13px 4px;font-weight:700;color:var(--ink)}
.drawer details summary{padding:13px 4px;font-weight:800;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center}
.drawer details summary::-webkit-details-marker{display:none}
.drawer details ul{margin:0 0 8px;padding-left:12px}
.drawer details a{font-weight:600;color:var(--muted);padding:9px 4px}
.drawer-actions{display:grid;gap:10px;margin-top:10px}

/* =========================================================
   5. Hero + service strip
   ========================================================= */
.hero-wrap{padding:30px 0 16px}
.hero{min-height:530px;border-radius:34px;overflow:hidden;position:relative;background-size:cover;background-position:center 45%;box-shadow:var(--shadow-lg);display:flex;align-items:center}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,16,10,.94) 0%,rgba(4,16,10,.86) 42%,rgba(4,16,10,.50) 72%,rgba(4,16,10,.30) 100%)}
.hero-content{position:relative;z-index:2;width:min(650px,100%);padding:78px 0 64px 68px;color:#fff}
.eyebrow{display:inline-flex;align-items:center;gap:10px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.3);padding:9px 14px;border-radius:999px;font-size:12px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase}
.hero h1{font-size:clamp(38px,5vw,68px);line-height:1.03;margin:22px 0 18px;letter-spacing:-2px;color:#fff}
.hero p{font-size:19px;line-height:1.6;max-width:570px;color:rgba(255,255,255,.92)}
.hero-buttons{display:flex;gap:14px;margin-top:30px;flex-wrap:wrap}
.hero-note{position:absolute;right:34px;bottom:30px;background:#fff;border-radius:22px;padding:18px 22px;display:flex;gap:16px;align-items:center;box-shadow:0 15px 40px rgba(0,0,0,.18);z-index:2}
.hero-note strong{display:block;color:var(--ink);font-size:15px}
.hero-note span{color:var(--muted);font-size:12px}
.hero-note-icon{width:46px;height:46px;border-radius:15px;background:var(--accent-soft);display:flex;align-items:center;justify-content:center;font-size:22px}

.service-strip{display:grid;grid-template-columns:repeat(4,1fr);background:var(--surface);border-radius:22px;margin-top:22px;box-shadow:0 10px 35px rgba(27,42,34,.08);overflow:hidden;list-style:none;padding:0}
.service{padding:23px 25px;display:flex;gap:13px;align-items:center;border-right:1px solid var(--line)}
.service:last-child{border-right:0}
.service i{font-style:normal;font-size:24px;line-height:1}
.service strong{display:block;font-size:14px}
.service span{font-size:12px;color:var(--muted)}

/* =========================================================
   6. Sections
   ========================================================= */
.section{padding:74px 0 12px}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px;flex-wrap:wrap}
.kicker{color:var(--primary-ink);font-weight:900;font-size:12px;letter-spacing:1.8px;text-transform:uppercase;font-family:var(--sans)}
.section h2{font-size:clamp(30px,3.4vw,44px);letter-spacing:-1px;margin:8px 0 0;line-height:1.05}
.section-head p{margin:0;color:var(--muted);max-width:430px}
.view-all{font-weight:900;color:var(--primary-ink)}

.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;list-style:none;padding:0;margin:0}
.category-card{background:var(--surface);border-radius:var(--radius);padding:27px;min-height:212px;border:1px solid var(--line-soft);box-shadow:var(--shadow);transition:transform .18s ease,box-shadow .18s ease;display:flex;flex-direction:column}
.category-card:hover,.category-card:focus-within{transform:translateY(-4px);box-shadow:0 16px 34px rgba(22,36,29,.10)}
.cat-icon{width:58px;height:58px;border-radius:18px;background:var(--accent-soft);display:flex;align-items:center;justify-content:center;font-size:30px}
.category-card h3{font-family:var(--sans);font-size:18px;margin:20px 0 5px}
.category-card h3 a{color:var(--ink)}
.category-card p{font-size:13px;color:var(--muted);min-height:38px;margin-bottom:12px}
.category-card .cat-link{font-size:13px;font-weight:900;color:var(--primary-ink);margin-top:auto}

.deal-banner{margin-top:66px;background:var(--primary);border-radius:var(--radius-lg);min-height:250px;color:#fff;display:grid;grid-template-columns:1.25fr .75fr;overflow:hidden;position:relative}
.deal-copy{padding:48px 55px;position:relative;z-index:2}
.deal-copy .kicker{color:var(--accent-soft)}
.deal-copy h2{font-size:clamp(28px,3vw,40px);margin:6px 0 10px;color:#fff}
.deal-copy p{max-width:590px;color:rgba(255,255,255,.88)}
.deal-price{font-size:17px;font-weight:800;margin-top:18px}
.deal-price strong{font-size:42px;color:var(--accent-soft)}
.deal-visual{background:linear-gradient(135deg,var(--accent-soft),#fff);display:flex;align-items:center;justify-content:center;position:relative;padding:24px}
.deal-visual img{height:230px;width:260px;object-fit:contain;filter:drop-shadow(0 18px 18px rgba(0,0,0,.2));transform:rotate(5deg)}
.deal-bubble{position:absolute;top:25px;right:26px;background:var(--accent);color:#16120c;width:92px;height:92px;border-radius:50%;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:900;line-height:1.05;transform:rotate(8deg);font-size:14px}

.brands-block{margin-top:66px;background:var(--surface);border-radius:27px;padding:36px}
.brands-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px;flex-wrap:wrap}
.brands-head h2{font-size:29px;margin:0}
.brand-row{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;list-style:none;padding:0;margin:0}
.brand-pill{min-height:67px;border:1px solid rgba(25,42,33,.09);background:#fff;border-radius:16px;display:flex;align-items:center;justify-content:center;font-weight:900;color:#303A34;box-shadow:0 4px 14px rgba(0,0,0,.03);text-align:center;padding:10px 12px;font-size:14px}
.brand-pill:hover{border-color:var(--primary);color:var(--primary-ink);text-decoration:none}

.story{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:stretch;margin-top:66px}
.story-photo{min-height:430px;border-radius:var(--radius-lg);background-size:cover;background-position:center;position:relative}
.story-photo::after{content:"";position:absolute;inset:0;border-radius:var(--radius-lg);background:linear-gradient(0deg,rgba(8,30,20,.25),rgba(8,30,20,.05))}
.story-copy{border-radius:var(--radius-lg);background:var(--surface);padding:52px;display:flex;flex-direction:column;justify-content:center}
.story-copy h2{font-size:clamp(28px,3vw,43px);line-height:1.08;margin:8px 0 16px}
.story-copy p{color:var(--muted);font-size:16px;line-height:1.7}
.story-list{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:20px 0 28px;list-style:none;padding:0}
.story-list li{font-weight:800;font-size:13px;display:flex;gap:8px;align-items:flex-start}
.story-list li::before{content:"✓";color:var(--accent-ink);font-weight:900}

.newsletter{margin:70px auto 0;background:linear-gradient(120deg,var(--primary-dark),var(--primary));border-radius:var(--radius-lg);padding:46px 52px;color:#fff;display:grid;grid-template-columns:1fr 530px;gap:40px;align-items:center}
.newsletter h2{font-size:clamp(26px,3vw,38px);margin:0 0 7px;color:#fff}
.newsletter p{margin:0;color:rgba(255,255,255,.86)}
.subscribe{min-height:60px;background:#fff;border-radius:17px;display:grid;grid-template-columns:1fr auto;padding:5px;gap:5px}
.subscribe input{border:0;outline:0;padding:0 16px;min-height:50px;border-radius:13px}
.subscribe button{border:0;border-radius:13px;background:var(--primary);color:#fff;padding:0 24px;font-weight:900;min-height:50px}
.subscribe button:hover{background:var(--primary-dark);color:#fff}

/* On a terracotta surface a terracotta button would disappear, so the
   primary action inverts to cream-on-terracotta rather than changing hue. */
.btn.on-primary,a.btn.on-primary,.woocommerce a.button.on-primary{
  background:var(--bg);color:var(--primary-dark);border-color:var(--bg);
}
.btn.on-primary:hover,a.btn.on-primary:hover{background:#fff;color:var(--primary-dark)}
.form-note{font-size:12px;color:rgba(255,255,255,.78);margin:10px 0 0}
.form-message{margin-top:10px;font-size:14px;font-weight:700}
.form-message.is-error{color:#FFD9D5}

/* =========================================================
   7. Footer
   ========================================================= */
.site-footer{margin-top:80px;background:var(--footer);color:#fff;padding:62px 0 30px}
.footer-grid{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:40px}
.footer-brand img{width:210px;height:60px;object-fit:contain;object-position:left center;border-radius:12px}
.site-footer p{color:var(--footer-ink);font-size:13px;line-height:1.7}
.site-footer h2,.site-footer h3{font-family:var(--sans);margin:8px 0 18px;font-size:14px;color:#fff}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li a,.site-footer a{display:block;color:var(--footer-ink);font-size:13px;margin:10px 0}
.site-footer a:hover{color:#fff}
.site-footer .footer-brand a{display:inline}
.legal{border-top:1px solid rgba(255,255,255,.12);margin-top:44px;padding-top:24px;display:flex;justify-content:space-between;gap:20px;color:#8E9B92;font-size:12px;flex-wrap:wrap}
.legal a{color:#8E9B92;display:inline;margin:0 10px 0 0}

/* =========================================================
   8. Page shell / content
   ========================================================= */
.page-hero{background:var(--surface);border-bottom:1px solid var(--line)}
.page-hero .container{padding:34px 0 30px}
.page-hero h1{font-size:clamp(30px,3.6vw,46px);margin:6px 0 8px}
.page-hero p.lede{color:var(--muted);max-width:720px;font-size:17px;margin:0}
.breadcrumbs{font-size:13px;color:var(--muted);margin:0 0 6px}
.breadcrumbs a{color:var(--muted);font-weight:600}
.breadcrumbs a:hover{color:var(--primary-ink)}
.breadcrumbs .sep{margin:0 8px;opacity:.6}

.site-main{display:block}
.content-area{padding:44px 0 20px}
.entry-content{max-width:820px}
.entry-content.is-wide{max-width:none}
.entry-content h2{font-size:30px;margin-top:1.8em}
.entry-content h3{font-family:var(--sans);font-size:20px;margin-top:1.6em}
.entry-content ul li,.entry-content ol li{margin-bottom:.5em}
.entry-content a{text-decoration:underline}
/* UI controls inside prose must not inherit the prose underline. A long
   :not() chain would out-specify every later rule, so scope it instead. */
.entry-content .woocommerce a,
.entry-content .button,
.entry-content .btn,
.entry-content .brand-pill,
.entry-content .cat-link,
.entry-content .view-all,
.entry-content .category-chips a,
.entry-content .product-card a,
.entry-content .brand-alpha a,
.entry-content .sitemap-cols h3 a,
.entry-content .faq-item summary{text-decoration:none}
.entry-content .woocommerce p a:hover,
.entry-content .woocommerce li a:hover{text-decoration:underline}
.card-panel{background:var(--surface);border-radius:var(--radius);padding:30px;box-shadow:var(--shadow);border:1px solid var(--line-soft);margin:0 0 20px}
.panel-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin:26px 0}
.faq-item{background:var(--surface);border:1px solid var(--line-soft);border-radius:18px;margin-bottom:12px;overflow:hidden}
.faq-item summary{padding:18px 22px;font-weight:800;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:center}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-size:22px;color:var(--primary-ink);flex:0 0 auto}
.faq-item[open] summary::after{content:"–"}
.faq-item .faq-body{padding:0 22px 20px;color:var(--muted)}
.notice-box{background:var(--accent-soft);border-left:4px solid var(--accent-ink);border-radius:14px;padding:18px 22px;margin:22px 0;color:#33402C}
.notice-box strong{color:#2B3625}

/* =========================================================
   9. WooCommerce — product cards and grids
   ========================================================= */
.product-grid,ul.products{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;list-style:none;padding:0;margin:0 0 30px}
ul.products::before,ul.products::after{display:none}
ul.products li.product{width:auto!important;float:none!important;margin:0!important;clear:none!important}
.product-card{background:var(--surface);border-radius:var(--radius);overflow:hidden;border:1px solid var(--line-soft);box-shadow:var(--shadow);display:flex;flex-direction:column;height:100%;position:relative;transition:transform .18s ease,box-shadow .18s ease}
.product-card:hover,.product-card:focus-within{transform:translateY(-3px);box-shadow:0 16px 34px rgba(22,36,29,.10)}
.product-media{height:212px;background:#fff;position:relative;padding:14px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--line-soft)}
.product-media a{display:flex;width:100%;height:100%;align-items:center;justify-content:center}
.product-media img{width:100%;height:100%;object-fit:contain;border-radius:12px}
.badge-stack{position:absolute;left:10px;top:10px;z-index:2;display:flex;flex-wrap:wrap;gap:5px;align-items:flex-start;max-width:calc(100% - 62px)}
.sale-badge,.mini-badge,.oos-badge{border-radius:6px;padding:3px 7px;color:#fff;font-size:9.5px;font-weight:900;letter-spacing:.5px;text-transform:uppercase;line-height:1.4}
.sale-badge{background:var(--sale)}
.mini-badge{background:var(--primary)}
.oos-badge{background:#5B534F}
.wishlist-toggle{position:absolute;right:10px;top:10px;width:var(--btn-h-icon);height:var(--btn-h-icon);border:1px solid var(--line);background:#fff;border-radius:var(--btn-radius);font-size:16px;box-shadow:0 2px 8px rgba(0,0,0,.06);z-index:3;display:flex;align-items:center;justify-content:center;cursor:pointer;min-height:0;padding:0;color:var(--primary-ink)}
.wishlist-toggle[aria-pressed="true"]{background:var(--primary);color:#fff;border-color:var(--primary)}
.quickview-btn{position:absolute;left:50%;transform:translateX(-50%);bottom:10px;z-index:3;opacity:0;background:#fff;color:var(--ink);border:1px solid var(--line);height:32px;min-height:32px;padding:0 12px;font-size:12px;border-radius:var(--btn-radius);transition:opacity .16s ease;box-shadow:0 2px 10px rgba(0,0,0,.10)}
.product-card:hover .quickview-btn,.quickview-btn:focus{opacity:1}
.product-meta{padding:13px 14px 14px;display:flex;flex-direction:column;flex:1;gap:2px}
.product-brand{font-size:10.5px;color:var(--primary-ink);font-weight:900;letter-spacing:.9px;text-transform:uppercase;margin:0;line-height:1.2}
.product-brand a{color:inherit}
.product-card h2,.product-card h3,.product-card .woocommerce-loop-product__title{font-family:var(--sans);font-size:14px;font-weight:700;line-height:1.32;min-height:37px;margin:3px 0 4px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;padding:0;letter-spacing:0}
.product-card h3 a,.product-card h2 a{color:var(--ink)}
.rating-line{font-size:11.5px;color:var(--star);letter-spacing:.4px;display:flex;align-items:center;gap:5px;margin:0}
.rating-line .count{color:var(--muted);letter-spacing:0;font-weight:600}
.stock-line{font-size:11.5px;font-weight:700;margin:0;color:var(--accent-ink)}
.stock-line.is-low{color:#8A5A00}
.stock-line.is-out{color:#8A3B33}
.card-meta-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:11.5px;margin:0 0 6px}
.card-meta-row .dot{color:var(--line);}
.product-bottom{display:flex;align-items:baseline;justify-content:flex-start;gap:8px;margin-top:auto;padding-top:8px}
.card-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:9px}
.card-actions .button{width:100%;padding:0 8px;font-size:13px}
.price{font-size:18px;font-weight:900;color:var(--ink);font-family:var(--sans);line-height:1.1}
.price del{font-size:12px;color:var(--muted);margin-left:5px;font-weight:600}
.price ins{text-decoration:none}
.price .old-price{font-size:12px;color:var(--muted);text-decoration:line-through;margin-left:5px;font-weight:600}
.add-to-cart-btn{width:44px;height:44px;min-height:44px;border-radius:13px;border:0;background:var(--primary);color:#fff;font-size:22px;display:flex;align-items:center;justify-content:center;padding:0;flex:0 0 44px}
.add-to-cart-btn:hover{background:var(--primary-dark)}
.add-to-cart-btn.loading{opacity:.6}
.add-to-cart-btn.added::after{content:"✓"}
.product-card .unit-note{font-size:11px;color:var(--muted);margin-top:2px}

/* Shop toolbar + filters */
.shop-layout{display:grid;grid-template-columns:274px 1fr;gap:30px;align-items:start;padding-top:30px}
.shop-filters{background:var(--surface);border-radius:var(--radius);padding:24px;border:1px solid var(--line-soft);box-shadow:var(--shadow);position:sticky;top:180px}
.shop-filters h2{font-family:var(--sans);font-size:16px;margin:0 0 14px}
.filter-group{border-top:1px solid var(--line-soft);padding:16px 0 4px}
.filter-group:first-of-type{border-top:0;padding-top:0}
.filter-group > h3{font-family:var(--sans);font-size:13px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin:0 0 10px}
.filter-group ul{list-style:none;margin:0;padding:0;max-height:250px;overflow:auto}
.filter-group li{margin:0 0 4px}
.filter-check{display:flex;gap:9px;align-items:center;font-weight:600;font-size:14px;margin:0;cursor:pointer;padding:4px 2px;min-height:32px}
.filter-check input{width:18px;height:18px;min-height:0;flex:0 0 18px;accent-color:var(--primary)}
.filter-check .c{margin-left:auto;color:var(--muted);font-size:12px}
.price-inputs{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.price-inputs input{min-height:44px}
.filter-actions{display:grid;gap:8px;margin-top:16px}
.active-filters{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 16px;padding:0;list-style:none}
.chip{display:inline-flex;align-items:center;gap:8px;background:var(--accent-soft);color:#2F3B29;border-radius:999px;padding:7px 14px;font-size:13px;font-weight:700;border:1px solid rgba(79,106,70,.25)}
.chip a,.chip button{color:#2F3B29;font-weight:900;background:none;border:0;padding:0;min-height:0;cursor:pointer}
.chip.is-clear{background:#fff;border-color:var(--line)}

.shop-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line-soft);border-radius:18px;padding:14px 20px;margin-bottom:20px}
.woocommerce-result-count,.woocommerce .woocommerce-result-count{margin:0;color:var(--muted);font-size:14px;float:none}
.woocommerce-ordering,.woocommerce .woocommerce-ordering{margin:0;display:flex;align-items:center;gap:10px;float:none}
.woocommerce-ordering select{min-width:220px;min-height:44px}
.shop-toolbar button.filter-drawer-toggle{display:none}
.category-chips{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 22px;padding:0;list-style:none}
.category-chips a{display:inline-flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:9px 16px;font-size:13px;font-weight:800;color:var(--ink)}
.category-chips a:hover,.category-chips a[aria-current="page"]{background:var(--primary);color:#fff;border-color:var(--primary);text-decoration:none}

.woocommerce-pagination ul{display:flex;gap:8px;list-style:none;padding:0;margin:30px 0 0;justify-content:center;border:0}
.woocommerce-pagination li{border:0!important;margin:0!important}
.woocommerce-pagination a,.woocommerce-pagination span{display:flex;align-items:center;justify-content:center;min-width:46px;height:46px;border-radius:14px;background:var(--surface);border:1px solid var(--line);font-weight:800;color:var(--ink);padding:0 12px}
.woocommerce-pagination .current{background:var(--primary);color:#fff;border-color:var(--primary)}

.empty-state{background:var(--surface);border:1px dashed var(--line);border-radius:var(--radius);padding:56px 34px;text-align:center;box-shadow:var(--shadow)}
.empty-state .empty-icon{font-size:44px;margin-bottom:12px}
.empty-state h2{font-size:26px;margin-bottom:8px}
.empty-state p{color:var(--muted);max-width:520px;margin-inline:auto}
.empty-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:22px}

/* Single product */
.single-product-wrap{padding-top:30px}
.product-main{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:44px;align-items:start}
.woocommerce div.product div.images,.woocommerce div.product div.summary{width:auto!important;float:none!important;margin:0!important}
.hs-gallery{background:var(--surface);border-radius:var(--radius);padding:22px;border:1px solid var(--line-soft);box-shadow:var(--shadow)}
.hs-gallery-main{background:var(--surface-2);border-radius:18px;height:480px;display:flex;align-items:center;justify-content:center;padding:24px;position:relative;overflow:hidden}
.hs-gallery-main img{max-height:100%;width:auto;max-width:100%;object-fit:contain;transition:transform .25s ease}
.hs-gallery-main.is-zoom img{transform:scale(1.6)}
.hs-gallery-zoom{position:absolute;right:14px;bottom:14px;background:#fff;border:1px solid var(--line);border-radius:12px;min-height:40px;padding:8px 14px;font-size:13px;font-weight:800;cursor:pointer;color:var(--ink)}
.hs-thumbs{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap;list-style:none;padding:0}
.hs-thumb{width:84px;height:84px;border-radius:14px;border:2px solid var(--line);background:var(--surface-2);padding:6px;cursor:pointer;min-height:0;display:flex;align-items:center;justify-content:center}
.hs-thumb[aria-current="true"]{border-color:var(--primary)}
.hs-thumb img{max-width:100%;max-height:100%;object-fit:contain}
.mock-art-note{font-size:12px;color:var(--muted);margin-top:12px}

.summary .product-brand{font-size:12px}
.woocommerce div.product .product_title{font-size:clamp(26px,3vw,38px);margin:6px 0 10px}
.woocommerce div.product p.price,.woocommerce div.product span.price{font-size:32px;font-weight:900;color:var(--ink);font-family:var(--sans);margin:14px 0}
.woocommerce div.product p.price del{font-size:18px;color:var(--muted);font-weight:600}
.woocommerce div.product p.price ins{text-decoration:none}
.save-tag{display:inline-block;background:var(--sale);color:#fff;border-radius:999px;padding:5px 12px;font-size:12px;font-weight:900;margin-left:10px;vertical-align:middle}
.woocommerce div.product form.cart{margin:22px 0;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.woocommerce .quantity{display:flex;align-items:center;border:1px solid var(--line);border-radius:var(--btn-radius);overflow:hidden;background:#fff;height:var(--btn-h)}
.woocommerce .quantity .qty{width:52px;text-align:center;border:0;height:var(--btn-h);min-height:var(--btn-h);border-radius:0;padding:0;font-size:14px;font-weight:700}
.qty-btn{width:36px;height:var(--btn-h);border:0;background:var(--surface-2);font-size:17px;cursor:pointer;min-height:0;padding:0;color:var(--ink);flex:0 0 36px}
.qty-btn:hover{background:var(--accent-soft)}
.woocommerce div.product form.cart .button{flex:1;min-width:200px;min-height:52px}
.product-assurance{display:grid;gap:12px;margin:24px 0;padding:20px;background:var(--surface);border-radius:18px;border:1px solid var(--line-soft)}
.product-assurance div{display:flex;gap:12px;align-items:flex-start;font-size:14px}
.product-assurance i{font-style:normal;font-size:18px}
.product_meta{font-size:13px;color:var(--muted);border-top:1px solid var(--line-soft);padding-top:16px;margin-top:8px}
.product_meta > span{display:block;margin-bottom:6px}
.woocommerce-tabs{margin-top:56px}
.woocommerce-tabs ul.tabs{list-style:none;display:flex;gap:8px;padding:0;margin:0 0 20px;flex-wrap:wrap;border:0}
.woocommerce-tabs ul.tabs li{background:var(--surface);border:1px solid var(--line);border-radius:999px;margin:0;padding:0}
.woocommerce-tabs ul.tabs li a{display:block;padding:11px 22px;font-weight:800;color:var(--ink);font-size:14px}
.woocommerce-tabs ul.tabs li.active{background:var(--primary);border-color:var(--primary)}
.woocommerce-tabs ul.tabs li.active a{color:#fff}
.woocommerce-tabs .panel{background:var(--surface);border-radius:var(--radius);padding:30px;border:1px solid var(--line-soft)}
.woocommerce-tabs .panel h2{font-size:22px}
.sticky-atc{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--line);box-shadow:0 -8px 30px rgba(0,0,0,.10);padding:10px 16px;z-index:90;display:none;gap:12px;align-items:center}
.sticky-atc .sa-title{font-size:13px;font-weight:800;line-height:1.25;flex:1;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.sticky-atc .sa-price{font-weight:900}
.sticky-atc .button{min-height:46px}
.related.products,.upsells.products,.cross-sells{margin-top:60px}
.related.products > h2,.upsells.products > h2{font-size:30px;margin-bottom:20px}
.recently-viewed{margin-top:60px}

/* Cart / checkout / account */
.woocommerce-cart-form,.cart-collaterals,.woocommerce-checkout .col2-set,.woocommerce-checkout #order_review,
.woocommerce-account .woocommerce,.woocommerce-order-received .woocommerce{background:transparent}
.woocommerce table.shop_table{background:var(--surface);border:1px solid var(--line-soft);border-radius:var(--radius);border-collapse:separate;border-spacing:0;overflow:hidden}
.woocommerce table.shop_table th{background:var(--surface-2);font-size:13px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted)}
.woocommerce table.shop_table td,.woocommerce table.shop_table th{border-color:var(--line-soft)}
.woocommerce table.cart img{width:70px;border-radius:12px;background:var(--surface-2)}
.woocommerce .cart_totals,.woocommerce-checkout #order_review{background:var(--surface);border:1px solid var(--line-soft);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}
.woocommerce-checkout .col2-set .col-1,.woocommerce-checkout .col2-set .col-2{width:100%;float:none}
.checkout-steps{display:flex;gap:10px;list-style:none;padding:0;margin:0 0 26px;flex-wrap:wrap}
.checkout-steps li{display:flex;align-items:center;gap:9px;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:9px 18px;font-size:13px;font-weight:800;color:var(--muted)}
.checkout-steps li.is-current{background:var(--primary);border-color:var(--primary);color:#fff}
.checkout-steps li.is-done{background:var(--accent-soft);border-color:var(--accent);color:#33402C}
.woocommerce form .form-row{padding:0;margin:0 0 16px}
.woocommerce-checkout .form-row-first,.woocommerce-checkout .form-row-last{width:100%;float:none}
.woocommerce .woocommerce-info,.woocommerce .woocommerce-message,.woocommerce .woocommerce-error{background:var(--surface);border-top:3px solid var(--accent);border-radius:16px;box-shadow:var(--shadow);color:var(--ink);padding:16px 20px 16px 48px;margin-bottom:20px;list-style:none}
.woocommerce .woocommerce-error{border-top-color:var(--sale)}
.woocommerce .woocommerce-info::before,.woocommerce .woocommerce-message::before,.woocommerce .woocommerce-error::before{color:var(--accent-ink);top:18px;left:18px}
.woocommerce .woocommerce-error::before{color:var(--sale)}
.checkout-trust{display:flex;gap:18px;flex-wrap:wrap;margin-top:18px;font-size:13px;color:var(--muted)}
.woocommerce-form-coupon-toggle,.woocommerce-form-login-toggle{margin-bottom:16px}
.woocommerce-MyAccount-navigation ul{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.woocommerce-MyAccount-navigation a{display:block;padding:12px 16px;border-radius:13px;background:var(--surface);border:1px solid var(--line-soft);font-weight:700;color:var(--ink)}
.woocommerce-MyAccount-navigation li.is-active a{background:var(--primary);color:#fff;border-color:var(--primary)}
.woocommerce-MyAccount-content{background:var(--surface);border:1px solid var(--line-soft);border-radius:var(--radius);padding:28px}
.woocommerce-account .woocommerce::after{content:"";display:table;clear:both}
.woocommerce-MyAccount-navigation{width:26%;float:left}
.woocommerce-MyAccount-content{width:70%;float:right}

/* Mini cart drawer */
.cart-drawer{position:fixed;inset:0;z-index:210;display:none}
.cart-drawer.is-open{display:block}
.cart-drawer .drawer-backdrop{position:absolute;inset:0;background:rgba(12,23,17,.5)}
.cart-panel{position:absolute;top:0;bottom:0;right:0;width:min(420px,92vw);background:#fff;display:flex;flex-direction:column;box-shadow:var(--shadow-lg)}
.cart-panel-head{padding:20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}
.cart-panel-head h2{margin:0;font-size:20px}
.cart-panel-body{padding:16px 20px;overflow-y:auto;flex:1}
.cart-panel-foot{padding:18px 20px;border-top:1px solid var(--line);display:grid;gap:10px;background:var(--surface-2)}
.cart-panel .woocommerce-mini-cart{list-style:none;margin:0;padding:0}
.cart-panel .woocommerce-mini-cart-item{position:relative;display:flex;flex-wrap:wrap;gap:4px 12px;padding:14px 34px 14px 0;border-bottom:1px solid var(--line-soft);align-items:center;line-height:1.4}
.cart-panel .woocommerce-mini-cart-item > a:not(.remove){display:flex;align-items:center;gap:12px;flex:1;min-width:0;font-weight:700;color:var(--ink);font-size:14px}
.cart-panel .woocommerce-mini-cart-item img{width:60px;height:60px;flex:0 0 60px;object-fit:contain;background:var(--surface-2);border-radius:12px;padding:4px}
.cart-panel .woocommerce-mini-cart-item a.remove{position:absolute;right:0;top:18px;width:26px;height:26px;line-height:24px;text-align:center;border-radius:50%;background:var(--surface-2)}
.cart-panel .woocommerce-mini-cart-item .quantity{flex-basis:100%;padding-left:72px}
.cart-panel .woocommerce-mini-cart__total{display:flex;justify-content:space-between;font-size:16px;font-weight:800;padding:16px 0 0;margin:0;border-top:1px solid var(--line)}
.cart-panel .woocommerce-mini-cart__buttons{display:none}
.cart-panel .woocommerce-mini-cart-item a.remove{color:var(--sale);font-weight:900;text-decoration:none}
.cart-panel .quantity{border:0;font-size:13px;color:var(--muted)}
.free-ship-bar{background:var(--accent-soft);border-radius:14px;padding:12px 14px;font-size:13px;font-weight:700;color:#33402C;margin-bottom:14px}
.free-ship-track{height:8px;border-radius:99px;background:#fff;margin-top:8px;overflow:hidden}
.free-ship-fill{height:100%;background:var(--accent-ink);border-radius:99px}

/* Quick view modal */
.hs-modal{position:fixed;inset:0;z-index:220;display:none;align-items:center;justify-content:center;padding:20px}
.hs-modal.is-open{display:flex}
.hs-modal .drawer-backdrop{position:absolute;inset:0;background:rgba(12,23,17,.55)}
.hs-modal-panel{position:relative;background:#fff;border-radius:var(--radius);max-width:920px;width:100%;max-height:88vh;overflow:auto;padding:28px;box-shadow:var(--shadow-lg)}
.hs-modal-close{position:absolute;right:16px;top:16px;width:42px;height:42px;border-radius:12px;border:1px solid var(--line);background:#fff;font-size:20px;cursor:pointer;min-height:0;padding:0;color:var(--ink)}
.qv-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.qv-media{background:var(--surface-2);border-radius:18px;height:340px;display:flex;align-items:center;justify-content:center;padding:20px}
.qv-media img{max-height:100%;max-width:100%;object-fit:contain}

/* Wishlist page */
.wishlist-grid{margin-top:20px}

/* Sitemap page */
.sitemap-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:26px}
.sitemap-cols ul{list-style:none;padding:0}
.sitemap-cols li{margin-bottom:8px}

/* Brand index */
.brand-index{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px;list-style:none;padding:0;margin:0}
.brand-alpha{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 24px;padding:0;list-style:none}
.brand-alpha a{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:12px;background:var(--surface);border:1px solid var(--line);font-weight:800;color:var(--ink)}
.brand-alpha a:hover{background:var(--primary);color:#fff;text-decoration:none}

/* Contact form */
.contact-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:30px;align-items:start}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-grid .full{grid-column:1/-1}
.field-error{color:#A3231A;font-size:13px;font-weight:700;margin-top:5px;display:block}
input[aria-invalid="true"],textarea[aria-invalid="true"],select[aria-invalid="true"]{border-color:#A3231A;border-width:2px}

/* Utilities */
.mt-0{margin-top:0}
.text-muted{color:var(--muted)}
.is-hidden{display:none!important}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}

/* =========================================================
   10. Responsive
   ========================================================= */
/* With the filter sidebar the results column is ~936px, so three columns
   keep the cards readable at every desktop width. Bounded with min-width so
   it cannot out-specify the two-column mobile rule below. */
@media(min-width:901px){
  .shop-results ul.products,.shop-results .product-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:1100px){
  .product-grid,ul.products{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:1024px){
  .footer-grid{grid-template-columns:repeat(3,1fr)}
  .header-row{grid-template-columns:auto 1fr auto;gap:16px}
  .site-logo img{width:190px;height:58px}
  .shop-layout{grid-template-columns:1fr}
  .shop-filters{position:static;display:none}
  .shop-filters.is-open{display:block}
  .shop-toolbar button.filter-drawer-toggle{display:inline-flex}
  .product-main{grid-template-columns:1fr;gap:28px}
  .hs-gallery-main{height:380px}
  .newsletter{grid-template-columns:1fr;padding:36px 28px}
  .story{grid-template-columns:1fr}
  .story-photo{min-height:280px}
  .contact-grid{grid-template-columns:1fr}
  .woocommerce-MyAccount-navigation,.woocommerce-MyAccount-content{width:100%;float:none}
  .woocommerce-MyAccount-navigation{margin-bottom:20px}
}
@media(max-width:900px){
  .container{width:min(var(--container),calc(100% - 32px))}
  .header-row{grid-template-columns:auto 1fr auto;min-height:0;padding:14px 0;row-gap:12px}
  .header-search{grid-column:1/-1;grid-row:2}
  .site-nav{display:none}
  .menu-toggle{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:14px;background:var(--accent-soft);border:0;font-size:20px;cursor:pointer;min-height:0;padding:0;color:var(--accent-ink)}
  .header-action .header-action-label{display:none}
  .hero{min-height:0}
  .hero-content{padding:48px 28px}
  .hero-note{display:none}
  .service-strip,.category-grid,.product-grid,ul.products{grid-template-columns:repeat(2,1fr)}
  .service{border-right:0;border-bottom:1px solid var(--line)}
  .deal-banner{grid-template-columns:1fr}
  .deal-copy{padding:34px 28px}
  .deal-visual{padding:30px 0 40px}
  .deal-bubble{width:76px;height:76px;font-size:12px;top:14px;right:14px}
  .footer-grid{grid-template-columns:1fr 1fr}
  .brand-row{grid-template-columns:repeat(2,1fr)}
  .mega-inner{grid-template-columns:repeat(2,1fr)}
  .story-copy{padding:32px 26px}
  .section{padding:54px 0 12px}
  .form-grid{grid-template-columns:1fr}
  .grid-2,.grid-3{grid-template-columns:1fr}
  .qv-grid{grid-template-columns:1fr}
  .single-product .sticky-atc{display:flex}
  .single-product .site-footer{padding-bottom:90px}
  .woocommerce-tabs .panel{padding:22px}
}
@media(max-width:560px){
  .product-media{height:210px;padding:14px}
  .product-card h3,.product-card h2{font-size:14px}
  .price{font-size:18px}
  .legal{flex-direction:column;gap:8px}
  .footer-grid{grid-template-columns:1fr}
  .hs-gallery-main{height:300px}
  .shop-toolbar{flex-direction:column;align-items:stretch}
  .woocommerce-ordering select{width:100%}
  .promo .container{justify-content:center;text-align:center;font-size:12px}
  .promo .promo-support{display:none}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .category-card:hover,.product-card:hover{transform:none}
}

@media print{
  .site-header,.site-footer,.promo,.sticky-atc,.cart-drawer,.drawer{display:none!important}
}

/* =========================================================
   11. WooCommerce specificity overrides
   WooCommerce ships its own stylesheet with deep selectors.
   These rules re-assert the Warm Neighborhood design system
   without resorting to blanket !important declarations.
   ========================================================= */
.woocommerce ul.products,
.woocommerce-page ul.products{margin:0 0 30px;padding:0}
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product{width:auto;float:none;margin:0;padding:0;text-align:left}
.woocommerce ul.products li.product a img,
.woocommerce-page ul.products li.product a img{margin:0;box-shadow:none;width:100%;height:100%;object-fit:contain}
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-page ul.products li.product .woocommerce-loop-product__title{font-family:var(--sans);font-size:15px;line-height:1.35;padding:0;margin:7px 0 8px;color:var(--ink)}
.woocommerce ul.products li.product .price,
.woocommerce-page ul.products li.product .price,
.woocommerce ul.products li.product span.price{color:var(--ink);font-size:20px;font-weight:900;font-family:var(--sans);display:block;margin:0}
.woocommerce ul.products li.product .price del,
.woocommerce ul.products li.product .price ins{display:inline}
.woocommerce ul.products li.product .price del{color:var(--muted);font-size:12px;font-weight:600;opacity:1}
.woocommerce ul.products li.product .price ins{text-decoration:none;font-weight:900;background:none;color:var(--ink)}
.woocommerce ul.products li.product .button{margin:0}
.woocommerce ul.products li.product .onsale,
.woocommerce span.onsale{display:none}

.woocommerce div.product .woocommerce-product-rating{margin-bottom:14px}
.woocommerce .star-rating{color:var(--star)}
.woocommerce div.product p.price,
.woocommerce div.product span.price{color:var(--ink)}
.woocommerce div.product p.price del{color:var(--muted)}
.woocommerce div.product p.price ins{background:none;color:var(--ink)}
.woocommerce div.product form.cart div.quantity{float:none;margin:0}
.woocommerce div.product .woocommerce-tabs ul.tabs::before{display:none}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after{display:none}
.woocommerce div.product .woocommerce-tabs ul.tabs li{border-radius:999px;background:var(--surface)}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{background:var(--primary);border-color:var(--primary)}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{color:#fff}

.woocommerce nav.woocommerce-pagination ul,
.woocommerce nav.woocommerce-pagination ul li{border:0}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span{background:var(--surface);border:1px solid var(--line);border-radius:14px;color:var(--ink);padding:0 12px;min-width:46px;height:46px;display:flex;align-items:center;justify-content:center;font-weight:800}
.woocommerce nav.woocommerce-pagination ul li span.current{background:var(--primary);color:#fff;border-color:var(--primary)}

.woocommerce table.shop_table_responsive tr td::before,
.woocommerce-page table.shop_table_responsive tr td::before{font-weight:800}
.woocommerce #content table.cart td.actions .coupon .input-text,
.woocommerce table.cart td.actions .coupon .input-text{width:200px;min-height:48px;border-radius:13px;border:1px solid var(--line);padding:11px 15px}
.woocommerce .cart-collaterals .cart_totals,
.woocommerce-page .cart-collaterals .cart_totals{width:100%;float:none}
.woocommerce .cart-collaterals .cross-sells,
.woocommerce-page .cart-collaterals .cross-sells{width:100%;float:none}
.woocommerce-cart .cart-collaterals{display:grid;grid-template-columns:1fr;gap:26px}
.woocommerce form .form-row label{font-weight:700}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select{min-height:48px;border:1px solid var(--line);border-radius:13px;padding:11px 15px;background:#fff}
.woocommerce form.checkout_coupon,
.woocommerce form.login,
.woocommerce form.register{border:1px solid var(--line-soft);border-radius:var(--radius);padding:24px;background:var(--surface)}
.woocommerce-checkout #payment{background:transparent}
.woocommerce-checkout #payment ul.payment_methods{border-bottom:1px solid var(--line);padding:0 0 16px}
.woocommerce-checkout #payment div.form-row{padding:16px 0 0}
.woocommerce-checkout #payment div.payment_box{background:var(--accent-soft);color:#2F3B29;border-radius:14px}
.woocommerce-checkout #payment div.payment_box::before{border-bottom-color:var(--accent-soft)}
.woocommerce-info,.woocommerce-message{border-top-color:var(--accent)}

.woocommerce .woocommerce-breadcrumb{display:none}
.woocommerce .products .star-rating{display:none}

/* Variant buttons need to out-specify WooCommerce's own .button rules. */
.woocommerce .btn-outline,.woocommerce a.button.btn-outline,.woocommerce button.button.btn-outline,
body .btn-outline{background:transparent;border-color:var(--primary);color:var(--primary-ink)}
.woocommerce .btn-outline:hover,.woocommerce a.button.btn-outline:hover,.woocommerce button.button.btn-outline:hover,
body .btn-outline:hover{background:var(--primary);color:#fff}
.woocommerce .btn-ghost,body .btn-ghost{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.62);color:#fff}
.woocommerce .btn-ghost:hover,body .btn-ghost:hover{background:rgba(255,255,255,.22);color:#fff}
.woocommerce .btn-primary,.woocommerce a.button.btn-primary,.woocommerce button.button.btn-primary,
body .btn-primary{background:var(--primary);color:#fff}
.woocommerce .btn-primary:hover,body .btn-primary:hover{background:var(--primary-dark);color:#fff}
.woocommerce .btn-sm,body .btn-sm{padding:0 12px}
.btn-block{width:100%}
.btn-icon{width:var(--btn-h-icon);padding:0;flex:0 0 var(--btn-h-icon)}

/* Our own stock line replaces WooCommerce's duplicate one in the summary. */
.woocommerce div.product .summary > p.stock,
.woocommerce div.product .summary .stock.in-stock,
.woocommerce div.product .summary .stock.out-of-stock{display:none}

/* Add-to-cart icon button must stay square inside the product card. */
.woocommerce .product-card .add-to-cart-btn,
body .add-to-cart-btn{width:44px;min-width:44px;padding:0;background:var(--primary);color:#fff}
.woocommerce .product-card .add-to-cart-btn:hover,body .add-to-cart-btn:hover{background:var(--primary-dark)}
body .wishlist-toggle{background:#fff;color:var(--primary-ink);padding:0;min-height:0}
body .wishlist-toggle[aria-pressed="true"]{background:var(--primary);color:#fff}

/* WooCommerce's clearfix pseudo-elements become stray grid items and push the
   first product into the second column. Neutralise them on our grid containers. */
.woocommerce ul.products::before,.woocommerce ul.products::after,
.woocommerce-page ul.products::before,.woocommerce-page ul.products::after,
.woocommerce .products ul::before,.woocommerce .products ul::after,
body ul.products::before,body ul.products::after,
.woocommerce .cart-collaterals::before,.woocommerce .cart-collaterals::after,
.woocommerce-page .cart-collaterals::before,.woocommerce-page .cart-collaterals::after,
.woocommerce .col2-set::before,.woocommerce .col2-set::after,
.woocommerce-page .col2-set::before,.woocommerce-page .col2-set::after{content:none;display:none}

/* Product card media: absolute-positioned link so the image can never be
   collapsed by flex shrinking on narrow screens. */
.product-media{position:relative}
.product-card .product-media > a{position:absolute;inset:14px;display:flex;align-items:center;justify-content:center;width:auto;height:auto}
.product-card .product-media img,
.woocommerce ul.products li.product .product-media > a img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;margin:0}
@media(max-width:560px){
  .product-card .product-media > a{inset:14px}
}
/* Compact brand mark on small screens. */
@media(max-width:900px){
  .site-logo img,.site-logo svg{width:154px;height:46px}
  .site-header.is-compact .site-logo img{height:42px}
}

/* =========================================================
   12. Button scale — WooCommerce override layer
   WooCommerce's own selectors are deeper than ours, so the
   single button scale is re-asserted here for its controls.
   ========================================================= */
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.woocommerce #respond input#submit,.woocommerce a.button.alt,.woocommerce button.button.alt,
.woocommerce input.button.alt,.woocommerce-page a.button,.woocommerce-page button.button,
body .button,body button.button,body a.button{
  height:var(--btn-h);min-height:var(--btn-h);padding:0 var(--btn-px);
  font-size:var(--btn-fs);line-height:1;border-radius:var(--btn-radius);font-weight:800;
  display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;
}
.woocommerce .card-actions .button,body .card-actions .button{padding:0 8px;font-size:13px;width:100%}
.woocommerce .quickview-btn,body .quickview-btn{height:32px;min-height:32px;font-size:12px;padding:0 12px}
.woocommerce .wishlist-toggle,body .wishlist-toggle{height:var(--btn-h-icon);min-height:var(--btn-h-icon);width:var(--btn-h-icon);padding:0}
.woocommerce .qty-btn,body .qty-btn{height:var(--btn-h);min-height:var(--btn-h);width:36px;padding:0;font-size:17px}
.woocommerce table.cart td.actions .button,.woocommerce #content table.cart td.actions .button{height:var(--btn-h);min-height:var(--btn-h)}
.woocommerce .header-search button,body .header-search button{height:auto;min-height:0;border-radius:0}

/* Buy now sits beside Add to cart and matches it exactly. */
.woocommerce div.product form.cart{gap:10px;align-items:center}
.woocommerce div.product form.cart .button,
.woocommerce div.product form.cart .hs-buy-now-single{flex:0 1 auto;min-width:150px;height:var(--btn-h)}
.hs-buy-now-single{background:var(--accent);color:#17130d}
.hs-buy-now-single:hover{background:#6E8963;color:#12100a}
.sticky-atc .button{flex:0 0 auto;min-width:88px}

/* Card action pair: identical footprint, no wrapping. */
.card-actions .button,.card-actions .hs-buy-now{min-width:0;overflow:hidden;text-overflow:ellipsis}
.card-actions .hs-buy-now{background:var(--primary);color:#fff}
.card-actions .hs-buy-now:hover{background:var(--primary-dark);color:#fff}
.card-actions [aria-disabled="true"]{pointer-events:none}

/* Footer brand mark needs no plate — the logo carries its own. */
.site-footer .footer-brand img{background:transparent;padding:0}

/* Compact chips and pagination so they sit on the same scale. */
.category-chips a{height:34px;padding:0 14px;font-size:13px;border-radius:var(--btn-radius)}
.chip{padding:0 12px;height:32px;border-radius:var(--btn-radius);font-size:12.5px}
.brand-pill{min-height:52px;font-size:13px;border-radius:var(--btn-radius)}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span{min-width:var(--btn-h);height:var(--btn-h);border-radius:var(--btn-radius);font-size:14px}
.woocommerce-tabs ul.tabs li a{padding:0 16px;height:var(--btn-h);display:flex;align-items:center;font-size:14px}
.woocommerce-tabs ul.tabs li{border-radius:var(--btn-radius)}
.hs-gallery-zoom{height:34px;min-height:34px;padding:0 12px;font-size:12.5px;border-radius:var(--btn-radius)}
.hs-thumb{width:66px;height:66px;border-radius:var(--btn-radius);padding:5px}
.drawer-close,.hs-modal-close{width:var(--btn-h-icon);height:var(--btn-h-icon);border-radius:var(--btn-radius);font-size:16px}
.action-icon{width:38px;height:38px;flex:0 0 38px;border-radius:var(--btn-radius);font-size:17px}
.menu-toggle{width:var(--btn-h);height:var(--btn-h);border-radius:var(--btn-radius);font-size:18px}
.subscribe{min-height:52px;padding:6px;border-radius:14px}
.subscribe input{min-height:var(--btn-h);border-radius:var(--btn-radius)}
.subscribe button{min-height:var(--btn-h);height:var(--btn-h);border-radius:var(--btn-radius);padding:0 18px;font-size:var(--btn-fs)}

/* WooCommerce's loop-button rule forces display:block, which strips the
   flex centering from our card actions. Out-specify it rather than
   reaching for !important. */
.woocommerce ul.products li.product .card-actions .button,
.woocommerce-page ul.products li.product .card-actions .button,
.woocommerce ul.products li.product .card-actions a.button,
.woocommerce ul.products li.product .card-actions button.button,
body .card-actions .button,
body .card-actions a.button,
body .card-actions button.button{
  display:inline-flex;align-items:center;justify-content:center;
  width:100%;height:var(--btn-h);min-height:var(--btn-h);margin:0;
  padding:0 8px;font-size:13px;line-height:1;border-radius:var(--btn-radius);
  text-align:center;float:none;
}
.woocommerce div.product form.cart .button,
.woocommerce div.product form.cart a.button,
.woocommerce div.product form.cart button.button,
.woocommerce div.product form.cart .hs-buy-now-single{
  display:inline-flex;align-items:center;justify-content:center;float:none;
  height:var(--btn-h);min-height:var(--btn-h);margin:0;line-height:1;
}
.woocommerce ul.products li.product .quickview-btn,
body .quickview-btn{display:inline-flex;align-items:center;justify-content:center;width:auto;margin:0}
.woocommerce ul.products li.product .wishlist-toggle,
body .wishlist-toggle{display:inline-flex;align-items:center;justify-content:center;margin:0}

/* Product page: mirror the card hierarchy — outline "Add to cart",
   solid terracotta "Buy now" — so the primary action is unambiguous. */
.woocommerce div.product form.cart .single_add_to_cart_button,
.woocommerce div.product form.cart button.button.alt{
  background:transparent;border-color:var(--primary);color:var(--primary-ink);
}
.woocommerce div.product form.cart .single_add_to_cart_button:hover,
.woocommerce div.product form.cart button.button.alt:hover{
  background:var(--primary);color:#fff;
}
.woocommerce div.product form.cart .hs-buy-now-single,
body .hs-buy-now-single{background:var(--primary);color:#fff;border-color:var(--primary)}
.woocommerce div.product form.cart .hs-buy-now-single:hover,
body .hs-buy-now-single:hover{background:var(--primary-dark);color:#fff}
.sticky-atc .hs-buy-now,.sticky-atc a.button:not(.btn-outline){background:var(--primary);color:#fff}

/* Registered-entity block in the footer. */
.footer-company{color:#C9D2CB;font-size:12.5px;line-height:1.6;margin-bottom:12px}
.footer-company strong{color:#fff}
.promo-support a{color:#fff;text-decoration:underline;white-space:nowrap}
.promo-support span[aria-hidden]{margin:0 6px;text-decoration:none;opacity:.7}

/* =========================================================
   Payment mark strip (footer legal bar, cart, checkout)
   Network artwork is fetched from Wikimedia Commons with its licence
   recorded (see PAYMENT_LOGO_SOURCES.csv). Trademark permission to
   display a mark comes from the processor agreement, not the image
   licence — swap in each network's official brand-centre asset and
   follow its brand guidelines before launch.
   ========================================================= */
.payment-methods{margin:0}
.payment-methods h2.payment-methods-title,
.woocommerce .payment-methods h2.payment-methods-title,
.entry-content .payment-methods h2.payment-methods-title{
  font-family:var(--sans);font-size:11.5px;font-weight:700;letter-spacing:.09em;
  line-height:1.4;text-transform:uppercase;margin:0 0 10px;padding:0;border:0;
  color:var(--muted);
}
.payment-marks{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
/* Fixed height, elastic width: the marks have very different aspect ratios,
   so sizing them all to one tile width shrinks the wide ones to nothing.
   Constant optical height is what reads as tidy, not constant width. */
.pay-mark{
  display:inline-flex;align-items:center;justify-content:center;
  height:var(--pay-h);min-height:var(--pay-h);
  min-width:48px;max-width:96px;padding:0 8px;
  border-radius:6px;background:#fff;border:1px solid rgba(20,32,29,.10);
  box-shadow:0 1px 2px rgba(12,23,17,.10);overflow:hidden;
}
.pay-mark img{
  display:block;width:auto;height:18px;max-width:80px;
  object-fit:contain;object-position:center;
}
/* Text fallback for any mark whose artwork has not been fetched. */
.pay-mark.is-text{
  width:auto;min-width:58px;padding:0 12px;color:#1B2A22;font-family:var(--sans);
  font-size:12px;font-weight:700;letter-spacing:.02em;line-height:1;white-space:nowrap;
}

/* Footer: the strip shares the legal bar with the copyright line. */
.legal{align-items:center}
.legal .payment-methods{flex:0 0 auto}
.legal-copy{flex:1 1 auto;min-width:220px}

/* Light-surface contexts. */
.payment-methods--cart,.payment-methods--checkout{
  margin-top:28px;padding-top:20px;border-top:1px solid var(--line);
}
.payment-methods--cart .pay-mark,
.payment-methods--checkout .pay-mark{border-color:var(--line)}

@media(max-width:760px){
  .legal{align-items:flex-start}
  .legal .payment-methods{margin-top:4px}
}
@media(max-width:600px){
  .payment-marks{gap:6px}
  .pay-mark{min-width:44px;max-width:86px;padding:0 7px}
  .pay-mark img{height:16px;max-width:72px}
  .pay-mark.is-text{min-width:52px;padding:0 10px;font-size:11.5px}
}

/* =========================================================
   Late corrections
   ========================================================= */

/* The desktop "Filters" button duplicates the sidebar that is already on
   screen. The hide rule sat before the button-scale layer, whose
   `.woocommerce button.button` selector matches at equal specificity and
   later in the file, so it won. Restated here, after everything. */
.woocommerce .shop-toolbar button.filter-drawer-toggle,
body .shop-toolbar button.filter-drawer-toggle{display:none}
@media(max-width:900px){
  .woocommerce .shop-toolbar button.filter-drawer-toggle,
  body .shop-toolbar button.filter-drawer-toggle{display:inline-flex}
}

/* Photo credit under the product gallery. */
.photo-credit{margin:12px 0 0;font-size:11.5px;line-height:1.6;color:var(--muted)}
.photo-credit a{color:var(--primary-ink);text-decoration:underline}

/* Cart line thumbnails: the source photographs have very different aspect
   ratios, so letting each one size itself gives every row a different height.
   A fixed box with contained artwork keeps the table on a rhythm. */
.woocommerce table.cart td.product-thumbnail,
.woocommerce-cart table.cart td.product-thumbnail{width:76px}
.woocommerce table.cart td.product-thumbnail img,
.woocommerce-cart table.cart td.product-thumbnail img{
  width:60px;height:60px;object-fit:contain;background:#fff;
  border:1px solid var(--line);border-radius:10px;padding:4px;
}

/* One solid button per view. "Proceed to checkout" is the action on the cart
   page, so applying a coupon steps back to the outline treatment. */
.woocommerce .coupon button.button,
.woocommerce-cart .coupon button.button[name="apply_coupon"]{
  background:transparent;color:var(--primary-ink);border-color:var(--primary);
}
.woocommerce .coupon button.button:hover,
.woocommerce-cart .coupon button.button[name="apply_coupon"]:hover{
  background:var(--primary);color:#fff;
}

/* WCAG 2.2 target size (2.5.8): a standalone navigation link needs a 24px
   target. These sit in lists as whole items rather than as words inside a
   sentence, so the inline-text exception does not cover them. */
.site-footer nav li a,
.sitemap-cols li a,
.sitemap-cols h3 a,
.mega-col li a,
.mega-col h3 a,
.hs-drawer li a,
.brand-alpha a,
.breadcrumbs a,
.breadcrumbs span[aria-current],
.cat-link,
.view-all,
.footer-company a{
  display:inline-flex;align-items:center;min-height:24px;
}

/* The brand line on a product card is a link in its own right, not a word
   inside a sentence, so it needs the 24 px minimum too. */
.product-brand a,.product-card .product-brand a{
  display:inline-flex;align-items:center;min-height:24px;
}