/*
Theme Name: Castello di Cantone e Vecchia Masseria
Description: Il tema dei due siti. Stessa struttura e stesso layout; colori, logo e dettagli cambiano col marchio del dominio (classe marchio-cantone / marchio-masseria sul body).
Version: 0.2.0
Text Domain: cantone-masseria
*/

/* ---------- Font: Barlow (OFL, self-hosted) per il testo, Cormorant per i titoli ---------- */
@font-face { font-family: "Barlow"; font-weight: 300; font-display: swap; src: url("assets/fonts/barlow-300.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 400; font-display: swap; src: url("assets/fonts/barlow-400.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 600; font-display: swap; src: url("assets/fonts/barlow-600.woff2") format("woff2"); }

/* ---------- Token. I colori definitivi arrivano dal Figma: questi vengono dallo shop attuale ---------- */
:root {
  --cm-carta: #f4efe6;
  --cm-carta-scura: #ebe3d5;
  --cm-bianco: #fffdf9;
  --cm-inchiostro: #1d1d1b;
  --cm-inchiostro-tenue: #5b534b;
  --cm-linea: rgba(33, 29, 26, 0.16);
  --cm-accento: #b1af6a;
  --cm-accento-testo: #646230;
  --cm-scuro: #1d1d1b;
  --cm-su-scuro: #f4efe6;
  --cm-su-scuro-tenue: rgba(244, 239, 230, 0.72);
  --cm-testo: "Barlow", system-ui, sans-serif;
  --cm-titoli: "Cormorant Garamond", Georgia, serif;
  --cm-larghezza: 1200px;
  --cm-gutter: 16px;
  --cm-raggio: 2px;
}
body.marchio-masseria {
  --cm-carta: #f6f1e8;
  --cm-carta-scura: #ece3d4;
  --cm-accento: #7a3b3a;
  --cm-accento-testo: #6a2f2e;
  --cm-scuro: #231c19;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--cm-carta); color: var(--cm-inchiostro); font: 400 17px/1.6 var(--cm-testo); }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--cm-accento-testo); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--cm-inchiostro); }
h1, h2, h3, h4 { font-family: var(--cm-titoli); font-weight: 500; line-height: 1.1; margin: 0 0 .5em; letter-spacing: .01em; }
h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); }
h2 { font-size: clamp(1.8rem, 3.6vw, 2.6rem); }
h3 { font-size: 1.35rem; }
p { margin: 0 0 1em; }
.cm-contenitore { max-width: var(--cm-larghezza); margin: 0 auto; padding: 0 var(--cm-gutter); }
.cm-salta { position: absolute; left: -999px; top: 0; background: var(--cm-scuro); color: var(--cm-su-scuro); padding: 8px 12px; z-index: 100; }
.cm-salta:focus { left: 8px; }
.cm-visivamente-nascosto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.cm-sopratitolo { font-size: .8rem; letter-spacing: .18em; text-transform: uppercase; color: var(--cm-accento-testo); margin-bottom: .6em; font-weight: 600; }
.cm-bottone { display: inline-block; background: var(--cm-accento); color: var(--cm-scuro); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; font-size: .82rem; padding: 14px 26px; border: 1px solid var(--cm-accento); border-radius: var(--cm-raggio); text-decoration: none; transition: background .2s, color .2s; cursor: pointer; }
.cm-bottone:hover { background: var(--cm-scuro); border-color: var(--cm-scuro); color: var(--cm-su-scuro); }
.cm-bottone--contorno { background: transparent; color: var(--cm-inchiostro); border-color: var(--cm-inchiostro); }
.cm-bottone--contorno:hover { background: var(--cm-inchiostro); color: var(--cm-su-scuro); }
body.marchio-masseria .cm-bottone { color: var(--cm-su-scuro); }
.cm-link { font-weight: 600; letter-spacing: .08em; text-transform: uppercase; font-size: .8rem; text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 2px; }
.cm-azione { margin-top: 32px; }
.cm-sezione__testa { text-align: center; max-width: 640px; margin: 0 auto 40px; }

