/*
 Theme Name:  Sharp VER092 Child
 Theme URI:   https://www.laterradipuglia.it
 Description: Child theme di Sharp VER092 — La Terra di Puglia
 Author:      La Terra di Puglia
 Template:    sharp-VER092
 Version:     1.2.0
*/

/* ============================================================
   Qui sotto puoi aggiungere CSS custom senza toccare il padre
   ============================================================ */

/* === Header cleanup === */

/* Barra verde al posto di mag_header.jpg */
.ldp-header-bar {
    width: 100%;
    height: 8px;
    background-color: #4cba39;
    display: block;
}

/* Rimuove banner prodotti header (desktop) */
.headerbanner {
    display: none !important;
}

/* Logo centrato quando il banner è rimosso */
.logo-banner .col-lg-4 {
    float: none !important;
    margin: 0 auto;
    text-align: center;
}

/* === Menu masthead — font moderno di sistema === */
nav .mastheadnav li a {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                 Helvetica, Arial, sans-serif !important;
    font-size: 13.5px !important;
    letter-spacing: 0.02em;
    padding: 6px 8px !important;
    color: #333333 !important;
    border-left: none !important;
    border-radius: 4px;
    transition: background-color 0.2s ease, color 0.2s ease;
}

/* Hover — sfondo verde, testo bianco */
nav .mastheadnav li a:hover {
    background-color: #4cba39 !important;
    color: #ffffff !important;
}

/* Separatori tra voci — rimossi */
nav .mastheadnav li {
    border: none !important;
}

/* === Shop button === */
nav .mastheadnav li.ldp-menu-shop a {
    background-color: #4cba39 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    padding: 6px 8px !important;
    border-radius: 4px;
    border-left: none !important;
}

nav .mastheadnav li.ldp-menu-shop a::before {
    content: "\f07a";
    font-family: FontAwesome;
    margin-right: 5px;
    font-weight: normal;
}

nav .mastheadnav li.ldp-menu-shop a:hover {
    background-color: #3a9a2c !important;
    color: #ffffff !important;
}

/* === Menu masthead — sfondo bianco + bordo verde === */
.site-masthead {
    background-color: #ffffff;
    border-bottom: 2px solid #4cba39 !important;
    padding: 4px 0 !important;
}

/* =====================================================
   PAGINE CATEGORIA — restyling titolo, descrizione, card
   ===================================================== */

/* Titolo categoria */
.post-lead h1 {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 1.6rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    color: #2d2d2d;
    border-left: 4px solid #4cba39;
    padding-left: 12px;
}

/* Descrizione categoria */
.post-lead p {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 15px;
    line-height: 1.7;
    color: #444;
    padding: 14px 18px;
    background: #f8f8f6;
    border-radius: 6px;
    margin-top: 12px;
}

/* Link nella descrizione — oro coerente con il resto del sito */
.post-lead p a {
    color: #c8922a !important;
    text-decoration: underline;
}

/* Nasconde punto spurio sopra le card */
.archive .entries-wrapper > p,
.archive article.entry + p {
    display: none;
}

/* Card articolo — solo su pagine archivio/categoria */
.archive article.entry {
    background: #ffffff;
    border: 1px solid #ebebeb;
    border-radius: 8px;
    padding: 14px;
    margin-bottom: 18px;
    transition: box-shadow 0.2s ease;
}

.archive article.entry:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.08);
}

/* Titolo articolo in archivio */
.archive article.entry .entry-title {
    margin: 8px 0 6px;
}

.archive article.entry .entry-title a {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 21px !important;
    font-weight: 700;
    line-height: 1.3;
    color: #1a1a1a !important;
    letter-spacing: -0.01em;
}

.archive article.entry .entry-title a:hover {
    color: #c8922a !important;
}

/* Meta (data, autore) */
.archive article.entry .postmeta {
    font-size: 12px;
    color: #888;
}

