/* Immobiliare Palmieri — stile del sito, conforme al Brand Book v0.2
   Palmieri Blue #0072BB · Montserrat · pulizia e minimalismo */

/* Font autoospitato, non caricato da fonts.googleapis.com: un font variabile
   (un solo file copre i pesi 400-800) ritagliato al solo set di caratteri
   latini, sufficiente per un sito interamente in italiano. */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('fonts/montserrat-latin.woff2') format('woff2');
}
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('fonts/montserrat-latin.woff2') format('woff2');
}
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('fonts/montserrat-latin.woff2') format('woff2');
}
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('fonts/montserrat-latin.woff2') format('woff2');
}
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url('fonts/montserrat-latin.woff2') format('woff2');
}

:root {
    /* Tavolozza del Brand Book v0.2, sezione 4.1: Palmieri Blue + bianco/nero
       (con scala di tinte del nero). Il rosso non fa parte della palette UI
       generale — il testo del brand book cita "blu e arancione" ma la
       pagina della palette non definisce alcun arancione, ed è la pagina
       con i codici colore a fare fede, non il paragrafo mai aggiornato. È
       però il rosso del marchio stesso (roof/barra, #ED1B24): usato qui
       solo come accent sui pulsanti di azione vera (CTA hero, invio form),
       non come terzo colore diffuso — vedi .pis-btn-rosso. Il rosso puro
       sotto testo bianco dà solo 3,98:1 (sotto il 4,5 di WCAG AA): questa è
       una versione più scura, stessa tinta, che arriva a 6,49:1. */
    --pal-blu: #0072BB;
    --pal-blu-scuro: #005a94;
    --pal-blu-tenue: #e9f2f9;
    --pal-rosso-scuro: #bb151c;
    --pal-nero: #000000;
    --pal-testo: #1a1a1a;
    --pal-grigio: #6b6b6b;
    --pal-grigio-tenue: #f5f6f7;
    --pal-bordo: #e4e7ea;
    --pal-raggio: 10px;
    --pal-ombra: 0 2px 14px rgba(0, 0, 0, .07);
    --pal-ombra-alta: 0 10px 34px rgba(0, 114, 187, .16);
}

body,
.ast-container,
button,
input,
select,
textarea {
    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

h1, h2, h3, h4, h5, h6,
.entry-title {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--pal-testo);
    letter-spacing: -.02em;
}

/* --- Header: il titolo testuale diventa il logo --- */
/* Raddoppiato su richiesta (era 210x58). Sotto i 480px il raddoppio pieno
   sbatterebbe contro il pulsante del menu: Astra lo mette a "larghezza
   viewport - 62px" costante (misurato su schermi da 320 a 390px), quindi
   il logo resta grande ma entro il margine libero reale a ogni larghezza.
   Larghezza 292px e non 420: a 116px di altezza l'immagine (1559x621) ne occupa
   291, il resto era spazio vuoto che mandava "Contatti" a capo fra 924 e 1044px
   e spingeva l'icona del menu fuori dallo schermo fra 480 e 504px. */
.site-title a {
    display: block;
    width: 292px;
    height: 116px;
    background: url('https://gestionale.immobiliarepalmieri.com/static/img/logo_trasparente.png') left center / contain no-repeat;
    text-indent: -9999px;
    overflow: hidden;
    white-space: nowrap;
}

@media (max-width: 479px) {
    .site-title a { width: 260px; height: 71.8px; }
}

@media (max-width: 359px) {
    .site-title a { width: 216px; height: 59.7px; }
}

.main-header-menu .menu-link {
    font-weight: 600;
    font-size: .95rem;
    letter-spacing: .01em;
}

.main-header-menu .menu-item:hover > .menu-link,
.main-header-menu .current-menu-item > .menu-link {
    color: var(--pal-blu);
}

/* Le pagine costruite a sezioni non mostrano il titolo del tema */
.pis-pagina-sezioni .entry-title,
.pis-pagina-sezioni .ast-archive-description {
    display: none;
}

/* --- Fasce a tutta larghezza ---------------------------------------
   Astra vincola i figli diretti del contenuto con
     .entry-content[data-ast-blocks-layout] > *
       { max-width: var(--wp--custom--ast-content-width-size);
         margin-left: auto; margin-right: auto; }
   che ha specificita' (0,2,0) e batte qualunque regola di sola classe.
   Per questo NON usiamo margini negativi in vw (verrebbero annullati):
   togliamo il vincolo al contenitore del tema e restituiamo la colonna
   leggibile ai soli contenuti testuali. Niente 100vw, quindi nessuna
   barra di scorrimento orizzontale. */

.pis-pagina-sezioni .site-content > .ast-container {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
}

.pis-pagina-sezioni #primary,
.pis-pagina-sezioni .site-main,
.pis-pagina-sezioni .ast-article-single {
    margin: 0;
    padding: 0;
    border: 0;
}

/* Il titolo della pagina generato dal tema: l'H1 lo fornisce l'hero */
.pis-pagina-sezioni .entry-header {
    display: none;
}

.pis-pagina-sezioni .entry-content[data-ast-blocks-layout] > .pis-full,
.pis-pagina-sezioni .entry-content > .pis-full {
    max-width: none;
    width: auto;
    margin-left: 0;
    margin-right: 0;
}

.pis-pagina-sezioni .entry-content[data-ast-blocks-layout] > *:not(.pis-full),
.pis-pagina-sezioni .entry-content > *:not(.pis-full) {
    max-width: 1180px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 24px;
    padding-right: 24px;
}

/* I paragrafi di testo libero (Chi siamo, Contatti) ereditano la larghezza
   di 1180px pensata per i titoli di sezione: su una riga di prosa sono oltre
   140 caratteri, scomodi da leggere. Restringerli con "margin:auto" li
   centra come blocco a se stante, staccandoli dal titolo sopra (es. "Dove
   siamo" su Contatti, allineato a sinistra); con "margin-left:0" finiscono
   invece a filo pagina, ignorando i 24px di rientro del riquadro da 1180px.
   Il margin-left qui sotto ricalcola il solo scarto di centratura che
   "margin:auto" produce per il riquadro largo — (spazio residuo)/2 — e
   lascia che sia il padding-left:24px, gia' ereditato dalla regola sopra,
   a fare l'ultimo passo: e' lo stesso conto che il browser fa per il
   titolo, quindi il testo comincia allo stesso punto a ogni larghezza,
   compresa la fascia in cui il riquadro non si centra piu' (sotto 1180px
   il max() lo azzera, come fa il browser per il titolo). */
