/*
Theme Name: Gaston intimo chic
Theme URI: https://gaston.store/
Description: Child theme di Twenty Twenty-Five per Gaston intimo chic, Siena. Nero e bianco, Playfair Display + Inter self-hosted.
Author: Gianluca Balducci
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.6
Text Domain: gaston-child
*/

/* ---------- Base ---------- */
body { -webkit-font-smoothing: antialiased; }
::selection { background: var(--wp--preset--color--nero); color: var(--wp--preset--color--bianco); }
:where(a, button, .wp-element-button):focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

/* Titoli display come la locandina: maiuscolo, stretto */
.is-style-gaston-display { text-transform: uppercase; letter-spacing: -0.01em; line-height: 0.95; }
.gaston-eyebrow { text-transform: uppercase; letter-spacing: 0.22em; font-size: var(--wp--preset--font-size--small); font-weight: 600; }

/* Filetto con tacca centrale, ripreso dalla locandina */
.wp-block-separator.is-style-gaston-filetto { border: 0; height: 1px; background: currentColor; opacity: 1; position: relative; overflow: visible; width: 100%; }
.wp-block-separator.is-style-gaston-filetto::after { content: ""; position: absolute; left: 50%; top: -3px; width: 28px; height: 7px; transform: translateX(-50%); background: currentColor; }

/* Fascia a scacchi del monogramma G */
.wp-block-separator.gaston-scacchi { height: 14px; border: 0; border-block: 1px solid var(--wp--preset--color--nero); opacity: 1; margin-block: 0 !important; background: repeating-linear-gradient(90deg, var(--wp--preset--color--nero) 0 14px, var(--wp--preset--color--bianco) 14px 28px); }

/* Sezioni a tutta larghezza attaccate tra loro */
.wp-block-post-content > .alignfull,
header.wp-block-template-part, footer.wp-block-template-part,
.wp-site-blocks > main, .wp-site-blocks > footer { margin-block-start: 0 !important; margin-block-end: 0 !important; }
header.wp-block-template-part > .wp-block-group { margin-block: 0; }
.gaston-header { position: relative; z-index: 10; }
.gaston-header .gaston-logo img { max-width: 46vw; height: auto; }

/* ---------- Bottoni su fondo nero ---------- */
.has-nero-background-color .wp-block-button:not(.is-style-outline) .wp-element-button { background: var(--wp--preset--color--bianco); color: var(--wp--preset--color--nero); }
.has-nero-background-color .wp-block-button.is-style-outline .wp-element-button { color: var(--wp--preset--color--bianco); border-color: var(--wp--preset--color--bianco); }
.wp-block-button.is-style-outline .wp-element-button:hover { background: var(--wp--preset--color--nero); color: var(--wp--preset--color--bianco); }
.has-nero-background-color .wp-block-button.is-style-outline .wp-element-button:hover { background: var(--wp--preset--color--bianco); color: var(--wp--preset--color--nero); }

/* ---------- Barra annuncio ---------- */
.gaston-barra p { margin: 0; }
.gaston-barra a { color: inherit; text-underline-offset: 3px; }

/* ---------- Fasi dell'evento (JS imposta data-gaston-fase su <html>) ----------
   Senza JS si vede solo la fase "dopo" (sempre vera: ci siamo trasferiti). */
.gaston-fase--prima, .gaston-fase--durante, .gaston-fase--evento { display: none !important; }
html[data-gaston-fase="prima"] .gaston-fase--prima,
html[data-gaston-fase="durante"] .gaston-fase--durante,
html[data-gaston-fase="prima"] .gaston-fase--evento,
html[data-gaston-fase="durante"] .gaston-fase--evento { display: revert !important; }
html[data-gaston-fase="prima"] .gaston-fase--dopo,
html[data-gaston-fase="durante"] .gaston-fase--dopo { display: none !important; }

/* ---------- Hero ---------- */
.gaston-hero .wp-block-video video { width: 100%; aspect-ratio: 9 / 16; max-height: min(78vh, 720px); object-fit: cover; display: block; margin-inline: auto; }
.gaston-hero .wp-block-video { margin: 0; }
.gaston-hero .wp-block-columns { gap: clamp(2rem, 5vw, 5rem); }