/* Badge categoria — resta verde, è un elemento grafico non un link di lettura */
.archive article.entry .postcategory {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #ffffff !important;
    background-color: #4cba39;
    padding: 2px 8px;
    border-radius: 3px;
    text-decoration: none !important;
    margin-bottom: 8px;
}

.archive article.entry .postcategory:hover {
    background-color: #3a9a2c;
}

/* =====================================================
   ARTICOLO SINGOLO — titolo più grande
   ===================================================== */

.single article.entry .entry-title {
    margin-bottom: 16px;
}

.single article.entry .entry-title a {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 32px !important;
    font-weight: 700;
    line-height: 1.25;
    color: #1a1a1a !important;
    letter-spacing: -0.02em;
}

h1.post-title {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    font-size: 5.2rem !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    color: #1a1a1a !important;
    letter-spacing: -0.02em !important;
    margin-bottom: 12px !important;
}

@media (max-width: 768px) {
    h1.post-title {
        font-size: 1.8rem !important;
    }
}

/* Badge categorie articolo singolo — resta verde, elemento grafico */
p.post-category a {
    display: inline-block !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    color: #ffffff !important;
    background-color: #4cba39 !important;
    padding: 3px 10px !important;
    border-radius: 3px !important;
    text-decoration: none !important;
    margin-right: 4px !important;
}

p.post-category a:hover {
    background-color: #3a9a2c !important;
}

/* Rimuove il punto separatore tra le categorie */
p.post-category {
    margin-bottom: 8px !important;
}

/* =====================================================
   LINK — oro coerente su tutto il sito
   (v1.2.0 — prima era verde #4cba39, sostituito per uniformità
   con i componenti editoriali ldp-articoli.css / ldp-pages.css)
   ===================================================== */

a {
    color: #c8922a !important;
}

a:hover {
    color: #a3741f !important;
}

/* --- Eccezioni alla regola qui sopra ---------------------------------
   `a { color: oro !important }` vince su tutto, comprese le etichette di
   categoria del tema padre: quelle hanno il fondo colorato e il testo
   bianco (`color:#fff`, senza !important), quindi perdevano.

   Il risultato in home era **oro su oro** nelle subnews — testo del tutto
   invisibile — e **oro su arancio** nelle colonne sotto l'apertura.

   Qui il bianco torna al suo posto, e **solo** sulle etichette che un
   fondo colorato ce l'hanno davvero: quelle senza restano oro, che su
   bianco si legge benissimo. Trovato da Marco il 16/08/2026. */
.below-fea-left .belowfea_secondcol .pull-left a.postcategory,
.below-fea-left .belowfea_secondcol .pull-left a.postcategory:hover,
.below-fea-left .belowfea_secondcol .pull-left a.postcategory:focus,
.below-fea-left .belowfea_thirdcol .postmedia a.postcategory,
.below-fea-left .belowfea_thirdcol .postmedia a.postcategory:hover,
.below-fea-left .belowfea_thirdcol .postmedia a.postcategory:focus,
.subnews .subnews-first a.subnews-catname,
.subnews .subnews-first a.subnews-catname:hover,
.subnews .subnews-first a.subnews-catname:focus {
    color: #ffffff !important;
}

/* Eccezioni — menu e bottoni non devono cambiare colore */
nav .mastheadnav li a,
nav .mainnav li a,
.ldp-menu-shop a,
#wpadminbar a {
    color: inherit !important;
}

/* =====================================================
   SIDEBAR — ultimi post
   ===================================================== */

.wp-block-latest-posts__list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.wp-block-latest-posts__list li {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 8px 0 !important;
    border-bottom: 1px solid #f0f0f0 !important;
}

.wp-block-latest-posts__post-title {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    color: #2d2d2d !important;
    text-decoration: none !important;
}

.wp-block-latest-posts__post-title:hover {
    color: #c8922a !important;
}

.wp-block-latest-posts__featured-image img {
    border-radius: 4px !important;
    object-fit: cover !important;
}