.pis-pagina-sezioni .entry-content[data-ast-blocks-layout] > p:not(.pis-full),
.pis-pagina-sezioni .entry-content > p:not(.pis-full) {
    max-width: 720px;
    margin-left: max(0px, calc((100% - 1180px) / 2));
    margin-right: auto;
}

/* Aria fra una fascia colorata e il testo che la segue */
.pis-pagina-sezioni .entry-content > .pis-full + *:not(.pis-full) {
    margin-top: 56px;
}

.pis-full {
    position: relative;
}

/* In modalita' page-builder Astra impone max-width:none ai NIPOTI di
   .entry-content con un selettore da specificita' (0,5,0):
     .ast-page-builder-template .entry-content[data-ast-blocks-layout]
       > *:not(.wp-block-group):where(...) > *
   .pis-wrap e' esattamente uno di quei nipoti, e senza !important
   perderebbe la colonna leggibile diventando larga quanto lo schermo. */
.pis-wrap {
    max-width: 1180px !important;
    margin: 0 auto;
    padding: 0 24px;
}

/* --- HERO --- */
.pis-hero {
    background: var(--pal-blu);
    color: #fff;
    position: relative;
    overflow: hidden;
    padding: 92px 0 84px;
}

/* Il taglio diagonale riprende il social banner del brand book */
.pis-hero::after {
    content: '';
    position: absolute;
    right: -140px;
    top: -80px;
    width: 620px;
    height: 620px;
    background: rgba(255, 255, 255, .06);
    transform: rotate(28deg);
    pointer-events: none;
}

.pis-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 760px;
}

/* Messaggio grande della home: a destra sul computer, sopra il titolo quando
   la colonna non basta. Sotto i 1024px, affiancato, costringerebbe i due
   pulsanti ad andare a capo. */
.pis-hero .pis-hero-claim {
    position: relative;
    z-index: 1;
    max-width: none;
    margin: 0 0 26px;
    color: #fff;
    font-size: clamp(1.9rem, 8.4vw, 3rem);
    font-weight: 800;
    line-height: 1.12;
    text-transform: uppercase;
}

.pis-hero-claim span {
    display: block;
}

/* Fuori dal flusso: se occupasse spazio, le tre righe non sarebbero piu'
   allineate a destra e la colonna, allargandosi, manderebbe a capo i pulsanti. */
.pis-hero-claim sup {
    position: absolute;
    top: auto;
    font-size: inherit;
    line-height: inherit;
    vertical-align: baseline;
}

.pis-hero-claim small {
    display: block;
    margin-top: 10px;
    font-size: clamp(.95rem, 1.5vw, 1.2rem);
    font-weight: 500;
    line-height: 1.3;
    text-transform: none;
}

@media (min-width: 1024px) {
    .pis-hero-con-claim {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 24px;
    }

    .pis-hero-con-claim .pis-hero-inner {
        grid-column: 1;
        grid-row: 1;
    }

    .pis-hero .pis-hero-claim {
        grid-column: 2;
        grid-row: 1;
        margin: 0;
        font-size: clamp(2.35rem, 4.2vw, 4.2rem);
        text-align: right;
    }
}

.pis-occhiello {
    display: inline-block;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    padding: 7px 15px;
    border: 1.5px solid rgba(255, 255, 255, .5);
    border-radius: 100px;
    margin-bottom: 26px;
}

.pis-hero h1 {
    color: #fff;
    font-size: clamp(2.1rem, 5vw, 3.6rem);
    font-weight: 800;
    line-height: 1.08;
    margin: 0 0 22px;
}

.pis-hero h1 em {
    font-style: normal;
    display: block;
    font-weight: 400;
}

.pis-hero p {
    font-size: clamp(1rem, 2vw, 1.2rem);
    line-height: 1.6;
    color: rgba(255, 255, 255, .93);
    margin: 0 0 34px;
    max-width: 620px;
}

.pis-azioni {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

/* Astra sottolinea tutti i link dentro il contenuto
   (.ast-single-post .entry-content a, specificita' 0,2,1): i componenti
   del plugin devono batterla, i link nei testi restano sottolineati. */
.pis-sito .entry-content a.pis-btn,
.pis-sito .entry-content a.pis-card-imm,
.pis-sito .entry-content a.pis-news-card,
.pis-sito .entry-content a.pis-pag-btn,
.pis-sito .entry-content .pis-faq a,
.pis-sito .entry-content .pis-cta-contatti a,
.pis-sito .entry-content .pis-fascia a,
.pis-sito .pis-briciole a,
.pis-sito .pis-footer a,
.pis-sito .pis-box-contatto a {
    text-decoration: none;
}

.pis-sito .entry-content a.pis-btn:hover,
.pis-sito .entry-content a.pis-card-imm:hover,
.pis-sito .entry-content a.pis-news-card:hover,
.pis-sito .pis-footer a:hover,
.pis-sito .pis-box-contatto a:hover {
    text-decoration: none;
}

.pis-btn {
    display: inline-block;
    padding: 15px 30px;
    border-radius: 8px;
    font-weight: 700;
    font-size: .98rem;
    text-decoration: none;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
    border: 2px solid transparent;
}

.pis-btn:hover {
    transform: translateY(-2px);
    text-decoration: none;
}

.pis-btn-primario {
    background: #fff;
    color: var(--pal-blu);
}

.pis-btn-primario:hover {
    background: #fff;
    color: var(--pal-blu-scuro);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .2);
}

.pis-btn-fantasma {
    border-color: rgba(255, 255, 255, .65);
    color: #fff;
}