/* ---------- Testata ---------- */
.cm-testata { background: var(--cm-bianco); border-bottom: 1px solid var(--cm-linea); position: sticky; top: 0; z-index: 50; }
.cm-testata__riga { display: flex; align-items: center; gap: 24px; min-height: 96px; }
.cm-testata__logo { display: block; margin-right: auto; }
.cm-testata__logo .cm-logo { width: auto; height: 72px; } /* più specifico di «.woocommerce-page img» */
.cm-navigazione { display: flex; }
.cm-menu, .cm-sottomenu { list-style: none; margin: 0; padding: 0; }
.cm-menu { display: flex; gap: 28px; }
.cm-menu > li { position: relative; }
.cm-menu > li > a { display: block; padding: 30px 0; font-size: .86rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 600; color: var(--cm-inchiostro); text-decoration: none; border-bottom: 2px solid transparent; }
.cm-menu > li > a:hover, .cm-menu > li.current-menu-item > a, .cm-menu > li.current-menu-ancestor > a { border-bottom-color: var(--cm-accento); }
.cm-menu .cm-sottomenu, .cm-menu .sub-menu { position: absolute; left: -16px; top: 100%; min-width: 220px; background: var(--cm-bianco); border: 1px solid var(--cm-linea); padding: 8px 0; display: none; }
.cm-menu > li:hover > .cm-sottomenu, .cm-menu > li:hover > .sub-menu, .cm-menu > li:focus-within > .cm-sottomenu, .cm-menu > li:focus-within > .sub-menu { display: block; }
.cm-sottomenu a, .sub-menu a { display: block; padding: 8px 16px; color: var(--cm-inchiostro); text-decoration: none; font-size: .95rem; }
.cm-sottomenu a:hover, .sub-menu a:hover { background: var(--cm-carta); }
.cm-testata__azioni { display: flex; align-items: center; gap: 16px; }
.cm-carrello { display: inline-flex; align-items: center; gap: 6px; color: var(--cm-inchiostro); text-decoration: none; }
.cm-carrello__conto { font-size: .75rem; font-weight: 600; background: var(--cm-accento); color: var(--cm-scuro); min-width: 20px; height: 20px; border-radius: 10px; display: inline-grid; place-items: center; padding: 0 5px; }
body.marchio-masseria .cm-carrello__conto { color: var(--cm-su-scuro); }
.cm-testata__apri { display: none; width: 44px; height: 44px; background: none; border: 0; padding: 10px; cursor: pointer; flex-direction: column; justify-content: space-between; }
.cm-testata__apri span:not(.cm-visivamente-nascosto) { display: block; height: 2px; background: var(--cm-inchiostro); }

@media (max-width: 900px) {
  .cm-testata__riga { min-height: 68px; gap: 12px; }
  .cm-testata__logo .cm-logo { height: 48px; }
  .cm-testata__apri { display: flex; order: 3; }
  .cm-navigazione { display: none; position: absolute; left: 0; right: 0; top: 100%; background: var(--cm-bianco); border-bottom: 1px solid var(--cm-linea); padding: 8px var(--cm-gutter) 24px; max-height: calc(100vh - 68px); overflow: auto; }
  body.cm-menu-aperto .cm-navigazione { display: block; }
  .cm-menu { flex-direction: column; gap: 0; }
  .cm-menu > li > a { padding: 14px 0; border-bottom: 1px solid var(--cm-linea); }
  .cm-menu .cm-sottomenu, .cm-menu .sub-menu { position: static; border: 0; padding: 0 0 8px 16px; min-width: 0; }
  .cm-menu > li:hover > .cm-sottomenu, .cm-menu > li:hover > .sub-menu { display: none; }
  .cm-menu > li.aperta > .cm-sottomenu, .cm-menu > li.aperta > .sub-menu { display: block; }
}

/* ---------- Testa di pagina ---------- */
.cm-testa-pagina { position: relative; min-height: 46vh; display: grid; align-items: end; color: var(--cm-su-scuro); background: var(--cm-scuro) var(--cm-immagine) center/cover no-repeat; isolation: isolate; }
.cm-testa-pagina::before { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(20, 18, 16, .78), rgba(20, 18, 16, .15) 60%, rgba(20, 18, 16, .25)); z-index: -1; }
.cm-testa-pagina--home { min-height: 78vh; align-items: center; text-align: center; }
.cm-testa-pagina--bassa { min-height: 32vh; }
.cm-testa-pagina__testo { padding-top: 48px; padding-bottom: 48px; width: 100%; }
.cm-testa-pagina__titolo { color: inherit; margin: 0; text-shadow: 0 2px 20px rgba(0, 0, 0, .3); }
.cm-testa-pagina .cm-sopratitolo { color: var(--cm-accento); }
.cm-testa-pagina__sotto { font-family: var(--cm-titoli); font-size: 1.4rem; font-style: italic; color: var(--cm-su-scuro-tenue); margin-top: .6em; }
.cm-testa-pagina--home .cm-azione { margin-top: 28px; }