/* Link dentro strong negli articoli ldp — oro prevale sul nero del bold */
.ldp-article strong a,
.ldp-article a strong { color: #c8922a !important; }

.home .aioseo-breadcrumbs {
    display: none;
}
/* ============================================================
   Breadcrumb AIOSEO — nascosto sulla home
   ============================================================
   In home il widget gira dentro il loop degli articoli e si
   prende la categoria del primo post che incontra: mostrava
   "Home » Arte & Cultura", che non vuol dire niente. Sulle
   altre pagine il percorso e' corretto e resta.
   Aggiunto il 16 agosto 2026, con l'ok di Marco. */
.home .aioseo-breadcrumbs,
.blog .aioseo-breadcrumbs {
    display: none;
}

/* ============================================================
   Correlati — sostituiscono Inline Related Posts (16/08/2026)
   ============================================================ */

/* Il rimando dentro il testo, reso dallo shortcode [irp] */
.ldp-leggi-anche {
    margin: 18px 0;
    padding: 10px 14px;
    background: #faf7f0;
    border-left: 4px solid #c8922a;
    font-size: 15px;
}
.ldp-leggi-anche a {
    text-decoration: none;
    color: #333;
}
.ldp-leggi-anche a:hover {
    color: #c8922a;
}
.ldp-leggi-anche strong {
    color: #c8922a;
}

/* Il blocco in fondo all'articolo */
.ldp-correlati {
    margin: 40px 0 10px;
    padding-top: 24px;
    border-top: 3px solid #c8922a;
}
.ldp-correlati-titolo {
    font-size: 20px;
    margin: 0 0 18px;
    padding: 0;
    border: 0;
}
.ldp-correlati-griglia {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
}
.ldp-correlato {
    flex: 1 1 200px;
    min-width: 180px;
    text-decoration: none;
    color: #333;
    display: block;
}
.ldp-correlato:hover .ldp-correlato-titolo {
    color: #c8922a;
}
.ldp-correlato-foto img {
    width: 100%;
    height: 140px;
    object-fit: cover;
    border-radius: 4px;
    display: block;
    margin-bottom: 8px;
}
.ldp-correlato-titolo {
    display: block;
    font-weight: 700;
    font-size: 15px;
    line-height: 1.35;
}
@media (max-width: 600px) {
    .ldp-correlato { flex: 1 1 100%; }
    .ldp-correlato-foto img { height: 180px; }
}


/* ============================================================
   Logo magazine + tagline (brief del 16/08/2026)
   ============================================================
   Sostituisce il logo "shop-oriented" — wordmark con badge rosso
   SHOP ONLINE e riga shop.laterradipuglia.it — con quello del
   magazine. Il bottone verde Shop nel menu NON si tocca: e' il
   CTA commerciale e resta dov'e'.

   La tagline e' un <p> e non un <h1>: il tema stampa gia' un h1
   in homepage (il claim in index.php). */
.site-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
    padding: 1.5rem 1rem;
    text-align: center;
}
.site-brand__logo {
    display: block;
    line-height: 0;
}
.site-brand__logo img {
    width: clamp(200px, 42vw, 320px);
    height: auto;
    display: block;
}
.site-brand__tagline {
    margin: 0;
    font-size: clamp(.8rem, 1.6vw, .95rem);
    font-weight: 400;
    letter-spacing: .08em;
    /* piu' chiaro del #574E4E del wordmark: la tagline
       accompagna il logo, non compete con lui */
    color: #6B6B66;
    text-transform: none;
}
@media (max-width: 600px) {
    .site-brand { padding: 1rem .75rem; }
    .site-brand__tagline { letter-spacing: .05em; }
}


/* --- Briciole di pane sopra il titolo (16 agosto 2026) --------------
   Devono leggersi come un'indicazione di posizione, non come un menu:
   piccole, grigie, senza sottolineature. Il colore pieno arriva solo
   sull'hover, ed e' l'oro di casa. */