.pis-btn-fantasma:hover {
    background: rgba(255, 255, 255, .12);
    color: #fff;
}

.pis-btn-blu {
    background: var(--pal-blu);
    color: #fff;
}

.pis-btn-blu:hover {
    background: var(--pal-blu-scuro);
    color: #fff;
    box-shadow: var(--pal-ombra-alta);
}

.pis-btn-rosso {
    background: var(--pal-rosso-scuro);
    color: #fff;
}

.pis-btn-rosso:hover {
    background: #931016;
    color: #fff;
    box-shadow: 0 10px 34px rgba(237, 27, 36, .22);
}

/* --- Barra numeri --- */
.pis-numeri {
    background: #fff;
    border-bottom: 1px solid var(--pal-bordo);
    padding: 34px 0;
}

.pis-numeri-griglia {
    display: grid;
    /* Sempre tre in fila: sul telefono, a due per riga, il terzo numero
       resterebbe da solo e fuori asse. */
    grid-template-columns: repeat(3, 1fr);
    gap: 26px;
    text-align: center;
}

@media (max-width: 460px) {
    .pis-numeri-griglia {
        gap: 22px 14px;
    }
}

.pis-numero strong {
    display: block;
    font-size: 2.1rem;
    font-weight: 800;
    color: var(--pal-blu);
    line-height: 1.1;
}

.pis-numero span {
    display: block;
    margin-top: 5px;
    font-size: .9rem;
    color: var(--pal-grigio);
    font-weight: 500;
}

/* --- Sezioni generiche --- */
.pis-sezione {
    padding: 80px 0;
}

.pis-sezione-tenue {
    background: var(--pal-grigio-tenue);
}

.pis-titolo-sezione {
    text-align: center;
    max-width: 720px;
    margin: 0 auto 52px;
}

.pis-titolo-sezione .pis-eyebrow {
    display: block;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--pal-blu);
    margin-bottom: 12px;
}

.pis-titolo-sezione h2 {
    font-size: clamp(1.6rem, 3.4vw, 2.4rem);
    font-weight: 800;
    margin: 0 0 14px;
    line-height: 1.15;
}

.pis-titolo-sezione p {
    color: var(--pal-grigio);
    font-size: 1.03rem;
    line-height: 1.65;
    margin: 0;
}

/* --- Step numerati --- */
/* Colonne fisse e non auto-fit: con quattro passi auto-fit lascerebbe
   il quarto da solo su una riga intorno ai 1000px di larghezza. */
.pis-step {
    display: grid;
    grid-template-columns: 1fr;
    gap: 28px;
    counter-reset: passo;
}

@media (min-width: 600px) {
    .pis-step {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1100px) {
    .pis-step {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 22px;
    }
}

.pis-step-card {
    background: #fff;
    border: 1px solid var(--pal-bordo);
    border-radius: var(--pal-raggio);
    padding: 32px 26px;
    position: relative;
}

.pis-step-card::before {
    counter-increment: passo;
    content: counter(passo);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--pal-blu);
    color: #fff;
    font-weight: 800;
    font-size: 1.15rem;
    margin-bottom: 18px;
}

.pis-step-card h3 {
    font-size: 1.12rem;
    margin: 0 0 10px;
}

.pis-step-card p {
    color: var(--pal-grigio);
    font-size: .96rem;
    line-height: 1.62;
    margin: 0;
}

/* --- Card con icona --- */
.pis-card-griglia {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 28px;
}

.pis-card {
    background: #fff;
    border: 1px solid var(--pal-bordo);
    border-radius: var(--pal-raggio);
    padding: 34px 28px;
    transition: box-shadow .2s ease, transform .2s ease;
}

.pis-card:hover {
    box-shadow: var(--pal-ombra-alta);
    transform: translateY(-3px);
}

.pis-icona {
    width: 62px;
    height: 62px;
    display: block;
    margin-bottom: 20px;
}

.pis-card h3 {
    font-size: 1.15rem;
    margin: 0 0 12px;
}

.pis-card p {
    color: var(--pal-grigio);
    font-size: .96rem;
    line-height: 1.65;
    margin: 0;
}

.pis-card ul {
    margin: 14px 0 0;
    padding: 0;
    list-style: none;
}

.pis-card li {
    position: relative;
    padding-left: 22px;
    margin-bottom: 8px;
    color: var(--pal-grigio);
    font-size: .94rem;
    line-height: 1.5;
}

.pis-card li::before {
    content: '';
    position: absolute;
    left: 0;
    top: .45em;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--pal-blu);
}

/* --- Fascia Open House --- */
.pis-fascia {
    background: var(--pal-blu);
    color: #fff;
    padding: 76px 0;
    position: relative;
    overflow: hidden;
}

.pis-fascia::after {
    content: '';
    position: absolute;
    left: -120px;
    bottom: -220px;
    width: 480px;
    height: 480px;
    background: rgba(255, 255, 255, .06);
    transform: rotate(24deg);
}

.pis-fascia-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1.25fr 1fr;
    gap: 54px;
    align-items: center;
}

.pis-fascia h2 {
    color: #fff;
    font-size: clamp(1.6rem, 3.4vw, 2.3rem);
    font-weight: 800;
    margin: 0 0 18px;
    line-height: 1.15;
}

.pis-fascia p {
    color: rgba(255, 255, 255, .93);
    font-size: 1.03rem;
    line-height: 1.68;
    margin: 0 0 16px;
}

.pis-fascia-punti {
    display: grid;
    gap: 14px;
}

/* La velatura bianca schiariva il blu fino a rendere illeggibile qualunque
   testo sopra (col bianco pieno si arrivava solo a 4,28:1). Invertita in una
   velatura scura: il pannello resta staccato e il contrasto sale a 5,2:1. */
.pis-fascia-punto {
    background: rgba(0, 0, 0, .12);
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 8px;
    padding: 16px 20px;
}

.pis-fascia-punto strong {
    display: block;
    font-size: 1rem;
    margin-bottom: 3px;
}

