/* ============================================================
   OBJEX LABS x WOOCOMMERCE : skin del negozio
   La pagina di acquisto che segue products/luma.html deve sembrare
   la stessa pagina: paper-first, un solo accento ambra, Exo sui
   titoli, mono su numeri/etichette, raggio 2px, hover solo colore.
   Copre: pagina prodotto, carrello, checkout (classico + blocchi),
   avvisi, pagina "ordine ricevuto", header/footer del kit.

   IMPORT: enqueued dal plugin objex-woo (objex-woo.php); non serve
   incollare nulla nell'editor o in "CSS aggiuntivo".

   FONT: self-hosted dentro il plugin (assets/fonts/), path relativi
   a questo file. Niente fonts.googleapis.com a runtime (stessa
   scelta del sito).
   ============================================================ */

@font-face{font-family:'Exo';font-style:normal;font-weight:100 900;font-display:swap;src:url('fonts/exo-latin.woff2') format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:100 800;font-display:swap;src:url('fonts/jetbrainsmono-latin.woff2') format('woff2')}

:root{
  --paper:#f9f8f5;
  --ink:#141412;
  --ink-60:rgba(20,20,18,.6);
  --ink-12:rgba(20,20,18,.12);
  --amber:#f39c12;
  --amber-hover:#ffb130;
  --night:#0d0d0c;
  --accent:var(--amber);
  --accent-ink:#a15c00;      /* ambra per TESTO su fondo chiaro, passa WCAG AA */
  --sand:#f4f1ea;            /* banda sabbia piatta, come .sec--tint del sito */
  --radius:2px;
  --sans:'Exo',system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
}

/* ---------- base ---------- */
body{
  font-family:var(--sans);
  background:var(--paper);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
}
.woocommerce a,
.wc-block-components-checkout-step a{color:var(--accent-ink)}
.woocommerce a:hover{color:var(--ink)}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}

@media (prefers-reduced-motion:reduce){
  *{transition:none !important;animation:none !important}
}

/* contenitore: stesso respiro del sito (7vw + cap 1180px).
   SOLO div.woocommerce: sui temi a blocchi WooCommerce mette la classe
   "woocommerce" anche sul BODY, e un selettore nudo strizzerebbe
   l'intera pagina (header e footer compresi) a 1180px centrati. */
div.woocommerce,
.woocommerce-page .site-main,
.objx-wrap{box-sizing:border-box;width:100%;max-width:1180px;margin:0 auto;padding:0 7vw}
@media (min-width:1400px){div.woocommerce,.woocommerce-page .site-main,.objx-wrap{padding:0 24px}}

/* stacco dalla top bar sticky: il padding sta sul wrapper radice del
   canvas (.wp-site-blocks, presente su OGNI tema a blocchi, subito dopo
   la objx-head stampata su wp_body_open), non sui wrapper dei singoli
   template: cosi' vale per carrello, checkout, shop e prodotto anche
   quando il markup della pagina non contiene .objx-main (es. blocchi
   cart/checkout, altri temi). .site-main e' il fallback dei temi classici. */
.wp-site-blocks,
.woocommerce-page .site-main{padding-top:clamp(56px,8vh,96px)}
/* il margine di .objx-main del tema si azzera: lo stacco lo da' gia'
   .wp-site-blocks, altrimenti si sommerebbero */
.objx-main{margin-top:0}

/* nasconde header/footer/breadcrumb del tema attivo: il kit stampa i suoi
   (vedi objex-woo-snippet.php). Selettori dei temi piu comuni. */
.site-header,.storefront-breadcrumb,.site-footer,
header.wp-block-template-part,footer.wp-block-template-part{display:none !important}

/* ============================================================
   HEADER del kit: top bar con sfondo paper pieno come index.html
   (logo esteso inline a sinistra, icona carrello ambra 40x40 a
   destra, riga inferiore ink-12). Markup stampato da objex-woo.php
   su wp_body_open.
   ============================================================ */
/* banner promo sopra la top bar (testo in objex_woo_promo_texts,
   objex-woo.php): striscia night piena, mono maiuscolo, centrata.
   Non e' sticky: scorre via con la pagina, la barra sotto resta. */
.objx-promo{box-sizing:border-box;background:var(--night);color:rgba(249,248,245,.85);text-align:center;padding:9px 7vw;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;line-height:1.5}
@media (max-width:600px){.objx-promo{font-size:9.5px;letter-spacing:.08em}}

/* top bar: "Shop" sul margine sinistro (home shop), logo OBJEX
   centrato in assoluto (uscita verso objexlabs.com), carrello a
   destra. Shop e carrello stanno DENTRO lo stesso contenitore del
   contenuto (1180px + 7vw): margini perfettamente allineati. */
.objx-head{box-sizing:border-box;position:sticky;top:0;z-index:30;padding:10px 0;background:var(--paper);border-bottom:1px solid var(--ink-12)}
/* admin bar WP (utente loggato): fixed 32px desktop / 46px mobile,
   la sticky bar deve fermarsi sotto, non finirci dietro */
body.admin-bar .objx-head{top:32px}
@media (max-width:782px){body.admin-bar .objx-head{top:46px}}
.objx-head-i{box-sizing:border-box;width:100%;max-width:1180px;margin:0 auto;padding:0 7vw;display:flex;align-items:center;gap:clamp(14px,2.2vw,26px)}
@media (min-width:1400px){.objx-head-i{padding:0 24px}}
/* bandiera lingua/valuta a sinistra del carrello: mostra la lingua
   ATTIVA (prezzi sempre EUR), il click passa all'altra (data-set-lang
   dell'altra lingua, cablato da objex-i18n.js). E' lei a spingersi
   sul margine destro: il carrello le sta accanto. */
.objx-head-flag{margin-left:auto;appearance:none;background:none;border:0;padding:4px;cursor:pointer;display:inline-flex;align-items:center;flex:0 0 auto}
.objx-head-flag svg{display:block;width:24px;height:16px;border-radius:var(--radius);outline:1px solid var(--ink-12);transition:outline-color .2s ease}
.objx-head-flag:hover svg{outline-color:var(--accent)}
/* logo esteso INLINE (sorgente: assets/svg/objex-logo-black.svg del sito):
   nessuna richiesta esterna, stessa altezza 28px della bar del sito.
   CENTRATO in assoluto sulla bar; porta alla home dello shop. */
.objx-head-logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:block}
.objx-head-logo svg{height:28px;width:auto;display:block}
/* scritta "Shop" sul margine sinistro, Exo 900 come i titoli.
   La doppia classe con .woocommerce batte il colore link ambra di
   ".woocommerce a": ink fissa, ambra solo in hover. */
.objx-head-shoplabel,
.woocommerce .objx-head-shoplabel{font-family:var(--sans);font-weight:900;letter-spacing:-.02em;font-size:19px;line-height:1;color:var(--ink);text-decoration:none;flex:0 0 auto;transition:color .2s ease}
.objx-head-shoplabel:hover,
.woocommerce .objx-head-shoplabel:hover{color:var(--accent-ink)}

@media (max-width:640px){
  .objx-head-shoplabel{font-size:16px}
  .objx-head-logo svg{height:24px}
  .objx-head-i{gap:12px}
}

/* carrello: solo icona, quadrato ambra 40x40 (stessa geometria del
   .cta-shop di base.css). Hover: solo colore, nessun movimento. */
.objx-head-cta{position:relative;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;flex:0 0 auto;color:var(--night);background:var(--amber);border-radius:var(--radius);text-decoration:none;transition:background .2s ease}
.objx-head-cta:hover{background:var(--amber-hover);color:var(--night)}
/* icona piu' grande e marcata dentro il quadrato 40x40 (che resta
   invariato), come sul bottone delle card */