.ldp-briciole {
    font-family: Helvetica, Arial, "Lucida Grande", sans-serif;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: .02em;
    color: #8a8a85;
    margin: 4px 0 10px;
}
.ldp-briciole a {
    color: #8a8a85;
    text-decoration: none !important;
    border: 0 !important;
}
.ldp-briciole a:hover,
.ldp-briciole a:focus {
    color: #c8922a;
    text-decoration: underline !important;
}
.ldp-briciole .aioseo-breadcrumb-separator {
    margin: 0 5px;
    opacity: .55;
}
/* l'ultima voce e' la pagina in cui sei: non e' un link e non deve
   sembrarlo, ma neanche sparire */
.ldp-briciole .aioseo-breadcrumb:last-child {
    color: #5c5c58;
}
/* Su mobile la topbar dei menu e' fissa in alto e le briciole le finivano
   addosso: qui prendono aria sopra, si rimpiccioliscono di un punto e le
   voci si stringono fra loro. La soglia e' 768px, la stessa a cui compare
   la topbar in mobile-nav.css. */
@media (max-width: 768px) {
    .ldp-briciole {
        font-size: 10px;
        line-height: 15px;
        letter-spacing: 0;
        margin: 14px 0 8px;
    }
    .ldp-briciole .aioseo-breadcrumb-separator {
        margin: 0 3px;
    }
}

/* Stessa causa, altri tre punti trovati il 16/08/2026 guardando il desktop:

   1. l'etichetta della categoria **sopra il titolo di ogni articolo**
      (`.post-lead p.post-category`), fondo arancio #ec4017;
   2. le voci colorate del menu principale, che prendono il fondo da uno
      stile inline messo dalle opzioni del tema (turchese, lilla, salmone);
   3. le voci dei **sottomenu**, che al passaggio del mouse prendono il
      fondo pieno arancio — da quando «Where to go» e «Getting there»
      hanno dei figli, e' un caso che si vede eccome.

   Piu' le paginazioni, che si accendono sull'hover. */
.post-lead p.post-category a,
.post-lead p.post-category a:hover,
.post-lead p.post-category a:focus,
nav .mainnav li.colored-nav-item > a,
nav .mainnav li.colored-nav-item > a:hover,
nav .mastheadnav li.colored-nav-item > a,
nav .mastheadnav li.colored-nav-item > a:hover,
.footer-nav nav a.colored-nav-item,
.footer-nav nav a.colored-nav-item:hover,
nav .mastheadnav li ul li a:hover,
nav .mastheadnav li ul li a:focus,
nav .mainnav li ul li a:hover,
nav .mainnav li ul li a:focus,
.archive-pagination .page-numbers:hover,
.comment-pagination a:hover,
p.post-pagination a:hover span {
    color: #ffffff !important;
}

/* ============================================================
   RICERCA — pagina dei risultati (26/08/2026)
   ------------------------------------------------------------
   Stili di `search.php`, che prima di oggi non esisteva: senza
   quel template WordPress ripiegava su `index.php`, cioe' serviva
   la HOMEPAGE a chi cercava. Vedi il commento in testa al file.
   ============================================================ */

.ldp-ricerca-testata {
    margin-bottom: 28px;
    padding-bottom: 20px;
    border-bottom: 3px solid #c8922a;
}
.ldp-ricerca-titolo {
    font-size: 26px;
    line-height: 1.25;
    margin: 0 0 6px;
}
.ldp-ricerca-titolo em {
    font-style: normal;
    color: #c8922a;
}
.ldp-ricerca-conta {
    margin: 0 0 16px;
    color: #777;
    font-size: 14px;
}