/* ---------- Sottomenu di sezione ---------- */
.cm-sottosezioni { background: var(--cm-bianco); border-bottom: 1px solid var(--cm-linea); }
.cm-sottosezioni ul { list-style: none; margin: 0 auto; padding: 0 var(--cm-gutter); max-width: var(--cm-larghezza); display: flex; gap: 28px; overflow-x: auto; }
.cm-sottosezioni a { display: block; padding: 16px 0; font-size: .82rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 600; color: var(--cm-inchiostro-tenue); text-decoration: none; white-space: nowrap; border-bottom: 2px solid transparent; }
.cm-sottosezioni .attiva a, .cm-sottosezioni a:hover { color: var(--cm-inchiostro); border-bottom-color: var(--cm-accento); }

/* ---------- Prosa ---------- */
.cm-articolo { padding: 56px var(--cm-gutter); }
.cm-prosa { max-width: 720px; margin: 0 auto; font-size: 1.1rem; }
.cm-prosa--intro { margin-bottom: 40px; }
.cm-prosa h2, .cm-prosa h3 { margin-top: 1.6em; }
.cm-prosa img { margin: 1.5em 0; }
.cm-intro { padding: 64px 0 24px; }
.cm-intro__testo { max-width: 760px; text-align: center; font-family: var(--cm-titoli); font-size: 1.5rem; line-height: 1.45; }

/* ---------- Blocchi immagine + testo ---------- */
.cm-sezioni { padding: 24px 0 48px; }
.cm-blocco { display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; align-items: center; padding: 40px 0; }
.cm-blocco--inverso .cm-blocco__foto { order: 2; }
.cm-blocco__foto img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
.cm-blocco__testo h2 { margin-bottom: .4em; }
.cm-blocco__testo p { color: var(--cm-inchiostro-tenue); max-width: 46ch; }
@media (max-width: 760px) { .cm-blocco { grid-template-columns: 1fr; gap: 20px; padding: 24px 0; } .cm-blocco--inverso .cm-blocco__foto { order: 0; } }