.pis-fascia-punto span {
    font-size: .9rem;
    color: rgba(255, 255, 255, .88);
    line-height: 1.5;
}

/* --- Team, con la foto di gruppo --- */
.pis-team {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 50px;
    align-items: center;
}

.pis-team-foto {
    margin: 0;
}

.pis-team-foto img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: var(--pal-raggio);
    box-shadow: var(--pal-ombra);
}

.pis-team-foto figcaption {
    margin-top: 12px;
    color: var(--pal-grigio);
    font-size: .88rem;
    line-height: 1.5;
}

.pis-team-testo h2 {
    font-size: clamp(1.6rem, 3.4vw, 2.3rem);
    font-weight: 800;
    line-height: 1.15;
    margin: 0 0 16px;
}

.pis-team-testo > p {
    color: var(--pal-grigio);
    font-size: 1.03rem;
    line-height: 1.68;
    margin: 0;
}

.pis-team-persone {
    list-style: none;
    margin: 26px 0 0;
    padding: 0;
    display: grid;
    gap: 18px;
}

.pis-team-persone li {
    padding-left: 16px;
    border-left: 3px solid var(--pal-blu);
}

.pis-team-persone strong {
    display: block;
    font-size: 1.06rem;
    line-height: 1.3;
}

.pis-team-ruolo {
    display: block;
    color: var(--pal-blu);
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    margin: 3px 0 5px;
}

.pis-team-nota {
    display: block;
    color: var(--pal-grigio);
    font-size: .93rem;
    line-height: 1.55;
}

/* --- Valori del brand --- */
.pis-valori {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 22px;
}

.pis-valore {
    padding: 26px 22px;
    border-left: 3px solid var(--pal-blu);
    background: #fff;
}

/* Il livello dell'intestazione dipende dalla pagina (vedi i commenti sul salto
   nella gerarchia): lo stile deve valere per entrambi i livelli possibili. */
.pis-valore h3,
.pis-valore h4 {
    font-size: 1.02rem;
    margin: 0 0 8px;
    color: var(--pal-blu);
    font-weight: 700;
}

.pis-valore p {
    font-size: .93rem;
    color: var(--pal-grigio);
    line-height: 1.6;
    margin: 0;
}

/* --- FAQ --- */
.pis-faq {
    max-width: 820px;
    margin: 0 auto;
}

.pis-faq details {
    background: #fff;
    border: 1px solid var(--pal-bordo);
    border-radius: 8px;
    margin-bottom: 12px;
    overflow: hidden;
}

.pis-faq summary {
    cursor: pointer;
    padding: 20px 24px;
    font-weight: 600;
    font-size: 1.02rem;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.pis-faq summary::-webkit-details-marker {
    display: none;
}

.pis-faq summary::after {
    content: '+';
    color: var(--pal-blu);
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 1;
    flex-shrink: 0;
}

.pis-faq details[open] summary::after {
    content: '\2013';
}

.pis-faq details > div {
    padding: 0 24px 20px;
    color: var(--pal-grigio);
    font-size: .97rem;
    line-height: 1.68;
}

/* --- CTA finale --- */
.pis-cta {
    text-align: center;
    padding: 76px 0;
    background: var(--pal-blu-tenue);
}

.pis-cta h2 {
    font-size: clamp(1.6rem, 3.4vw, 2.3rem);
    font-weight: 800;
    margin: 0 0 14px;
}

.pis-cta p {
    color: var(--pal-grigio);
    font-size: 1.05rem;
    line-height: 1.65;
    max-width: 620px;
    margin: 0 auto 30px;
}

.pis-cta-contatti {
    margin-top: 26px;
    font-size: .95rem;
    color: var(--pal-grigio);
}

/* Il blu del brand su questo azzurro tenue dà 4,49:1, appena sotto il 4,5
   richiesto da WCAG AA per il testo normale: qui serve il blu scuro (6,4:1). */
.pis-cta-contatti a {
    color: var(--pal-blu-scuro);
    font-weight: 700;
    text-decoration: none;
}

/* --- Griglia immobili --- */
/* min(300px, 100%): su uno schermo da 320px la colonna utile e' di soli 272px,
   e una scheda da 300px sporgeva facendo scorrere la pagina di lato. */
.pis-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
    gap: 28px;
}

/* Le tre schede della home stanno in fila anche su tablet: a due per riga la
   terza resterebbe da sola. */