.ldp-ricerca-form {
    display: flex;
    gap: 8px;
    max-width: 520px;
}
.ldp-ricerca-form input[type="search"] {
    flex: 1;
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid #ddd;
    border-radius: 3px;
    font-size: 15px;
    background: #fff;
    color: #333;
}
.ldp-ricerca-form input[type="search"]:focus {
    border-color: #c8922a;
    outline: 2px solid rgba(200, 146, 42, .25);
    outline-offset: 1px;
}
.ldp-ricerca-form button {
    padding: 10px 20px;
    border: 0;
    border-radius: 3px;
    background: #4cba39;
    color: #fff;
    font-size: 15px;
    cursor: pointer;
}
.ldp-ricerca-form button:hover {
    background: #3f9a30;
}

.ldp-risultato {
    padding: 18px 0;
    border-bottom: 1px solid #eee;
}
.ldp-risultato .entry-title {
    font-size: 19px;
    line-height: 1.3;
    margin: 0 0 6px;
}
.ldp-risultato-meta {
    margin: 0 0 8px;
    font-size: 12px;
}
.ldp-tipo {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: .06em;
    font-size: 11px;
}
.ldp-tipo-scheda {
    background: #c8922a;
    color: #fff;
}
.ldp-tipo-articolo {
    background: #f1ece1;
    color: #7a6a4f;
}
.ldp-risultato-meta .ldp-data {
    margin-left: 8px;
    color: #999;
}
.ldp-risultato-testo {
    margin: 0;
    color: #555;
    font-size: 15px;
    line-height: 1.55;
}

.ldp-ricerca-vuoto {
    padding: 8px 0 24px;
}
.ldp-ricerca-vuoto-titolo {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 10px;
}
.ldp-ricerca-vuoto-titolo em {
    font-style: normal;
    color: #c8922a;
}
.ldp-ricerca-scorciatoie {
    list-style: none;
    margin: 14px 0 0;
    padding: 0;
}
.ldp-ricerca-scorciatoie li {
    margin-bottom: 8px;
}
.ldp-ricerca-scorciatoie li::before {
    content: "\203A";
    color: #c8922a;
    font-weight: bold;
    margin-right: 8px;
}

@media (max-width: 600px) {
    .ldp-ricerca-titolo { font-size: 22px; }
    .ldp-ricerca-form { flex-wrap: wrap; }
    .ldp-ricerca-form input[type="search"] { flex: 1 1 100%; }
}

/* ------------------------------------------------------------
   Ricerca nella barra masthead (desktop) — 26/08/2026
   ------------------------------------------------------------
   SOLO LA LENTE. Un campo di testo qui non ci sta: il menu ha
   tredici voci piu' il tasto Shop e riempie gia' la riga, quindi
   un form da ~150px andava a capo e finiva su una riga sua sotto
   il menu. Un'icona da 15px sta in linea, dopo Shop.

   🔑 QUI NON SI DICHIARA NESSUNA MISURA E NESSUN COLORE, ed e' la
   parte da non rifare: le voci di questo menu sono ridefinite piu'
   in alto in QUESTO stesso file (riga 37, `nav .mastheadnav li a`)
   con `padding:6px 8px !important` e `color:#333 !important`, che
   vincono su tutto quello che dichiara il padre. Ridichiarare qui
   il padding del padre non serviva a niente: perdeva contro
   l'!important e la lente restava disallineata dalle parole.
   Lasciando ereditare, l'icona prende automaticamente le misure,
   il colore e l'hover verde con testo bianco delle altre voci —
   e siccome l'SVG usa `currentColor`, sull'hover diventa bianca
   da sola, senza una riga in piu'.

   🔴 E la barra e' BIANCA (`.site-masthead{background:#fff}`, riga
   83). Una versione precedente ci metteva testo bianco: invisibile.

   Su mobile la masthead e' nascosta: li' il form intero sta in
   cima al pannello Esplora, vedi mobile-nav.css.
   ------------------------------------------------------------ */
nav .mastheadnav li.ldp-cerca a {
    display: flex;
    align-items: center;
}
nav .mastheadnav li.ldp-cerca svg {
    display: block;
}

/* La classe che WordPress usa per le etichette solo-lettore.
   Il tema non la definisce: senza, l'etichetta si vedrebbe. */
