/*
Theme Name: Carterìa ai Frari
Theme URI: https://www.carteriaaifrari.it
Author: Carterìa ai Frari
Author URI: https://www.carteriaaifrari.it
Description: Tema WordPress su misura per la bottega artigiana Carterìa ai Frari, convertito dal template statico "Hielo" (templated.co).
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: carteria-ai-frari
*/

/* Questo file resta volutamente "vuoto": tutto lo stile visivo vive in
   assets/css/main.css, caricato da functions.php con wp_enqueue_style().
   Il commento sopra è obbligatorio: è l'unico modo con cui WordPress
   riconosce e registra il tema nel pannello Aspetto > Temi. */

/* Galleria di miniature (blocco Galleria di WordPress con classe "galleria-carteria"):
   riproduce le miniature quadrate dell'originale. La didascalia non si vede
   in pagina, ma compare sotto l'immagine ingrandita (vedi cartai_galleria in functions.php). */
.galleria-carteria.wp-block-gallery { display: flex; flex-wrap: wrap; gap: 0; margin: 0 0 1em 0; }
.galleria-carteria.wp-block-gallery figure.wp-block-image { flex: 0 0 auto !important; width: auto !important; margin: 0 10px 15px 0 !important; padding: 1px; background-color: #474747; border: 2px solid #474747; }
.galleria-carteria figure.wp-block-image img { display: block; width: 133px !important; height: 133px !important; object-fit: cover; margin: 0; }
.galleria-carteria figure.wp-block-image figcaption { display: none !important; }

/* Schede delle creazioni: griglia su più colonne e più righe */
.schede { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 1.5em; margin: 0 0 2em 0; }
.schede-titolo { margin: 1.5em 0 0.75em 0; }
.scheda { background: #fff; border-radius: 5px; box-shadow: 0 0 0.75em 0 rgba(0, 0, 0, 0.15); overflow: hidden; display: flex; flex-direction: column; }
.scheda .scheda-img { display: block; border: 0; aspect-ratio: 4 / 3; overflow: hidden; background: #eee; }
.scheda .scheda-img img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease; }
.scheda .scheda-img:hover img { transform: scale(1.04); }
.scheda-corpo { padding: 1em 1.1em 1.1em 1.1em; display: flex; flex-direction: column; flex: 1; }
.scheda-corpo h3 { font-size: 1.05em; margin: 0 0 0.5em 0; }
.scheda-dati { list-style: none; margin: 0 0 0.75em 0; padding: 0; font-size: 0.9em; }
.scheda-dati li { margin: 0; padding: 0.15em 0; border-top: 1px solid rgba(0, 0, 0, 0.08); }
.scheda-dati li span { font-weight: 600; margin-right: 0.35em; }
.scheda-prezzo { margin: auto 0 0 0; font-weight: 700; font-size: 1.05em; }
.scheda-testo { font-size: 0.85em; margin-top: 0.75em; }
.scheda-testo p { margin: 0 0 0.5em 0; }

/* Indice dei tipi di oggetto, sopra le schede */
.schede-indice { list-style: none; margin: 0 0 1em 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5em; }
.schede-indice li { margin: 0; padding: 0; }
.schede-indice a { display: inline-block; padding: 0.3em 0.9em; border: 1px solid rgba(0, 0, 0, 0.25); border-radius: 2em; font-size: 0.85em; text-decoration: none; }
.schede-indice a:hover { background: rgba(0, 0, 0, 0.06); }
.schede-indice li.sub a { border-style: dashed; font-size: 0.8em; }
.schede-sottotitolo { margin: 1.25em 0 0.75em 0; font-size: 1em; }
.scheda-testo ul { margin: 0 0 0.5em 0; padding-left: 0; }

/* Banner della home: la dissolvenza iniziale dal nero dura meno */
.banner:after { -moz-transition: opacity 0.6s ease-in-out, visibility 0.6s !important; -webkit-transition: opacity 0.6s ease-in-out, visibility 0.6s !important; transition: opacity 0.6s ease-in-out, visibility 0.6s !important; }
.contenuto-dopo { margin-top: 1.5em; }

/* Le immagini di WordPress portano gli attributi width e height: dentro i riquadri si adattano
   alla larghezza e l'altezza segue, senza deformarsi (Dicono di noi, riquadri della home). */
.image.fit img { height: auto; }
.albo .image img { height: auto; }

.banner.veil-off:after { display: none !important; }

/* Sottopagine: testo più leggibile (Lato peso normale al posto del sottile, corpo maggiore, colore più scuro).
   Vale per il testo delle pagine e per le schede; i titoli mantengono il loro stile. */
.subpage .content { font-weight: 400; font-size: 1.1rem; line-height: 1.75; color: #1f272c; }
.subpage .content strong, .subpage .scheda strong { font-weight: 700; }
.subpage .scheda { font-weight: 400; color: #1f272c; }
.pagina-chi .content p { margin: 0 0 1.1em 0; }

/* Home, testo di presentazione sulla foto scura: più leggibile (chiaro, peso normale, minuscole) e link in oro */
#two.wrapper.style3 { box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.38); }
#two.wrapper.style3 p { color: #f6f2e9; font-weight: 400; text-transform: none; letter-spacing: 0.01em; line-height: 1.8; text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6); }
#two.wrapper.style3 p a { color: #f2d27f; font-weight: 700; text-decoration: underline; text-underline-offset: 0.2em; text-decoration-thickness: 1px; }
#two.wrapper.style3 p a:hover { color: #fff; }

/* Tra 981 e 1100 px di larghezza il contenitore (75rem) superava lo schermo e il testo usciva a destra */
.wrapper > .inner { max-width: 92%; }

/* Home, testo di presentazione: il filetto sotto i paragrafi solo dopo l'ultimo */
#two.wrapper.style3 p:not(:last-child):after { display: none; }

/* Immagini con versione per cellulare (inc/immagini.php): nelle schede diventano quadrate sotto i 736 px */
picture.con-mobile { display: contents; }
@media screen and (max-width: 736px) {
	.scheda .scheda-img:has(picture.con-mobile) { aspect-ratio: 1 / 1; }
}

/* Cellulare: il banner non riempie tutta l'altezza dello schermo ma ha proporzioni 4:5 (al massimo lo schermo),
   così le immagini quadrate "-mobile" delle slide si vedono per intero in larghezza. */
@media screen and (max-width: 736px) {
	.banner.full { min-height: 0; height: min(125vw, 100vh) !important; }
}