/* ---------- Vini ---------- */
.cm-vini-home, .cm-lista-vini, .cm-correlati { padding: 56px var(--cm-gutter); }
.cm-vini-home { background: var(--cm-bianco); }
.cm-griglia-vini { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 40px 28px; }
.cm-griglia-vini--3 { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.cm-vino { text-align: center; }
.cm-vino__foto { display: block; background: var(--cm-carta-scura); padding: 24px; }
.cm-vino__foto img { height: 320px; width: 100%; object-fit: contain; transition: transform .3s; }
.cm-vino:hover .cm-vino__foto img { transform: translateY(-6px); }
.cm-vino__testo { padding: 16px 4px 0; }
.cm-vino__denominazione { font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: var(--cm-inchiostro-tenue); margin-bottom: .4em; }
.cm-vino__nome { font-size: 1.5rem; margin-bottom: .3em; }
.cm-vino__nome a { color: var(--cm-inchiostro); text-decoration: none; }
.cm-vino__prezzo { font-weight: 600; margin: 0; }
.cm-vino__prezzo .woocommerce-Price-currencySymbol { font-weight: 400; font-size: .85em; }

/* ---------- Scopri anche ---------- */
.cm-scopri { background: var(--cm-scuro); color: var(--cm-su-scuro); padding: 64px var(--cm-gutter); }
.cm-scopri h2, .cm-scopri .cm-vino__nome a { color: inherit; }
.cm-scopri .cm-sopratitolo { color: var(--cm-accento); }
.cm-scopri .cm-vino__foto { background: rgba(255, 255, 255, .06); }
.cm-scopri .cm-vino__denominazione { color: var(--cm-su-scuro-tenue); }
.cm-scopri .cm-bottone--contorno { color: var(--cm-su-scuro); border-color: var(--cm-su-scuro); }
.cm-scopri .cm-bottone--contorno:hover { background: var(--cm-su-scuro); color: var(--cm-scuro); }
.cm-scopri .cm-azione { text-align: center; }

/* ---------- Scheda del vino ---------- */
.cm-scheda__griglia { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; padding: 56px var(--cm-gutter); align-items: start; }
.cm-scheda__foto { background: var(--cm-carta-scura); padding: 32px; }
.cm-scheda__foto .woocommerce-product-gallery__image img { max-height: 70vh; width: auto; margin: 0 auto; object-fit: contain; }
.cm-scheda__foto .flex-control-thumbs { display: flex; gap: 8px; justify-content: center; list-style: none; padding: 0; margin: 12px 0 0; }
.cm-scheda__foto .flex-control-thumbs img { width: 56px; }
.cm-scheda__nome { margin-bottom: .2em; }
.cm-scheda__denominazione { font-size: .85rem; letter-spacing: .14em; text-transform: uppercase; color: var(--cm-inchiostro-tenue); }
.cm-scheda__prezzo { font-size: 1.6rem; font-family: var(--cm-titoli); margin: 20px 0 8px; }
.cm-scheda__nota { font-size: .85rem; color: var(--cm-inchiostro-tenue); }
.cm-scheda__ungulus { background: var(--cm-carta-scura); padding: 24px; margin: 24px 0; }
.cm-scheda__descrizione { padding-bottom: 32px; }
.cm-scheda__tecnica { padding: 32px var(--cm-gutter) 56px; max-width: calc(var(--cm-larghezza) * .8); }
.cm-dati { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px 32px; margin: 0; }
.cm-dati div { border-top: 1px solid var(--cm-linea); padding-top: 10px; }
.cm-dati dt { font-size: .76rem; letter-spacing: .14em; text-transform: uppercase; color: var(--cm-inchiostro-tenue); }
.cm-dati dd { margin: 4px 0 0; }
@media (max-width: 760px) { .cm-scheda__griglia { grid-template-columns: 1fr; gap: 24px; padding-top: 24px; } }

/* Il modulo di acquisto di WooCommerce (formati e quantità) */
.cm-scheda__acquisto table.variations { border: 0; margin: 0 0 16px; }
.cm-scheda__acquisto table.variations td, .cm-scheda__acquisto table.variations th { border: 0; padding: 4px 0; vertical-align: middle; }
.cm-scheda__acquisto table.variations th.label { padding-right: 16px; font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; }
.cm-scheda__acquisto select, .cm-scheda__acquisto input.qty, .cm-woo select, .cm-woo input[type="text"], .cm-woo input[type="email"], .cm-woo input[type="tel"], .cm-woo input[type="password"], .cm-woo textarea { font: inherit; padding: 10px 12px; border: 1px solid var(--cm-inchiostro-tenue); background: var(--cm-bianco); border-radius: var(--cm-raggio); color: var(--cm-inchiostro); }
.cm-scheda__acquisto .reset_variations { display: none !important; }
.cm-scheda__acquisto .woocommerce-variation-price { display: none; }
.cm-scheda__acquisto form.cart { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.cm-scheda__acquisto form.cart .variations { flex-basis: 100%; }
.cm-scheda__acquisto .woocommerce-variation-add-to-cart { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.cm-scheda__acquisto input.qty { width: 72px; }
.cm-scheda__acquisto button.single_add_to_cart_button, .cm-woo button.button, .cm-woo .button, .cm-woo a.button, .cm-woo button[type="submit"] { background: var(--cm-accento) !important; color: var(--cm-scuro) !important; font-weight: 600 !important; letter-spacing: .08em; text-transform: uppercase; font-size: .82rem !important; padding: 14px 26px !important; border: 1px solid var(--cm-accento) !important; border-radius: var(--cm-raggio) !important; cursor: pointer; line-height: 1.2; }
.cm-scheda__acquisto button.single_add_to_cart_button:hover, .cm-woo .button:hover, .cm-woo button[type="submit"]:hover { background: var(--cm-scuro) !important; border-color: var(--cm-scuro) !important; color: var(--cm-su-scuro) !important; }
body.marchio-masseria .cm-scheda__acquisto button.single_add_to_cart_button, body.marchio-masseria .cm-woo .button, body.marchio-masseria .cm-woo button[type="submit"] { color: var(--cm-su-scuro) !important; }
.cm-scheda__acquisto .stock { font-size: .9rem; color: var(--cm-inchiostro-tenue); }

/* ---------- Carrello, cassa, account (sopra gli stili di WooCommerce) ---------- */
.cm-woo { padding: 48px var(--cm-gutter) 64px; }
.cm-woo h1, .cm-woo .entry-title { margin-bottom: 1em; }
.cm-woo table.shop_table { border: 0; border-collapse: collapse; }
.cm-woo table.shop_table th, .cm-woo table.shop_table td { border: 0; border-bottom: 1px solid var(--cm-linea); padding: 14px 8px; }
.cm-woo table.shop_table img { width: 64px; height: 96px; object-fit: contain; background: var(--cm-carta-scura); }
.cm-woo .cart_totals, .cm-woo .cross-sells { display: none; }
.cm-woo .cart-collaterals .cart_totals { display: block; }
.cm-woo .woocommerce-message, .cm-woo .woocommerce-info, .cm-woo .woocommerce-error { border-top-color: var(--cm-accento); background: var(--cm-bianco); }
.cm-woo .woocommerce-message::before, .cm-woo .woocommerce-info::before { color: var(--cm-accento-testo); }
.cm-woo #payment { background: var(--cm-bianco); border: 1px solid var(--cm-linea); }
.cm-woo #payment div.payment_box { background: var(--cm-carta); }
.cm-woo .woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; }
.cm-woo .woocommerce-MyAccount-navigation a { display: block; padding: 10px 0; border-bottom: 1px solid var(--cm-linea); text-decoration: none; color: var(--cm-inchiostro); }
.cm-woo .woocommerce-MyAccount-navigation .is-active a { color: var(--cm-accento-testo); font-weight: 600; }
.cm-woo .woocommerce-form-login, .cm-woo .woocommerce-form-register { border: 1px solid var(--cm-linea); background: var(--cm-bianco); }
.cm-woo label { font-size: .85rem; letter-spacing: .04em; }
.cm-woo .woocommerce-pagination ul.page-numbers { border: 0; }

/* ---------- Timeline ---------- */
.cm-timeline { list-style: none; margin: 32px 0; padding: 0 0 0 32px; border-left: 2px solid var(--cm-accento); }
.cm-tappa { position: relative; padding: 0 0 40px; }
.cm-tappa::before { content: ""; position: absolute; left: -41px; top: 6px; width: 16px; height: 16px; border-radius: 50%; background: var(--cm-carta); border: 3px solid var(--cm-accento); }
.cm-tappa__anno { font-family: var(--cm-titoli); font-size: 2rem; line-height: 1; color: var(--cm-accento-testo); display: block; margin-bottom: 8px; }
.cm-tappa__testo h3 { margin-bottom: .3em; }
.cm-tappa__testo p { color: var(--cm-inchiostro-tenue); }

/* ---------- Piè di pagina ---------- */
.cm-piede { background: var(--cm-scuro); color: var(--cm-su-scuro-tenue); padding: 56px 0 24px; margin-top: 0; }
.cm-piede a { color: var(--cm-su-scuro); text-decoration: none; }
.cm-piede a:hover { color: var(--cm-accento); }
.cm-piede__griglia { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 40px; }
.cm-piede .cm-logo--piede { width: auto; height: 64px; filter: invert(1) brightness(1.6); margin-bottom: 16px; }
.cm-piede__titolo { font-family: var(--cm-testo); font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; color: var(--cm-accento); margin-bottom: 14px; }
.cm-piede__menu { list-style: none; margin: 0; padding: 0; }
.cm-piede__menu li { margin-bottom: 8px; }
.cm-piede__fine { border-top: 1px solid rgba(255, 255, 255, .12); margin-top: 40px; padding-top: 20px; font-size: .85rem; }
.cm-piede__fine p { margin: 0; }
@media (max-width: 760px) { .cm-piede__griglia { grid-template-columns: 1fr; gap: 28px; } }

/* ---------- 404 ---------- */
.cm-404 { text-align: center; padding: 96px var(--cm-gutter); }