.screen-reader-text {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ============================================================
   ESPLORA — la pagina di scoperta (26/08/2026)
   ------------------------------------------------------------
   Foto in cima ai risultati, elenco compatto sotto: e' la forma
   scelta da Marco. Le foto sono poche di proposito — servirne
   una per ognuno dei 2.770 contenuti peserebbe sul server, che
   e' gia' il collo di bottiglia (TTFB 1,3 s).
   ============================================================ */

.ldp-esplora-testata {
    margin-bottom: 26px;
    padding-bottom: 18px;
    border-bottom: 3px solid #c8922a;
}
.ldp-esplora-testata h1 {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 34px;
    font-weight: 700;
    line-height: 1.2;
    margin: 0 0 10px;
    color: #1a1a1a;
}
.ldp-esplora-intro {
    color: #555;
    font-size: 16px;
    line-height: 1.6;
    /* 68ch era il limite giusto per un testo lungo e sbagliato per questo:
       su una pagina larga spezzava la presentazione in quattro righe strette
       accanto a filtri larghi il doppio, e si vedeva. Segnalato da Marco il
       26/08. Qui il testo e' tre frasi: sta su due righe e accompagna la
       larghezza del resto. */
    max-width: 900px;
}

/* --- i filtri --- */
.ldp-esplora-filtri {
    display: grid;
    gap: 14px;
    padding: 18px;
    background: #f8f8f6;
    border: 1px solid #ebebeb;
    border-radius: 8px;
    margin-bottom: 22px;
}
.ldp-esplora-riga {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}
.ldp-esplora-eti {
    width: 80px;
    flex: none;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #999;
}
.ldp-esplora-chip {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    flex: 1;
}

/* I chip sono <a> veri verso i rami del sito: senza JavaScript restano
   nove link che funzionano. Il JS li trasforma in filtri quando parte. */
.ldp-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 13px;
    border: 1px solid #ddd;
    border-radius: 999px;
    background: #fff;
    color: #555 !important;
    font-size: 14px;
    text-decoration: none !important;
    transition: border-color .15s ease, background-color .15s ease, color .15s ease;
}
.ldp-chip:hover {
    border-color: #c8922a;
    color: #1a1a1a !important;
}
.ldp-chip.attivo {
    background: #4cba39;
    border-color: #4cba39;
    color: #fff !important;
}
.ldp-chip-n {
    font-size: 11px;
    color: #aaa;
}
.ldp-chip.attivo .ldp-chip-n {
    color: rgba(255, 255, 255, .8);
}

.ldp-esplora-campo {
    padding: 8px 11px;
    border: 1px solid #ddd;
    border-radius: 5px;
    background: #fff;
    color: #333;
    font-size: 14px;
    min-width: 160px;
    max-width: 100%;
}
.ldp-esplora-campo:focus {
    border-color: #c8922a;
    outline: 2px solid rgba(200, 146, 42, .22);
    outline-offset: 1px;
}
.ldp-esplora-parola {
    flex: 1;
    min-width: 220px;
    font-size: 16px; /* sotto i 16px iOS zooma da solo sul focus */
}
.ldp-esplora-azzera {
    background: none;
    border: none;
    color: #c8922a;
    font-size: 13px;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
    padding: 8px 2px;
}

/* Le righe che senza JavaScript non servirebbero a niente restano
   nascoste finche' il filtro non e' vivo. */
.ldp-esplora-solo-js { display: none; }
.ldp-esplora-attiva .ldp-esplora-solo-js { display: flex; }

.ldp-esplora-conta {
    font-size: 13px;
    color: #888;
    margin: 0 0 16px;
}