@media (min-width: 661px) {
    .pis-grid-anteprima {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* Sul telefono le griglie diventano a colonna singola. In anteprima restano due
   news, il resto è a un tocco col pulsante sotto. Le schede nascoste non
   scaricano nemmeno le fotografie, perché sono in loading="lazy" dentro un
   elemento non visualizzato. */
@media (max-width: 660px) {
    .pis-news-grid-anteprima > .pis-news-card:nth-child(n+3) {
        display: none;
    }
}

.pis-card-imm {
    display: block;
    background: #fff;
    border: 1px solid var(--pal-bordo);
    border-radius: var(--pal-raggio);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: box-shadow .2s ease, transform .2s ease;
}

.pis-card-imm:hover {
    box-shadow: var(--pal-ombra-alta);
    transform: translateY(-3px);
    text-decoration: none;
    color: inherit;
}

.pis-card-media {
    position: relative;
    aspect-ratio: 4 / 3;
    background: var(--pal-grigio-tenue);
    overflow: hidden;
}

.pis-card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.pis-etichetta {
    position: absolute;
    top: 14px;
    left: 14px;
    background: var(--pal-blu);
    color: #fff;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: 6px 12px;
    border-radius: 5px;
}

.pis-card-corpo {
    padding: 22px;
}

.pis-card-corpo h2,
.pis-card-corpo h3 {
    font-size: 1.08rem;
    margin: 0 0 4px;
    line-height: 1.3;
}

.pis-zona {
    color: var(--pal-grigio);
    font-size: .89rem;
    margin: 0 0 14px;
}

.pis-prezzo {
    font-size: 1.35rem;
    font-weight: 800;
    color: var(--pal-blu);
    margin: 0 0 14px;
}

.pis-dati {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding-top: 14px;
    border-top: 1px solid var(--pal-bordo);
    list-style: none;
}

.pis-dati li {
    font-size: .84rem;
    color: var(--pal-grigio);
    background: var(--pal-grigio-tenue);
    padding: 5px 11px;
    border-radius: 5px;
    font-weight: 500;
}

.pis-vuoto {
    padding: 56px 24px;
    text-align: center;
    color: var(--pal-grigio);
    background: var(--pal-grigio-tenue);
    border-radius: var(--pal-raggio);
}

.pis-tutti {
    text-align: center;
    margin-top: 42px;
}

/* --- Scheda immobile --- */
.pis-dettaglio {
    max-width: 980px;
    margin: 0 auto 60px;
}

.pis-briciole {
    font-size: .88rem;
    color: var(--pal-grigio);
    margin-bottom: 18px;
}

.pis-briciole a {
    color: var(--pal-blu);
    text-decoration: none;
    font-weight: 600;
}

.pis-dettaglio-testata {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-end;
    gap: 18px;
    padding-bottom: 22px;
    border-bottom: 2px solid var(--pal-blu);
    margin-bottom: 28px;
}

.pis-dettaglio h1 {
    font-size: clamp(1.5rem, 3.4vw, 2.2rem);
    font-weight: 800;
    margin: 0;
    line-height: 1.15;
}

.pis-dettaglio-zona {
    color: var(--pal-grigio);
    margin: 6px 0 0;
    font-size: 1rem;
}

.pis-prezzo-dettaglio {
    font-size: clamp(1.5rem, 3.2vw, 2.1rem);
    font-weight: 800;
    color: var(--pal-blu);
    margin: 0;
    white-space: nowrap;
}

.pis-foto-dettaglio {
    width: 100%;
    border-radius: var(--pal-raggio);
    display: block;
    margin-bottom: 12px;
}

.pis-galleria {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: 10px;
    margin-bottom: 36px;
}

.pis-galleria img {
    width: 100%;
    height: 100px;
    object-fit: cover;
    border-radius: 7px;
    display: block;
    transition: opacity .15s ease;
}

.pis-galleria a:hover img {
    opacity: .82;
}

.pis-blocco-titolo {
    font-size: 1.2rem;
    font-weight: 700;
    margin: 0 0 18px;
}

/* Le linee della griglia erano lo sfondo grigio del contenitore che
   traspariva nei gap da 1px: con un numero di voci non multiplo delle
   colonne, l'ultima cella mancante mostrava un riquadro grigio vuoto invece
   di una semplice linea sottile. Ora le linee sono ombre interne di ogni
   cella: una cella che non esiste non lascia nessun segno, a nessuna larghezza. */
.pis-caratteristiche {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    background: #fff;
    border: 1px solid var(--pal-bordo);
    border-radius: var(--pal-raggio);
    overflow: hidden;
    margin-bottom: 36px;
}

.pis-caratteristica {
    background: #fff;
    padding: 16px 20px;
    box-shadow: inset 1px 0 0 var(--pal-bordo), inset 0 1px 0 var(--pal-bordo);
}

.pis-caratteristica dt {
    font-size: .8rem;
    color: var(--pal-grigio);
    text-transform: uppercase;
    letter-spacing: .06em;
    font-weight: 600;
    margin-bottom: 5px;
}

.pis-caratteristica dd {
    margin: 0;
    font-size: 1.02rem;
    font-weight: 600;
    color: var(--pal-testo);
}

.pis-descrizione {
    font-size: 1.02rem;
    line-height: 1.75;
    color: #333;
    margin-bottom: 36px;
}

.pis-box-contatto {
    background: var(--pal-blu);
    color: #fff;
    border-radius: var(--pal-raggio);
    padding: 38px 34px;
    text-align: center;
}

.pis-box-contatto h3 {
    color: #fff;
    font-size: 1.35rem;
    margin: 0 0 10px;
}

/* Sul blu del brand il bianco pieno dà 5,09:1; al 90% scendeva a 4,43. */
.pis-box-contatto p {
    color: #fff;
    margin: 0 0 24px;
    line-height: 1.6;
}

/* --- Footer --- */
.pis-footer {
    background: var(--pal-nero);
    color: rgba(255, 255, 255, .72);
    padding: 54px 0 30px;
    font-size: .93rem;
    line-height: 1.7;
}

.pis-footer-griglia {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 36px;
    margin-bottom: 36px;
}

/* A 190px il logo si vedeva a 64px di altezza reale: "immobiliare" restava
   leggibile solo in proporzione al file sorgente, non a schermo (13px di
   altezza vera). La colonna del footer ha margine (misurata: 353px libera su
   desktop, 342px su mobile), quindi si allarga il contenitore, non solo il
   testo dentro l'immagine. */
.pis-footer img {
    max-width: 260px;
    margin-bottom: 16px;
}

.pis-footer h3,
.pis-footer h4 {
    color: #fff;
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .12em;
    margin: 0 0 16px;
    font-weight: 700;
}

.pis-footer a {
    color: rgba(255, 255, 255, .72);
    text-decoration: none;
}

.pis-footer a:hover {
    color: #fff;
}

.pis-footer ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.pis-footer li {
    margin-bottom: 9px;
}

/* Icone in un'area da 40px: abbastanza grande da toccarla col dito. Il margine
   negativo riporta l'icona a filo con il testo delle righe sopra. */
.pis-footer-social {
    margin: 14px 0 0 -9px;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.pis-footer-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: #fff;
    transition: background .15s ease;
}

.pis-footer-social a:hover {
    background: rgba(255, 255, 255, .15);
}

.pis-footer-social svg {
    display: block;
}

.pis-footer-coda {
    border-top: 1px solid rgba(255, 255, 255, .15);
    padding-top: 22px;
    font-size: .84rem;
    color: rgba(255, 255, 255, .5);
}

/* Il footer del plugin sostituisce quello del tema */
.pis-sito .site-footer {
    display: none;
}

/* Le schede immobile non passano dal contenitore del tema */
.pis-scheda-immobile .pis-dettaglio {
    padding-top: 40px;
}

/* La scheda immobile e' una pagina virtuale (rewrite + template_redirect),
   non un post/pagina vero: non riceve mai la classe "pis-pagina-sezioni" ne'
   i meta di Astra, quindi restava scoperto lo sfondo grigio-azzurro di
   default del tema (rgb(240,245,250)) invece del bianco usato ovunque
   altrove sul sito. */
body.pis-scheda-immobile {
    background: #fff;
}

/* --- News: elenco articoli --- */
.pis-news-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 28px;
}

.pis-news-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--pal-bordo);
    border-radius: var(--pal-raggio);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: box-shadow .2s ease, transform .2s ease;
}