.objx-head-cta svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}

/* badge numerico: pallino ink sull'angolo del quadrato ambra, mono bold;
   sparisce da solo a carrello vuoto (data-count="0") */
.objx-cart-n{position:absolute;top:-7px;right:-7px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--night);color:var(--paper);font-family:var(--mono);font-size:9.5px;font-weight:700;line-height:1;display:flex;align-items:center;justify-content:center}
.objx-cart-n[data-count="0"]{display:none}

/* ============================================================
   SISTEMA BOTTONI: mappa del .cta del sito sui bottoni Woo.
   Primario ink; l'azione di ACQUISTO (add to cart, checkout,
   place order) e' ambra + ink come .cta--buy. Hover: solo colore.
   ============================================================ */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.wc-block-components-button{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:var(--mono);font-size:12px;line-height:1;letter-spacing:.1em;text-transform:uppercase;
  text-decoration:none;color:var(--paper);background:var(--ink);
  padding:14px 22px;border:0;border-radius:var(--radius);
  font-weight:500;cursor:pointer;
  transition:background .2s ease,color .2s ease;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.wc-block-components-button:hover{background:var(--accent);color:var(--night)}

/* l'azione negozio: ambra pieno, etichetta ink, bold (come .cta--buy) */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce .single_add_to_cart_button,
.woocommerce a.checkout-button,
.woocommerce #place_order,
.wc-block-components-checkout-place-order-button,
.wc-block-cart__submit-button{
  background:var(--accent) !important;color:var(--night) !important;font-weight:700 !important;
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce .single_add_to_cart_button:hover,
.woocommerce a.checkout-button:hover,
.woocommerce #place_order:hover,
.wc-block-components-checkout-place-order-button:hover,
.wc-block-cart__submit-button:hover{background:var(--amber-hover) !important;color:var(--night) !important}

.woocommerce a.button.disabled,
.woocommerce button.button:disabled{opacity:.45;cursor:not-allowed}

/* ============================================================
   TIPOGRAFIA CONDIVISA: kicker mono ambra, titoli Exo 900,
   prezzi e SKU in mono (i numeri sono dati, come sul sito)
   ============================================================ */
.woocommerce h1,.woocommerce h2,.woocommerce h3,
.wc-block-components-title{
  font-family:var(--sans);font-weight:900;letter-spacing:-.02em;line-height:1.05;color:var(--ink);
}
.woocommerce .price,
.woocommerce .amount,
.woocommerce-Price-amount,
.wc-block-components-product-price,
.wc-block-formatted-money-amount{
  font-family:var(--mono);font-weight:500;letter-spacing:-.02em;color:var(--ink);
}

/* breadcrumb Woo (Home / Categoria / Prodotto): via del tutto, la
   navigazione la fanno la barra shop e le icone categoria */
.woocommerce-breadcrumb{display:none !important}

/* ============================================================
   ICONE CATEGORIE (modello shop.loxone.com): riga centrata sotto la
   top bar, stampata da objex-woo.php (wp_body_open, prio 11) solo su
   shop / categoria / prodotto / ricerca prodotti e solo con almeno
   2 categorie. La ricerca sta nella top bar. La specificita' con
   body.woocommerce serve a battere il colore link di ".woocommerce a".
   ============================================================ */
/* riga perfettamente simmetrica rispetto al centro dello schermo
   (come il logo): ogni voce ha larghezza FISSA, cosi' la voce di
   mezzo cade esattamente sull'asse centrale */
.objx-shopcats{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(8px,2vw,28px);margin:clamp(18px,2.8vh,32px) auto 0;padding:0 7vw}
.objx-shopcat{width:104px;flex:0 0 auto;text-align:center}
.objx-shopcat,
.woocommerce .objx-shopcat{display:flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none;color:var(--ink-60);transition:color .2s ease}
.objx-shopcat svg{width:30px;height:30px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
/* i glifi Material ufficiali sono riempiti, non stroke */
.objx-shopcat svg.objx-ic-fill{fill:currentColor;stroke:none;stroke-width:0}
/* miniatura della categoria al posto dell'SVG (se impostata in
   Prodotti > Categorie): stessa impronta 30x30 */
.objx-shopcat img.objx-shopcat-img{width:30px;height:30px;object-fit:contain;display:block}
.objx-shopcat span{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;border-bottom:2px solid transparent;padding-bottom:2px}
.objx-shopcat:hover,
.woocommerce .objx-shopcat:hover{color:var(--ink)}
.objx-shopcat.is-on,
.woocommerce .objx-shopcat.is-on{color:var(--ink)}
.objx-shopcat.is-on span{border-bottom-color:var(--accent)}

/* il canvas del template legacy Woo (main.site-main) porta un
   padding-top suo di ~78px (misurato live: era LUI la fascia vuota
   sopra il banner, non i nostri margini). Lo stacco verticale lo
   gestiamo noi su .wp-site-blocks: qui zero. */
main.site-main{padding-top:0 !important;padding-block-start:0 !important}

/* pagine negozio: meno vuoto della soglia globale (56-96px), la bar
   e l'eventuale riga categorie danno gia' aria. Sulla home shop il
   banner segue subito le icone: stacco minimo. */
.single-product .wp-site-blocks,
.tax-product_cat .wp-site-blocks{padding-top:clamp(28px,4.5vh,52px)}
/* stacco icone -> banner: circa il doppio dello stacco banner ->
   prodotti (.objx-shop-hero margin-bottom, 16-28px) */
.woocommerce-shop .wp-site-blocks{padding-top:clamp(30px,4.5vh,50px)}

/* ============================================================
   PAGINA PRODOTTO: presentazione modello shop.loxone.com.
   Griglia 2 colonne: galleria in card bianca a sinistra, BUY BOX
   in card sticky a destra (cod. articolo, titolo, prezzo + IVA,
   descrizione breve, disponibilita' con pallino, qty + add to cart,
   meta). Sotto: sezioni impilate a tutta larghezza al posto dei
   tab, poi correlati a card. Token OBJEX invariati.
   ============================================================ */
.woocommerce div.product{
  position:relative;margin-top:clamp(14px,2.5vh,26px);
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  gap:clamp(24px,4vw,56px);align-items:start;
}
.woocommerce div.product .woocommerce-notices-wrapper,
.woocommerce div.product .woocommerce-tabs,
.woocommerce div.product .related,
.woocommerce div.product .up-sells{grid-column:1/-1}
/* il core Woo float-a images/summary al 48%: sotto grid i float sono
   ignorati ma le width restano, quindi si riportano al 100% */
.woocommerce div.product div.images,
.woocommerce div.product div.summary{float:none;width:100%;margin:0}
@media (max-width:880px){
  .woocommerce div.product{display:block}
  .woocommerce div.product div.images{margin-bottom:22px}
}

/* buy box (Loxone): card bianca bordata ink, angoli morbidi, IN FLUSSO
   (niente sticky: scorrendo resta al suo posto). Flex colonna con
   order espliciti: badge, titolo, cod. articolo SOTTO il titolo,
   prezzo con divisore, descrizione, riga d'acquisto in fondo, stock
   a chiudere. */
.woocommerce div.product div.summary{
  box-sizing:border-box;background:#fff;border:1px solid var(--ink);border-radius:6px;
  padding:clamp(26px,3.2vw,44px);
  display:flex;flex-direction:column;align-self:start;
}
.woocommerce div.product div.summary>*{order:5}
.woocommerce div.product div.summary span.onsale{order:1}
.woocommerce div.product div.summary .product_title{order:2}
.woocommerce div.product div.summary .objx-sku{order:3}
.woocommerce div.product div.summary p.price{order:4}
.woocommerce div.product div.summary form.cart{order:6}
.woocommerce div.product div.summary p.stock{order:7}
.woocommerce div.product div.summary .product_meta{order:8}

/* badge sale: pillola dentro il buy box (spostata li' da objex-woo.php) */
.woocommerce div.product div.summary span.onsale{
  position:static;display:inline-block;align-self:flex-start;margin:0 0 16px;
}

/* cod. articolo SOTTO il titolo (stampato da objex-woo.php) */
.objx-sku{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-60);margin:8px 0 0}

.woocommerce div.product .product_title{font-size:clamp(1.5rem,2.6vw,2.2rem);margin:0}
.woocommerce div.product p.price{
  font-size:clamp(1.4rem,2.2vw,1.9rem);font-weight:700;margin:18px 0 0;
  padding-bottom:18px;border-bottom:1px solid var(--ink-12);
}
/* pagina prodotto: prezzo di partenza barrato, piccolo, su riga
   propria sopra il prezzo attuale; la pillola -N% qui non si mostra
   (resta solo sulle card della griglia) */
.woocommerce div.product p.price del{display:block;font-size:.5em;font-weight:400;color:var(--ink-60);opacity:1;margin-bottom:4px}
.woocommerce div.product p.price ins{text-decoration:none}
.woocommerce div.product div.summary span.onsale{display:none}
.woocommerce-product-details__short-description{font-size:.98rem;line-height:1.55;color:var(--ink-60);margin-top:14px}
.woocommerce-product-details__short-description ul{margin:10px 0 0;padding-left:18px}
.woocommerce-product-details__short-description li{margin:4px 0}

/* galleria (Loxone): NESSUNA card, immagine principale direttamente
   sul paper; thumbnails in riga centrata sotto, ognuna in card bianca,
   attiva bordata ambra */
.woocommerce div.product div.images{box-sizing:border-box;background:none;border:0;padding:clamp(8px,1.5vw,24px) 0 0}
.woocommerce div.product div.images img{border-radius:var(--radius)}
.woocommerce div.product div.images .flex-control-thumbs{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:clamp(18px,3vh,30px) 0 0;padding:0}
.woocommerce div.product div.images .flex-control-thumbs li{
  box-sizing:border-box;list-style:none;float:none;width:84px;margin:0;
  background:#fff;border:1px solid var(--ink-12);border-radius:6px;padding:6px;
  cursor:pointer;transition:border-color .2s ease;
}
.woocommerce div.product div.images .flex-control-thumbs li:hover{border-color:var(--accent)}
.woocommerce div.product div.images .flex-control-thumbs li:has(img.flex-active){border-color:var(--accent)}
.woocommerce div.product div.images .flex-control-thumbs img{border:0;border-radius:var(--radius);opacity:.75;transition:opacity .2s ease}
.woocommerce div.product div.images .flex-control-thumbs img.flex-active,
.woocommerce div.product div.images .flex-control-thumbs img:hover{opacity:1}

/* badge sconto ("SALE -21%", da objex-woo.php): pillola nella
   tonalita' del brand ma piu' accesa (amber-hover #ffb130), testo
   ink; sull'angolo della card nella griglia shop/correlati */
.woocommerce span.onsale{
  background:var(--amber-hover);color:var(--night);
  font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  border-radius:var(--radius);min-width:0;min-height:0;line-height:1;padding:8px 12px;
}
.woocommerce ul.products li.product span.onsale{position:absolute !important;top:12px;left:12px;right:auto;z-index:2;margin:0;width:auto;align-self:auto}
.woocommerce ul.products li.product{position:relative}

/* riga d'acquisto (Loxone): stepper quantita' + quadrato ambra con
   la sola icona carrello, allineati a destra */
.woocommerce div.product form.cart{display:flex;flex-wrap:wrap;gap:10px;align-items:stretch;justify-content:flex-end;margin:22px 0 6px}
.woocommerce div.product form.cart .quantity,
.woocommerce div.product form.cart .objx-qty{flex:0 0 auto}
.woocommerce div.product form.cart .single_add_to_cart_button{
  flex:0 0 auto;width:56px;min-height:52px;padding:0;
  font-size:0;line-height:0;position:relative;border-radius:var(--radius);
}

/* quantita': campo mono con stepper (objex-woo.js aggiunge i bottoni) */
.woocommerce .quantity .qty{
  font-family:var(--mono);font-size:14px;text-align:center;
  width:64px;padding:12px 6px;border:1px solid var(--ink-12);border-radius:var(--radius);
  background:#fff;color:var(--ink);
}
.woocommerce .quantity .qty:focus{border-color:var(--accent);outline:none}
.objx-qty{display:inline-flex;align-items:stretch}
.objx-qty .qty{border-radius:0;border-left:0;border-right:0;-moz-appearance:textfield}
.objx-qty .qty::-webkit-outer-spin-button,
.objx-qty .qty::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.objx-qty-btn{
  width:42px;border:1px solid var(--ink-12);background:#fff;color:var(--ink);
  font-family:var(--mono);font-size:16px;line-height:1;cursor:pointer;
  transition:background .2s ease,color .2s ease;
}
.objx-qty-btn:first-child{border-radius:var(--radius) 0 0 var(--radius)}
.objx-qty-btn:last-child{border-radius:0 var(--radius) var(--radius) 0}
.objx-qty-btn:hover{background:var(--ink);color:var(--paper)}

/* meta prodotto (SKU, categoria): NASCOSTO, il buy box chiude con la
   riga stock (il cod. articolo sta gia' sotto il titolo, la categoria
   la dicono le icone sotto la top bar) */
.woocommerce div.product .product_meta{display:none}

/* tab Woo come BARRA A PILLOLE (Loxone): contenitore bianco
   arrotondato centrato, tab attiva night su paper, un pannello alla
   volta (il toggle lo fa il JS dei tab di Woo). Il titolo h2 dentro
   il pannello sparisce: lo dice gia' la pillola attiva. */
.woocommerce div.product .woocommerce-tabs{margin-top:clamp(28px,4.5vh,52px)}
.woocommerce div.product .woocommerce-tabs ul.tabs{
  display:flex;flex-wrap:wrap;justify-content:center;gap:4px;
  list-style:none;width:fit-content;max-width:100%;
  margin:0 auto clamp(22px,3.5vh,36px);padding:4px;
  background:#fff;border:1px solid var(--ink-12);border-radius:6px;
  overflow:visible;
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs::after,
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after{display:none}
.woocommerce div.product .woocommerce-tabs ul.tabs li{
  margin:0;padding:0;background:none;border:0;border-radius:var(--radius);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{
  display:block;padding:12px 22px;border-radius:var(--radius);
  font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-60);text-decoration:none;
  transition:background .2s ease,color .2s ease;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover{color:var(--ink)}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{background:var(--night);color:var(--paper)}
.woocommerce div.product .woocommerce-tabs .panel{
  font-size:1rem;line-height:1.55;color:var(--ink-60);
  background:#fff;border:1px solid var(--ink-12);border-radius:6px;
  padding:clamp(20px,3vw,36px);margin:0 0 clamp(30px,5vh,52px);
}
.woocommerce div.product .woocommerce-tabs .panel>h2:first-of-type{display:none}

/* tabella attributi: righe pulite, chiavi mono ambra come .spec-rows .k */
.woocommerce table.woocommerce-product-attributes{border:0}
.woocommerce table.woocommerce-product-attributes th,
.woocommerce table.woocommerce-product-attributes td{
  border:0;border-bottom:1px solid var(--ink-12);background:none !important;
  padding:10px 12px 10px 0;font-style:normal;
}
.woocommerce table.woocommerce-product-attributes th{
  font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent-ink);
}
.woocommerce table.woocommerce-product-attributes td{font-family:var(--mono);font-size:.85rem;color:var(--ink-60)}

/* suffisso prezzo ("+ IVA", da Woo > Impostazioni > IVA): su riga
   propria sotto il prezzo, piccolo e muted (come "excl. VAT" Loxone) */
.woocommerce div.product p.price .woocommerce-price-suffix{
  display:block;margin-top:6px;
  font-family:var(--mono);font-size:.5em;font-weight:400;letter-spacing:.06em;color:var(--ink-60);
}

/* disponibilita' / spedizione: riga mono con icona camion Material
   "delivery_truck_speed" in verde acceso (mask, stesso path delle
   card). Verde solo qui: e' un colore funzionale, non entra nella
   palette. Esaurito: pallino rosso. */
.woocommerce div.product p.stock{
  display:flex;align-items:center;justify-content:flex-end;gap:8px;
  font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-60);margin:12px 0 0;
}
.woocommerce div.product p.stock::before{content:'';width:17px;height:17px;flex:0 0 auto;background:#22c55e;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960'%3E%3Cpath d='M195-195q-35-35-35-85H60l18-80h113q17-19 40-29.5t49-10.5q26 0 49 10.5t40 29.5h167l84-360H182l4-17q6-28 27.5-45.5T264-800h456l-37 160h117l120 160-40 200h-80q0 50-35 85t-85 35q-50 0-85-35t-35-85H400q0 50-35 85t-85 35q-50 0-85-35Zm442-245h193l4-21-74-99h-95l-28 120Zm-19-273 2-7-84 360 2-7 34-146 46-200ZM20-427l20-80h220l-20 80H20Zm80-146 20-80h260l-20 80H100Zm180 333q17 0 28.5-11.5T320-280q0-17-11.5-28.5T280-320q-17 0-28.5 11.5T240-280q0 17 11.5 28.5T280-240Zm400 0q17 0 28.5-11.5T720-280q0-17-11.5-28.5T680-320q-17 0-28.5 11.5T640-280q0 17 11.5 28.5T680-240Z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960'%3E%3Cpath d='M195-195q-35-35-35-85H60l18-80h113q17-19 40-29.5t49-10.5q26 0 49 10.5t40 29.5h167l84-360H182l4-17q6-28 27.5-45.5T264-800h456l-37 160h117l120 160-40 200h-80q0 50-35 85t-85 35q-50 0-85-35t-35-85H400q0 50-35 85t-85 35q-50 0-85-35Zm442-245h193l4-21-74-99h-95l-28 120Zm-19-273 2-7-84 360 2-7 34-146 46-200ZM20-427l20-80h220l-20 80H20Zm80-146 20-80h260l-20 80H100Zm180 333q17 0 28.5-11.5T320-280q0-17-11.5-28.5T280-320q-17 0-28.5 11.5T240-280q0 17 11.5 28.5T280-240Zm400 0q17 0 28.5-11.5T720-280q0-17-11.5-28.5T680-320q-17 0-28.5 11.5T640-280q0 17 11.5 28.5T680-240Z'/%3E%3C/svg%3E") center/contain no-repeat}
.woocommerce div.product p.stock.in-stock{color:#16a34a}
/* stock BASSO (classe objx-low dal PHP, sotto 5 unita'): tutto in
   arancione, icona Material "production_quantity_limits" (path
   ufficiale Google, Apache 2.0) al posto del camion */
.woocommerce div.product p.stock.in-stock.objx-low{color:#c2410c}
.woocommerce div.product p.stock.in-stock.objx-low::before{background:#f97316;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960'%3E%3Cpath d='M451.5-591.5Q440-603 440-620t11.5-28.5Q463-660 480-660t28.5 11.5Q520-637 520-620t-11.5 28.5Q497-580 480-580t-28.5-11.5ZM440-720v-200h80v200h-80ZM223.5-103.5Q200-127 200-160t23.5-56.5Q247-240 280-240t56.5 23.5Q360-193 360-160t-23.5 56.5Q313-80 280-80t-56.5-23.5Zm400 0Q600-127 600-160t23.5-56.5Q647-240 680-240t56.5 23.5Q760-193 760-160t-23.5 56.5Q713-80 680-80t-56.5-23.5ZM40-800v-80h131l170 360h280l156-280h91L692-482q-11 20-29.5 31T622-440H324l-44 80h480v80H280q-45 0-68.5-39t-1.5-79l54-98-144-304H40Z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960'%3E%3Cpath d='M451.5-591.5Q440-603 440-620t11.5-28.5Q463-660 480-660t28.5 11.5Q520-637 520-620t-11.5 28.5Q497-580 480-580t-28.5-11.5ZM440-720v-200h80v200h-80ZM223.5-103.5Q200-127 200-160t23.5-56.5Q247-240 280-240t56.5 23.5Q360-193 360-160t-23.5 56.5Q313-80 280-80t-56.5-23.5Zm400 0Q600-127 600-160t23.5-56.5Q647-240 680-240t56.5 23.5Q760-193 760-160t-23.5 56.5Q713-80 680-80t-56.5-23.5ZM40-800v-80h131l170 360h280l156-280h91L692-482q-11 20-29.5 31T622-440H324l-44 80h480v80H280q-45 0-68.5-39t-1.5-79l54-98-144-304H40Z'/%3E%3C/svg%3E") center/contain no-repeat}
/* stock ZERO: stessa icona, tutto in rosso (via il pallino) */
.woocommerce div.product p.stock.out-of-stock{color:#8f1c19}
.woocommerce div.product p.stock.out-of-stock::before{background:#8f1c19;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960'%3E%3Cpath d='M451.5-591.5Q440-603 440-620t11.5-28.5Q463-660 480-660t28.5 11.5Q520-637 520-620t-11.5 28.5Q497-580 480-580t-28.5-11.5ZM440-720v-200h80v200h-80ZM223.5-103.5Q200-127 200-160t23.5-56.5Q247-240 280-240t56.5 23.5Q360-193 360-160t-23.5 56.5Q313-80 280-80t-56.5-23.5Zm400 0Q600-127 600-160t23.5-56.5Q647-240 680-240t56.5 23.5Q760-193 760-160t-23.5 56.5Q713-80 680-80t-56.5-23.5ZM40-800v-80h131l170 360h280l156-280h91L692-482q-11 20-29.5 31T622-440H324l-44 80h480v80H280q-45 0-68.5-39t-1.5-79l54-98-144-304H40Z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960'%3E%3Cpath d='M451.5-591.5Q440-603 440-620t11.5-28.5Q463-660 480-660t28.5 11.5Q520-637 520-620t-11.5 28.5Q497-580 480-580t-28.5-11.5ZM440-720v-200h80v200h-80ZM223.5-103.5Q200-127 200-160t23.5-56.5Q247-240 280-240t56.5 23.5Q360-193 360-160t-23.5 56.5Q313-80 280-80t-56.5-23.5Zm400 0Q600-127 600-160t23.5-56.5Q647-240 680-240t56.5 23.5Q760-193 760-160t-23.5 56.5Q713-80 680-80t-56.5-23.5ZM40-800v-80h131l170 360h280l156-280h91L692-482q-11 20-29.5 31T622-440H324l-44 80h480v80H280q-45 0-68.5-39t-1.5-79l54-98-144-304H40Z'/%3E%3C/svg%3E") center/contain no-repeat}

/* stock DENTRO la riga d'acquisto (spostato li' da objex-woo.php):
   riga PROPRIA sotto stepper e bottone carrello (order 2 + basis
   100% nel form flex-wrap), allineata a destra come loro; il gap
   10px del form da' lo stacco dal bottone. */
.woocommerce div.product form.cart p.stock{
  flex:0 0 100%;order:2;justify-content:flex-end;margin:0;
}

/* tab Downloads (objex-woo.php): righe con freccia ambra, stessa
   grammatica della sezione datasheet di products/luma.html */
.objx-dl{list-style:none;margin:0;padding:0}
.objx-dl li{border-bottom:1px solid var(--ink-12)}
.objx-dl a{
  display:flex;align-items:center;gap:12px;padding:14px 2px;
  font-family:var(--mono);font-size:.85rem;letter-spacing:.02em;
  color:var(--ink);text-decoration:none;transition:color .2s ease;
}
.objx-dl a:hover{color:var(--accent-ink)}
.objx-dl-arrow{color:var(--accent-ink);flex:0 0 auto}

/* tab FAQs (objex-woo.php): accordion details/summary, domanda in
   Exo bold con +/- mono ambra sul margine destro, risposta muted */
.objx-faqs{margin:0}
.objx-faq{border-bottom:1px solid var(--ink-12)}
.objx-faq summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:15px 2px;font-family:var(--sans);font-weight:700;font-size:.98rem;color:var(--ink);
  transition:color .2s ease;
}
.objx-faq summary::-webkit-details-marker{display:none}
.objx-faq summary:hover{color:var(--accent-ink)}
.objx-faq summary::after{content:'+';font-family:var(--mono);font-size:17px;font-weight:500;color:var(--accent-ink);flex:0 0 auto}
.objx-faq[open] summary::after{content:'\2212'}
.objx-faq-a{padding:0 2px 16px;font-size:.95rem;line-height:1.6;color:var(--ink-60)}
.objx-faq-a p{margin:0 0 10px}
.objx-faq-a p:last-child{margin-bottom:0}

/* ============================================================
   MODALE CONSENSO ENGINEERING SAMPLE (markup da objex-woo.php,
   logica in objex-woo.js): stessa grammatica del .buy-modal di
   src/base.css del sito, con i token del kit (card 6px, bottoni
   mono uppercase, continue ambra come l'azione d'acquisto).
   ============================================================ */
.objx-es-modal[hidden]{display:none}
.objx-es-modal{position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;padding:20px}
.objx-es-backdrop{position:absolute;inset:0;background:rgba(13,13,12,.6);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
@keyframes objx-es-in{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
.objx-es-card{
  position:relative;width:100%;max-width:460px;max-height:calc(100dvh - 40px);overflow:auto;
  background:var(--paper);color:var(--ink);border-radius:6px;
  box-shadow:0 30px 80px rgba(0,0,0,.5);padding:clamp(22px,4vw,32px);
  animation:objx-es-in .28s cubic-bezier(.16,1,.3,1);
}
.objx-es-card:focus{outline:none}
.objx-es-x{position:absolute;top:10px;right:12px;width:34px;height:34px;border:0;background:none;font-size:24px;line-height:1;color:var(--ink-60);cursor:pointer;border-radius:var(--radius)}
.objx-es-x:hover{color:var(--ink);background:var(--ink-12)}
.objx-es-eyebrow{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent-ink);margin:0 0 10px}
.objx-es-title{font-family:var(--sans);font-weight:900;letter-spacing:-.02em;line-height:1.1;font-size:clamp(1.4rem,3.5vw,1.9rem);margin:0 0 14px}
.objx-es-body{font-size:.95rem;line-height:1.55;color:var(--ink-60)}
.objx-es-body p{margin:0}
.objx-es-body strong{color:var(--ink)}
.objx-es-body ul{margin:12px 0;padding-left:18px;display:flex;flex-direction:column;gap:6px}
.objx-es-body li{margin:0}
.objx-es-consent{display:flex;gap:10px;align-items:flex-start;margin-top:18px;font-size:.9rem;line-height:1.4;color:var(--ink);cursor:pointer}
.objx-es-consent input{margin-top:2px;width:16px;height:16px;accent-color:var(--accent);flex:0 0 auto}
.objx-es-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px;justify-content:flex-end}
.objx-es-cancel,
.objx-es-continue{
  display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:12px;line-height:1;letter-spacing:.1em;text-transform:uppercase;
  padding:14px 22px;border-radius:var(--radius);cursor:pointer;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.objx-es-cancel{background:none;border:1px solid var(--ink-12);color:var(--ink)}
.objx-es-cancel:hover{border-color:var(--ink);background:var(--ink);color:var(--paper)}
.objx-es-continue{background:var(--accent);border:0;color:var(--night);font-weight:700}
.objx-es-continue:hover{background:var(--amber-hover)}
.objx-es-continue[disabled]{opacity:.45;cursor:not-allowed}

/* header archivio di Woo (titolo "Shop" gia' spento + descrizione
   della pagina Shop): VIA DEL TUTTO. Se nella pagina Shop finiscono
   blocchi o paragrafi vuoti (autosave, editor), qui diventavano
   spazio vuoto tra le icone categorie e il banner. */
.woocommerce-shop .woocommerce-products-header,
.woocommerce-products-header{display:none;margin:0;padding:0}

/* prodotti correlati / griglia negozio: card bianche bordate,
   hover bordo ambra (stessa grammatica delle card Loxone).
   auto-fill: le card tengono una larghezza da card anche quando i
   prodotti sono pochi, niente card spalmata o schiacciata. */
.woocommerce .related.products>h2,
.woocommerce .up-sells.products>h2{
  font-size:clamp(1.15rem,1.8vw,1.5rem);
  margin:0 0 16px;padding-bottom:12px;border-bottom:1px solid var(--ink-12);
}
.woocommerce ul.products{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px;
  margin:0;padding:0;list-style:none;
}
.woocommerce ul.products::before,
.woocommerce ul.products::after{display:none}
.woocommerce ul.products li.product{
  box-sizing:border-box;float:none;width:100% !important;margin:0;
  background:#fff;border:1px solid transparent;border-radius:6px;
  padding:clamp(20px,2vw,28px);
  display:flex;flex-direction:column;gap:2px;
  transition:border-color .2s ease,box-shadow .2s ease;
}
/* piatta a riposo: l'ombra compare solo in hover, insieme al bordo ambra */
.woocommerce ul.products li.product:hover{border-color:var(--accent);box-shadow:0 1px 2px rgba(20,20,18,.04),0 10px 28px rgba(20,20,18,.06)}
/* il link prodotto contiene immagine, titolo, cod. articolo e prezzo:
   colonna, immagine centrata con aria intorno (Loxone) */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link{display:flex;flex-direction:column;text-decoration:none}
/* immagine in box ad ALTEZZA FISSA con object-fit:contain: nessun
   ritaglio (lato PHP la size e' quella non croppata della pagina
   prodotto), ELPM e LUMA fittano allo stesso modo qualunque sia il
   formato del file */
.woocommerce ul.products li.product a img{border-radius:var(--radius);margin:10px auto 22px;max-width:80%;width:auto;height:190px;object-fit:contain}
/* titolo senza grassetto: il peso visivo sta sul prezzo */
.woocommerce ul.products li.product .woocommerce-loop-product__title{font-family:var(--sans);font-weight:400;letter-spacing:-.01em;font-size:1.1rem;line-height:1.25;padding:0;color:var(--ink)}
/* cod. articolo sotto il titolo (objex-woo.php) */
.objx-loop-sku{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-60);margin:4px 0 0}

/* tag "Engineering sample": pillola ambra tenue sotto il titolo
   (card e buy box; il suffisso nel titolo lo toglie objex-woo.php) */
.objx-tag{
  display:inline-block;align-self:flex-start;
  font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--accent-ink);background:rgba(243,156,18,.12);
  border-radius:var(--radius);padding:6px 10px;margin:8px 0 0;
}
.woocommerce div.product div.summary .objx-tag{order:2}
/* prezzo in grassetto ma piu' piccolo del titolo, "excl. VAT" su riga propria */
.woocommerce ul.products li.product .price{font-size:1rem;font-weight:700;margin:14px 0 2px;color:var(--ink)}
.woocommerce ul.products li.product .price del{display:none}
.woocommerce ul.products li.product .price ins{text-decoration:none}
.objx-loop-vat{font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--ink-60);margin:0 0 18px}
/* riga d'acquisto in fondo alla card (Loxone): stepper quantita' a
   pillola + quadrato ambra con la sola icona carrello. Costruita da
   objex-woo.js attorno al bottone AJAX di Woo. */
.objx-loop-buy{margin-top:auto;display:flex;align-items:stretch;gap:10px}
.objx-loop-qty{display:inline-flex;align-items:stretch;background:#fff;border:1px solid var(--ink-12);border-radius:var(--radius);overflow:hidden}
.objx-loop-qty-btn{width:40px;border:0;background:#fff;color:var(--ink);font-family:var(--mono);font-size:16px;line-height:1;cursor:pointer;transition:background .2s ease,color .2s ease}
.objx-loop-qty-btn:hover{background:var(--ink);color:var(--paper)}
.objx-loop-qty-n{width:40px;border:0;text-align:center;font-family:var(--mono);font-size:14px;color:var(--ink);background:#fff;-moz-appearance:textfield}
.objx-loop-qty-n::-webkit-outer-spin-button,
.objx-loop-qty-n::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.objx-loop-qty-n:focus{outline:none}
.woocommerce ul.products li.product .button{
  margin-top:0;align-self:auto;flex:0 0 auto;
  width:52px;height:52px;padding:0;border-radius:var(--radius);
  font-size:0;line-height:0;position:relative;
  background:var(--accent) !important;color:var(--night) !important;
}
.woocommerce ul.products li.product .button:hover{background:var(--amber-hover) !important;color:var(--night) !important}
.woocommerce ul.products li.product .button::before,
.woocommerce div.product form.cart .single_add_to_cart_button::before{
  content:'';position:absolute;inset:0;margin:auto;width:21px;height:21px;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.6' fill='black' stroke='none'/%3E%3Ccircle cx='17.5' cy='20' r='1.6' fill='black' stroke='none'/%3E%3Cpath d='M3 3h2l2.6 10.6A2 2 0 0 0 9.5 15h8.2a2 2 0 0 0 1.9-1.4L22 7H6'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.6' fill='black' stroke='none'/%3E%3Ccircle cx='17.5' cy='20' r='1.6' fill='black' stroke='none'/%3E%3Cpath d='M3 3h2l2.6 10.6A2 2 0 0 0 9.5 15h8.2a2 2 0 0 0 1.9-1.4L22 7H6'/%3E%3C/svg%3E") center/contain no-repeat;
}
/* link "View cart" che Woo appende dopo l'aggiunta AJAX: superfluo,
   il badge del carrello in alto si aggiorna da solo */
.woocommerce ul.products li.product .added_to_cart{display:none}

/* feedback "aggiunto": per ~1.2s il bottone diventa night con la
   spunta (classe .is-added da objex-woo.js), poi torna ambra */
.woocommerce ul.products li.product .button.is-added{background:var(--night) !important;color:var(--paper) !important}
.woocommerce ul.products li.product .button.is-added::before{
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5.5 5.5L20 6.5'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5.5 5.5L20 6.5'/%3E%3C/svg%3E") center/contain no-repeat;
}
/* spinner AJAX di Woo (classe .loading): puntini nascosti, il
   feedback vero arriva con la spunta */
.woocommerce ul.products li.product .button.loading{opacity:.7}
.woocommerce ul.products li.product .button.loading::after{display:none}

/* badge carrello: piccolo "pop" a ogni aggiunta (objex-woo.js) */
@keyframes objx-pop{0%{transform:scale(1)}40%{transform:scale(1.45)}100%{transform:scale(1)}}
.objx-cart-n.objx-pop{animation:objx-pop .45s ease}
/* riga disponibilita' (objx-woo.php), chiude la card: icona camion
   Material "delivery_truck_speed" (path ufficiale Google, Apache 2.0)
   in verde acceso via mask, "In stock" in verde, riga spedizione in
   nero. Esaurito: torna il pallino rosso. */
.objx-loop-stock{display:grid;grid-template-columns:auto 1fr;column-gap:8px;row-gap:3px;align-items:center;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;margin:16px 0 0;color:#16a34a}
.objx-loop-stock::before{content:'';grid-row:1;width:17px;height:17px;background:#22c55e;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960'%3E%3Cpath d='M195-195q-35-35-35-85H60l18-80h113q17-19 40-29.5t49-10.5q26 0 49 10.5t40 29.5h167l84-360H182l4-17q6-28 27.5-45.5T264-800h456l-37 160h117l120 160-40 200h-80q0 50-35 85t-85 35q-50 0-85-35t-35-85H400q0 50-35 85t-85 35q-50 0-85-35Zm442-245h193l4-21-74-99h-95l-28 120Zm-19-273 2-7-84 360 2-7 34-146 46-200ZM20-427l20-80h220l-20 80H20Zm80-146 20-80h260l-20 80H100Zm180 333q17 0 28.5-11.5T320-280q0-17-11.5-28.5T280-320q-17 0-28.5 11.5T240-280q0 17 11.5 28.5T280-240Zm400 0q17 0 28.5-11.5T720-280q0-17-11.5-28.5T680-320q-17 0-28.5 11.5T640-280q0 17 11.5 28.5T680-240Z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960'%3E%3Cpath d='M195-195q-35-35-35-85H60l18-80h113q17-19 40-29.5t49-10.5q26 0 49 10.5t40 29.5h167l84-360H182l4-17q6-28 27.5-45.5T264-800h456l-37 160h117l120 160-40 200h-80q0 50-35 85t-85 35q-50 0-85-35t-35-85H400q0 50-35 85t-85 35q-50 0-85-35Zm442-245h193l4-21-74-99h-95l-28 120Zm-19-273 2-7-84 360 2-7 34-146 46-200ZM20-427l20-80h220l-20 80H20Zm80-146 20-80h260l-20 80H100Zm180 333q17 0 28.5-11.5T320-280q0-17-11.5-28.5T280-320q-17 0-28.5 11.5T240-280q0 17 11.5 28.5T280-240Zm400 0q17 0 28.5-11.5T720-280q0-17-11.5-28.5T680-320q-17 0-28.5 11.5T640-280q0 17 11.5 28.5T680-240Z'/%3E%3C/svg%3E") center/contain no-repeat}
.objx-stock-s{grid-column:2}
.objx-stock-ship{grid-column:2;color:var(--ink);font-size:10px;letter-spacing:.06em}
.objx-loop-stock.is-out{color:#8f1c19}
.objx-loop-stock.is-out::before{background:#8f1c19;-webkit-mask:none;mask:none;width:8px;height:8px;border-radius:50%}
/* smartphone: niente banner hero, la home parte dalla griglia */
@media (max-width:640px){
  .objx-shop-hero{display:none}
}

/* smartphone: card piu' compatte (immagine e controlli ridotti) */
@media (max-width:520px){
  .woocommerce ul.products{grid-template-columns:1fr;gap:14px}
  .woocommerce ul.products li.product{padding:16px}
  .woocommerce ul.products li.product a img{max-width:58%;margin:6px auto 14px;height:150px}
  .woocommerce ul.products li.product .woocommerce-loop-product__title{font-size:1rem}
  .woocommerce ul.products li.product .price{font-size:.95rem;margin:10px 0 2px}
  .objx-loop-vat{margin-bottom:14px}
  .woocommerce ul.products li.product .button{width:46px;height:46px}
  .objx-loop-qty-btn{width:34px}
  .objx-loop-qty-n{width:34px;font-size:13px}
  .objx-loop-stock{margin-top:12px}
}

/* ============================================================
   SHOP (archivio prodotti): solo la lista, hero opzionale (immagine
   in evidenza della pagina Shop, stampata da objex-woo.php), niente
   conteggio risultati ne' ordinamento (rimossi anche lato PHP: qui
   e' la cintura di sicurezza). Lo stacco dalla top bar arriva dal
   padding globale di .wp-site-blocks.
   ============================================================ */
.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-ordering{display:none}
/* hero/banner tra le icone categorie e "Our products": immagine in
   evidenza della pagina Shop resa come BANNER BASSO rettangolare a
   tutta larghezza (altezza fissa, ritaglio object-fit al centro) */
.objx-shop-hero{margin:0 0 clamp(16px,2.5vh,28px)}
.objx-shop-hero img{display:block;width:100%;height:clamp(140px,20vh,230px);object-fit:cover;border-radius:6px;border:1px solid var(--ink-12)}

/* recensioni: fuori scope per un prodotto engineering sample */
.woocommerce #reviews,
.woocommerce div.product .woocommerce-tabs ul.tabs li.reviews_tab{display:none}

/* ============================================================
   TABELLE (carrello, riepilogo ordine): niente zebra, righe ink-12
   ============================================================ */
.woocommerce table.shop_table{border:0;border-radius:0;margin-top:24px}
.woocommerce table.shop_table th,
.woocommerce table.shop_table td{border:0;border-bottom:1px solid var(--ink-12);background:none;padding:14px 12px 14px 0}
.woocommerce table.shop_table th{
  font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-60);font-weight:500;
}
.woocommerce table.shop_table td.product-name{font-weight:700}
.woocommerce table.shop_table td.product-name a{color:var(--ink);text-decoration:none}
.woocommerce table.shop_table td.product-name a:hover{color:var(--accent-ink)}
.woocommerce a.remove{color:var(--ink-60) !important;font-weight:400}
.woocommerce a.remove:hover{color:var(--paper) !important;background:var(--ink)}

/* coupon: campo + bottone allineati al sistema */
.woocommerce .coupon .input-text{
  font-family:var(--mono);font-size:12px;padding:12px 14px;
  border:1px solid var(--ink-12);border-radius:var(--radius);background:#fff;
}
.woocommerce .coupon .input-text:focus{border-color:var(--accent);outline:none}

/* totali carrello: card sabbia piatta, come le bande .sec--tint */
.woocommerce .cart_totals{background:var(--sand);border-radius:6px;padding:clamp(18px,3vw,28px)}
.woocommerce .cart_totals h2{font-size:1.1rem;margin-bottom:8px}
.woocommerce .cart_totals table.shop_table{margin-top:0}
.woocommerce .cart-collaterals .cart_totals tr td,
.woocommerce .cart-collaterals .cart_totals tr th{border-color:var(--ink-12)}
.woocommerce .order-total .amount{font-size:1.15rem;font-weight:700}

/* ============================================================
   CHECKOUT CLASSICO ([woocommerce_checkout])
   ============================================================ */
.woocommerce form .form-row label{
  font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-60);
  margin-bottom:6px;
}
.woocommerce form .form-row label .required{color:var(--accent-ink);text-decoration:none}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select{
  font-family:var(--sans);font-size:15px;color:var(--ink);
  background:#fff;border:1px solid var(--ink-12);border-radius:var(--radius);
  padding:12px 14px;transition:border-color .2s ease;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus{border-color:var(--accent);outline:none}
.woocommerce form .form-row.woocommerce-invalid input.input-text{border-color:#b3231f}

/* select2 (paese/provincia) allineato ai campi */
.woocommerce .select2-container--default .select2-selection--single{
  height:auto;padding:12px 14px;border:1px solid var(--ink-12);border-radius:var(--radius);background:#fff;
}
.woocommerce .select2-container--default .select2-selection--single .select2-selection__rendered{line-height:1.4;padding:0;color:var(--ink)}
.woocommerce .select2-container--default .select2-selection--single .select2-selection__arrow{height:100%;top:0}
.select2-dropdown{border:1px solid var(--ink-12);border-radius:var(--radius)}
.select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--ink);color:var(--paper)}

/* intestazioni sezioni checkout */
.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
#order_review_heading{
  font-size:1.15rem;margin:26px 0 14px;padding-bottom:10px;border-bottom:1px solid var(--ink-12);
}

/* riepilogo ordine: banda sabbia, coerente con i totali carrello */
.woocommerce #order_review{background:var(--sand);border-radius:6px;padding:clamp(18px,3vw,28px)}
.woocommerce #order_review table.shop_table{margin-top:0}

/* metodi di pagamento: card pulite, radio ambra */
.woocommerce #payment{background:none}
.woocommerce #payment ul.payment_methods{border-bottom:1px solid var(--ink-12);padding:16px 0}
.woocommerce #payment ul.payment_methods li{list-style:none}
.woocommerce #payment ul.payment_methods li label{font-size:.95rem;font-weight:700;cursor:pointer}
.woocommerce #payment input[type=radio],
.woocommerce input[type=checkbox]{accent-color:var(--accent);width:16px;height:16px}
.woocommerce #payment div.payment_box{
  background:#fff;border:1px solid var(--ink-12);border-radius:var(--radius);
  color:var(--ink-60);font-size:.9rem;
}
.woocommerce #payment div.payment_box::before{display:none}
.woocommerce #payment div.form-row.place-order{padding:18px 0 0}
.woocommerce #place_order{width:100%;font-size:13px;padding:16px 22px}

/* privacy / termini sotto il place order: mono piccolo, come le note del sito */
.woocommerce-terms-and-conditions-wrapper,
.woocommerce-privacy-policy-text{font-size:.85rem;line-height:1.5;color:var(--ink-60)}
.woocommerce-privacy-policy-text a,
.woocommerce-terms-and-conditions-wrapper a{color:var(--accent-ink)}

/* ============================================================
   CHECKOUT / CARRELLO A BLOCCHI (Gutenberg, default Woo 8+)
   ============================================================ */
.wc-block-components-text-input input,
.wc-block-components-textarea textarea,
.wc-block-components-combobox .components-combobox-control__input,
.wc-block-components-select .components-custom-select-control__button{
  background:#fff;border:1px solid var(--ink-12);border-radius:var(--radius);color:var(--ink);
}
.wc-block-components-text-input input:focus,
.wc-block-components-textarea textarea:focus{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.wc-block-components-checkout-step__title{font-family:var(--sans);font-weight:900;letter-spacing:-.02em}
.wc-block-components-checkout-step__description{color:var(--ink-60)}
.wc-block-components-radio-control__input{accent-color:var(--accent)}
.wc-block-components-radio-control__input:checked{border-color:var(--accent);background:var(--accent)}
.wc-block-components-sidebar .wc-block-components-panel,
.wc-block-components-order-summary{background:var(--sand);border-radius:6px}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value{font-weight:700}
.wc-block-components-button{border-radius:var(--radius)}
.wc-block-components-button__text{font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;font-size:12px}

/* riepilogo ordine sticky del checkout a blocchi: Woo lo incolla a
   top:0 e finisce incastrato dietro la top bar sticky del kit. Deve
   fermarsi SOTTO la barra, come il buy box della pagina prodotto
   (61px di barra + aria). !important: vince sulle regole dei blocchi. */
.wc-block-components-sidebar-layout .wc-block-components-sidebar,
.wc-block-checkout__sidebar,
.wc-block-components-sidebar .wc-block-components-order-summary{top:84px !important}
body.admin-bar .wc-block-components-sidebar-layout .wc-block-components-sidebar,
body.admin-bar .wc-block-checkout__sidebar,
body.admin-bar .wc-block-components-sidebar .wc-block-components-order-summary{top:116px !important}

/* ============================================================
   AVVISI: stessa grammatica dello status box del modale Buy
   (mono, sfondo tinta al 10%, raggio 6, niente icone giganti)
   ============================================================ */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.wc-block-components-notice-banner{
  font-family:var(--mono);font-size:12.5px;line-height:1.5;
  border:0;border-radius:6px;padding:14px 16px !important;
  background:rgba(243,156,18,.1);color:var(--accent-ink);
  margin-bottom:22px;
}
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before{display:none}
.woocommerce-message{background:rgba(20,20,18,.06);color:var(--ink)}
.woocommerce-error,
.wc-block-components-notice-banner.is-error{background:rgba(179,35,31,.08);color:#8f1c19}
.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button{float:right;margin-left:12px;padding:8px 12px;font-size:10px}

/* ============================================================
   ORDINE RICEVUTO (thank you page)
   ============================================================ */
.woocommerce-thankyou-order-received{
  font-family:var(--sans);font-weight:900;letter-spacing:-.02em;
  font-size:clamp(1.5rem,3vw,2.2rem);margin:30px 0 22px;max-width:26ch;
}
.woocommerce ul.order_details{
  display:flex;flex-wrap:wrap;gap:18px 34px;list-style:none;margin:0 0 30px;padding:clamp(18px,3vw,26px);
  background:var(--sand);border-radius:6px;
}
.woocommerce ul.order_details li{
  border:0;margin:0;padding:0;float:none;
  font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-60);
}
.woocommerce ul.order_details li strong{
  display:block;font-family:var(--mono);font-size:1rem;letter-spacing:-.01em;text-transform:none;color:var(--ink);margin-top:8px;
}

/* ============================================================
   FOOTER del kit: replica 1:1 del footer scuro di products/luma.html
   (#labs-footer): banda night, marchio X invertito, 4 colonne
   PRODOTTI / SUPPORTO / AZIENDA / CONTATTI, riga sottile con link
   legali e social, riga societaria centrata sotto. Markup stampato
   da objex-woo.php su wp_footer.
   ============================================================ */
/* niente width:100%: e' un blocco, riempie da solo; con il padding 7vw
   e box-sizing content-box del tema sforerebbe lo schermo di 14vw */
.objx-footer{box-sizing:border-box;margin-top:clamp(64px,9vh,112px);background:var(--night);padding:clamp(44px,7vh,80px) 7vw clamp(36px,6vh,60px);font-family:var(--sans);color:rgba(249,248,245,.72);overflow-x:clip}
.objx-footer *{margin:0;padding:0;box-sizing:border-box}
.objx-footer-i{max-width:1180px;margin:0 auto}
.objx-footer-head{text-align:center;margin-bottom:clamp(42px,7vh,78px)}
/* marchio X INLINE (sorgente: assets/svg/objex-mark.svg del sito),
   riempito direttamente di bianco per la banda night: niente filtri,
   niente file esterni */
.objx-footer-head svg{height:38px;width:auto;display:inline-block}

.objx-footer-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(22px,3.5vw,44px);text-align:left;margin-bottom:clamp(30px,5vh,50px)}
.objx-footer-col-t{font-family:var(--mono);font-size:10px;color:rgba(249,248,245,.5);letter-spacing:.1em;text-transform:uppercase;margin-bottom:12px}
.objx-footer-links{list-style:none;display:flex;flex-direction:column;align-items:flex-start;gap:7px}
.objx-footer-links a{font-size:13px;color:rgba(249,248,245,.72);text-decoration:none;transition:color .2s}
.objx-footer-links a:hover{color:var(--amber)}

.objx-footer-thin{display:flex;justify-content:space-between;align-items:center;gap:16px 24px;flex-wrap:wrap}
.objx-footer-legal{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;font-family:var(--mono);font-size:10px;color:rgba(249,248,245,.5);letter-spacing:.05em}
.objx-footer-legal .dot{color:rgba(249,248,245,.3);user-select:none}
.objx-footer-legal a{color:rgba(249,248,245,.5);text-decoration:none;transition:color .2s}
.objx-footer-legal a:hover{color:var(--paper)}
.objx-footer-soc{display:flex;gap:18px}
.objx-footer-soc a{display:flex;align-items:center;justify-content:center;color:rgba(249,248,245,.5);transition:color .2s}
.objx-footer-soc a:hover{color:var(--amber)}
.objx-footer-soc svg{width:17px;height:17px;fill:currentColor}

/* riga societaria (art. 2250 c.c.) + copyright, centrata sotto la riga sottile */
.objx-footer-company{font-family:var(--mono);font-size:10px;letter-spacing:.04em;line-height:1.7;color:rgba(249,248,245,.45);text-align:center;margin:clamp(12px,2vh,18px) 0 0;padding-top:clamp(12px,2vh,18px);border-top:1px solid rgba(249,248,245,.1)}

.objx-footer a:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:var(--radius)}
@media (max-width:860px){.objx-footer-cols{grid-template-columns:1fr 1fr;gap:24px 32px}}
@media (max-width:600px){
  .objx-footer-thin{justify-content:center}
  .objx-footer-legal{justify-content:center}
  .objx-footer-soc{width:100%;justify-content:center}
}

/* ============================================================
   CODA DEL BODY: niente strisce sotto il footer
   ============================================================ */
/* iframe tecnici di Stripe / WooPayments accodati al body dopo il
   footer (metrics, controller): sono da 1px ma in flusso inline
   generano una riga chiara sotto il footer scuro del checkout.
   Fuori flusso, NON display:none: devono restare funzionanti. */
iframe[name^="__privateStripe"],
body > iframe[src*="js.stripe.com"]{position:absolute !important;left:-9999px !important;top:0 !important}

/* ============================================================
   CARRELLO / CHECKOUT: margini di pagina. Il template a blocchi di
   Woo (main.wp-block-group dentro .wp-site-blocks) non ha padding
   laterale proprio: sotto i ~1200px di viewport titolo, tabelle e
   campi finivano a filo del bordo schermo (misurato live a 390px).
   Qui si danno gli stessi margini del resto del sito, e su mobile
   si compatta la testata.
   ============================================================ */
.woocommerce-cart .wp-site-blocks,
.woocommerce-checkout .wp-site-blocks{padding-left:7vw;padding-right:7vw}
@media (min-width:1400px){
  .woocommerce-cart .wp-site-blocks,
  .woocommerce-checkout .wp-site-blocks{padding-left:24px;padding-right:24px}
}
@media (max-width:640px){
  .woocommerce-cart .wp-site-blocks,
  .woocommerce-checkout .wp-site-blocks{padding-top:22px}
  .woocommerce-cart h1.wp-block-post-title,
  .woocommerce-checkout h1.wp-block-post-title{font-size:1.6rem;margin-bottom:10px}
}
/* titolo di pagina vuoto (es. pagina Checkout senza titolo): via,
   non deve lasciare una riga fantasma */
h1.wp-block-post-title:empty{display:none}

/* footer sticky: su pagine corte (carrello vuoto, thank-you) il footer
   chiude comunque la finestra, nessuna fascia paper sotto la banda night.
   I figli fixed/absolute del body (admin bar, modali) non ne risentono. */
body{display:flex;flex-direction:column;min-height:100vh}
.wp-site-blocks{flex:1 0 auto}
.objx-footer{flex-shrink:0}

/* ---------- mobile ---------- */
@media (max-width:768px){
  .woocommerce #place_order{font-size:12px}
  .woocommerce table.shop_table td{padding-right:8px}
  .woocommerce .coupon{display:flex;gap:8px}
  .woocommerce .coupon .input-text{flex:1;width:auto !important}
}