/* --- le card con la foto --- */
.ldp-esplora-card {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 26px;
}
.ldp-c {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid #ebebeb;
    border-radius: 8px;
    overflow: hidden;
    text-decoration: none !important;
    transition: box-shadow .2s ease;
}
.ldp-c:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, .08);
}
.ldp-c-foto {
    display: block;
    aspect-ratio: 16 / 10;
    background: #f1ece1;
    overflow: hidden;
}
.ldp-c-foto img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.ldp-c-tit {
    display: block;
    padding: 12px 14px 6px;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.3;
    color: #1a1a1a !important;
}
.ldp-c:hover .ldp-c-tit {
    color: #c8922a !important;
}
.ldp-c-eti {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    padding: 0 14px 14px;
}

/* --- l'elenco compatto --- */
.ldp-r {
    padding: 13px 0;
    border-bottom: 1px solid #eee;
}
.ldp-r-tit {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.35;
    color: #1a1a1a !important;
    text-decoration: none !important;
}
.ldp-r-tit:hover {
    color: #c8922a !important;
}
.ldp-r-eti {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 6px;
}

.ldp-e {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 2px 7px;
    border-radius: 3px;
    background: #f1ece1;
    color: #7a6a4f;
    white-space: nowrap;
}
.ldp-e-luogo {
    background: transparent;
    border: 1px solid #e0bc7a;
    color: #a3741f;
}
.ldp-e-tipo {
    background: transparent;
    border: 1px solid #e5e5e5;
    color: #999;
}

.ldp-esplora-altri {
    display: block;
    width: 100%;
    margin-top: 18px;
    padding: 12px;
    background: #f8f8f6;
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    font-size: 14px;
    color: #333;
    cursor: pointer;
}
.ldp-esplora-altri:hover {
    border-color: #c8922a;
}
.ldp-esplora-vuoto,
.ldp-esplora-noscript {
    padding: 36px 0;
    text-align: center;
    color: #777;
    font-size: 15px;
}