.pis-news-card:hover {
    box-shadow: var(--pal-ombra-alta);
    transform: translateY(-3px);
    color: inherit;
}

.pis-news-media {
    position: relative;
    aspect-ratio: 16 / 9;
    background: var(--pal-grigio-tenue);
    overflow: hidden;
}

.pis-news-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Articolo senza immagine in evidenza: segnaposto col marchio, mai un buco grigio */
.pis-news-media-vuota {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--pal-blu-tenue);
}

.pis-news-segnaposto {
    width: 76px;
    height: 76px;
    opacity: .5;
}

.pis-news-corpo {
    padding: 22px;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.pis-news-data {
    font-size: .78rem;
    color: var(--pal-grigio);
    margin: 0 0 9px;
    text-transform: uppercase;
    letter-spacing: .07em;
    font-weight: 600;
}

.pis-news-card h2,
.pis-news-card h3 {
    font-size: 1.12rem;
    line-height: 1.35;
    margin: 0 0 10px;
}

.pis-news-estratto {
    color: var(--pal-grigio);
    font-size: .95rem;
    line-height: 1.62;
    margin: 0 0 16px;
    flex: 1;
}

.pis-news-leggi {
    color: var(--pal-blu);
    font-weight: 700;
    font-size: .92rem;
}

/* --- Paginazione --- */
.pis-paginazione {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    flex-wrap: wrap;
    margin-top: 46px;
}

.pis-pag-btn {
    display: inline-block;
    padding: 12px 22px;
    border: 2px solid var(--pal-blu);
    border-radius: 8px;
    color: var(--pal-blu);
    font-weight: 700;
    font-size: .93rem;
    text-decoration: none;
}

.pis-sito a.pis-pag-btn:hover {
    background: var(--pal-blu);
    color: #fff;
    text-decoration: none;
}

.pis-pag-spento {
    opacity: .4;
    border-color: var(--pal-bordo);
    color: var(--pal-grigio);
}

.pis-pag-stato {
    color: var(--pal-grigio);
    font-size: .92rem;
    font-weight: 600;
}

/* --- Articolo singolo --- */
.pis-articolo .entry-header {
    max-width: 780px;
    margin: 46px auto 4px;
    padding: 0 24px;
}

.pis-articolo .entry-title {
    font-size: clamp(1.6rem, 3.6vw, 2.5rem);
    line-height: 1.14;
    font-weight: 800;
    margin: 0 0 12px;
}

/* La riga meta del tema stampa "By" seguito dall'autore e non e'
   personalizzabile senza filtri: la sostituiamo con la nostra
   (.pis-articolo-meta, generata dal plugin). Stesso discorso per la
   navigazione fra articoli, che ha etichette in inglese non tradotte:
   il ritorno all'elenco lo diamo noi in fondo all'articolo. */
.pis-articolo .entry-meta,
.pis-articolo .post-navigation,
.pis-articolo #comments,
.pis-articolo #respond {
    display: none;
}

.pis-articolo-meta {
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--pal-blu);
    margin: 0 0 26px;
}

.pis-articolo .entry-content {
    max-width: 780px;
    margin: 0 auto;
    padding: 0 24px;
    font-size: 1.05rem;
    line-height: 1.78;
    /* Astra usa un grigio con dominante blu: per la lettura lunga
       preferiamo un neutro, coerente con --pal-testo del brand. */
    color: #2b2b2b;
}

.pis-articolo .entry-content h2 {
    font-size: 1.5rem;
    margin: 2em 0 .6em;
}

.pis-articolo .entry-content h3 {
    font-size: 1.18rem;
    margin: 1.7em 0 .5em;
}

.pis-articolo .entry-content ul,
.pis-articolo .entry-content ol {
    padding-left: 1.35em;
    margin-bottom: 1.6em;
}

.pis-articolo .entry-content li {
    margin-bottom: .5em;
}

.pis-articolo .entry-content blockquote {
    border-left: 4px solid var(--pal-blu);
    padding: 4px 0 4px 22px;
    margin: 1.8em 0 1.8em 0;
    color: #333;
    font-style: normal;
}

.pis-articolo .entry-content img,
.pis-articolo .post-thumb img {
    border-radius: var(--pal-raggio);
}

.pis-articolo-coda {
    margin-top: 48px;
}

.pis-articolo-ritorno {
    text-align: center;
    margin-top: 26px;
}

.pis-sito .pis-articolo-ritorno a {
    color: var(--pal-blu);
    font-weight: 700;
    text-decoration: none;
}