/* ---------- Griglia motivi ---------- */
.gaston-motivi .wp-block-column { border-top: 1px solid var(--wp--preset--color--nero); padding-top: var(--wp--preset--spacing--30); }
.gaston-numero { font-family: var(--wp--preset--font-family--playfair); font-style: italic; }


/* ---------- Loghi marchi ---------- */
.wp-block-gallery.gaston-loghi { gap: 12px; }
.wp-block-gallery.gaston-loghi figure.wp-block-image { display: flex !important; flex-direction: column; align-items: center; justify-content: center; aspect-ratio: 16 / 9; padding: 18px 20px; background: var(--wp--preset--color--bianco); border: 1px solid var(--wp--preset--color--grigio-chiaro); }
.wp-block-gallery.gaston-loghi figure.wp-block-image img { width: auto !important; height: auto !important; max-width: 100%; max-height: 64px; object-fit: contain; flex: 0 1 auto !important; }
.wp-block-gallery.gaston-loghi figure.gaston-logo-chiaro { background: var(--wp--preset--color--nero); border-color: var(--wp--preset--color--nero); }
.wp-block-gallery.gaston-loghi figure.wp-block-image figcaption { position: static !important; background: none !important; color: var(--wp--preset--color--grigio) !important; padding: 10px 0 0 !important; margin: 0 !important; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.14em; max-height: none !important; overflow: visible !important; text-shadow: none !important; }
.wp-block-gallery.gaston-loghi figure.gaston-logo-chiaro figcaption { color: var(--wp--preset--color--grigio-chiaro) !important; }
@media (max-width: 781px) { .wp-block-gallery.gaston-loghi figure.wp-block-image img { max-height: 44px; } .wp-block-gallery.gaston-loghi figure.wp-block-image { padding: 12px; } }

/* ---------- Categorie ---------- */
.gaston-categorie h3 { margin-top: 0.9rem; }
.gaston-categorie .wp-block-image img, .gaston-specialisti .wp-block-image img { width: 100%; }

/* ---------- Immagini ---------- */
.gaston-foto img { aspect-ratio: 3 / 4; object-fit: cover; width: 100%; }
.wp-block-gallery.gaston-galleria img { aspect-ratio: 3 / 4; object-fit: cover; }
.wp-block-media-text.gaston-trasloco video { aspect-ratio: 9 / 16; object-fit: cover; max-height: min(80vh, 760px); }

/* ---------- Popup inaugurazione ----------
   Il gruppo .gaston-popup sta nella pagina Home ed è modificabile dall'editor.
   Sul sito è nascosto finché lo script non lo apre. */
.gaston-popup { display: none !important; }
.gaston-popup-overlay { position: fixed; inset: 0; z-index: 9999; background: rgb(10 10 10 / 0.82); display: grid; place-items: center; padding: 16px; animation: gaston-fade .25s ease-out; }
.gaston-popup-overlay .gaston-popup { display: block !important; position: relative; width: min(440px, calc(100vw - 32px)); max-width: 100% !important; max-height: calc(100dvh - 32px); overflow-x: hidden; overflow-y: auto; margin: 0 !important; box-shadow: 0 30px 80px rgb(0 0 0 / 0.5); }
.gaston-popup-overlay .gaston-popup > * { max-width: 100% !important; margin-inline: auto !important; }
.gaston-popup .wp-block-buttons { justify-content: center; }
.gaston-popup .wp-block-image img { max-height: 46vh; width: auto; margin-inline: auto; display: block; }
.gaston-popup-chiudi { position: absolute; top: 8px; right: 8px; width: 44px; height: 44px; border: 0; border-radius: 50%; background: transparent; color: var(--wp--preset--color--bianco); font-size: 28px; line-height: 1; cursor: pointer; }
.gaston-popup-chiudi:hover { background: rgb(255 255 255 / 0.12); }
@keyframes gaston-fade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .gaston-popup-overlay { animation: none; } }

/* ---------- Mobile ---------- */
@media (max-width: 781px) {
	.gaston-hero .wp-block-video video { max-height: min(62vh, 560px); }
	.gaston-hero .wp-block-buttons .wp-block-button { flex: 1 1 100%; }
	.gaston-hero .wp-block-buttons .wp-element-button { width: 100%; }
	.gaston-header-cta { display: none !important; }
}