@media (max-width: 900px) {
    .ldp-esplora-card { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .ldp-esplora-testata h1 { font-size: 26px; }
    .ldp-esplora-card { grid-template-columns: 1fr; }
    .ldp-esplora-eti { width: 100%; }
    .ldp-esplora-campo { min-width: 0; flex: 1; }
}

/* ============================================================
   HOME — il richiamo a /esplora, sotto il banner (27/08/2026)
   ------------------------------------------------------------
   Il blocco lo stampa un hook in functions.php, agganciato a
   `dynamic_sidebar_after` sulla sidebar del banner.

   Ogni voce porta il suo colore in `--c`, scritto nel PHP: così
   la palette sta in un posto solo, accanto ai nomi, e non
   sparpagliata in otto regole CSS che nessuno ritrova.
   ============================================================ */

.ldp-scopri {
    margin: 22px 0 30px;
    padding: 22px 24px 24px;
    background: #fbfaf7;
    border: 1px solid #ece7db;
    border-radius: 10px;
}

.ldp-scopri-testa h2 {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                 Helvetica, Arial, sans-serif;
    font-size: 21px !important;
    font-weight: 700;
    line-height: 1.25;
    color: #1a1a1a;
    margin: 0 0 6px;
    /* la linea dorata dei titoli di casa, ma qui sotto e corta */
    border: 0;
    padding: 0;
}

.ldp-scopri-testa h2::after {
    content: "";
    display: block;
    width: 46px;
    height: 3px;
    background: #c8922a;
    margin-top: 9px;
}

.ldp-scopri-testa p {
    margin: 12px 0 18px;
    color: #666;
    font-size: 15px;
    line-height: 1.55;
    max-width: 62ch;
}

.ldp-scopri-voci {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

/* La voce prende il colore da --c: fondo tenue e bordo pieno a riposo,
   fondo pieno al passaggio. Così le otto voci si distinguono senza
   sembrare otto bottoni urlati. */
.ldp-scopri-voce {
    display: inline-block;
    padding: 8px 15px;
    border: 1.5px solid var(--c, #c8922a);
    border-radius: 999px;
    background: transparent;
    color: var(--c, #c8922a) !important;
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none !important;
    transition: background-color .16s ease, color .16s ease;
}

.ldp-scopri-voce:hover,
.ldp-scopri-voce:focus {
    background: var(--c, #c8922a);
    color: #ffffff !important;
}

.ldp-scopri-tutto {
    display: inline-block;
    margin-top: 18px;
    font-size: 14.5px;
    font-weight: 600;
    color: #c8922a !important;
    text-decoration: none !important;
    border-bottom: 1px solid rgba(200, 146, 42, .35);
    padding-bottom: 2px;
}

.ldp-scopri-tutto:hover {
    border-bottom-color: #c8922a;
}

@media (max-width: 600px) {
    .ldp-scopri {
        padding: 18px 16px 20px;
        margin: 18px 0 24px;
    }
    .ldp-scopri-testa h2 { font-size: 19px !important; }
    .ldp-scopri-testa p  { font-size: 14.5px; margin-bottom: 16px; }
    .ldp-scopri-voce     { font-size: 14px; padding: 7px 13px; }
}

/* ------------------------------------------------------------
   «Tutto quello che abbiamo su ...» — in fondo alle schede di
   paese (27/08/2026)
   ------------------------------------------------------------
   Lo stampa un filtro in functions.php sulle 33 schede elencate
   in `luoghi-mappa.php`. Nei contenuti non c'è scritto niente.
   ------------------------------------------------------------ */
.ldp-tutto-su {
    margin: 28px 0 8px !important;
    padding: 14px 18px;
    background: #faf7f0;
    border-left: 4px solid #c8922a;
    border-radius: 0 6px 6px 0;
}

.ldp-tutto-su a {
    color: #a3741f !important;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.ldp-tutto-su a:hover {
    color: #c8922a !important;
}

.ldp-tutto-su a span {
    transition: transform .15s ease;
}

.ldp-tutto-su a:hover span {
    transform: translateX(3px);
}

@media (max-width: 600px) {
    .ldp-tutto-su {
        padding: 12px 14px;
        margin: 22px 0 8px !important;
    }
    .ldp-tutto-su a { font-size: 15px; }
}

/* ------------------------------------------------------------
   ESPLORA — i risultati raggruppati (27/08/2026)
   ------------------------------------------------------------
   Le schede per ramo dell'albero, gli articoli per età con i
   freschi in cima. Un elenco piatto di quaranta voci miste non
   si legge, e mette sullo stesso piano due cose diverse.
   ------------------------------------------------------------ */

.ldp-sez {
    margin-top: 30px;
}

.ldp-sez:first-child {
    margin-top: 0;
}

.ldp-sez-tit {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                 Helvetica, Arial, sans-serif;
    font-size: 13px !important;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    color: #999;
    margin: 0 0 4px;
    padding-bottom: 8px;
    border-bottom: 2px solid #ebebeb;
}

.ldp-g {
    margin-top: 20px;
}

/* Il nome del ramo: è un'etichetta di servizio, non un titolo
   editoriale — sta sopra le voci e non compete con loro. */
.ldp-g-tit {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                 Helvetica, Arial, sans-serif;
    font-size: 15px !important;
    font-weight: 700;
    color: #1a1a1a;
    margin: 0 0 2px;
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.ldp-g-tit::before {
    content: "";
    width: 3px;
    height: 15px;
    background: #c8922a;
    flex: none;
    border-radius: 2px;
}

.ldp-g-n {
    font-size: 12px;
    font-weight: 400;
    color: #aaa;
}

/* Dentro un gruppo le voci stanno più strette: sono una lista,
   non una sequenza di blocchi indipendenti. */
.ldp-g .ldp-r {
    padding: 10px 0 10px 11px;
}

.ldp-g .ldp-r-tit {
    font-size: 15.5px;
}

@media (max-width: 600px) {
    .ldp-sez-tit { font-size: 12px !important; }
    .ldp-g-tit   { font-size: 14.5px !important; }
    .ldp-g .ldp-r-tit { font-size: 15px; }
}