@media (max-width: 880px) {
    .pis-fascia-inner {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    /* Foto sopra e testo sotto: affiancati sotto gli 880px la foto di gruppo
       diventerebbe troppo stretta per riconoscere le persone. */
    .pis-team {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .pis-hero {
        padding: 64px 0 58px;
    }

    .pis-sezione {
        padding: 58px 0;
    }

    .pis-dettaglio-testata {
        align-items: flex-start;
    }

    /* Su schermi stretti una sola colonna: minmax(320px) da solo lascerebbe
       le card news schiacciate sui telefoni piccoli. */
    .pis-news-grid {
        grid-template-columns: 1fr;
    }

    .pis-paginazione {
        gap: 12px;
    }

    .pis-pag-btn {
        padding: 11px 16px;
        font-size: .88rem;
    }

    .pis-articolo .entry-header {
        margin-top: 30px;
    }
}

/* --- Modulo di contatto --- */
.pis-form-contatti {
    max-width: 640px;
    margin: 32px 0 0;
    scroll-margin-top: 24px;
}

.pis-form-esito {
    padding: 16px 20px;
    border-radius: var(--pal-raggio);
    font-size: .95rem;
    line-height: 1.55;
    margin-bottom: 24px;
}

.pis-form-ok {
    background: var(--pal-blu-tenue);
    border-left: 3px solid var(--pal-blu);
    color: var(--pal-testo);
}

/* Il rosso non è nella tavolozza approvata: l'errore si distingue dal
   successo (blu) restando comunque dentro Blu/Bianco/Nero, con un grigio
   già usato altrove sul sito e un bordo nero anziché colorato. */
.pis-form-errore {
    background: var(--pal-grigio-tenue);
    border-left: 3px solid var(--pal-testo);
    color: var(--pal-testo);
}

/* Campo civetta: fuori dallo schermo invece di display:none, che alcuni
   compilatori automatici sanno riconoscere e saltare. */
.pis-campo-web {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.pis-form-riga {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.pis-campo {
    margin-bottom: 20px;
}

.pis-campi-obbligatori {
    font-size: .82rem;
    color: var(--pal-grigio);
    margin: 0 0 18px;
}

.pis-campo label {
    display: block;
    font-size: .86rem;
    font-weight: 700;
    color: var(--pal-testo);
    margin-bottom: 7px;
}

/* Il vincolo minlength e' un fumetto nativo del browser: su Safari/VoiceOver
   iOS spesso non viene annunciato affatto. Il testo qui non dipende da come
   il browser decide di mostrare la validazione. */
.pis-campo-suggerimento {
    font-weight: 400;
    color: var(--pal-grigio);
    text-transform: none;
    letter-spacing: normal;
}

.pis-campo input,
.pis-campo textarea {
    width: 100%;
    padding: 13px 16px;
    border: 1px solid var(--pal-bordo);
    border-radius: 8px;
    font-family: 'Montserrat', sans-serif;
    font-size: .96rem;
    color: var(--pal-testo);
    background: #fff;
}

.pis-campo textarea {
    resize: vertical;
    min-height: 120px;
}

.pis-campo input:focus,
.pis-campo textarea:focus {
    outline: none;
    border-color: var(--pal-blu);
    box-shadow: 0 0 0 3px var(--pal-blu-tenue);
}

.pis-campo-consenso {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 24px;
    font-size: .86rem;
    line-height: 1.5;
    color: var(--pal-grigio);
    cursor: pointer;
}

.pis-campo-consenso input {
    margin-top: 3px;
    flex-shrink: 0;
    width: 17px;
    height: 17px;
    accent-color: var(--pal-blu);
}

.pis-campo-consenso a {
    color: var(--pal-blu);
}

.pis-form-contatti button[type="submit"] {
    border: none;
    cursor: pointer;
    font-family: 'Montserrat', sans-serif;
}

@media (max-width: 560px) {
    .pis-form-riga {
        grid-template-columns: 1fr;
        gap: 0;
    }
}

/* --- Barra superiore: F.I.M.A.A. e WhatsApp --- */
.pis-topbar {
    background: #fff;
    border-bottom: 1px solid var(--pal-bordo);
}

/* Stessa colonna dell'header del tema (1240px, misurata): a sinistra il logo
   F.I.M.A.A. parte dove parte il logo Palmieri (20px); a destra il pulsante
   finisce dove finisce il testo dell'ultima voce di menu (35px). */
.pis-topbar-inner {
    max-width: 1240px;
    margin: 0 auto;
    padding: 8px 35px 8px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.pis-topbar-fimaa {
    display: block;
    flex-shrink: 1;
    min-width: 0;
}

.pis-topbar-fimaa img {
    display: block;
    width: auto;
    max-width: 100%;
    height: 56px;
}

/* Verde WhatsApp: qui il Brand Book non si applica, il colore fa parte del
   riconoscimento del servizio. Testo scuro e non bianco: il bianco su questo
   verde si ferma sotto 2:1, molto al di sotto del 4,5 di WCAG AA. */
.pis-sito .pis-topbar-whatsapp {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    gap: 8px;
    min-height: 40px;
    padding: 8px 16px;
    border-radius: 100px;
    background: #25d366;
    color: #06331c;
    font-size: .9rem;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    transition: background .15s ease;
}

.pis-sito .pis-topbar-whatsapp:hover,
.pis-sito .pis-topbar-whatsapp:focus-visible {
    background: #1ebe5b;
    color: #06331c;
    text-decoration: none;
}

/* Con l'header mobile il riferimento a destra e' l'icona del menu (31px). */
@media (max-width: 921px) {
    .pis-topbar-inner {
        padding-right: 31px;
    }
}

@media (max-width: 479px) {
    .pis-topbar-inner {
        padding-top: 6px;
        padding-bottom: 6px;
    }

    .pis-topbar-fimaa img {
        height: 48px;
    }
}

/* --- Occhiello della home, piu' grande ---
   Solo l'hero della home: .pis-occhiello serve anche per "Il metodo" e per gli
   hero delle altre pagine, che restano com'erano. */
.home .pis-hero .pis-occhiello {
    font-size: 1.05rem;
    padding: 10px 20px;
}

/* Sul telefono la dimensione segue la larghezza dello schermo e la spaziatura
   fra le lettere si riduce: cosi' la scritta resta su una riga sola anche a
   320px, dove prima andava a capo. */
@media (max-width: 479px) {
    .home .pis-hero .pis-occhiello {
        font-size: clamp(11.4px, 3.55vw, 15px);
        letter-spacing: .08em;
        padding: 8px 14px;
        white-space: nowrap;
    }
}

/* --- Menu con sette voci ---
   Accanto al logo non entra su una riga fra 922px (dove finisce il menu mobile)
   e 1099px: margine fino a 1099 perche' le barre di scorrimento di Windows
   tolgono altri 17px alla larghezza utile. La voce Contatti tiene il suo margine
   destro, che la allinea al pulsante WhatsApp. */
@media (min-width: 922px) and (max-width: 1099px) {
    .main-header-menu .menu-link {
        padding-left: 7px;
        padding-right: 7px;
        font-size: .86rem;
        letter-spacing: 0;
    }

    .main-header-menu > .menu-item:last-child > .menu-link {
        padding-right: 15px;
    }
}

/* --- Dicono di Noi --- */
.pis-recensioni {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr));
    gap: 24px;
}

.pis-recensione {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 28px 26px;
    background: #fff;
    border: 1px solid var(--pal-bordo);
    border-radius: var(--pal-raggio);
}

/* Il giallo e' fuori palette, come il verde di WhatsApp: e' il colore che tutti
   riconoscono come valutazione. */
.pis-recensione-stelle {
    margin-bottom: 12px;
    color: #f5a623;
    font-size: 1.15rem;
    letter-spacing: .1em;
}

.pis-sito .entry-content .pis-recensione blockquote {
    flex: 1;
    margin: 0 0 18px;
    padding: 0;
    border: 0;
    font-style: italic;
    font-size: .96rem;
    line-height: 1.65;
    color: var(--pal-testo);
}

.pis-recensione figcaption {
    font-weight: 700;
    font-size: .92rem;
    color: var(--pal-blu);
}

.pis-dicono-azione {
    margin: 40px 0 0;
    text-align: center;
}

.pis-video-griglia {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
    gap: 30px 24px;
}

.pis-video h3 {
    margin: 12px 0 0;
    font-size: .98rem;
    font-weight: 600;
    line-height: 1.4;
}

/* Finta anteprima: il player vero viene creato al clic, da video.js. Le immagini
   di YouTube sono 4:3 con le bande nere: il ritaglio a 16:9 le toglie. */
.pis-video-anteprima {
    position: relative;
    display: block;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: var(--pal-raggio);
    background: var(--pal-blu-tenue);
}

.pis-video-anteprima img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pis-video-play {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 62px;
    height: 62px;
    border-radius: 50%;
    background: var(--pal-blu);
    box-shadow: 0 4px 18px rgba(0, 0, 0, .3);
    transform: translate(-50%, -50%);
    transition: transform .15s ease, background .15s ease;
}

/* Triangolo disegnato con i bordi: nessuna icona da caricare. */
.pis-video-play::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 54%;
    border-style: solid;
    border-width: 11px 0 11px 18px;
    border-color: transparent transparent transparent #fff;
    transform: translate(-50%, -50%);
}

.pis-video-anteprima:hover .pis-video-play,
.pis-video-anteprima:focus-visible .pis-video-play {
    background: var(--pal-blu-scuro);
    transform: translate(-50%, -50%) scale(1.08);
}

.pis-video-player {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    border: 0;
    border-radius: var(--pal-raggio);
}

.pis-video-nota {
    margin: 16px 0 0;
    text-align: center;
    font-size: .85rem;
    color: var(--pal-grigio);
}

/* --- Contatti: indirizzo, orari e mappa --- */
.pis-dove-siamo {
    display: grid;
    gap: 28px;
    margin-bottom: 2em;
}

@media (min-width: 800px) {
    .pis-dove-siamo {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
        gap: 48px;
    }
}

/* Le due colonne sono nipoti di .entry-content: Astra in modalita'
   page-builder da' loro margin-left/right:auto (vedi .pis-wrap), che in una
   griglia le stringe al contenuto invece di far loro riempire la colonna. */
.pis-dove-siamo > * {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Gli orari ("15:30 – 19:30") non vanno spezzati a capo sul telefono. */
.pis-dove-siamo-testo strong {
    white-space: nowrap;
}

.pis-mappa {
    display: flex;
    flex-direction: column;
}

/* La mappa prende l'altezza della colonna con indirizzo e orari, ma non
   scende sotto una misura in cui si legge ancora bene. */
.pis-mappa-riquadro {
    position: relative;
    display: flex;
    flex: 1;
    min-height: 320px;
}

.pis-mappa-anteprima,
.pis-mappa-iframe {
    flex: 1;
    width: 100%;
    min-height: 320px;
    border: 1px solid var(--pal-bordo);
    border-radius: var(--pal-raggio);
}

.pis-mappa-anteprima {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    background: var(--pal-blu-tenue);
    color: var(--pal-blu);
    text-decoration: none;
}

.pis-mappa-sfondo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.pis-mappa-pin {
    position: relative;
    width: 44px;
    height: 59px;
    filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .18));
}

.pis-mappa-anteprima .pis-btn {
    position: relative;
}

/* Il pulsante e' uno span dentro il link: l'effetto va dato al passaggio
   sull'intera anteprima, che e' tutta cliccabile. */
.pis-mappa-anteprima:hover .pis-btn-blu,
.pis-mappa-anteprima:focus-visible .pis-btn-blu {
    background: var(--pal-blu-scuro);
    box-shadow: var(--pal-ombra-alta);
    transform: translateY(-2px);
}

/* Dopo il clic l'anteprima copre la mappa finche' Google non l'ha
   consegnata (vedi mappa.js), con una rotella sul pulsante. */
.pis-mappa-in-caricamento {
    position: absolute;
    inset: 0;
    z-index: 1;
    cursor: progress;
}

.pis-mappa-in-caricamento .pis-btn::before {
    content: "";
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-right: 10px;
    vertical-align: -.15em;
    border: 2px solid rgba(255, 255, 255, .35);
    border-top-color: #fff;
    border-radius: 50%;
    animation: pis-mappa-gira .8s linear infinite;
}

@keyframes pis-mappa-gira {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .pis-mappa-in-caricamento .pis-btn::before {
        animation-duration: 2.4s;
    }
}

/* Doppia classe: .entry-content p di Astra aggiungerebbe un margine sotto,
   che ruberebbe altezza alla mappa. */
.pis-mappa .pis-mappa-nota {
    margin: 10px 0 0;
    font-size: .85rem;
    color: var(--pal-grigio);
}