/* Mobile first: navigation and language are usable before the catalog loads. */
.storefront-header,.shop-page .storefront-header{position:sticky;top:0;z-index:30;height:76px;padding:10px 12px;display:flex;gap:8px;justify-content:space-between;background:#f6f1e6;color:#282c24;border-bottom:1px solid #d6d4c8}
.storefront-header .brand{gap:6px;min-width:0;flex:1;text-align:left}
.storefront-header .brand .brand-mark{width:38px;height:38px;background:transparent;padding:0}
.storefront-header .brand .brand-wordmark{font-size:12px;letter-spacing:.5px;white-space:nowrap}
.storefront-header .brand-wordmark small{font-size:7px;letter-spacing:1px;margin-top:6px}
.storefront-header .language-selector{position:relative;display:block;flex:0 0 54px;margin:0;min-width:0;color:#35432f}
.storefront-header .language-selector summary{list-style:none;display:flex;align-items:center;justify-content:center;gap:5px;height:44px;padding:0;cursor:pointer;font:500 13px 'DM Sans',Arial,sans-serif;letter-spacing:.4px;position:relative;isolation:isolate}
.storefront-header .language-selector summary::-webkit-details-marker{display:none}
.storefront-header .language-selector summary:before{content:'';position:absolute;inset:4px 0;border:1px solid #c5cbbc;border-radius:18px;background:#fffdf8;z-index:-1;transition:background .15s,border-color .15s}
.storefront-header .language-selector summary:hover:before,.storefront-header .language-selector[open] summary:before{background:#e8eddf;border-color:#97a38a}
.storefront-header .language-selector summary svg{flex:none;transition:transform .15s}
.storefront-header .language-selector[open] summary svg{transform:rotate(180deg)}
.storefront-header .language-selector summary:focus-visible{outline:2px solid #6e7d5e;outline-offset:1px;border-radius:18px}
.storefront-header .language-options{position:absolute;top:calc(100% + 6px);right:0;z-index:40;width:76px;padding:5px;background:#fffdf8;border:1px solid #d8ddcf;border-radius:16px;box-shadow:0 8px 24px #28342120;display:grid;gap:2px}
.storefront-header .language-options a{display:flex;align-items:center;justify-content:center;min-height:40px;border-radius:11px;font:500 13px 'DM Sans',Arial,sans-serif;letter-spacing:.5px;text-decoration:none;color:#35432f}
.storefront-header .language-options a:hover{background:#f0f2e9}
.storefront-header .language-options a[aria-current=true]{background:#e4ebdc;color:#2b3c23;font-weight:600}
.storefront-header .language-options a:focus-visible{outline:2px solid #6e7d5e;outline-offset:-2px}
.storefront-header .menu{display:block;flex:0 0 44px;min-width:44px;min-height:44px;padding:0;border:1px solid #a6ad9d;color:#282c24;background:#fff;font-size:0}
.storefront-header .menu:before{content:'☰';font-size:22px;line-height:1}
.storefront-header .menu[aria-expanded=true]:before{content:'×';font-size:28px}
.storefront-header nav{display:none;position:absolute;top:100%;left:0;right:0;max-height:calc(100dvh - 76px);overflow:auto;overscroll-behavior:contain;background:#f6f1e6;color:#282c24;padding:12px;gap:2px;flex-direction:column;align-items:stretch;border-bottom:1px solid #c9c5b5;box-shadow:0 12px 20px #0001;border-radius:0 0 20px 20px}
.storefront-header nav.open{display:flex}
.storefront-header nav a,.shop-page .storefront-header nav a:last-child{display:flex;align-items:center;min-height:44px;padding:12px 16px;border:0;font-size:16px;border-radius:12px}
.storefront-header nav a:hover{background:#e5eadf;opacity:1}
.storefront-header select:focus-visible,.storefront-header button:focus-visible{outline:3px solid #a37424;outline-offset:2px}
html{scroll-padding-top:90px}
@media(max-width:600px){
 .hero{height:calc(100svh - 76px);min-height:570px;max-height:none}
 .hero-copy{top:24%;left:6%;right:6%}
 .hero h1{font-size:clamp(43px,12vw,59px);letter-spacing:-1.5px;overflow-wrap:break-word}
 .hero-sub{line-height:1.6}
 .hero-bottom{left:6%;right:6%;bottom:25px}
 .hero .scroll-link{font-size:9px;letter-spacing:1px}
 .shop-card-body .solid-button{width:100%;min-height:44px;font-size:13px;padding:10px 8px;white-space:normal}
 .card-format-selector select{font-size:16px;min-height:44px;padding:8px 4px}
 .card-size{line-height:1.5}.shop-card h3{overflow-wrap:anywhere}
 .purchase-controls{flex-wrap:wrap}.purchase-controls>.solid-button{min-width:170px}
 .format{gap:12px}.format strong{text-align:right}
 .cart-line-controls{flex-wrap:wrap}.remove-item{min-height:44px}
 .gallery-thumbnails{overflow-x:auto;max-width:100%;padding-bottom:4px}.gallery-thumb{flex-shrink:0}
 .commerce-page input,.commerce-page textarea,.commerce-page select,.cart-line input,.quantity-control input{font-size:16px}
 .commerce-panel,.commerce-columns>*{min-width:0}.order-lines li{gap:12px}.order-lines li span{min-width:0;overflow-wrap:anywhere}
 .commerce-panel h1,.commerce-page h1{overflow-wrap:anywhere}
 .category-filters{gap:8px}.category-filters button{min-height:44px;padding:10px 14px;font-size:14px}
}
@media(max-width:359px){
 .storefront-header{gap:6px;padding-inline:8px}
 .storefront-header .brand .brand-mark{width:30px;height:30px}
 .storefront-header .brand .brand-wordmark{font-size:10px;letter-spacing:0}
 .storefront-header .brand-wordmark small{font-size:6px;letter-spacing:.7px}
 .storefront-header .language-selector{flex-basis:54px}
 .catalog-grid,.related .shop-grid{grid-template-columns:1fr}
 .cart-line{grid-template-columns:60px minmax(0,1fr);gap:12px}
}
@media(min-width:601px){
 .storefront-header,.shop-page .storefront-header{height:84px;padding-inline:4%;gap:16px}
 .storefront-header .brand .brand-mark{width:50px;height:50px}
 .storefront-header .brand .brand-wordmark{font-size:16px;letter-spacing:1px}
 .storefront-header .brand-wordmark small{font-size:8px;letter-spacing:2px}
 .storefront-header .language-selector{flex-basis:54px}
 .storefront-header nav{padding:18px 4%}
}
@media(min-width:1280px){
 .storefront-header nav{position:static;display:flex;flex:0 1 auto;flex-direction:row;align-items:center;gap:12px;overflow:visible;padding:0;border:0;box-shadow:none;background:transparent;max-height:none}
 .storefront-header nav a,.shop-page .storefront-header nav a:last-child{font-size:13px;padding:10px 0;white-space:nowrap}
 .storefront-header .brand{flex:1 0 auto}
 .storefront-header .menu{display:none}
}

@media(max-width:700px), (max-height:500px) and (max-width:900px){
 .journey{height:auto;margin-block:20px}
 .journey-sticky{position:relative;top:auto;height:auto;min-height:0;grid-template-columns:1fr;grid-template-rows:auto auto;overflow:hidden}
 .journey-visual{aspect-ratio:4/3;min-height:0}
 .journey-copy{padding:26px 6%}
 .stage-copy{min-height:0}.stage-copy p{max-width:none}
 .stage-nav{margin-top:12px}.stage-nav button{min-height:44px}
 .journey-foot{display:none}
 .retailer-grid{grid-template-columns:minmax(0,1fr)}
}
/* Shared storefront controls: pill actions, rounded fields and matching popovers. */
body:has(.storefront-header){--control-radius:14px;--action-radius:999px;--control-height:44px}
body:has(.storefront-header) main :is(.solid-button,.soft-button,.remove-item,.text-link,.shop-card-link,.product-discover,.category-filters button,.stage-nav button){border-radius:var(--action-radius);min-height:44px;line-height:1.4;max-width:100%;white-space:normal;text-align:center}
body:has(.storefront-header) main :is(input:not([type=checkbox]),textarea,select){font-size:16px;max-width:100%;border-radius:var(--control-radius)}
body:has(.storefront-header) main :is(input:not([type=checkbox]),select){min-height:44px}
body:has(.storefront-header) main label:has(input[type=checkbox]){display:flex;align-items:flex-start;gap:10px;min-height:44px;cursor:pointer;line-height:1.6}
body:has(.storefront-header) main input[type=checkbox]{flex:0 0 20px;width:20px;height:20px;min-width:20px;margin:3px 0 0;accent-color:#35432f}
body:has(.storefront-header) main details:not(.shop-select)>summary{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:14px;line-height:1.5;list-style:none;cursor:pointer}
body:has(.storefront-header) main details:not(.shop-select)>summary:after{flex:none;float:none;margin:0}
body:has(.storefront-header) main :is(button,summary,input,a):focus-visible{outline:2px solid #6e7d5e;outline-offset:3px}
body:has(.storefront-header) main :is(h1,h2,h3,p,a,label){overflow-wrap:break-word}
.storefront-header .language-options a{min-height:44px}
.shop-select{position:relative;margin:8px 0 0;min-width:0;width:100%;font-size:16px}
.shop-select summary{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px;padding:12px 16px;border:1px solid #b8bdac;border-radius:999px;background:#fffdf8;color:#35432f;cursor:pointer;list-style:none;font:inherit;line-height:1.4}
.shop-select summary::-webkit-details-marker{display:none}
.shop-select summary span{min-width:0;overflow-wrap:anywhere}
.shop-select summary:after{content:'';width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);flex:none;margin:0 2px 3px 0}
.shop-select[open] summary:after{transform:rotate(225deg);margin-top:5px}
.shop-select[open] summary{background:#e8eddf;border-color:#97a38a}
.shop-select summary[aria-disabled=true]{opacity:.5;cursor:not-allowed}
.shop-select-options{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:20;display:grid;gap:2px;padding:5px;background:#fffdf8;border:1px solid #d8ddcf;border-radius:16px;box-shadow:0 8px 24px #28342120;max-height:240px;overflow-y:auto;overscroll-behavior:contain}
.shop-select.opens-up .shop-select-options{top:auto;bottom:calc(100% + 6px)}
.shop-select-options button{width:100%;min-height:44px;padding:10px;border:0;border-radius:11px;background:transparent;color:#35432f;font:inherit;line-height:1.4;text-align:left;cursor:pointer;overflow-wrap:anywhere}
.shop-select-options button:hover{background:#f0f2e9}.shop-select-options button[aria-pressed=true]{background:#e4ebdc;font-weight:600}.shop-select-options button:disabled{opacity:.5;cursor:not-allowed}
main select[hidden]{display:none!important}
.shop-card:has(.shop-select[open]){overflow:visible;position:relative;z-index:21}
.shop-card:has(.shop-select[open]) .shop-card-image{border-radius:18px 18px 0 0}
.quantity-control input{padding:0!important;min-height:44px;border-radius:0!important}
@media(max-width:700px){
 .card-format-selector{font-size:13px}.card-format-selector .shop-select{font-size:14px}.card-format-selector .shop-select summary{padding:10px}
 .detail-accordions details{padding-block:10px}.commerce-panel{border-radius:20px}
 .shop-card-body .solid-button{margin-top:auto}.shop-card-body .card-feedback:not(:empty){margin-top:10px}
 .order-summary .solid-button{margin-top:15px}.gallery-thumb{min-width:44px;min-height:44px}
 .purchase-controls>.solid-button{min-width:0}.quantity-control{flex-shrink:0}
 .breadcrumbs a{min-height:32px;display:inline-flex;align-items:center}
}
@media(max-height:500px) and (max-width:900px){
 .hero{min-height:480px}.hero-copy{top:18%}.hero h1{font-size:clamp(42px,7vw,62px)}.hero-bottom{bottom:24px}
 .storefront-header nav{max-height:calc(100dvh - 84px)}
}

/* Generous quantity targets, with the primary action on its own row on phones. */
.quantity-control button{min-width:44px;min-height:44px}
@media(max-width:600px){.purchase-controls>.solid-button{flex-basis:100%;width:100%}}

/* Account and cart follow the language selector on every screen. */
.storefront-header .header-actions{display:flex;align-items:center;gap:2px;flex:0 0 auto}
.storefront-header .header-icon{position:relative;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;color:inherit}
.storefront-header .header-icon:hover{background:#e5eadf}
.storefront-header .header-icon:focus-visible{outline:2px solid #6e7d5e;outline-offset:2px}
.storefront-header .header-icon svg{width:23px;height:23px;flex:none}
.storefront-header .header-cart-count{position:absolute;right:0;top:0;display:flex;align-items:center;justify-content:center;min-width:17px;height:17px;padding:0 4px;border-radius:10px;background:#35432f;color:white;font:600 10px/1 Arial,sans-serif;margin:0}
@media(max-width:480px){.storefront-header .brand .brand-wordmark{display:none}.storefront-header,.shop-page .storefront-header{gap:6px}.storefront-header .header-actions{gap:0}}