/*
Theme Name: SGS Theme
Description: Extremely simple WooCommerce theme mimicking the Dawn-based sunglassshop.co.za look.
Version: 1.0.0
Requires PHP: 8.0
Text Domain: sgs-theme
*/
:root{--field-h:4rem;--font:"Instrument Sans",system-ui,sans-serif;--font-nav:var(--font);--font-heading:"Playfair Display",Georgia,serif;--field-border:rgba(18,18,18,.2);--fg:#121212;--bg:#fff;--muted:rgba(18,18,18,.75);--line:rgba(18,18,18,.1);--soft:#f3f3f3;--radius:4px;--w:120rem}
*,*::before,*::after{box-sizing:border-box}
html{font-size:62.5%}
body{margin:0;background:var(--soft);color:var(--fg);font:400 1.6rem/1.6 var(--font);letter-spacing:.02rem}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:700;line-height:1.3;margin:0 0 1.5rem;letter-spacing:.03rem}
h1{font-size:4rem}h2{font-size:3.2rem}h3{font-size:2.2rem}
.wrap{max-width:var(--w);margin:0 auto;padding:0 5rem}
@media(max-width:749px){.wrap{padding:0 1.5rem}h1{font-size:3rem}h2{font-size:2.4rem}}
.announce{background:#121212;color:#efefef;text-align:center;font-weight:700;font-size:1.3rem;padding:1rem 1.5rem}
.announce a{color:inherit;text-decoration:underline;text-underline-offset:.2em}
.announce p{margin:0}
.site-header{background:#fff;border-bottom:1px solid var(--line)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding-top:1rem;padding-bottom:1rem}
.site-header img{width:80px;height:80px}
.site-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:2.4rem;flex-wrap:wrap}
.site-nav a{text-decoration:none;font-size:1.5rem;font-family:var(--font-nav);font-weight:500}
.site-nav a:hover{text-decoration:underline;text-underline-offset:.3rem}
/* Fly-out cart */
.sgs-cart{position:relative}
.sgs-cart__btn{text-decoration:none;font-size:1.5rem;display:inline-block;padding:.6rem 0}
.sgs-cart__panel{display:none;position:absolute;right:0;top:100%;z-index:100;width:36rem;max-width:calc(100vw - 3rem);background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 1rem 3rem rgba(0,0,0,.15);padding:1.6rem;font-size:1.4rem}
.sgs-cart.is-open .sgs-cart__panel{display:block}
.sgs-cart .woocommerce-mini-cart{list-style:none;margin:0;padding:0;max-height:36rem;overflow-y:auto}
.sgs-cart ul.woocommerce-mini-cart.cart_list li.woocommerce-mini-cart-item{position:relative;min-height:9rem;padding:1.2rem 2.4rem 1.2rem 7.8rem;border-bottom:1px solid var(--line)}
.sgs-cart ul.woocommerce-mini-cart.cart_list li.woocommerce-mini-cart-item img{position:absolute;left:0;top:1.2rem;width:6rem;height:6rem;object-fit:cover;border-radius:var(--radius);float:none;margin:0}
.sgs-cart ul.woocommerce-mini-cart.cart_list li.woocommerce-mini-cart-item a:not(.remove){display:block;text-decoration:none;font-weight:700}
.sgs-cart ul.woocommerce-mini-cart.cart_list li.woocommerce-mini-cart-item .quantity{display:block;margin-top:.4rem}
.sgs-cart ul.woocommerce-mini-cart.cart_list li.woocommerce-mini-cart-item a.remove{position:absolute;top:1rem;right:0;text-decoration:none;font-size:2rem;line-height:1;color:var(--muted)}
.sgs-cart ul.woocommerce-mini-cart.cart_list li.woocommerce-mini-cart-item .quantity{color:var(--muted)}
.sgs-cart .woocommerce-mini-cart__total{display:flex;justify-content:space-between;margin:1.4rem 0}
.sgs-cart .woocommerce-mini-cart__buttons{display:grid;gap:.8rem;margin:0}
.sgs-cart .woocommerce-mini-cart__buttons a{text-align:center}
.sgs-cart .woocommerce-mini-cart__buttons a:not(.checkout){background:#fff;color:var(--fg);border:1px solid var(--fg)}
.sgs-cart .woocommerce-mini-cart__empty-message{margin:0;color:var(--muted)}

/* Toasts (WooCommerce notices) */
.js .woocommerce-notices-wrapper{display:none}
.sgs-toasts{position:fixed;top:1.6rem;right:1.6rem;z-index:1000;display:grid;gap:.8rem;width:36rem;max-width:calc(100vw - 3.2rem);pointer-events:none}
.sgs-toast{pointer-events:auto;display:flex;align-items:flex-start;gap:1.2rem;background:var(--fg);color:#fff;border-radius:var(--radius);padding:1.4rem 1.6rem;font-size:1.4rem;line-height:1.4;box-shadow:0 .8rem 2.4rem rgba(0,0,0,.25);opacity:0;transform:translateY(-.8rem);transition:opacity .25s,transform .25s}
.sgs-toast.is-in{opacity:1;transform:none}
.sgs-toast--error{background:#c0392b}
.sgs-toast__body{flex:1}
.sgs-toast__body ul{margin:0;padding:0;list-style:none}
.sgs-toast__body li{display:block;list-style:none;margin:0}
.sgs-toast__body li+li{margin-top:.6rem}
.sgs-toast__link{display:inline-block;margin-left:.6rem;color:#fff;font-weight:700;text-decoration:none}
.sgs-toast a{color:#fff;text-decoration:none}
.sgs-toast__close{background:none;color:#fff;padding:0 .2rem;font-size:2rem;line-height:1}
.sgs-toast__close:hover{background:none;opacity:.7}
main{padding:4rem 0 6rem}
.hero{background:var(--soft);text-align:center;padding:8rem 1.5rem}
.hero h1{font-size:5rem}
.button,button,input[type=submit],.woocommerce a.button,.woocommerce button.button,.woocommerce #respond input#submit,.woocommerce a.button.alt,.woocommerce button.button.alt{display:inline-block;background:var(--fg);color:#fff;border:0;border-radius:var(--radius);padding:1.2rem 3rem;font:inherit;font-size:1.5rem;text-decoration:none;cursor:pointer;line-height:1.2}
.button:hover,button:hover,input[type=submit]:hover,.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce a.button.alt:hover,.woocommerce button.button.alt:hover{background:#333;color:#fff}
input,select,textarea{font:inherit;padding:1rem 1.2rem;border:1px solid var(--line);border-radius:var(--radius);background:#fff;color:var(--fg)}
.woocommerce ul.products{display:grid;grid-template-columns:repeat(3,1fr);gap:3rem;margin:0 0 3rem;padding:0}
.woocommerce ul.products::before,.woocommerce ul.products::after{display:none}
.woocommerce ul.products li.product{width:auto;margin:0;float:none}
.woocommerce ul.products li.product a{text-decoration:none}
.woocommerce ul.products li.product img{aspect-ratio:auto;object-fit:contain;margin:0;border-radius:0;background:#fff}
.woocommerce ul.products li.product .pdp-card{color:var(--fg)}
.woocommerce ul.products li.product .woocommerce-loop-product__title{font-size:1.6rem;padding:0;margin:0 0 .4rem}
.woocommerce .price,.woocommerce ul.products li.product .price{color:var(--muted);font-size:1.5rem}
.woocommerce span.onsale{background:var(--fg);color:#fff;border-radius:var(--radius);min-height:0;min-width:0;line-height:1;padding:.7rem 1.2rem;font-size:1.2rem;top:1rem;left:1rem;right:auto}
.woocommerce div.product div.images{width:48%}.woocommerce div.product div.summary{width:48%}
.woocommerce div.product .product_title{font-size:3.6rem}
.woocommerce div.product p.price{font-size:2rem}
.woocommerce-breadcrumb{font-size:1.3rem;color:var(--muted);margin-bottom:2rem}
.woocommerce-message,.woocommerce-info{border-top-color:var(--fg)}
.woocommerce-message::before,.woocommerce-info::before{color:var(--fg)}
.site-footer{border-top:1px solid var(--line);padding:4rem 0;font-size:1.4rem;color:var(--muted)}
.site-footer .wrap{display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.site-footer ul{list-style:none;margin:0;padding:0;display:flex;gap:2rem;flex-wrap:wrap}
@media(max-width:989px){.woocommerce ul.products{grid-template-columns:repeat(2,1fr);gap:1.5rem}.woocommerce div.product div.images,.woocommerce div.product div.summary{width:100%;float:none}}

/* ---------- Product page (matches sunglassshop.co.za PDP) ---------- */
.pdp{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:5rem;align-items:start;padding:3rem 0 6rem}
.pdp__media{display:grid;grid-template-columns:1fr;gap:1rem}
.pdp__media--grid{grid-template-columns:1fr 1fr}
.pdp__thumbs{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.pdp__img{display:block;cursor:zoom-in}
.pdp__img.is-main{grid-column:1/-1}
.pdp__img img{width:100%;height:auto;border-radius:var(--radius)}
.pdp__info{position:sticky;top:2rem}
.pdp__brand{display:inline-block;font-size:1.3rem;letter-spacing:.14rem;text-transform:uppercase;text-decoration:none;color:var(--muted);margin-bottom:1rem}
.pdp__title{font-size:2.8rem;font-weight:700;line-height:1.2;margin:0 0 .5rem}
.pdp__model{font-size:1.6rem;margin:0 0 1.4rem}
.pdp__stock{display:flex;align-items:center;gap:.7rem;font-size:1.3rem;font-weight:700;letter-spacing:.06rem;text-transform:uppercase;margin:0 0 2.4rem}
.pdp__stock::before{content:"";width:.9rem;height:.9rem;border-radius:50%;background:currentColor}
.pdp__stock.is-in{color:#0a8a2f}.pdp__stock.is-out{color:#c0392b}
.pdp__sizerow{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;margin-bottom:2rem}
.pdp__label{display:block;font-size:1.2rem;text-transform:uppercase;letter-spacing:.06rem;margin-bottom:.8rem}
.pdp__pill{display:inline-block;background:var(--fg);color:#fff;border-radius:var(--radius);padding:.7rem 1.6rem;font-size:1.3rem}
.pdp__sizeguide{display:inline-flex;align-items:center;gap:1rem;font-size:1.6rem;text-decoration:none}
.pdp__sizeguide:hover{text-decoration:underline}
.pdp__buybox{background:#fff;border-radius:var(--radius);padding:2rem}
.pdp__priceline{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:2rem}
.pdp__price{font-size:3.2rem;line-height:1.2}
.pdp__price .sgs-price-was{display:block;font-size:1.4rem;color:var(--muted);margin-top:.6rem}
.pdp__save{background:var(--soft);border-radius:var(--radius);padding:.4rem 1rem;font-size:1.2rem;font-weight:700;white-space:nowrap}
.pdp__form{display:grid;gap:1rem;margin:0 0 2rem}
.pdp__btn{width:100%;padding:1.3rem 2rem;font-size:1.5rem;border:1px solid var(--fg);border-radius:var(--radius);cursor:pointer;text-align:center}
.pdp__btn--outline{background:#fff;color:var(--fg)}
.pdp__btn--outline:hover{background:#fff;color:var(--fg);box-shadow:0 0 0 1px var(--fg)}
.pdp__btn--solid{background:var(--fg);color:#fff}
.pdp__btn:disabled{opacity:.5;cursor:not-allowed}
.pdp__perks{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:1rem;text-align:center;font-size:1.2rem}
.pdp__perks li{flex:0 1 calc((100% - 2rem) / 3);min-width:9rem;display:flex;flex-direction:column;align-items:center;gap:.2rem}
.pdp__perks svg{margin-bottom:.4rem}
.pdp__perks span{color:var(--muted)}
.pdp__pickup{background:#fff;border-radius:var(--radius);padding:1.6rem 2rem;margin-top:1.6rem;font-size:1.3rem}
.pdp__pickup p{margin:0 0 .4rem}
.pdp__pickup-sub{padding-left:2rem;color:var(--muted)}
.pdp__pickup a{margin-left:2rem}
.pdp__tick{color:#0a8a2f;margin-right:.8rem}
.pdp-section{padding:2rem 0 5rem}
.pdp-h2{font-size:3.2rem;font-weight:700;margin:0 0 2.4rem}
.pdp-h2--bold{font-weight:700}
.pdp-section--white{background:#fff}
.pdp-variants-box{background:#fff;border-radius:var(--radius);padding:1.8rem 1.4rem .3rem;margin:0 0 1.6rem;min-width:0}
.pdp-variants-box,.pdp__buybox{box-shadow:var(--elev-1)}
.pdp-variants-box .pdp-variant__price{display:none} /* hidden while we experiment; remove this line to show prices again */
.pdp-variants-box .pdp-variant{flex-basis:12rem}
.pdp-variants-box .pdp-variant__img{border:.2rem solid transparent;border-radius:var(--radius);transition:border-color .15s}
.pdp-variants-box .pdp-variant:hover .pdp-variant__img{border-color:#d4d4d4}
.pdp-variants-box .pdp-variant.is-current .pdp-variant__img{border-color:var(--fg)}
.pdp-variants-box .pdp-variant.is-current .pdp-variant__img::before{content:"\2713";position:absolute;left:.6rem;top:.6rem;z-index:1;width:2rem;height:2rem;border-radius:50%;background:var(--fg);color:#fff;font-size:1.2rem;line-height:2rem;text-align:center}
.pdp-variants-box .pdp-variant__dot{width:2rem;height:2rem}
.pdp-variants{display:flex;gap:1.6rem;overflow-x:auto;padding-bottom:.5rem;scroll-snap-type:x proximity}
/* Chrome, Edge, Safari: a slim pill. (scrollbar-width/-color would switch these rules off in Chromium, so only Firefox gets them.) */
.pdp-variants::-webkit-scrollbar{height:.5rem}
.pdp-variants::-webkit-scrollbar-track{background:#eee;border-radius:.25rem}
.pdp-variants::-webkit-scrollbar-thumb{background:#b8b8b8;border-radius:.25rem}
.pdp-variants::-webkit-scrollbar-thumb:hover{background:#8f8f8f}
@supports (-moz-appearance:none){.pdp-variants{scrollbar-width:thin;scrollbar-color:#b8b8b8 #eee}}
.pdp-variant{flex:0 0 16rem;text-decoration:none;text-align:center;font-size:1.2rem;color:var(--muted);scroll-snap-align:start}
.pdp-variant__price{display:block}
.pdp-variant__dot{position:absolute;right:.6rem;bottom:.6rem;width:2.4rem;height:2.4rem;border-radius:50%;box-shadow:0 0 0 .2rem #fff,0 0 0 .3rem rgba(0,0,0,.25)}
/* Colour-name tooltip: one element on <body> (the row scrolls, so it would clip anything inside it), placed by sgs.js above the tile. */
.sgs-tip{position:fixed;z-index:1000;max-width:22rem;background:var(--fg);color:#fff;border-radius:var(--radius);padding:.4rem .9rem;font-size:1.2rem;line-height:1.3;font-weight:600;text-align:center;pointer-events:none;opacity:0;transition:opacity .12s}
.sgs-tip.is-on{opacity:1}
.pdp-variant__price{margin-top:.4rem;font-size:1.4rem;font-weight:700;color:var(--fg)}
.pdp-variant__price .sgs-price-was{margin-left:.4rem;font-weight:400;color:var(--muted)}
.pdp-variant__img,.pdp-card__img{position:relative;display:block;margin-bottom:1rem}
.pdp-variant img,.pdp-card img{width:100%;aspect-ratio:auto;object-fit:contain;background:#fff}
.pdp-badge{position:absolute;left:.6rem;bottom:.6rem;background:var(--fg);color:#fff;border-radius:var(--radius);padding:.3rem 1.1rem;font-size:1.2rem;font-style:normal;font-weight:700}
.pdp-moreinfo{background:#fff;padding:4rem 0 5rem}
.pdp-moreinfo .pdp-h2{font-size:4rem}
.pdp-moreinfo ul{padding-left:2.4rem}
.pdp-moreinfo li{margin:.6rem 0}
.pdp-moreinfo__h3{font-size:2.2rem;margin:3rem 0 1.2rem}
.pdp-specs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 4rem;margin:0;max-width:72rem}
.pdp-specs div{display:flex;justify-content:space-between;gap:2rem;padding:.9rem 0;border-bottom:1px solid var(--line)}
.pdp-specs dt{color:var(--muted)}
.pdp-specs dd{margin:0;font-weight:700;text-align:right}
@media(max-width:749px){.pdp-specs{grid-template-columns:1fr}}
.pdp-moreinfo__title{font-size:2rem;margin-top:2rem}
.pdp-related ul.products{grid-template-columns:repeat(4,1fr);margin-bottom:0}
.pdp-card{display:flex;flex-direction:column;align-items:center;text-align:center;text-decoration:none}
.pdp-card__brand{font-size:1.2rem;letter-spacing:.14rem;text-transform:uppercase;color:var(--muted)}
.pdp-card__title{font-size:1.8rem;margin:.3rem 0}
.pdp-card__model{font-size:1.4rem;color:var(--muted)}
.pdp-card__price{display:flex;justify-content:center;gap:.6rem;font-size:1.4rem;margin-top:.4rem}
.pdp-card__price .sgs-price-was{color:var(--muted);margin-left:.4rem}
.pdp-card__price s{order:-1}
.pdp-modal{border:0;padding:0;max-width:92vw;max-height:92vh;background:#fff}
.pdp-modal::backdrop{background:rgba(0,0,0,.7)}
.pdp-modal img{max-width:92vw;max-height:92vh;display:block}
.pdp-modal__close{position:absolute;top:.5rem;right:.5rem;background:#fff;color:var(--fg);border:0;font-size:2.4rem;line-height:1;padding:.4rem 1rem}
@media(max-width:989px){.pdp{grid-template-columns:1fr;gap:2.4rem}.pdp__info{position:static}.pdp-related ul.products{grid-template-columns:repeat(2,1fr)}.pdp-h2{font-size:2.6rem}.pdp-moreinfo .pdp-h2{font-size:3.2rem}}

/* ---------- Checkout ---------- */
.sgs-checkout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:3rem;align-items:start}
.sgs-checkout__main{display:grid;gap:2rem}
.sgs-checkout__side{position:sticky;top:2rem;background:#fff;border-radius:var(--radius);padding:2.4rem 2rem}
.sgs-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:2.4rem}
.sgs-card[hidden]{display:none}
.sgs-card__title{font-size:2rem;font-weight:700;margin:0 0 1.6rem}
.sgs-optional{font-size:1.4rem;font-weight:400;color:var(--muted)}
.sgs-checkout.checkout .form-row,.sgs-checkout.checkout .form-row-first,.sgs-checkout.checkout .form-row-last{margin:0 0 .8rem;padding:0;float:none;width:100%;max-width:none;display:block}
.sgs-checkout .woocommerce-billing-fields__field-wrapper,.sgs-checkout .woocommerce-shipping-fields__field-wrapper{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0 1.4rem}
.sgs-checkout .form-row-first,.sgs-checkout .form-row-last{grid-column:span 3}
.sgs-checkout .form-row-wide,.sgs-checkout #billing_country_field,.sgs-checkout #shipping_country_field,.sgs-checkout .notes{grid-column:1/-1}
.sgs-checkout #billing_city_field,.sgs-checkout #shipping_city_field{grid-column:span 4}
.sgs-checkout #billing_address_2_field,.sgs-checkout #shipping_address_2_field,.sgs-checkout #billing_suburb_field,.sgs-checkout #shipping_suburb_field{grid-column:span 3}
.sgs-checkout #billing_postcode_field,.sgs-checkout #shipping_postcode_field{grid-column:span 2}
.sgs-checkout{--wc-form-border-color:var(--field-border)}
.sgs-checkout.checkout .form-row input.input-text:focus,.sgs-checkout.checkout .form-row select:focus{border-color:var(--fg);outline:0;box-shadow:0 0 0 1px var(--fg)}
.sgs-checkout label{display:block;font-size:1.3rem;line-height:1.3;margin-bottom:.3rem}
.sgs-checkout.checkout .form-row input.input-text,.sgs-checkout.checkout .form-row select{width:100%;height:var(--field-h);padding:0 1.2rem;font-size:1.5rem;line-height:calc(var(--field-h) - 2px);box-sizing:border-box}
.sgs-checkout .select2-container .select2-selection--single{height:var(--field-h);margin:0;border:1px solid var(--field-border);border-radius:var(--radius);background:#fff}
.sgs-checkout .select2-container .select2-selection--single .select2-selection__rendered{line-height:calc(var(--field-h) - 2px);padding:0 3.2rem 0 1.2rem;color:var(--fg);font-size:1.5rem}
.sgs-checkout .select2-container .select2-selection--single .select2-selection__arrow{height:calc(var(--field-h) - 2px);right:.6rem}
.sgs-checkout .woocommerce-validated .select2-container:not(.select2-container--open) .select2-selection,.sgs-checkout .woocommerce-validated input.input-text,.sgs-checkout .woocommerce-validated select{border-color:var(--field-border)!important}
.sgs-checkout .select2-container--open .select2-selection--single,.sgs-checkout .select2-container--focus .select2-selection--single{border-color:var(--fg);box-shadow:0 0 0 1px var(--fg)}
.select2-dropdown{border:1px solid var(--field-border);border-radius:var(--radius);box-shadow:0 1rem 3rem rgba(0,0,0,.12);font-size:1.5rem}
.select2-container--default .select2-search--dropdown .select2-search__field{border:1px solid var(--field-border);border-radius:var(--radius);padding:.8rem 1rem}
.sgs-checkout .woocommerce-input-wrapper strong{font-weight:400}
.sgs-ship{list-style:none;margin:0 0 1.6rem;padding:0;display:grid;gap:1rem}
.sgs-ship label{display:flex;align-items:center;gap:1.2rem;border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem 1.6rem;margin:0;font-size:1.5rem;cursor:pointer}
.sgs-ship label:has(input:checked){border-color:var(--fg);box-shadow:0 0 0 1px var(--fg)}
.sgs-ship__label{flex:1}
.sgs-ship__cost{font-weight:700}
.sgs-note{margin:0 0 1.6rem;color:var(--muted)}
.sgs-check{display:flex;align-items:center;gap:1rem;font-size:1.5rem!important;cursor:pointer;margin:0!important}
/* order summary: plain rows with a hairline under each, no table box */
.sgs-checkout table.shop_table.woocommerce-checkout-review-order-table{width:100%;border:0;border-radius:0;border-collapse:collapse;margin:0;font-size:1.4rem;background:none}
.sgs-checkout table.shop_table.woocommerce-checkout-review-order-table thead{display:none}
.sgs-checkout table.shop_table.woocommerce-checkout-review-order-table th,.sgs-checkout table.shop_table.woocommerce-checkout-review-order-table td{border:0;border-bottom:1px solid var(--line);padding:1.2rem 0;background:none;text-align:left;vertical-align:top;font-weight:400}
.sgs-checkout table.shop_table.woocommerce-checkout-review-order-table td:last-child{text-align:right;white-space:nowrap;padding-left:1rem}
.sgs-checkout table.shop_table.woocommerce-checkout-review-order-table{table-layout:fixed}
.sgs-checkout table.shop_table.woocommerce-checkout-review-order-table tfoot td:last-child{white-space:normal;overflow-wrap:anywhere}
.sgs-checkout .woocommerce-checkout-review-order-table tfoot ul{list-style:none;margin:0;padding:0;width:100%;box-sizing:border-box}
.sgs-checkout .woocommerce-checkout-review-order-table tfoot li{margin:0;padding:0;list-style:none}
.sgs-checkout .woocommerce-checkout-review-order-table tfoot label{display:block;margin:0;overflow-wrap:anywhere}
.sgs-checkout table.shop_table.woocommerce-checkout-review-order-table td.product-name{overflow:hidden;text-align:left;white-space:normal;padding-left:0}
.sgs-checkout .sgs-co-sub{display:flex;justify-content:space-between;align-items:baseline;margin-top:.4rem}
.sgs-checkout .woocommerce-checkout-review-order-table .product-total{font-weight:600;white-space:nowrap}
.sgs-checkout .order-total td small.includes_tax{display:block;margin-top:.2rem;font-size:1.1rem;font-weight:400;line-height:1.3;color:var(--muted);white-space:normal}
.sgs-checkout .sgs-co-item{display:flex;align-items:center;gap:1.2rem;min-width:0}
.sgs-checkout .sgs-co-img{flex:none;width:7.2rem;height:7.2rem;border:1px solid var(--line);border-radius:var(--radius);background:#fff;overflow:hidden}
.sgs-checkout .sgs-co-img img{display:block;width:100%;height:100%;object-fit:contain}
.sgs-checkout .sgs-co-body{flex:1;min-width:0}
.sgs-checkout .sgs-co-line{display:flex;align-items:baseline;gap:.6rem;min-width:0}
.sgs-checkout .sgs-co-name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sgs-checkout table.shop_table.woocommerce-checkout-review-order-table .product-quantity{font-weight:400;color:var(--muted)}
.sgs-checkout table.shop_table.woocommerce-checkout-review-order-table tfoot th{color:var(--muted)}
.sgs-checkout table.shop_table.woocommerce-checkout-review-order-table .order-total th,.sgs-checkout table.shop_table.woocommerce-checkout-review-order-table .order-total td{color:var(--fg);font-size:1.8rem;font-weight:700;border-bottom:0}
form.sgs-checkout #payment{background:none;margin-top:2rem}
form.sgs-checkout #payment ul.payment_methods{list-style:none;margin:0 0 1.6rem;padding:0;border:0}
form.sgs-checkout #payment ul.payment_methods li{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem 1.6rem;margin:0 0 1rem}
form.sgs-checkout #payment ul.payment_methods li{position:relative;cursor:pointer}
form.sgs-checkout #payment ul.payment_methods li>input.input-radio{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
form.sgs-checkout #payment ul.payment_methods li>label{cursor:pointer;margin:0}
form.sgs-checkout #payment ul.payment_methods li:has(>input.input-radio:checked){border-color:var(--fg);box-shadow:0 0 0 1px var(--fg)}
form.sgs-checkout #payment ul.payment_methods li:has(>input.input-radio:focus-visible){outline:2px solid var(--fg);outline-offset:2px}
form.sgs-checkout #payment div.payment_box{background:var(--soft);color:var(--muted);font-size:1.3rem;padding:1rem 1.2rem;margin:1rem 0 0;border-radius:var(--radius)}
form.sgs-checkout #payment div.payment_box::before{display:none}
.sgs-checkout #place_order{width:100%;padding:1.5rem 2rem;font-size:1.6rem}
.sgs-checkout .woocommerce-privacy-policy-text{font-size:1.2rem;color:var(--muted);margin-bottom:1.4rem}
@media(max-width:989px){.sgs-checkout{grid-template-columns:1fr;gap:2.4rem}.sgs-checkout__side{position:static}}
@media(max-width:600px){.sgs-checkout .form-row-first,.sgs-checkout .form-row-last,.sgs-checkout #billing_address_2_field,.sgs-checkout #shipping_address_2_field,.sgs-checkout #billing_suburb_field,.sgs-checkout #shipping_suburb_field{grid-column:1/-1}.sgs-card{padding:1.6rem}}
.sgs-ac{position:absolute;left:0;right:0;top:100%;z-index:50;margin:.2rem 0 0;padding:.4rem 0;list-style:none;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 1rem 3rem rgba(0,0,0,.15);max-height:32rem;overflow-y:auto}
.sgs-ac[hidden]{display:none}
.sgs-ac li[role=option]{padding:1rem 1.4rem;font-size:1.4rem;cursor:pointer;border-bottom:1px solid var(--line)}
.sgs-ac li[role=option]:hover,.sgs-ac li[aria-selected=true]{background:var(--soft)}
.sgs-ac__note{padding:.8rem 1.4rem;font-size:1.1rem;color:var(--muted)}
.sgs-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.sgs-coupon{margin:1.6rem 0 0}
.sgs-checkout .sgs-coupon__toggle{display:inline-block;color:var(--fg);font-size:1.4rem;text-decoration:underline;text-underline-offset:.3rem;cursor:pointer}
.sgs-checkout .sgs-coupon__toggle:hover{text-decoration-thickness:2px}
.sgs-coupon__panel{display:flex;gap:.8rem;margin-top:1rem}
.sgs-coupon__panel[hidden]{display:none}
.sgs-coupon__panel input{flex:1;min-width:0}
.sgs-coupon__apply{padding:1rem 2rem;font-size:1.4rem}


/* ---------- Size guide modal ---------- */
.pdp__sizeguide{background:none;border:0;padding:0;color:var(--fg);font:inherit;font-size:1.6rem;cursor:pointer;text-decoration:underline;text-underline-offset:.3rem}
.pdp__sizeguide:hover{background:none;color:var(--fg)}
.pdp-guide{border:0;border-radius:var(--radius);padding:3rem;width:min(92vw,72rem);max-height:90vh;overflow:auto;background:#fff;color:var(--fg)}
.pdp-guide::backdrop{background:rgba(0,0,0,.6)}
.pdp-guide__title{font-size:2.6rem;margin:0 3rem 2rem 0}
.pdp-guide__body img{max-width:100%;height:auto}
.pdp-guide__body table{width:100%;border-collapse:collapse;font-size:1.4rem}
.pdp-guide__body th,.pdp-guide__body td{border-bottom:1px solid var(--line);padding:.9rem 1rem;text-align:left}
.pdp-guide .pdp-modal__close{top:1rem;right:1rem;border-radius:var(--radius);background:var(--soft)}

/* Phone navigation: hamburger + left Shop drawer, app-style bottom bar. Desktop is unchanged (everything below is hidden above 749px). */
.sgs-burger,.sgs-drawer,.sgs-drawer__overlay,.sgs-tabbar{display:none}
@media(max-width:749px){
.site-header .sgs-cart{display:none}
.site-nav .sgs-hide-mobile,.site-nav:not(:has(>ul>li:not(.sgs-hide-mobile))){display:none}
.site-header .wrap{justify-content:center;position:relative;padding-top:.6rem;padding-bottom:.6rem}
.site-header img{width:48px;height:48px}
.sgs-burger{display:flex;flex-direction:column;justify-content:center;gap:.5rem;position:absolute;left:1.1rem;top:50%;transform:translateY(-50%);width:4.4rem;height:4.4rem;padding:1.1rem;background:none;border:0;cursor:pointer}
.sgs-burger span{display:block;height:2px;background:var(--fg);border-radius:1px}
.sgs-drawer__overlay{display:block;position:fixed;inset:0;z-index:1050;background:rgba(0,0,0,.45);opacity:0;pointer-events:none;transition:opacity .25s}
.sgs-drawer__overlay[hidden]{display:block}
.sgs-drawer{display:block;position:fixed;top:0;bottom:0;left:0;z-index:1100;width:min(30rem,85vw);background:#fff;overflow-y:auto;transform:translateX(-100%);visibility:hidden;transition:transform .25s,visibility .25s;padding-bottom:env(safe-area-inset-bottom)}
.sgs-drawer__head{display:flex;align-items:center;justify-content:space-between;padding:.8rem 1.6rem;border-bottom:1px solid var(--line);font:600 1.8rem var(--font-nav)}
.sgs-drawer .sgs-drawer__logo{display:block;padding:0}.sgs-drawer__logo img{width:56px;height:56px}
.sgs-drawer__close{background:none;border:0;font-size:3.2rem;line-height:1;padding:0 .6rem;cursor:pointer;color:var(--fg)}
.sgs-drawer nav{padding:.8rem 0 2rem}
.sgs-drawer a{display:block;padding:1.2rem 1.6rem;text-decoration:none;font:500 1.6rem var(--font-nav)}
.sgs-drawer a:active{background:var(--soft)}
.sgs-drawer__all{border-bottom:1px solid var(--line)}
.sgs-drawer__h{margin:1.6rem 1.6rem .4rem;font:600 1.2rem var(--font-nav);text-transform:uppercase;letter-spacing:.1rem;color:var(--muted)}
.sgs-drawer ul{list-style:none;margin:0;padding:0}
.sgs-drawer li a{font-weight:400;padding:1rem 1.6rem}
body.sgs-drawer-open{overflow:hidden}
body.sgs-drawer-open .sgs-drawer__overlay{opacity:1;pointer-events:auto}
body.sgs-drawer-open .sgs-drawer{transform:none;visibility:visible}
.sgs-tabbar{display:grid;grid-template-columns:repeat(3,1fr);position:fixed;left:0;right:0;bottom:0;z-index:900;background:#fff;border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom);box-shadow:0 -.4rem 1.6rem rgba(0,0,0,.06)}
.sgs-tabbar__item{display:flex;flex-direction:column;align-items:center;gap:.2rem;padding:.8rem .4rem .7rem;text-decoration:none;color:var(--muted);font:500 1.1rem var(--font-nav)}
.sgs-tabbar__item.is-active{color:var(--fg);font-weight:600}
.sgs-tabbar__icon{position:relative;display:block;height:2.4rem}
.sgs-tabbar .sgs-cart__count{position:absolute;top:-.5rem;left:1.4rem;min-width:1.8rem;height:1.8rem;padding:0 .4rem;border-radius:var(--radius);background:var(--fg);color:#fff;font:600 1.1rem/1.8rem var(--font);text-align:center}
body{padding-bottom:calc(6.4rem + env(safe-area-inset-bottom))}
.sgs-toasts{top:.8rem;right:.8rem;left:.8rem;width:auto;max-width:none}
}

/* ---------- Brand logo on the PDP (text brand name is the fallback) ---------- */
.pdp__brand.has-logo{display:block;margin-bottom:1.4rem}
.pdp__brand-logo{display:block;width:auto;height:3.2rem;max-width:13rem;object-fit:contain;object-position:left center}
@media(max-width:989px){.woocommerce ul.products[class*=columns-] li.product,.woocommerce-page ul.products[class*=columns-] li.product{width:auto;float:none;margin:0}.woocommerce-Price-amount{white-space:nowrap}}

/* ---------- Cart: no item description, price shown once (line total column) ---------- */
.wc-block-cart-items .wc-block-components-product-metadata__description,
.wc-block-cart-items .wc-block-cart-item__prices{display:none}
.wc-block-mini-cart__items .wc-block-components-product-metadata__description{display:none}

/* Shop megamenu (desktop): taxonomy buttons on the left, the active taxonomy's options on the right */
.site-header{position:relative}
.site-nav{align-self:stretch;display:flex}
.site-nav li{display:flex;align-items:center}
.site-nav li.has-mega{position:static}
.sgs-mega{display:none;position:absolute;left:0;right:0;top:100%;z-index:200;background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);box-shadow:0 1.2rem 2.4rem rgba(0,0,0,.1);padding:0;text-align:left}
.sgs-mega::before{content:"";position:absolute;left:0;right:0;top:-1.4rem;height:1.4rem}
.has-mega:hover>.sgs-mega,.has-mega:focus-within>.sgs-mega,.has-mega.is-open>.sgs-mega{display:block}
.sgs-mega__layout{display:grid;grid-template-columns:24rem 1fr;min-height:36rem}
.sgs-mega__tabs{display:flex;flex-direction:column;gap:.2rem;padding:1.6rem 1.6rem 1.6rem 0;border-right:1px solid var(--line)}
.sgs-mega .sgs-mega__tab{display:flex;align-items:center;justify-content:space-between;width:100%;padding:1.1rem 1.4rem;background:none;color:var(--fg);border:0;border-radius:var(--radius);font:500 1.5rem var(--font-nav);text-align:left;cursor:pointer}
.sgs-mega .sgs-mega__tab i{font-style:normal;font-size:2rem;line-height:1;color:var(--muted);opacity:0;transition:opacity .15s}
.sgs-mega .sgs-mega__tab:hover,.sgs-mega .sgs-mega__tab:focus-visible,.sgs-mega .sgs-mega__tab.is-active{background:var(--soft);color:var(--fg)}
.sgs-mega .sgs-mega__tab.is-active{font-weight:600}
.sgs-mega .sgs-mega__tab.is-active i{opacity:1}
.sgs-mega__all{margin-top:auto;padding:1.4rem 1.4rem 0;font:600 1.4rem var(--font-nav);text-decoration:none}
.sgs-mega__all:hover{text-decoration:underline;text-underline-offset:.3rem}
.sgs-mega__panes{padding:2rem 0 2rem 3.2rem;min-width:0}
.sgs-mega__pane{display:none}
.sgs-mega__pane.is-active{display:block}
.sgs-mega__h{margin:0 0 1.2rem;font:600 1.2rem var(--font-nav);text-transform:uppercase;letter-spacing:.1rem;color:var(--muted)}
.sgs-mega ul{display:grid;grid-template-columns:repeat(4,1fr);gap:.1rem 2.4rem;list-style:none;margin:0;padding:0;max-height:29rem;overflow-y:auto;scrollbar-width:thin}
.sgs-mega li{display:block}
.sgs-mega li a{display:flex;align-items:center;gap:.6rem;padding:.6rem .4rem;font:400 1.5rem var(--font);text-decoration:none;border-radius:var(--radius)}
.sgs-mega li a:hover{background:var(--soft)}
.sgs-mega ul.has-images{grid-template-columns:repeat(5,1fr);gap:1rem;max-height:none}
.sgs-mega li a.sgs-mega__logo,.sgs-mega ul.has-images li a{justify-content:center;height:7rem;padding:1.2rem;border:1px solid var(--line);border-radius:var(--radius);background:#fff;text-align:center;font-size:1.4rem;line-height:1.2}
.sgs-mega li a.sgs-mega__logo:hover,.sgs-mega ul.has-images li a:hover{border-color:rgba(18,18,18,.35);box-shadow:0 .6rem 1.6rem rgba(18,18,18,.12);background:#fff}
.sgs-mega li a.sgs-mega__logo.has-caption{flex-direction:column;gap:.6rem;height:auto;min-height:7rem}
.sgs-mega__logo.has-caption img{max-height:5rem}
.sgs-mega__logo.has-caption span{font-size:1.3rem}
.sgs-mega__logo img{width:100%;height:100%;max-height:100%;object-fit:contain} /* every logo fills the same box, whatever its own shape */
.sgs-mega ul.has-images li a.sgs-mega__logo:not(.has-caption){height:7rem;flex:none;width:100%}
.sgs-mega__logo.has-caption img{height:5rem}
.sgs-dot{display:inline-block;width:1rem;height:1rem;border-radius:50%;border:1px solid rgba(0,0,0,.25);flex:none}
@media(max-width:989px){.sgs-mega ul,.sgs-mega ul.has-images{grid-template-columns:repeat(3,1fr)}.sgs-mega__layout{grid-template-columns:20rem 1fr}}
/* Phone drawer: one expandable group per taxonomy */
@media(max-width:749px){
.sgs-drawer__group summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:1.3rem 1.6rem;font:500 1.6rem var(--font-nav);border-bottom:1px solid var(--line)}
.sgs-drawer__group summary::-webkit-details-marker{display:none}
.sgs-drawer__group summary::after{content:"+";font-size:2.2rem;line-height:1;color:var(--muted)}
.sgs-drawer__group[open]>summary::after{content:"\2013"}
.sgs-drawer__group ul{padding:.4rem 0 1rem;background:var(--soft)}
.sgs-drawer__group li a{display:flex;align-items:center;gap:.8rem;padding:.9rem 2.4rem}
/* Groups with pictures (brands, frame designs): two even button tiles per row, every picture in the same box */
.sgs-drawer__group ul.has-images{display:grid;grid-template-columns:repeat(2,1fr);gap:.8rem;padding:1rem 1.2rem 1.4rem}
.sgs-drawer__group ul.has-images li a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;height:6.4rem;padding:.9rem 1.2rem;background:#fff;border:1px solid var(--line);border-radius:var(--radius);text-align:center;font:500 1.3rem/1.2 var(--font-nav);box-shadow:0 1px 2px rgba(0,0,0,.05)}
.sgs-drawer__group ul.has-images li a:active{background:var(--soft);border-color:rgba(18,18,18,.35)}
.sgs-drawer__group ul.has-images li a.has-caption{height:8rem}
.sgs-drawer__group ul.has-images li img{width:100%;height:100%;min-height:0;object-fit:contain}
.sgs-drawer__group ul.has-images li a.has-caption img{height:4.2rem;flex:none}
.sgs-drawer__group ul.has-images li a.has-caption span{font-size:1.2rem}
}
.site-header .sgs-mega .wrap{display:block;padding-top:0;padding-bottom:0}

/* Menu screen > CSS Classes: sgs-hide-mobile hides an item on phones (up to 749px), sgs-hide-desktop hides it above that. */
@media(min-width:750px){.sgs-hide-desktop{display:none!important}}

/* ---------- Product cards outside the PDP (shop, categories, search, related) ---------- */
.woocommerce ul.products{gap:2.4rem}

/* ---------- Homepage sections (inc/home-sections.php) ---------- */
.home-section{padding:4rem 0 2rem;background:var(--section-bg,var(--soft))}
.home-section .woocommerce ul.products{margin-bottom:2rem}
.home-section__head{display:flex;align-items:flex-start;justify-content:space-between;gap:2rem;margin-bottom:2.4rem}
.home-section__text{max-width:64rem}
.home-section__head.has-hero{position:relative;isolation:isolate;align-items:flex-end;min-height:28rem;padding:3.6rem;border-radius:var(--radius);overflow:hidden;background-size:cover;background-position:center;color:#fff}
.home-section__head.has-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(0,0,0,.65),rgba(0,0,0,.15))}
.home-section__head.has-hero .home-section__title,.home-section__head.has-hero .home-section__intro{color:#fff}
.home-section__head.has-hero .home-section__title{font-size:4rem}
.home-section__head.has-hero .home-section__intro{opacity:.9}
@media(max-width:749px){.home-section__head.has-hero{min-height:22rem;padding:2rem}.home-section__head.has-hero .home-section__title{font-size:3rem}}
.home-section__logo{flex:none;margin-left:auto}
.home-section__logo .pdp__brand-logo{height:5rem;max-width:20rem;margin:0 0 0 auto;object-position:right top}
.home-section__title{font-size:3.2rem;margin:0 0 .8rem}
.home-section__intro{margin:0;color:var(--muted);font-size:1.5rem}
.home-section__link{flex:none;display:inline-flex;align-items:center;gap:.6rem;font-size:1.6rem;font-weight:500;color:var(--fg);text-decoration:none}
.home-section__label{text-decoration:underline;text-underline-offset:.4rem;text-decoration-thickness:1px}
.home-section__arrow{display:inline-block;transition:transform .2s}
.home-section__link:hover .home-section__label{text-decoration-thickness:2px}
.home-section__link:hover .home-section__arrow{transform:translateX(.4rem)}
@media(max-width:749px){.home-section__head{flex-direction:column;align-items:flex-start}.home-section__title{font-size:2.4rem}}
.woocommerce ul.products li.sgs-product-card{display:flex;flex-direction:column;padding:2rem;background:#fff;border:1px solid var(--line);border-radius:var(--radius);text-align:center;transition:box-shadow .25s,border-color .25s}
.woocommerce ul.products li.sgs-product-card:hover{border-color:rgba(18,18,18,.2);box-shadow:0 1.4rem 3.4rem rgba(18,18,18,.2)}
.sgs-product-card .pdp-card{flex:1;align-items:stretch;text-align:center;color:var(--fg)}
.sgs-product-card .pdp-card__img{width:100%;overflow:hidden;margin-bottom:2rem;border:0;border-radius:var(--radius);background:#fff}
.woocommerce ul.products li.sgs-product-card img{padding:1.2rem;border-radius:0;transition:transform .4s ease}
.sgs-product-card:hover .pdp-card__img img{transform:scale(1.04)}
.sgs-product-card .pdp-badge{left:1.2rem;bottom:auto;top:1.2rem;padding:.4rem 1.2rem;font-size:1.1rem;letter-spacing:.08rem;text-transform:uppercase}
.sgs-product-card .pdp-card__body{display:flex;flex-direction:column;align-items:center;gap:1.2rem;margin-top:auto;text-align:center}
.sgs-product-card .pdp-card__meta{display:flex;flex-direction:column;align-items:center;gap:.5rem;min-width:0}
.sgs-product-card .pdp-card__brand{font-size:1.1rem;font-weight:500;letter-spacing:.18rem}
.sgs-product-card .pdp-card__title{font-size:1.7rem;font-weight:600;line-height:1.3;margin:0}
.sgs-product-card .pdp-card__model{font-size:1.2rem;letter-spacing:.04rem}
.sgs-product-card .pdp-card__price{flex:none;flex-direction:row;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:.4rem .8rem;margin:0;padding:0;text-align:center;font-size:1.7rem;font-weight:700;line-height:1.2}
.sgs-product-card .pdp-card__price s{order:0}
.sgs-product-card .pdp-card__price .sgs-price-was{margin:0;font-size:1.3rem;font-weight:400}
.sgs-product-card .pdp-card__price:has(s) .sgs-price-now{color:#c0392b}
.woocommerce ul.products li.sgs-product-card a.button{display:block;margin:2rem 0 0;padding:1.2rem 1.6rem;width:100%;text-align:center;font-size:1.4rem}
.woocommerce ul.products li.sgs-product-card a.button.loading{opacity:.6}
.woocommerce ul.products li.sgs-product-card a.added_to_cart{margin-top:1rem;font-size:1.3rem;text-align:center}
@media(max-width:989px){.woocommerce ul.products{gap:1.2rem}.woocommerce ul.products li.sgs-product-card{padding:1.2rem}.sgs-product-card .pdp-card__img{margin-bottom:1.4rem}.sgs-product-card .pdp-card__title{font-size:1.5rem}.sgs-product-card .pdp-card__price{font-size:1.5rem}.woocommerce ul.products li.sgs-product-card a.button{margin-top:1.4rem}}

/* Product grids: 1 column on mobile (3 desktop, 2 tablet) */
@media(max-width:749px){.woocommerce ul.products{grid-template-columns:1fr}}
.home main{padding-top:0;padding-bottom:0}
.home-section--featured .home-section__title{margin-bottom:2.4rem}
.home-section:last-child{padding-bottom:6rem}

/* WooCommerce sets li.product width (30.75% etc.) for its own float layout; our grid sizes the cards */
html .woocommerce ul.products[class*=columns-] li.product,html .woocommerce[class*=columns-] ul.products li.product,html .woocommerce-page ul.products[class*=columns-] li.product{width:auto;float:none;margin:0}

/* Page is grey everywhere; header and footer stay white */
.site-footer{background:#fff}

/* ---------- Material surfaces: white cards on the grey page, elevation instead of borders ---------- */
:root{--elev-1:0 1px 3px rgba(18,18,18,.12),0 1px 2px rgba(18,18,18,.08);--elev-2:0 3px 8px rgba(18,18,18,.14),0 2px 4px rgba(18,18,18,.08);--elev-3:0 1.4rem 3.4rem rgba(18,18,18,.2)}
.woocommerce ul.products li.sgs-product-card{border:0;box-shadow:var(--elev-1)}
.woocommerce ul.products li.sgs-product-card:hover{border:0;box-shadow:var(--elev-3)}
.pdp__buybox,.pdp__pickup,.sgs-checkout__side,.sgs-card{box-shadow:var(--elev-1)}
.sgs-card{border:0}
/* Cart: items and totals are each a card */
html .wc-block-cart .wc-block-cart__main,html .wc-block-cart .wc-block-cart__sidebar{background:#fff;border-radius:var(--radius);box-shadow:var(--elev-1);padding:2.4rem;box-sizing:border-box}
html .wc-block-cart .wc-block-cart__sidebar{align-self:flex-start}
html .wc-block-cart .wc-block-cart__main .wc-block-cart-items{margin:0}
@media(min-width:990px){html .wc-block-cart .wc-block-components-sidebar-layout{justify-content:space-between}html .wc-block-cart .wc-block-cart__main{width:calc(65% - 1.2rem)}html .wc-block-cart .wc-block-cart__sidebar{width:calc(35% - 1.2rem)}}
@media(max-width:989px){html .wc-block-cart .wc-block-cart__main,html .wc-block-cart .wc-block-cart__sidebar{padding:1.6rem;margin-bottom:1.6rem}}
/* Every button uses the shared radius, including WooCommerce block buttons */
html button,html .button,html input[type=submit],html input[type=button],html .wp-element-button,html .wp-block-button__link,html .wc-block-components-button,html .wc-block-components-button:not(.is-link),html .wc-block-components-totals-coupon__button,html .wc-block-cart__submit-button,html .wc-block-components-checkout-place-order-button,html .wc-block-components-quantity-selector,html .wc-block-components-quantity-selector input{border-radius:var(--radius)}
html .wc-block-components-button::before,html .wc-block-components-button:focus::after{border-radius:var(--radius)}
/* Cart: a tiny, fixed gap between the two cards */
@media(min-width:990px){html .wc-block-cart .wc-block-components-sidebar-layout{display:flex;flex-wrap:nowrap;justify-content:flex-start;gap:.8rem}html .wc-block-cart .wc-block-cart__main{width:calc(65% - .4rem);margin:0}html .wc-block-cart .wc-block-cart__sidebar{width:calc(35% - .4rem);margin:0}}
@media(max-width:989px){html .wc-block-cart .wc-block-cart__main{margin-bottom:.8rem}html .wc-block-cart .wc-block-cart__sidebar{margin-bottom:0}}

/* ---------- My Account: menu and content are cards with the same tiny gap ---------- */
html .woocommerce-account .woocommerce-MyAccount-navigation,html .woocommerce-account .woocommerce-MyAccount-content,html .woocommerce-account .woocommerce-form-login,html .woocommerce-account .woocommerce-form-register,html .woocommerce-account .woocommerce-ResetPassword,html .woocommerce-account .woocommerce-EditAccountForm{background:#fff;border:0;border-radius:var(--radius);box-shadow:var(--elev-1);padding:2.4rem;box-sizing:border-box;float:none;width:auto;margin:0}
html .woocommerce-account .woocommerce-EditAccountForm,html .woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm{box-shadow:none;padding:0}
html .woocommerce-account .woocommerce-form-login,html .woocommerce-account .woocommerce-form-register,html .woocommerce-account .woocommerce-ResetPassword{max-width:48rem}
html .woocommerce-account .u-columns{display:flex;flex-wrap:wrap;gap:.8rem;align-items:flex-start}
html .woocommerce-account .u-columns .u-column1,html .woocommerce-account .u-columns .u-column2{float:none;width:auto;flex:1 1 32rem;margin:0}
html .woocommerce-account .woocommerce-MyAccount-navigation ul{list-style:none;margin:0;padding:0}
html .woocommerce-account .woocommerce-MyAccount-navigation li a{display:block;padding:1rem 1.2rem;border-radius:var(--radius);text-decoration:none}
html .woocommerce-account .woocommerce-MyAccount-navigation li a:hover{background:var(--soft)}
html .woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{background:var(--soft);font-weight:600}
@media(min-width:750px){html .woocommerce-account.logged-in .woocommerce{display:grid;grid-template-columns:minmax(22rem,28%) minmax(0,1fr);gap:.8rem;align-items:start}html .woocommerce-account.logged-in .woocommerce-notices-wrapper{grid-column:1/-1}}
@media(max-width:749px){html .woocommerce-account .woocommerce-MyAccount-navigation{margin-bottom:.8rem}html .woocommerce-account .woocommerce-MyAccount-navigation,html .woocommerce-account .woocommerce-MyAccount-content,html .woocommerce-account .woocommerce-form-login{padding:1.6rem}}
/* WooCommerce clearfix pseudo-elements would become empty grid items and push the menu out of its column */
html .woocommerce-account .woocommerce::before,html .woocommerce-account .woocommerce::after{display:none}

/* My Account > Orders: compact action buttons, left-aligned on one line */
html .woocommerce-account td.woocommerce-orders-table__cell-order-actions{text-align:left;white-space:nowrap}
/* Small, low-padding button: add class "button--sm" to any .button (the orders table buttons are WooCommerce-generated, so they are listed here) */
html .button.button--sm,html .woocommerce-account .woocommerce-orders-table__cell-order-actions .button{display:inline-block;padding:.6rem 1.2rem;font-size:1.3rem;line-height:1.2;white-space:nowrap}
html .woocommerce-account .woocommerce-orders-table__cell-order-actions .button{margin:0 .6rem 0 0}
html .woocommerce-account .woocommerce-orders-table__cell-order-actions .button:last-child{margin-right:0}
html .woocommerce-account th.woocommerce-orders-table__header-order-actions{text-align:left}

/* My Account > Addresses: Edit link sits left, next to the heading */
html .woocommerce-account .woocommerce-Address-title{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:flex-start;gap:.4rem 1.6rem}
html .woocommerce-account .woocommerce-Address-title h2,html .woocommerce-account .woocommerce-Address-title h3{margin:0 0 1rem}
html .woocommerce-account .woocommerce-Address-title a.edit,html .woocommerce-account .addresses .title .edit{float:none;margin:0;text-align:left}

/* Main menu items that open a panel of products (the genders, Polarized) */
.sgs-mega--products{padding:2rem 0 2.4rem}
.sgs-mega__head{display:flex;align-items:baseline;justify-content:space-between;gap:2rem;margin-bottom:1.4rem}
.sgs-mega__head .sgs-mega__h{margin:0}
.sgs-mega--products .sgs-mega__all{margin:0;padding:0}
.sgs-mega .sgs-mega__products{display:grid;grid-template-columns:repeat(4,1fr);gap:1.6rem 2rem;max-height:none;overflow:visible}
.sgs-mega-card{display:flex;flex-direction:column;gap:.3rem;text-decoration:none;color:var(--fg)}
.sgs-mega .sgs-mega-card{padding:0}
.sgs-mega-card__img{display:block;aspect-ratio:2/1;background:#fff;border:1px solid var(--line);border-radius:.8rem;overflow:hidden;margin-bottom:.6rem}
.sgs-mega-card__img img{width:100%;height:100%;object-fit:contain;aspect-ratio:auto;transition:transform .25s}
.sgs-mega-card:hover .sgs-mega-card__img img{transform:scale(1.04)}
.sgs-mega-card__brand{font:500 1.1rem var(--font-nav);letter-spacing:.16rem;text-transform:uppercase;color:var(--muted)}
.sgs-mega-card__title{font:600 1.5rem/1.3 var(--font)}
.sgs-mega-card__price{font:700 1.4rem var(--font);display:flex;gap:.6rem;align-items:baseline}
.sgs-mega-card__price .sgs-price-was{font-weight:400;font-size:1.2rem}
@media(max-width:989px){.sgs-mega .sgs-mega__products{grid-template-columns:repeat(3,1fr)}}
@media(max-width:749px){.sgs-drawer a.sgs-drawer__top{border-bottom:1px solid var(--line)}}
html .woocommerce-account .woocommerce-Address-title h2,html .woocommerce-account .woocommerce-Address-title h3{font-size:1.9rem;text-align:left}
html .woocommerce-account .woocommerce-Addresses address{text-align:left}
/* Addresses: Edit link under the heading; heading has no padding or margin */
html .woocommerce-account .woocommerce-Address-title{flex-direction:column;flex-wrap:nowrap;align-items:flex-start;gap:.4rem;padding:0;margin:0 0 1rem}
html .woocommerce-account .woocommerce-Address-title h2,html .woocommerce-account .woocommerce-Address-title h3{margin:0;padding:0}

/* My Account > Account details: password fields appear when "Change password" is ticked (no JS needed) */
html .screen-reader-text{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
html .woocommerce-account .sgs-pw-toggle{display:flex;align-items:center;gap:.8rem;margin:1.6rem 0}
html .woocommerce-account .sgs-pw-toggle input[type=checkbox]{width:1.8rem;height:1.8rem;margin:0;padding:0;accent-color:var(--fg);cursor:pointer}
html .woocommerce-account .sgs-pw-toggle label{margin:0;cursor:pointer;font-weight:500}
html .woocommerce-account form.edit-account:has(#sgs-change-pw:not(:checked)) fieldset:has(#password_1){display:none}
html .woocommerce-account form.edit-account fieldset{border:0;padding:0;margin:0 0 1.6rem}

/* PDP gallery: images sit on a white tile with padding */
html .pdp__img{background:#fff;padding:2rem;box-sizing:border-box;border-radius:var(--radius)}
html .pdp__img.is-main{padding:3rem}
@media(max-width:749px){html .pdp__img{padding:1.2rem}html .pdp__img.is-main{padding:1.6rem}}

/* Product names stay in the body font (Instrument Sans) (headings elsewhere use Playfair Display) */
html .pdp__title,html .woocommerce-loop-product__title,html .wc-block-components-product-name{font-family:var(--font)}
/* 3-image gallery: small thumbnails under the hero; clicking one swaps it into the hero */
html .pdp__thumbs .pdp__thumb{display:block;width:100%;margin:0;padding:1.2rem;background:#fff;color:inherit;border:0;border-radius:var(--radius);cursor:pointer;line-height:0;transition:box-shadow .2s}
html .pdp__thumbs .pdp__thumb:hover,html .pdp__thumbs .pdp__thumb:focus-visible{background:#fff;box-shadow:var(--elev-2)}
html .pdp__thumb img{width:100%;height:auto;display:block}
/* WooCommerce sets ".woocommerce-page img{height:auto;max-width:100%}", which outranks the plain class above */
html .pdp__brand .pdp__brand-logo{width:auto;height:auto;max-height:6.4rem;max-width:18rem}

/* ---------- Pay over time card (product page) ---------- */
.pdp__payover{background:#fff;border-radius:var(--radius);box-shadow:var(--elev-1);padding:2rem;margin-top:1.6rem}
.pdp__payover-title{font-size:1.8rem;margin:0 0 1.4rem}
.payover__placeholder{margin:0;color:var(--muted)}
.payover__item{padding:1.4rem 0;border-top:1px solid var(--line);font-size:1.4rem}
.payover__item:first-of-type{border-top:0;padding-top:.4rem}
.payover__item:last-child{padding-bottom:0}
.sgs-mega ul.has-images li{display:flex}
.sgs-mega ul.has-images li a{flex:1;height:auto;min-height:7rem}
.sgs-mega li a.sgs-mega__logo.has-caption{min-height:9rem}
.pdp__perks a,.pdp__perks a:hover,.pdp__perks a:focus{color:inherit;text-decoration:none}

/* ---------- Homepage brand scroller (parts/brand-scroller.php) ---------- */
.brand-scroller{padding:3.2rem 0 2.4rem;background:#fff;border-bottom:1px solid var(--line)}
.brand-scroller__title{font-size:2.4rem;margin:0 0 2rem}
.brand-scroller__viewport{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.brand-scroller__track{display:flex;width:max-content;gap:1.6rem;margin:0;padding:.4rem 0;list-style:none}
.brand-scroller__viewport::-webkit-scrollbar{display:none}
.brand-scroller:not(.is-live) li[aria-hidden]{display:none} /* the loop copy is only needed once sgs.js drives it */
.brand-scroller__track li{flex:none}
.brand-scroller__track a{display:flex;align-items:center;justify-content:center;width:19rem;height:9rem;padding:1.6rem 2rem;background:#fff;border:1px solid var(--line);border-radius:var(--radius);transition:box-shadow .25s,border-color .25s}
.brand-scroller__track a:hover{border-color:rgba(18,18,18,.35);box-shadow:0 .8rem 2rem rgba(18,18,18,.14)}
.brand-scroller__track img,.brand-scroller__track svg{width:100%;height:100%;object-fit:contain;display:block}
@media(prefers-reduced-motion:reduce){.brand-scroller__viewport{-webkit-mask-image:none;mask-image:none}.brand-scroller__track{padding:.4rem 1.6rem}}
@media(max-width:749px){.brand-scroller{padding:2.4rem 0 1.6rem}.brand-scroller__track a{width:14rem;height:7rem;padding:1.2rem 1.4rem}.brand-scroller__title{font-size:2rem}}
/* "View more" sits under the product grid */
.home-section__more{margin:0;text-align:right}
html .home-section .woocommerce ul.products,html .home-section ul.products{margin-bottom:1.6rem}
@media(max-width:749px){.home-section__logo{margin-left:0}.home-section__more{text-align:left}}
.home-section__head.has-hero{align-items:stretch}.home-section__head.has-hero .home-section__text{align-self:flex-end}.home-section__head.has-hero .home-section__logo{align-self:flex-start}
@media(max-width:749px){.home-section__head{flex-direction:column-reverse;align-items:flex-start}.home-section__head.has-hero{flex-direction:column-reverse;align-items:flex-start}}
/* Header: brand logo to the left of the title */
.home-section__head,.home-section__head.has-hero{flex-direction:row;justify-content:flex-start;align-items:center;gap:2rem}
.home-section__head.has-hero{align-items:flex-end}
.home-section__logo,.home-section__head.has-hero .home-section__logo{flex:none;margin:0;align-self:auto}
.home-section__head.has-hero .home-section__text{align-self:auto}
.home-section__logo .pdp__brand-logo{margin:0;object-position:left center}
@media(max-width:749px){.home-section__head,.home-section__head.has-hero{flex-direction:column;align-items:flex-start;gap:1.2rem}}

/* Mobile overflow: third-party pay-over widgets must not widen the product layout */
html .pdp{grid-template-columns:minmax(0,1fr)}
@media(min-width:990px){html .pdp{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}}
html .pdp__media,html .pdp__info{min-width:0;max-width:100%}
html .pdp__payover,html .payover__item,html .payover__embed{min-width:0;max-width:100%;overflow:hidden}
html .payover__item *{max-width:100%;box-sizing:border-box}
html .payover__item img,html .payover__item iframe,html .payover__item svg{max-width:100%;height:auto}
html .payover__item iframe{width:100%}
/* Homepage section heading: the brand logo is the <h2> (alt text = brand name) */
html .home-section__title--logo{display:block;margin:0 0 .8rem;font-size:0;line-height:0}
html .home-section__title--logo .pdp__brand-logo{display:block;width:auto;height:5rem;max-width:20rem;margin:0;object-position:left center}

/* ---------- Homepage "Pick your look" (parts/frame-grid.php) ---------- */
.look-grid{padding:4rem 0 3.2rem;background:#fff}
.look-grid__title{font-size:3.2rem;margin:0 0 2rem}
.look-grid__list{--cols:7;--gap:1.2rem;display:flex;flex-wrap:wrap;justify-content:center;gap:var(--gap);margin:0;padding:0;list-style:none} /* a short last row is centred */
.look-grid__list li{width:calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols))}
.look-grid__list a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem;padding:1.4rem 1.2rem 1.1rem;color:var(--fg);text-decoration:none;background:#fff;border:1px solid var(--line);border-radius:var(--radius);transition:box-shadow .25s,border-color .25s,transform .25s}
.look-grid__list a:hover{border-color:rgba(18,18,18,.35);box-shadow:0 .8rem 2rem rgba(18,18,18,.16);transform:translateY(-.2rem)}
.look-grid__list img{width:100%;height:4.4rem;object-fit:contain}
.look-grid__list span{font-size:1.2rem;font-weight:500;line-height:1.2;text-align:center}
@media(max-width:989px){.look-grid__list{--cols:5;--gap:1rem}}
@media(max-width:749px){.look-grid{padding:3rem 0 2.4rem}.look-grid__title{font-size:2.4rem}.look-grid__list{--cols:3;--gap:.8rem}.look-grid__list a{padding:1rem .6rem .8rem}.look-grid__list img{height:3.6rem}.look-grid__list span{font-size:1.1rem}}
/* Centre the head block itself (it is a shrink-wrapped flex item, so text-align alone does nothing) */
html .home-section__head,html .home-section__head.has-hero{justify-content:center;align-items:center}
html .home-section__head .home-section__text{margin:0 auto}
html .home-section__head.has-hero{align-items:flex-end}
@media(max-width:749px){html .home-section__head,html .home-section__head.has-hero{align-items:center}}

/* Notices that carry a button (e.g. My Account "Confirm email address"): on phones the message sits on top and the button fills the width below it, instead of the text being squeezed into a sliver beside it */
@media(max-width:749px){
.woocommerce-info:has(>.button.wc-forward),.woocommerce-message:has(>.button.wc-forward){display:flex;flex-direction:column-reverse;align-items:stretch;gap:1.2rem;padding:1.6rem;line-height:1.5}
.woocommerce-info:has(>.button.wc-forward)::before,.woocommerce-message:has(>.button.wc-forward)::before{display:none}
.woocommerce-info>.button.wc-forward,.woocommerce-message>.button.wc-forward{float:none;order:0;width:100%;margin:0;text-align:center;box-sizing:border-box}
}

/* My Account > Orders on phones: WooCommerce stacks each order as label/value lines, so give every order its own bordered card with space between them */
@media(max-width:768px){
html .woocommerce-account table.woocommerce-orders-table{border:0;background:none}
html .woocommerce-account table.woocommerce-orders-table tr{display:block;margin:0 0 1.6rem;border:1px solid var(--line);border-radius:var(--radius);background:#fff;overflow:hidden;box-shadow:var(--elev-1,0 1px 3px rgba(0,0,0,.08))}
html .woocommerce-account table.woocommerce-orders-table tr:last-child{margin-bottom:0}
html .woocommerce-account table.woocommerce-orders-table td{border-color:var(--line)}
html .woocommerce-account table.woocommerce-orders-table tr td:first-child{background:var(--soft);font-weight:600}
html .woocommerce-account table.woocommerce-orders-table tr td:last-child{border-bottom:0}
}

/* Brand page hero: full width (edge to edge, outside .wrap) */
html .brand-hero{border-radius:0;margin-bottom:2.4rem;justify-content:center;align-items:center}
html main:has(>.brand-hero){padding-top:0}

/* Brand pages, white-labelled: --brand / --brand-ink come from the brand's colour fields */
html .brand-page .brand-hero{background-color:var(--brand,#111);color:var(--brand-ink,#fff)}
html .brand-page .brand-hero::before{background:linear-gradient(90deg,color-mix(in srgb,var(--brand) 92%,transparent),color-mix(in srgb,var(--brand) 25%,transparent))}
html .brand-page .brand-hero .home-section__title,html .brand-page .brand-hero .home-section__intro{color:var(--brand-ink)}
html .brand-hero--boxed .home-section__title--logo .pdp__brand-logo{background:#fff;padding:1.2rem 2rem;border-radius:var(--radius);box-sizing:content-box}
html .brand-page .button,html .brand-page .woocommerce-pagination .page-numbers.current{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
html .brand-page .woocommerce-pagination .page-numbers a:hover{color:var(--brand)}
html .brand-page .sgs-product-card:hover{box-shadow:0 0 0 2px var(--brand),var(--elev-2)}
html .brand-page .sgs-product-card .pdp-card__price{color:var(--brand)}
html .brand-page select:focus,html .brand-page input:focus{outline:2px solid var(--brand);outline-offset:1px}
/* Brand page logo: larger than the homepage section logo */
html .brand-hero .home-section__title--logo .pdp__brand-logo{height:11rem;max-width:36rem;width:auto}
@media(max-width:749px){html .brand-hero .home-section__title--logo .pdp__brand-logo{height:7.5rem;max-width:26rem}}
/* Brand page banner: content centred both ways (beats the has-hero bottom alignment) */
html .home-section__head.has-hero.brand-hero{align-items:center;justify-content:center;text-align:center}
html .brand-hero .home-section__text{align-self:center;text-align:center}
html .brand-hero .home-section__title,html .brand-hero .home-section__intro{margin-left:auto;margin-right:auto}
/* Brand page with no banner: large centred logo, no background */
html .brand-plain-head{text-align:center;margin-bottom:2.4rem}
html .brand-plain-head .home-section__title--logo{margin:0 0 1rem}
html .brand-plain-head .home-section__title--logo .pdp__brand-logo{height:11rem;max-width:36rem;width:auto;margin:0 auto;object-position:center;background:none;padding:0}
html .brand-plain-head .home-section__intro{margin:0 auto}
@media(max-width:749px){html .brand-plain-head .home-section__title--logo .pdp__brand-logo{height:7.5rem;max-width:26rem}}
html .brand-hero--solid::before{display:none}

/* Brand logos on the homepage and in the menu sit on the brand colour (inline background, from the brand's colour field) */
html .home-section__title--logo.has-bg{display:inline-block;padding:1.2rem 2rem;border-radius:var(--radius);line-height:0}

/* Brand logo tiles (homepage strip, megamenu): same tile size, less padding so the logo is taller */
html .brand-scroller__track a{padding:.6rem 1.2rem}
html .sgs-mega li a.sgs-mega__logo:not(.has-caption),html .sgs-mega ul.has-images li a.sgs-mega__logo:not(.has-caption){padding:.4rem .8rem}
@media(max-width:749px){html .brand-scroller__track a{padding:.5rem .8rem}}
html .brand-scroller__track a{padding:.4rem .5rem}
@media(max-width:749px){html .brand-scroller__track a{padding:.3rem .4rem}}
/* Brand page banner logo: taller (banner size unchanged) */
html .brand-hero .home-section__title--logo .pdp__brand-logo{height:16rem;max-width:56rem}
@media(max-width:749px){html .brand-hero .home-section__title--logo .pdp__brand-logo{height:10rem;max-width:30rem}}
html .brand-hero .home-section__title--logo .pdp__brand-logo{max-width:72rem}

/* Brands / Frame design / Age group menu panels: terms on the left, products on the right */
html .sgs-mega--tax .sgs-mega__layout{grid-template-columns:38rem minmax(0,1fr);min-height:0}
html .sgs-mega--tax .sgs-mega__tabs{display:grid;grid-template-columns:1fr 1fr;align-content:start;gap:.2rem;max-height:44rem;overflow-y:auto;scrollbar-width:thin;padding:1.6rem 1.6rem 1.6rem 0}
html .sgs-mega--tax .sgs-mega__term{display:flex;align-items:center;gap:.8rem;justify-content:flex-start;padding:.7rem 1rem;font:500 1.4rem var(--font);text-decoration:none;color:var(--fg);border-radius:var(--radius)}
html .sgs-mega--tax .sgs-mega__term img{flex:none;width:4rem;height:2.4rem;object-fit:contain}
html .sgs-mega--tax .sgs-mega__panes{padding:2rem 0 2.4rem 3.2rem;transition:opacity .15s}
html .sgs-mega--tax .sgs-mega__panes.is-loading{opacity:.55}
html .sgs-mega--tax .sgs-mega__head{display:flex;align-items:baseline;justify-content:space-between;gap:2rem;margin-bottom:1.4rem}
html .sgs-mega--tax .sgs-mega__head .sgs-mega__h{margin:0}
html .sgs-mega--tax .sgs-mega__all{margin:0;padding:0}
@media(max-width:989px){html .sgs-mega--tax .sgs-mega__layout{grid-template-columns:28rem minmax(0,1fr)}html .sgs-mega--tax .sgs-mega__tabs{grid-template-columns:1fr}}

/* Homepage brand strip: no border around the logo tiles */
html .brand-scroller__track a,html .brand-scroller__track a:hover{border:0}

/* Homepage brand sections alternate grey / white, full width */
html .home-section.is-alt{--section-bg:#fff}
/* A brand section on its brand colour: text that sits on the background uses the brand's text colour */
html .home-section.has-brand-bg .home-section__intro,html .home-section.has-brand-bg .home-section__link,html .home-section.has-brand-bg .home-section__label{color:var(--section-ink)}
html .home-section.has-brand-bg .home-section__title--logo.has-bg{padding:0;background:none!important}
/* Homepage brand logo: the width sets the size, the height follows from the logo's own proportions */
html .home-section__title--logo .pdp__brand-logo{width:var(--logo-w,16rem);height:auto;max-width:100%;max-height:none}
@media(max-width:749px){html .home-section__title--logo .pdp__brand-logo{width:min(var(--logo-w,16rem),70vw)}}
/* The brand logo heading links to the brand page */
html .home-section__logo-link{display:block;line-height:0;text-decoration:none;transition:opacity .2s}
html .home-section__logo-link:hover{opacity:.8}
html .home-section__logo-link{display:inline-block}
html .home-section__logo-link,html .home-section__logo-link:hover{opacity:1;transition:none}
/* Homepage brand strip: horizontal padding around each logo */
html .brand-scroller__track a{padding:.4rem 2.4rem}
@media(max-width:749px){html .brand-scroller__track a{padding:.3rem 1.6rem}}
/* Homepage brand strip: smaller tiles so more logos fit on screen at once */
html .brand-scroller__track a{width:14rem;height:6.4rem;padding:.4rem 1.8rem}
html .brand-scroller__track{gap:1.2rem}
@media(max-width:749px){html .brand-scroller__track a{width:11rem;height:5rem;padding:.3rem 1.2rem}html .brand-scroller__track{gap:1rem}}

/* Fit panel: one column, each option a full-width image with its name under it */
html .sgs-mega--pa_frame-design .sgs-mega__layout{grid-template-columns:24rem minmax(0,1fr)}
html .sgs-mega--pa_frame-design .sgs-mega__tabs{grid-template-columns:minmax(0,1fr);gap:.6rem}
html .sgs-mega--pa_frame-design .sgs-mega__term{flex-direction:column;align-items:stretch;gap:.4rem;padding:.8rem 1rem;text-align:center;font-size:1.3rem}
html .sgs-mega--pa_frame-design .sgs-mega__term img{width:100%;height:5rem;object-fit:contain}

/* Brands panel: the brand logo replaces the name above the products (box in the brand colour when it has one) */
html .sgs-mega__h--logo{display:inline-flex;align-items:center;margin:0;line-height:0;letter-spacing:0;text-transform:none}
html .sgs-mega__h--logo img{display:block;width:auto;height:4.4rem;max-width:20rem;object-fit:contain}
html .sgs-mega__h--logo.has-bg{padding:.6rem 1.2rem;border-radius:var(--radius)}
/* Header cart (desktop): icon beside the text */
html .sgs-cart__btn{display:inline-flex;align-items:center;gap:.7rem}
html .sgs-cart__icon{flex:none;display:block}

/* Filter button, chips and panel */
html .sgs-shoptools{display:flex;flex-wrap:wrap;align-items:center;gap:1.2rem;margin-bottom:1.6rem}
html .sgs-shoptools .woocommerce-result-count{float:none;margin:0 auto 0 0}
html .sgs-shoptools .woocommerce-ordering{float:none;margin:0}
html .sgs-filter__open{display:inline-flex;align-items:center;gap:.7rem;padding:1rem 1.6rem;font-size:1.4rem}
html .sgs-filter__n{display:inline-block;min-width:1.8rem;height:1.8rem;padding:0 .5rem;border-radius:var(--radius);background:#fff;color:var(--fg);font:600 1.1rem/1.8rem var(--font);text-align:center}
html .sgs-chips{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;margin:0 0 1.6rem}
html .sgs-chip{display:inline-flex;gap:.6rem;align-items:center;padding:.6rem 1.2rem;background:#fff;border:1px solid var(--line);border-radius:var(--radius);font-size:1.3rem;text-decoration:none;color:var(--fg)}
html .sgs-chip:hover{border-color:var(--fg)}
html .sgs-chips__clear{font-size:1.3rem;text-decoration:underline;text-underline-offset:.3rem;color:var(--muted)}
dialog.sgs-filter{margin:0 0 0 auto;width:min(42rem,100%);height:100dvh;max-height:100dvh;padding:0;border:0;background:#fff;color:var(--fg);box-shadow:var(--elev-3)}
dialog.sgs-filter::backdrop{background:rgba(0,0,0,.45)}
.sgs-filter__form{display:flex;flex-direction:column;height:100%}
.sgs-filter__head{display:flex;align-items:center;justify-content:space-between;padding:1.6rem 2rem;border-bottom:1px solid var(--line)}
.sgs-filter__head h2{margin:0;font-size:2.2rem}
.sgs-filter__close{background:none;border:0;color:var(--fg);font-size:3rem;line-height:1;padding:0 .4rem;cursor:pointer}
.sgs-filter__body{flex:1;overflow-y:auto;padding:.8rem 2rem 2rem}
.sgs-filter__group{border-bottom:1px solid var(--line);padding:1.2rem 0}
.sgs-filter__group summary{cursor:pointer;font:600 1.5rem var(--font);list-style:none;display:flex;justify-content:space-between}
.sgs-filter__group summary::-webkit-details-marker{display:none}
.sgs-filter__group summary::after{content:"+";color:var(--muted)}
.sgs-filter__group[open] summary::after{content:"\2212"}
.sgs-filter__group em{font-style:normal;color:var(--muted);font-weight:400}
.sgs-filter__boxes{display:grid;grid-template-columns:1fr 1fr;gap:.4rem 1.2rem;max-height:24rem;overflow-y:auto;margin-top:1rem;scrollbar-width:thin}
.sgs-filter__boxes label,.sgs-filter__stock{display:flex;align-items:center;gap:.8rem;font-size:1.4rem;padding:.4rem 0;cursor:pointer}
.sgs-filter__price{display:flex;align-items:center;gap:1rem;border:0;border-bottom:1px solid var(--line);margin:0;padding:1.4rem 0}
.sgs-filter__price legend{font:600 1.5rem var(--font);padding:0 0 .8rem;float:left;width:100%}
.sgs-filter__price input{flex:1;min-width:0;padding:1rem 1.2rem;border:1px solid var(--line);border-radius:var(--radius);font:inherit}
.sgs-filter__stock{padding:1.4rem 0}
.sgs-filter__foot{display:flex;align-items:center;justify-content:space-between;gap:1.6rem;padding:1.4rem 2rem;border-top:1px solid var(--line);background:#fff}
.sgs-filter__foot a{font-size:1.4rem;text-decoration:underline;text-underline-offset:.3rem;color:var(--fg)}

/* Menu product cards: the whole product sits in one card; no grey hover fill, nothing spills out */
html .sgs-mega li a.sgs-mega-card{display:flex;flex-direction:column;gap:.3rem;min-width:0;padding:1rem;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;text-align:center;transition:box-shadow .2s,border-color .2s}
html .sgs-mega li a.sgs-mega-card:hover{background:#fff;border-color:rgba(18,18,18,.3);box-shadow:var(--elev-2)}
html .sgs-mega-card__img{border:0;border-radius:0;margin-bottom:.6rem;aspect-ratio:2/1}
html .sgs-mega-card__brand,html .sgs-mega-card__title,html .sgs-mega-card__price{max-width:100%;overflow-wrap:anywhere}
html .sgs-mega-card__price{justify-content:center;flex-wrap:wrap}
html .sgs-mega .sgs-mega__products li{min-width:0}

/* PDP: brand colour box behind the logo */
html .pdp__brand.has-logo.has-bg{display:inline-block;padding:.9rem 1.4rem;border-radius:var(--radius)}

html .sgs-filter__price{display:block;border:0;border-bottom:1px solid var(--line);margin:0;padding:1.4rem 0}
html .sgs-filter__price legend{float:none;width:auto;padding:0 0 .8rem}
html .sgs-filter__row{display:flex;align-items:center;gap:1rem}
html .sgs-filter__body:focus{outline:0}
html .sgs-filter__close:focus:not(:focus-visible){outline:0}
html .sgs-mega .sgs-mega__products li{display:flex}
html .sgs-mega li a.sgs-mega-card{flex:1;height:auto}

/* "No products were found" and other WooCommerce info notices: white card, round border, no icon, no thick top border */
html .woocommerce-info{background:#fff;color:var(--fg);border:1px solid var(--line);border-top:1px solid var(--line);border-radius:var(--radius);padding:1.6rem 2rem;margin:0 0 2rem;box-shadow:none}
html .woocommerce-info::before{display:none;content:none}
html .woocommerce-info a.button{margin-left:1.2rem}

/* Filter panel: price inputs stay inside the panel */
html .sgs-filter__row input{box-sizing:border-box;width:100%;min-width:0}

/* PDP brand logo on its colour box needs a size of its own (the box shrinks to the logo) */
html .pdp__brand.has-bg .pdp__brand-logo{height:4.4rem;width:auto;max-width:18rem;max-height:none}
html .sgs-mega .sgs-mega__products li{align-items:stretch}

/* Menu: hovering a product card or term never underlines its text (the "View all" links keep theirs) */
html .sgs-mega li a,html .sgs-mega li a:hover,html .sgs-mega li a:focus,html .sgs-mega li a:hover *{text-decoration:none}
html .sgs-mega a.sgs-mega__tab,html .sgs-mega a.sgs-mega__tab:hover,html .sgs-mega a.sgs-mega__tab:focus{text-decoration:none}

/* Filter button: same look as the sort dropdown (white, thin border, 44px, 16px text) */
html .sgs-shoptools .sgs-filter__open.button{box-sizing:border-box;height:4.4rem;padding:1rem 1.2rem;background:#fff;color:var(--fg);border:1px solid var(--line);border-radius:var(--radius);font:400 1.6rem/1 var(--font);gap:.8rem}
html .sgs-shoptools .sgs-filter__open.button:hover{background:#fff;border-color:rgba(18,18,18,.3)}
html .sgs-filter__n{background:var(--fg);color:#fff}

/* Megamenu hover area with no dead strips: spacing is padding inside the hoverable boxes, not gaps or margins between them */
@media(min-width:750px){
	html .site-header .wrap{padding-top:0;padding-bottom:0}                /* the header's vertical space moves into its children, so nav items reach the panel */
	html .site-header .wrap>a{display:flex;padding:1rem 0}                 /* logo */
	html .site-nav>ul{gap:0}                                               /* was a 2.4rem gap between items */
	html .site-nav>ul>li{padding:0 1.2rem}                                 /* ...now padding on each item, so the pointer never leaves the hover area between them */
	html .sgs-mega::before{display:none}                                   /* the 14px "bridge" hack is no longer needed: nothing sits between the item and the panel */
	html .sgs-mega--tax .sgs-mega__tabs{gap:0}
	html .sgs-mega--tax .sgs-mega__term{padding:.8rem 1rem}
	html .sgs-mega--pa_frame-design .sgs-mega__tabs{gap:0}
	html .sgs-mega--pa_frame-design .sgs-mega__term{padding:1rem}
}
/* A short grace period before a panel closes, so a slipped pointer does not close it (opening is instant) */
@media(min-width:750px){
	html .sgs-mega{display:block;visibility:hidden;opacity:0;pointer-events:none;transition:opacity .15s ease .15s,visibility 0s linear .3s}
	html .has-mega:hover>.sgs-mega,html .has-mega:focus-within>.sgs-mega,html .has-mega.is-open>.sgs-mega{visibility:visible;opacity:1;pointer-events:auto;transition-delay:0s}
}

/* Footer links: no underline, hovered or not */
html .site-footer a,html .site-footer a:hover,html .site-footer a:focus{text-decoration:none}

/* Load more (replaces numbered pagination) */
html .sgs-loadmore-wrap{display:flex;justify-content:center;margin:3.2rem 0 1rem}
html .sgs-loadmore{display:inline-block;box-sizing:border-box;min-width:20rem;padding:1.3rem 3.2rem;background:#fff;color:var(--fg);border:1px solid var(--line);border-radius:var(--radius);font:500 1.5rem/1 var(--font);text-align:center;text-decoration:none;cursor:pointer;transition:border-color .15s,box-shadow .15s}
html .sgs-loadmore:hover{border-color:rgba(18,18,18,.3);box-shadow:var(--elev-1);text-decoration:none}
html .sgs-loadmore[aria-busy=true]{opacity:.6;pointer-events:none}

/* Product card: the brand logo sits at the top right of the card (on the brand colour when it has one) */
html .sgs-product-card .pdp-card__logo{align-self:flex-end;display:flex;align-items:center;justify-content:center;margin:0 0 1rem;padding:0;background:none;border:0;border-radius:var(--radius);line-height:0}
html .sgs-product-card .pdp-card__logo.has-bg{padding:.6rem 1rem}
html .woocommerce ul.products li.sgs-product-card .pdp-card__logo img{display:block;width:auto;height:var(--lh,2.2rem);max-width:none;min-width:0;padding:0;margin:0;background:none;border-radius:0;object-fit:contain;aspect-ratio:auto;transform:none;transition:none}
html .sgs-product-card:hover .pdp-card__logo img{transform:none}
@media(max-width:749px){html .sgs-product-card .pdp-card__logo{margin-bottom:.8rem;padding:.4rem .8rem}html .woocommerce ul.products li.sgs-product-card .pdp-card__logo img{height:calc(var(--lh,2.2rem) * .8)}}

/* Product card text is left aligned (the brand logo badge stays top right) */
html .sgs-product-card .pdp-card,html .sgs-product-card .pdp-card__body{align-items:stretch;text-align:left}
html .sgs-product-card .pdp-card__meta{display:flex;flex-direction:column;align-items:flex-start}
html .sgs-product-card .pdp-card__price{justify-content:flex-start;text-align:left}

/* Card body: text left, brand logo bottom right */
html .sgs-product-card .pdp-card__body{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;column-gap:1.2rem}
html .sgs-product-card .pdp-card__meta,html .sgs-product-card .pdp-card__price{grid-column:1}
html .sgs-product-card .pdp-card__logo{grid-column:2;grid-row:1 / span 2;align-self:end;justify-self:end;margin:0}
/* Logo badge: never wider than 11rem, whatever the SVG's own size (ratio is unknown for SVGs, so height alone can't bound the width) */
html .woocommerce ul.products li.sgs-product-card .pdp-card__logo img{max-width:11rem;max-height:4.4rem}
html .woocommerce ul.products li.sgs-product-card .pdp-card__logo{max-width:100%;min-width:0}

/* Desktop: My account is an icon beside the cart */
.sgs-header-actions{display:flex;align-items:center;gap:2rem}
.sgs-account{display:inline-flex;align-items:center;padding:.6rem 0;color:var(--fg)}
.sgs-account svg{display:block}
@media(min-width:750px){.site-nav .sgs-hide-desktop{display:none}}
@media(max-width:749px){.site-header .sgs-header-actions{display:none}}

/* Move to top button */
.sgs-totop{position:fixed;right:2.4rem;bottom:2.4rem;z-index:800;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;height:4.4rem;min-width:4.4rem;padding:0 1.4rem;background:var(--fg);color:#fff;border:0;border-radius:var(--radius);box-shadow:var(--elev-2);font:500 1.4rem/1 var(--font);cursor:pointer;opacity:0;transform:translateY(.8rem);transition:opacity .2s,transform .2s}
.sgs-totop[hidden]{display:none}
.sgs-totop.is-visible{opacity:1;transform:none}
.sgs-totop:focus-visible{outline:2px solid var(--fg);outline-offset:3px}
@media(max-width:749px){.sgs-totop{right:1.2rem;bottom:calc(7rem + env(safe-area-inset-bottom));padding:0}.sgs-totop span{display:none}}

/* Full Screen page template: back button + logo bar, content fills the rest */
body.sgs-fullscreen{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh;background:#fff}
.fs-bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:.8rem 2rem;padding-top:max(.8rem,env(safe-area-inset-top));background:#fff;border-bottom:1px solid var(--line)}
.fs-back{justify-self:start;display:inline-flex;align-items:center;gap:.6rem;height:4.4rem;padding:0 1.4rem 0 1rem;color:var(--fg);text-decoration:none;border:1px solid var(--line);border-radius:var(--radius);font:500 1.5rem/1 var(--font)}
.fs-back:hover{background:var(--soft)}
.fs-logo{display:block;line-height:0}
.fs-logo img{display:block;width:56px;height:56px}
.fs-main{flex:1;display:flex;flex-direction:column;min-height:0}
.fs-main iframe.sgs-size-checker{flex:1;height:auto!important;min-height:0!important}
.fs-products:empty{display:none}
@media(max-width:749px){.fs-bar{padding:.6rem 1.2rem}.fs-back span{display:none}.fs-back{padding:0 1rem}}
.fs-main>p{display:contents;margin:0}
html body.sgs-fullscreen .fs-main{padding:0;margin:0}

/* Search: a header button that opens a Spotlight-style panel; live suggestions inside it */
.sgs-search-open{display:inline-flex;align-items:center;justify-content:center;width:4.4rem;height:4.4rem;padding:0;border:0;border-radius:50%;background:none;color:var(--fg);cursor:pointer;transition:background .15s}
.sgs-search-open:hover{background:var(--soft)}
.sgs-search-open--phone{display:none}
.sgs-search-open--nav{width:3.6rem;height:3.6rem}
.sgs-spot{position:fixed;inset:0;z-index:1100;display:flex;justify-content:center;align-items:flex-start;padding:12vh 1.6rem 1.6rem;background:rgba(18,18,18,.38);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity .18s}
.sgs-spot[hidden]{display:none}
.sgs-spot.is-open{opacity:1}
.sgs-spot__panel{width:100%;max-width:64rem;background:rgba(255,255,255,.96);border-radius:1.4rem;box-shadow:var(--elev-3);overflow:hidden;transform:translateY(-1.2rem) scale(.98);transition:transform .2s}
.sgs-spot.is-open .sgs-spot__panel{transform:none}
body.sgs-spot-open{overflow:hidden}
.sgs-search{position:relative;margin:0}
.sgs-search__input{display:block;width:100%;height:6.4rem;box-sizing:border-box;padding:0 2rem 0 6.2rem;border:0;border-radius:0;background:transparent;font:inherit;font-size:2rem;color:var(--fg);-webkit-appearance:none;appearance:none}
.sgs-search__input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.sgs-search__input::placeholder{color:rgba(18,18,18,.4)}
.sgs-search__input:focus{outline:0}
.sgs-search__btn{position:absolute;top:0;left:0;width:6.2rem;height:6.4rem;padding:0 0 0 .4rem;border:0;background:none;color:var(--fg);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .15s}
.sgs-search__btn svg{width:2.4rem;height:2.4rem}
.sgs-search__btn:hover{transform:scale(1.08)}
.sgs-search__list{max-height:min(56vh,46rem);overflow-y:auto;padding:.6rem;border-top:1px solid var(--line)}
.sgs-search__list[hidden]{display:none}
.sgs-search__row{display:grid;grid-template-columns:8rem 1fr auto;gap:1.4rem;align-items:center;padding:.8rem 1rem;border-radius:.8rem;text-decoration:none;color:var(--fg);font-size:1.5rem}
.sgs-search__row:hover,.sgs-search__row.is-active{background:var(--soft)}
.sgs-search__row img{width:8rem;height:4.8rem;object-fit:contain;background:#fff}
.sgs-search__ph{width:8rem;height:4.8rem}
.sgs-search__t{display:block;font-weight:600;line-height:1.25}
.sgs-search__s{display:block;font-size:1.2rem;color:var(--muted)}
.sgs-search__p{font-weight:700;white-space:nowrap}
.sgs-search__p em{font-style:normal;font-weight:400;color:var(--muted)}
.sgs-search__all{display:block;margin-top:.4rem;padding:1.2rem .8rem;border-top:1px solid var(--line);text-align:center;font-weight:600;font-size:1.4rem;color:var(--fg);text-decoration:none}
.sgs-search__all:hover,.sgs-search__all.is-active{text-decoration:underline}
.sgs-search__none{padding:1.6rem 1rem;font-size:1.4rem;color:var(--muted)}
.sgs-search__hint{padding:.9rem 2rem;border-top:1px solid var(--line);font-size:1.2rem;color:var(--muted)}
@media(max-width:749px){
.sgs-search-open--phone{display:inline-flex;position:absolute;right:1.1rem;top:50%;transform:translateY(-50%)}
.sgs-spot{padding-top:7vh}
.sgs-search__input{height:5.6rem;font-size:1.8rem;padding-left:5.4rem}
.sgs-search__btn{width:5.4rem;height:5.6rem}
.sgs-search__row{grid-template-columns:6rem 1fr auto;gap:1rem}
.sgs-search__row img,.sgs-search__ph{width:6rem;height:3.6rem}
.sgs-search__hint{display:none}
}
@media(prefers-reduced-motion:reduce){.sgs-spot,.sgs-spot__panel{transition:none}}
.sgs-search__list:not([hidden])+.sgs-search__hint{display:none}

/* The theme's generic button:hover turns text white on dark; these are icon buttons, so keep the icon dark on hover. */
html .sgs-search-open:hover,html .sgs-search-open:focus-visible{background:var(--soft);color:var(--fg)}
html .sgs-search__btn:hover{background:none;color:var(--fg)}

/* Form fields everywhere share one light grey border (WooCommerce's own default is near-black); focus keeps its dark border. */
html input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):not([type=range]):not([type=hidden]):not([type=file]):not(:focus),
html select:not(:focus),html textarea:not(:focus),
html .woocommerce form .form-row input.input-text:not(:focus),html .woocommerce form .form-row textarea:not(:focus),html .woocommerce form .form-row select:not(:focus),
html .select2-container--default .select2-selection--single,html .select2-container--default .select2-selection--multiple{border-color:var(--field-border)}

/* Logged-out My account (log in, register, lost password): no page heading; the card sits in the middle with a centred title. */
html .sgs-account-guest .woocommerce-form-login,html .sgs-account-guest .woocommerce-form-register,html .sgs-account-guest .woocommerce-ResetPassword{margin:0 auto;width:100%}
html .sgs-account-guest .woocommerce h2{text-align:center;max-width:48rem;margin:2.4rem auto 1.2rem}
html .sgs-account-guest .u-columns{justify-content:center}
html .sgs-account-guest .woocommerce-notices-wrapper{max-width:48rem;margin:0 auto}
/* 404 (404.php): smaller heading than the homepage hero; brand logos as tiles in the look grid */
.hero--404{padding:6rem 1.5rem 5rem}
.hero--404__code{margin:0 0 1rem;font-size:1.4rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.hero--404 h1{max-width:60rem;margin:0 auto 2.4rem;font-size:3.6rem;line-height:1.25}
.look-grid--brands{border-bottom:1px solid var(--line)}
.look-grid--brands .look-grid__list{--cols:6}
.look-grid--brands .look-grid__list a{height:8rem;padding:.8rem 1.6rem}
.look-grid--brands .look-grid__list img{height:100%}
.look-grid--brands .look-grid__list span{font-size:1.5rem}
@media(max-width:989px){.look-grid--brands .look-grid__list{--cols:4}}
@media(max-width:749px){.hero--404{padding:4rem 1.6rem 3.2rem}.hero--404 h1{font-size:2.6rem}.look-grid--brands .look-grid__list{--cols:2}.look-grid--brands .look-grid__list a{height:6.4rem}.look-grid--brands .look-grid__list img{height:100%}}

/* Contact page (page-contact.php) */
.contact-head{margin-bottom:3rem}
.contact-head h1{margin:0 0 .6rem}
.contact-head p{margin:0;color:var(--muted);font-size:1.7rem;max-width:60rem}
.contact-grid{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:3rem;align-items:start}
.contact-page .card{background:#fff;border-radius:var(--radius);box-shadow:0 .1rem .3rem rgba(0,0,0,.08);padding:3rem}
.contact-page .card h2{font-family:var(--font);font-size:2rem;font-weight:700;margin:0 0 1.6rem}
.contact-info{display:grid;gap:2rem}
.contact-card{display:flex;gap:1.8rem;align-items:flex-start}
.contact-card__icon{flex:0 0 auto;margin-top:.2rem;color:var(--fg)}
.contact-card h2{margin-bottom:.8rem!important;font-size:1.8rem!important}
.contact-card p{margin:0;color:var(--muted);line-height:1.7}
.contact-card a{color:var(--fg);font-weight:600;text-decoration:underline;text-underline-offset:.25em}
.contact-card a:hover{text-decoration-thickness:.2rem}
.contact-page .wpcf7 form p{margin:0 0 1.8rem}
.contact-page .wpcf7 label{display:block;font-weight:600;font-size:1.4rem}
.contact-page .wpcf7 .wpcf7-form-control-wrap{display:block;margin-top:.6rem}
.contact-page .wpcf7 input[type=text],.contact-page .wpcf7 input[type=email],.contact-page .wpcf7 input[type=tel],.contact-page .wpcf7 textarea{width:100%;box-sizing:border-box;height:var(--field-h);padding:0 1.4rem;border:1px solid var(--field-border);border-radius:var(--radius);font-weight:400;font-size:1.6rem}
.contact-page .wpcf7 textarea{height:16rem;padding:1.2rem 1.4rem;resize:vertical}
.contact-page .wpcf7 input:focus,.contact-page .wpcf7 textarea:focus{outline:.2rem solid var(--fg);outline-offset:.1rem;border-color:var(--fg)}
.contact-page .wpcf7 input[type=submit]{width:100%;padding:1.4rem 3rem;font-size:1.6rem;font-weight:600}
.contact-page .wpcf7 .wpcf7-not-valid-tip{color:#b32d2e;font-size:1.3rem;margin-top:.4rem}
.contact-page .wpcf7 .wpcf7-not-valid{border-color:#b32d2e}
.contact-page .wpcf7 form .wpcf7-response-output{margin:2rem 0 0;padding:1.2rem 1.6rem;border:0;border-radius:var(--radius);background:var(--soft);font-size:1.4rem}
.contact-page .wpcf7 form.sent .wpcf7-response-output{background:#e8f5e9}
.contact-page .wpcf7 form.invalid .wpcf7-response-output,.contact-page .wpcf7 form.failed .wpcf7-response-output{background:#fdecea}
.contact-page .wpcf7-spinner{display:block;margin:1rem auto 0}
/* Turnstile widget is printed after the Send button: show it above the button instead */
.contact-page .wpcf7 form.wpcf7-form{display:flex;flex-direction:column}
.contact-page .wpcf7 form .cf-turnstile{order:1;margin:0 0 1.8rem!important;min-height:0}
.contact-page .wpcf7 form > p:last-of-type{order:2}
.contact-page .wpcf7 form .wpcf7-response-output{order:3}
@media(max-width:899px){.contact-grid{grid-template-columns:minmax(0,1fr)}.contact-page .card{padding:2.2rem}}

/* Brand slideshow on phones: bigger logos */
@media(max-width:749px){html .brand-scroller__track a{width:17rem;height:8.4rem;padding:.4rem .8rem}html .brand-scroller__track{gap:1rem}}

/* Product grids on phones: two columns */
@media(max-width:749px){html .woocommerce ul.products,html .pdp-related ul.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}html .woocommerce ul.products li.sgs-product-card{padding:1rem}html .woocommerce ul.products li.sgs-product-card img{padding:.4rem}html .woocommerce ul.products li.product .woocommerce-loop-product__title{font-size:1.3rem}html .woocommerce ul.products li.sgs-product-card a.button{padding:1rem .6rem;font-size:1.2rem}}
@media(max-width:749px){html .home-section ul.products{grid-template-columns:minmax(0,1fr)}}
@media(max-width:749px){html .home-section .sgs-product-card{position:relative}html .home-section .sgs-product-card .pdp-card,html .home-section .sgs-product-card .pdp-card__body,html .home-section .sgs-product-card .pdp-card__meta{position:static}html .home-section ul.products li.sgs-product-card .pdp-card__img img{display:block;width:60%;height:auto;margin:0 auto;padding:0}html .home-section .sgs-product-card .pdp-card__img{margin-bottom:0}html .home-section .sgs-product-card .pdp-card__body{gap:0}html .home-section .sgs-product-card .pdp-card__logo,html .home-section .sgs-product-card .pdp-card__brand{position:absolute;top:.8rem;right:.8rem;left:auto;bottom:auto;border-radius:var(--radius);margin:0;grid-column:auto;grid-row:auto}html .home-section .sgs-product-card .pdp-card__meta{grid-column:1;grid-row:1}html .home-section .sgs-product-card .pdp-card__price{grid-column:2;grid-row:1;align-self:end;justify-content:flex-end;text-align:right}}
@media(max-width:749px){html .sgs-product-card .pdp-card__meta{grid-column:1;grid-row:1}html .sgs-product-card .pdp-card__price{grid-column:2;grid-row:1;align-self:end;justify-content:flex-end;text-align:right}html .sgs-product-card .pdp-card__logo{grid-column:2;grid-row:2}}
html .sgs-product-card{position:relative}html .sgs-product-card .pdp-card,html .sgs-product-card .pdp-card__body{position:static}html .sgs-product-card .pdp-card__logo{position:absolute;left:0;right:auto;bottom:0;margin:0;border-radius:0 var(--radius) 0 var(--radius)}
html .woocommerce ul.products li.sgs-product-card:has(.pdp-card__logo){padding-bottom:5rem}
@media(max-width:749px){html .woocommerce ul.products li.sgs-product-card:has(.pdp-card__logo){padding-bottom:4.4rem}html .woocommerce .home-section ul.products li.sgs-product-card:has(.pdp-card__logo){padding-bottom:1rem}}
/* Brand logo badge on product cards: smaller on phones */
@media(max-width:749px){html .woocommerce ul.products li.sgs-product-card .pdp-card__logo{max-width:7rem}html .woocommerce ul.products li.sgs-product-card .pdp-card__logo img{height:calc(var(--lh,2.2rem) * .5);max-width:100%;object-fit:contain}}
/* Brand logo in the page heading: smaller on phones */
@media(max-width:749px){html .brand-plain-head .home-section__title--logo .pdp__brand-logo,html .brand-hero .home-section__title--logo .pdp__brand-logo{width:min(var(--logo-w,16rem),10.5rem);height:auto;max-height:6.5rem;max-width:100%;object-fit:contain}}

/* Product card: name and model number in the first row, top left, above the picture */
html .sgs-product-card .pdp-card__meta{align-items:flex-start;text-align:left;margin:0 0 1.2rem;gap:.2rem}
html .sgs-product-card .pdp-card__body{margin-top:1.2rem}

/* Product card bottom row: brand logo on the left, price on the right */
html .sgs-product-card .pdp-card__body{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:end;column-gap:1.2rem;margin-top:.4rem}
html .sgs-product-card .pdp-card__logo{grid-column:1;grid-row:1;justify-self:start;align-self:end;margin:0}
html .sgs-product-card .pdp-card__price{grid-column:2;grid-row:1;justify-self:end;justify-content:flex-end;text-align:right}
html .sgs-product-card .pdp-card__body:not(:has(.pdp-card__logo)) .pdp-card__price{grid-column:1 / -1;justify-self:start;justify-content:flex-start;text-align:left}

/* Per-brand logo widths (Products > Brands): desktop / mobile on cards, full on the brand page heading */
@media(min-width:750px){html .woocommerce ul.products li.sgs-product-card .pdp-card__logo.has-lw-d{max-width:none}html .woocommerce ul.products li.sgs-product-card .pdp-card__logo.has-lw-d img{width:calc(var(--lw-d) * 1px);height:auto;max-width:none;max-height:none}}
@media(max-width:749px){html .woocommerce ul.products li.sgs-product-card .pdp-card__logo.has-lw-m{max-width:none}html .woocommerce ul.products li.sgs-product-card .pdp-card__logo.has-lw-m img{width:calc(var(--lw-m) * 1px);height:auto;max-width:none;max-height:none}}
html .brand-hero .home-section__title--logo.has-lw-full .pdp__brand-logo,html .brand-plain-head .home-section__title--logo.has-lw-full .pdp__brand-logo{width:min(calc(var(--lw-full) * 1px),92vw);height:auto;max-width:none;max-height:none}

/* Product card: brand logo pushed into the bottom left corner (desktop and up) */
@media(min-width:750px){html .sgs-product-card .pdp-card__logo{margin:0 0 -.8rem -.6rem}html .sgs-product-card .pdp-card__body{margin-bottom:0}}

/* Product card: brand logo sits right at the bottom edge */
@media(min-width:750px){html .sgs-product-card .pdp-card__logo{margin:0 0 -1.6rem -1.4rem}}
@media(max-width:749px){html .sgs-product-card .pdp-card__logo{margin:0 0 -.6rem -.7rem}}

/* Product card brand logo: one rule set decides the size and place. The image is exactly its own proportions (--lr), so the box wraps it with nothing spilling out, and the badge is pinned inside the card corner (no negative margins) */
html .woocommerce ul.products li.sgs-product-card .pdp-card__logo{position:absolute;left:0;bottom:0;margin:0;max-width:none;display:block;line-height:0}
html .woocommerce ul.products li.sgs-product-card .pdp-card__logo img{display:block;height:var(--lh,2.2rem);width:auto;max-width:none;max-height:none;aspect-ratio:var(--lr,auto);object-fit:contain;margin:0;padding:0}
@media(max-width:749px){html .woocommerce ul.products li.sgs-product-card .pdp-card__logo img{height:calc(var(--lh,2.2rem) * .5)}}
@media(max-width:749px){html .woocommerce .home-section ul.products li.sgs-product-card .pdp-card__logo{top:.8rem;right:.8rem;left:auto;bottom:auto}}

/* Product cards: tight inside (small card padding, no inner gaps); the bottom padding that clears the corner logo stays */
html .woocommerce ul.products{gap:1rem}
html .woocommerce ul.products li.sgs-product-card{padding:.8rem;margin:0}
html .woocommerce ul.products li.sgs-product-card .pdp-card__img{margin:0}
html .woocommerce ul.products li.sgs-product-card .pdp-card__img img{padding:0;margin:0 auto}
html .woocommerce ul.products li.sgs-product-card .pdp-card__body{gap:0;column-gap:0;row-gap:0;margin:0}
html .woocommerce ul.products li.sgs-product-card .pdp-card__meta{gap:0;margin:0}
html .woocommerce ul.products li.sgs-product-card .pdp-card__price{gap:0 .4rem;margin:0}

/* Product card picture: every picture sits in the same box (the widest crop is 5:2), scaled to fit with its own proportions, so tall pictures get narrower instead of making taller cards */
html .woocommerce ul.products li.sgs-product-card .pdp-card__img{aspect-ratio:5/2}
html .woocommerce ul.products li.sgs-product-card .pdp-card__img img{display:block;width:100%;height:100%;max-width:none;max-height:none;margin:0;object-fit:contain}
@media(max-width:749px){html .woocommerce .home-section ul.products li.sgs-product-card .pdp-card__img{width:60%;margin:0 auto}}

/* Brand logo keeps the card's padding: inset by the same .8rem, not flush to the edge */
html .woocommerce ul.products li.sgs-product-card .pdp-card__logo{left:.8rem;bottom:.8rem;border-radius:var(--radius)}
@media(min-width:750px){html .woocommerce ul.products li.sgs-product-card:has(.pdp-card__logo){padding-bottom:5.4rem}}

/* Price sits bottom right, level with the brand logo bottom left (same .8rem inset as the card padding) */
html .woocommerce ul.products li.sgs-product-card:has(.pdp-card__logo) .pdp-card__price{position:absolute;right:.8rem;bottom:.8rem;margin:0;justify-content:flex-end;text-align:right}
html .woocommerce ul.products li.sgs-product-card .pdp-card__body:not(:has(.pdp-card__logo)) .pdp-card__price{justify-self:end;justify-content:flex-end;text-align:right}

/* Product card, reference look: tinted picture stage with the brand top left and the tag bottom left; model, name, then price with a View button. Written last so it wins over the older card layers above. */
html .woocommerce ul.products li.sgs-product-card.sgs-product-card.sgs-product-card{--pad:1.6rem;--stage:#fff;padding:0;margin:0;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:none;overflow:hidden}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card.sgs-product-card[style*="--bc"]{--stage:#fff}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card.sgs-product-card:hover{border-color:rgba(18,18,18,.28);box-shadow:none}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__img{position:relative;box-sizing:border-box;width:100%;aspect-ratio:5/2;margin:0;padding:var(--pad);display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:0;background:var(--stage)}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__img img{width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;object-fit:contain;background:none}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__img .pdp-badge{position:absolute;left:var(--pad);bottom:var(--pad);top:auto;padding:.6rem 1rem;border-radius:.2rem;background:#1a1a1a;color:#fff;font-size:1.1rem;font-weight:600;font-style:normal;letter-spacing:.08em;text-transform:uppercase}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__body{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;align-content:start;gap:1rem 1.2rem;flex:1;margin:0;padding:var(--pad)}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__meta{grid-column:1 / -1;grid-row:1;display:flex;flex-direction:column;align-items:flex-start;gap:.4rem;margin:0}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__model,html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__brand{order:-1;font-size:1.1rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#5c5c5c}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__title{min-width:0;overflow-wrap:anywhere;margin:0;font-size:1.9rem;font-weight:700;letter-spacing:-.01em;line-height:1.25}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__body .pdp-card__price{position:static;grid-column:1;grid-row:2;justify-self:start;align-self:center;justify-content:flex-start;text-align:left;margin:0;font-size:2rem;font-weight:700}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__cta{grid-column:2;grid-row:2;display:inline-flex;align-items:center;justify-content:center;height:4.2rem;padding:0 2rem;border-radius:.2rem;background:var(--bc,#1a1a1a);color:var(--bc-fg,#fff);font-size:1.4rem;font-weight:600;line-height:1}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__logo{position:absolute;top:var(--pad);right:var(--pad);left:auto;bottom:auto;margin:0;border-radius:.2rem}
@media(max-width:749px){html .woocommerce ul.products li.sgs-product-card.sgs-product-card.sgs-product-card{--pad:1.2rem}}

/* Card spacing from one place: the card pads by --pad, its three rows (title, picture, price) are --pad apart, and nothing inside adds its own offset. The logo is absolute at the same --pad inset; the title row keeps clear of it. */
html .woocommerce ul.products li.sgs-product-card.sgs-product-card.sgs-product-card{padding:var(--pad)}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card{gap:var(--pad)}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__meta{grid-column:auto;grid-row:auto;padding:0;margin:0}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__img{padding:0}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__img .pdp-badge{left:0;bottom:0}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__body{padding:0}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card.sgs-product-card[style*="--logo-w"] .pdp-card__meta{padding-right:calc(var(--logo-w) * 1px + var(--pad))}
@media(max-width:749px){html .woocommerce ul.products li.sgs-product-card.sgs-product-card.sgs-product-card[style*="--logo-w"] .pdp-card__meta{padding-right:calc(var(--logo-wm) * 1px + var(--pad))}}

/* The picture ignores the card padding: it runs edge to edge (its side margins cancel --pad); the tag keeps the --pad inset so it still lines up with the text */
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__img{width:auto;margin:0 calc(var(--pad) * -1)}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__img .pdp-badge{left:var(--pad);bottom:var(--pad)}

/* Cards in a grid row are equal height; the price + View row sits on the card's bottom edge so the buttons line up whatever the title length. */
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__body{align-content:end;align-items:end;grid-template-rows:auto}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__body .pdp-card__price,html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__cta{grid-row:1;align-self:end}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__body .pdp-card__price{align-self:center}

/* Picture first, then the title block; the logo now sits over the picture, so the title needs no clearance for it. */
html .woocommerce ul.products li.sgs-product-card.sgs-product-card.sgs-product-card[style*="--logo-w"] .pdp-card__meta{padding-right:0}

/* Colour variants on the card: the PDP's round badges, each a link to that colour. The card's own link is stretched over the whole card; the badges sit above it. */
html .woocommerce ul.products li.sgs-product-card .pdp-card__link{position:absolute;inset:0;z-index:1;border-radius:inherit}
html .woocommerce ul.products li.sgs-product-card .pdp-card__logo{pointer-events:none}
html .woocommerce ul.products li.sgs-product-card .pdp-card__swatches{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;margin-top:.8rem}
html .woocommerce ul.products li.sgs-product-card .pdp-card__swatch{position:relative;z-index:2;display:block;padding:.4rem;line-height:0;border-radius:50%}
html .woocommerce ul.products li.sgs-product-card .pdp-card__swatch .pdp-variant__dot{position:static;display:block;width:2rem;height:2rem;box-shadow:0 0 0 .1rem rgba(0,0,0,.25)}
html .woocommerce ul.products li.sgs-product-card .pdp-card__swatch:hover .pdp-variant__dot{box-shadow:0 0 0 .2rem #fff,0 0 0 .3rem rgba(0,0,0,.45)}
html .woocommerce ul.products li.sgs-product-card .pdp-card__swatch.is-current .pdp-variant__dot{box-shadow:0 0 0 .2rem #fff,0 0 0 .3rem var(--fg)}
html .woocommerce ul.products li.sgs-product-card .pdp-card__more{font-size:1.2rem;color:var(--muted)}

/* Colour variants on the card: the PDP's round badges, each a link to that colour. The card's own link is stretched over the whole card; the badges sit above it. */
html .woocommerce ul.products li.sgs-product-card .pdp-card__link{position:absolute;inset:0;z-index:1;border-radius:inherit}
html .woocommerce ul.products li.sgs-product-card .pdp-card__logo{pointer-events:none}
html .woocommerce ul.products li.sgs-product-card .pdp-card__swatches{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;margin-top:.8rem}
html .woocommerce ul.products li.sgs-product-card .pdp-card__swatch{position:relative;z-index:2;display:block;padding:.4rem;line-height:0;border-radius:50%}
html .woocommerce ul.products li.sgs-product-card .pdp-card__swatch .pdp-variant__dot{position:static;display:block;width:2rem;height:2rem;box-shadow:0 0 0 .1rem rgba(0,0,0,.25)}
html .woocommerce ul.products li.sgs-product-card .pdp-card__swatch:hover .pdp-variant__dot{box-shadow:0 0 0 .2rem #fff,0 0 0 .3rem rgba(0,0,0,.45)}
html .woocommerce ul.products li.sgs-product-card .pdp-card__swatch.is-current .pdp-variant__dot{box-shadow:0 0 0 .2rem #fff,0 0 0 .3rem var(--fg)}
html .woocommerce ul.products li.sgs-product-card .pdp-card__more{font-size:1.2rem;color:var(--muted)}

/* Sold-out colour: the badge fades out; its tooltip (title) says Sold Out / On Backorder. */
html .woocommerce ul.products li.sgs-product-card .pdp-card__swatch.is-soldout .pdp-variant__dot{opacity:.3}
html .woocommerce ul.products li.sgs-product-card .pdp-card__swatch.is-soldout:hover .pdp-variant__dot{opacity:.5}

/* No View button. The brand badge sits at the top right of the text block under the picture (not over it); the title keeps clear of it. */
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__cta{display:none}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__meta{position:relative}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__meta .pdp-card__logo{position:absolute;top:0;right:0;left:auto;bottom:auto;margin:0}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card.sgs-product-card[style*="--logo-w"] .pdp-card__meta{padding-right:calc(var(--logo-w) * 1px + 1.2rem)}
@media(max-width:749px){html .woocommerce ul.products li.sgs-product-card.sgs-product-card.sgs-product-card[style*="--logo-w"] .pdp-card__meta{padding-right:calc(var(--logo-wm) * 1px + 1rem)}}

/* Sold-out badge: a dashed boundary around the faded colour so it reads as unavailable at a glance (padding drops by the border width, so the badge keeps its size). */
html .woocommerce ul.products li.sgs-product-card .pdp-card__swatch.is-soldout{padding:.3rem;border:.1rem dashed #6b6b6b}

/* PDP sold out: the status line under the title becomes a solid red label so it cannot be missed. */
.pdp__stock.is-out{align-self:flex-start;display:inline-flex;width:fit-content;padding:.8rem 1.4rem;font-size:1.5rem;letter-spacing:.12rem;color:#fff;background:#c0392b;border-radius:var(--radius)}
.pdp__stock.is-out::before{background:#fff}

/* "Enquire on preorder" on a sold-out PDP: button, then an e-mail box. */
.pdp-enquire{margin-top:1rem}
.pdp-enquire__form{margin-top:1rem;display:grid;gap:1rem}
.pdp-enquire__form[hidden]{display:none}
.pdp-enquire__field{display:grid;gap:.5rem;font-size:1.3rem;font-weight:600}
.pdp-enquire__field input{width:100%;box-sizing:border-box;padding:1.2rem 1.4rem;font:inherit;font-weight:400;font-size:1.5rem;border:1px solid var(--line);border-radius:var(--radius);background:#fff;color:var(--fg)}
.pdp-enquire__hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.pdp-enquire__msg{margin:0;font-size:1.4rem;min-height:1.4em}
.pdp-enquire__form.is-done .pdp-enquire__field,.pdp-enquire__form.is-done .cf-turnstile,.pdp-enquire__form.is-done button[type=submit]{display:none}

/* Brand logo: top left of the text block, above the title (in the flow, not floating at the right), so the title needs no clearance for it. */
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__meta .pdp-card__logo{position:static;order:-2;align-self:flex-start;margin:0 0 .8rem}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card.sgs-product-card[style*="--logo-w"] .pdp-card__meta{padding-right:0}
@media(max-width:749px){html .woocommerce ul.products li.sgs-product-card.sgs-product-card.sgs-product-card[style*="--logo-w"] .pdp-card__meta{padding-right:0}}

/* Sold-out PDP, friendlier: the red label is itself the trigger; opening the form hides the button; the form has an intro, a clear submit and a Cancel. */
button.pdp__stock.is-out{border:0;font-family:inherit;cursor:pointer;text-align:left;transition:background .15s}
button.pdp__stock.is-out:hover,button.pdp__stock.is-out:focus-visible{background:#a93226}
.pdp-enquire.is-open .pdp-enquire__btn{display:none}
.pdp-enquire{margin:0 0 2rem} /* the 2rem the buy form (.pdp__form) always had under its buttons: the perks list sits as far below the enquiry as it did below the old Sold out button */
.pdp-enquire__form{margin-top:0;padding:1.6rem;border:1px solid var(--line);border-radius:var(--radius);background:#fff}
.pdp-enquire__intro{margin:0;font-size:1.5rem;line-height:1.5;color:var(--fg)}
.pdp-enquire__actions{display:flex;align-items:center;gap:1.6rem}
.pdp-enquire__actions .pdp__btn{flex:1}
.pdp-enquire__cancel{background:none;border:0;padding:.6rem 0;font:inherit;font-size:1.4rem;color:var(--muted);text-decoration:underline;cursor:pointer}
.pdp-enquire__msg:not(:empty){padding:1.2rem 1.4rem;background:#f3f7f4;border-radius:var(--radius);color:var(--fg)}
.pdp-enquire__form.is-done .pdp-enquire__intro,.pdp-enquire__form.is-done .pdp-enquire__actions{display:none}

/* Enquiry: only the clickable alert at the top is dark green; the buy-box button and submit keep the normal dark theme look. Size choice as tappable pills, comfortable on phones. */
button.pdp__stock.is-out{background:#1f5130;border-color:#1f5130;color:#fff}
button.pdp__stock.is-out:hover,button.pdp__stock.is-out:focus-visible{background:#163a22;border-color:#163a22;color:#fff}
.pdp-enquire .pdp__btn--solid:hover{opacity:.88}
.pdp-enquire__btn:disabled,.pdp-enquire__actions .pdp__btn--solid:disabled{opacity:.6;cursor:wait}
.pdp-enquire__size1{margin:0;font-size:1.5rem}
.pdp-enquire__sizes{margin:0;padding:0;border:0;min-width:0;display:flex;flex-wrap:wrap;gap:.8rem}
.pdp-enquire__sizes legend{padding:0;margin:0 0 .8rem;font-size:1.3rem;font-weight:600}
.pdp-enquire__size{position:relative;display:block;margin:0}
.pdp-enquire__size input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.pdp-enquire__size span{display:flex;align-items:center;justify-content:center;min-width:6.4rem;min-height:4.4rem;padding:0 1.4rem;font-size:1.5rem;font-weight:600;border:1px solid var(--line);border-radius:var(--radius);background:#fff;color:var(--fg)}
.pdp-enquire__size input:checked+span{border-color:var(--fg);background:var(--fg);color:#fff}
.pdp-enquire__size input:focus-visible+span{outline:2px solid var(--fg);outline-offset:2px}
.pdp-enquire__field input{font-size:1.6rem;min-height:4.8rem} /* 16px+ stops iOS zooming into the field */
.pdp-enquire__form .cf-turnstile{max-width:100%;overflow-x:auto}
@media(max-width:749px){
	.pdp-enquire__form{padding:1.2rem}
	.pdp-enquire__actions{flex-direction:column;align-items:stretch;gap:.6rem}
	.pdp-enquire__actions .pdp__btn{min-height:4.8rem}
	.pdp-enquire__cancel{align-self:center;padding:1rem 1.6rem}
	button.pdp__stock.is-out{width:100%;justify-content:center;min-height:4.4rem;text-align:center}
	.pdp-enquire__btn{min-height:4.8rem}
}

/* Enquiry custom size: the text box that "Specify custom size" reveals (neutral colours; 16px font and 48px height for phones). */
.pdp-enquire__custom{flex:1 1 100%;display:grid;gap:.5rem;margin-top:.4rem}
.pdp-enquire__custom[hidden]{display:none}
.pdp-enquire__custom label{font-size:1.3rem;font-weight:600}
.pdp-enquire__custom input{width:100%;box-sizing:border-box;min-height:4.8rem;padding:1.2rem 1.4rem;font:inherit;font-size:1.6rem;border:1px solid var(--line);border-radius:var(--radius);background:#fff;color:var(--fg)}
.pdp-enquire__size--custom span{white-space:normal;text-align:center}
.pdp-enquire__msg:not(:empty){overflow-wrap:anywhere}

/* Enquiry: email or phone, optional comment. */
.pdp-enquire__contact{margin:0;padding:0;border:0;min-width:0;display:grid;gap:.8rem}
.pdp-enquire__contact legend{padding:0;margin:0 0 .8rem;font-size:1.3rem;font-weight:600}
.pdp-enquire__or{margin:0;font-size:1.3rem;color:var(--muted);text-align:center}
.pdp-enquire__check{display:flex;align-items:center;gap:1rem;min-height:4.4rem;font-size:1.5rem;cursor:pointer}
.pdp-enquire__check input{width:2.2rem;height:2.2rem;margin:0;accent-color:var(--fg)}
.pdp-enquire__comment[hidden]{display:none}
.pdp-enquire__field textarea{width:100%;box-sizing:border-box;min-height:9rem;padding:1.2rem 1.4rem;font:inherit;font-weight:400;font-size:1.6rem;line-height:1.4;border:1px solid var(--line);border-radius:var(--radius);background:#fff;color:var(--fg);resize:vertical}
.pdp-enquire__field input[type=tel]{font-size:1.6rem;min-height:4.8rem}

/* Polarized colours: a small "P" marker on the colour circle (card swatches and PDP colour variants) */
html .woocommerce ul.products li.sgs-product-card .pdp-card__swatch .pdp-variant__dot.is-polar{position:relative;top:auto;right:auto;bottom:auto;left:auto}
.pdp-variant__pol{position:absolute;top:-.5rem;right:-.5rem;box-sizing:border-box;width:1.2rem;height:1.2rem;border-radius:50%;background:var(--fg,#121212);color:#fff;font:700 .7rem/1.2rem var(--font,inherit);text-align:center;box-shadow:0 0 0 .1rem #fff}

/* Phones (two-column grid): the brand logo sits above the left-hand content, like desktop. */
@media(max-width:749px){
html .woocommerce ul.products li.sgs-product-card.sgs-product-card.sgs-product-card.sgs-product-card .pdp-card__meta .pdp-card__logo{position:static;order:-2;align-self:flex-start;margin:0 0 .6rem;padding:0}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card.sgs-product-card.sgs-product-card .pdp-card__meta .pdp-card__logo.has-bg{padding:.4rem .8rem}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card.sgs-product-card.sgs-product-card[style*="--logo-w"] .pdp-card__meta{padding-right:0}
}

/* Polarized marker, larger so it reads on the circles; and the tag under the title on the product's own page. */
.pdp-variant__pol{top:-.7rem;right:-.7rem;width:1.6rem;height:1.6rem;font-size:1rem;line-height:1.6rem}
.pdp__polar{display:flex;align-items:center;gap:.8rem;margin:0 0 1rem;font-size:1.3rem;font-weight:600;letter-spacing:.06rem;text-transform:uppercase}
.pdp__polar .pdp-variant__pol{position:static;flex:none}

/* Card colour circles: one line, scrolls sideways inside the card, no scrollbar. The top/right padding leaves room for the P marker. */
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__swatches{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;max-width:100%;min-width:0;margin-top:.2rem;padding:.7rem .8rem 0 0;scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior-x:contain}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__swatches::-webkit-scrollbar{display:none}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__swatch,html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__more{flex:none;white-space:nowrap}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__swatches{box-sizing:border-box}

/* Desktop: the brand logo also sits at the right of the title (top right of the text block); the title keeps clear of it. */
@media(min-width:750px){
html .woocommerce ul.products li.sgs-product-card.sgs-product-card.sgs-product-card .pdp-card__meta .pdp-card__logo{position:absolute;top:0;right:0;left:auto;bottom:auto;order:0;margin:0}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card.sgs-product-card.sgs-product-card[style*="--logo-w"] .pdp-card__meta{padding-right:calc(var(--logo-w) * 1px + var(--pad))}
}

/* Phones: the product pictures are a swipeable slideshow whatever the layout (1, 2, 3 or 4+ images); dots under it come from sgs.js. */
@media(max-width:749px){
html .pdp__media{display:flex;flex-wrap:nowrap;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;-ms-overflow-style:none}
html .pdp__media::-webkit-scrollbar{display:none}
html .pdp__media .pdp__thumbs{display:contents}
html .pdp__media>.pdp__img,html .pdp__media .pdp__thumb{flex:0 0 100%;width:100%;max-width:100%;box-sizing:border-box;scroll-snap-align:center;display:flex;align-items:center;justify-content:center}
html .pdp__media .pdp__img img,html .pdp__media .pdp__thumb img{width:100%;height:auto}
.pdp__dots{display:flex;justify-content:center;gap:.8rem;margin:1rem 0 0}
.pdp__dots i{width:.8rem;height:.8rem;border-radius:50%;background:rgba(18,18,18,.2)}
.pdp__dots i.on{background:var(--fg)}
}
@media(min-width:750px){.pdp__dots{display:none}}

/* Colour circles: the "+N" for further colours sits outside the scrolling row; on desktop (hover devices) a thin scrollbar shows while the pointer is over the row. */
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__colours{display:flex;align-items:center;gap:.4rem;max-width:100%;min-width:0}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__colours .pdp-card__swatches{flex:0 1 auto;min-width:0}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__colours .pdp-card__more{flex:none;padding-top:.7rem}
@media(hover:hover){
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__swatches{scrollbar-width:thin;scrollbar-color:transparent transparent}
html .woocommerce ul.products li.sgs-product-card.sgs-product-card .pdp-card__swatches:hover{scrollbar-color:rgba(18,18,18,.35) transparent}
}
/* /request-sunglasses/: the enquiry form on a page of its own. */
.wish-page{max-width:64rem;padding-top:3.2rem;padding-bottom:4.8rem}
.wish-page h1{margin:0 0 2rem}
.wish-form{margin:0}
.wish-form .pdp-enquire__field input[type=text]{width:100%;box-sizing:border-box;min-height:4.8rem;padding:1.2rem 1.4rem;font:inherit;font-weight:400;font-size:1.6rem;border:1px solid var(--line);border-radius:var(--radius);background:#fff;color:var(--fg)}

/* Homepage hero (Customizer > Hero): image, caption + button over it (9 positions) or in a bar below; always below on phones */
.hero__media{background-image:var(--hero-img)}
.hero__sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.hero__panel{border-radius:var(--radius)}
.hero__panel--bg{padding:2rem 2.4rem}
.hero__copy h1{margin:0}
.hero__copy p{margin:.4rem 0 0}
.hero--over{position:relative;display:flex;padding:6rem 3rem}
.hero--over.hero--image{min-height:var(--hero-h);padding:3rem}
.hero--over .hero__media{position:absolute;inset:0;background-size:cover;background-position:center}
.hero--over .hero__panel{position:relative;z-index:1;max-width:46rem}
.hero--over .hero__copy h1{font-size:3.2rem;line-height:1.1}
.hero--over .hero__copy p{font-size:1.8rem}
.hero--over .hero__copy+.button{margin-top:1.6rem}
.hero--over .button{padding:1rem 2.4rem;font-size:1.4rem}
.hero--v-top{align-items:flex-start}.hero--v-middle{align-items:center}.hero--v-bottom{align-items:flex-end}
.hero--h-left{justify-content:flex-start;text-align:left}.hero--h-center{justify-content:center;text-align:center}.hero--h-right{justify-content:flex-end;text-align:right}
.hero--below{padding:0}
.hero--below .hero__media{height:var(--hero-h);background-size:cover;background-position:center}
.hero--below .hero__panel{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:2rem 3rem;text-align:left;border-radius:0}
.hero--below .hero__copy h1{font-size:3rem;line-height:1.1}
.hero--below .hero__copy p{font-size:1.8rem}
.hero--below .button{flex:none;padding:1rem 2.4rem;font-size:1.4rem}
/* the text keeps to the content width (as .wrap) on wide screens; the image stays full width */
.hero--over,.hero--over.hero--image{padding-inline:max(3rem,calc((100% - var(--w)) / 2 + 5rem))}
.hero--below .hero__panel{padding-inline:max(3rem,calc((100% - var(--w)) / 2 + 5rem))}
@media(max-width:749px){
	.hero__media{background-image:var(--hero-img-m,var(--hero-img))}
	.hero--over.hero--image{padding:1.2rem}
	.hero--over:not(.hero--image){padding:4rem 1.6rem}
	.hero--over .hero__panel{max-width:100%}
	.hero--over .hero__panel--bg{padding:1.4rem 1.6rem}
	.hero--over .hero__copy h1{font-size:2.4rem}
	.hero--over .hero__copy p{font-size:1.5rem}
	.hero--over .hero__copy+.button{margin-top:1.2rem}
	.hero .button{padding:1.3rem 2.6rem;font-size:1.5rem;min-height:4.8rem;display:inline-flex;align-items:center}
	.hero--below .hero__media{height:min(var(--hero-h),50vh)}
	.hero--below .hero__panel{display:block;padding:1.6rem;text-align:left}
	.hero--below .hero__copy+.button{margin-top:1.2rem;display:inline-block}
}

/* Checkout: payment option name on the left, its brand logos on the right (always visible); the copy in the open box is hidden */
form.sgs-checkout #payment ul.payment_methods li>label{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;flex-wrap:wrap}
form.sgs-checkout #payment ul.payment_methods li>label img{float:none;margin:0;max-height:none;width:auto;height:2.4rem}
form.sgs-checkout #payment ul.payment_methods li>label .sgs-pay-logos{display:flex;align-items:center;gap:.8rem;margin-left:auto}
form.sgs-checkout #payment div.payment_box .peach-logos{display:none}