/* Home — LA PRIMA PAGINA (prototipo del 07/10/2026, ora la Home): l'impaginazione da quotidiano sopra i componenti della Home di oggi
   (ndc.css + home-piu.css). Solo gettoni del tema e della tabella dei corpi: i due temi e la regola madre valgono da sé.
   ★ Non si carica home/home.css: è lì che la Home toglieva la barra in basso del telefono. */

/* la pagina più larga: tre colonne come un giornale */
body.prima-pagina .pagina{ max-width:1320px }

/* ═══ la testata della prima pagina: la data, il nome della pagina, la stagione; sotto la SCELTA ═══ */
.pp-testata{ display:grid; gap:14px; padding-top:18px }
.pp-riga-data{ display:grid; grid-template-columns:1fr auto 1fr; gap:12px; align-items:center; padding:8px 0; border-top:2px solid var(--inchiostro); border-bottom:4px double var(--inchiostro) }
.pp-riga-data > :last-child{ text-align:right }
.pp-centro{ color:var(--inchiostro) }
.pp-scelta .sel{ font:700 var(--c-titoletto)/1 var(--f-titolo); text-transform:uppercase; letter-spacing:.02em; cursor:pointer }
.pp-scelta .sel-coppe label{ cursor:pointer }

/* ═══ l'apertura: occhiello, titolo, catenaccio ═══ */
.pp-apertura{ display:grid; gap:10px; padding:26px 0 22px; border-bottom:1px solid var(--inchiostro) }
.pp-occhiello{ margin:0; font:700 var(--c-nota)/1.3 var(--f-cifre); letter-spacing:.12em; text-transform:uppercase; color:var(--verdetto) }
.pp-titolo{ margin:0; font:900 clamp(var(--c-titolo), 5.2vw, var(--c-grande))/.95 var(--f-titolo); text-transform:uppercase; letter-spacing:-.005em; text-wrap:balance; max-width:22ch }
.pp-sq,.pp-sq-t{ color:inherit; text-decoration:none; white-space:nowrap }
.pp-sq:hover,.pp-sq-t:hover{ text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:4px }
.pp-sq .sq-cl,.pp-sq{ display:inline-flex; align-items:center; gap:.18em; vertical-align:baseline }
.pp-sq img,.pp-sq .senza,.pp-sq .stemma-svg{ width:.8em; height:.8em; object-fit:contain; flex:none; align-self:center }
.pp-sq .stemma-svg svg{ height:.8em; width:auto }
.pp-sq .senza{ display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--filetto); font-size:.5em; color:var(--grigio) }
.pp-sq-t{ display:inline; font-weight:600 }
.pp-sq-t img,.pp-sq-t .senza,.pp-sq-t .stemma-svg{ display:inline-block; width:1.05em; height:1.05em; object-fit:contain; vertical-align:-.17em; margin-right:.25em }
.pp-sq-t .stemma-svg svg{ height:1.1em; width:auto }
.pp-sq-t .senza{ display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--filetto); font-size:.7em; color:var(--grigio) }
.pp-catenaccio{ margin:0; font:400 var(--c-titoletto)/1.45 var(--f-testo); max-width:70ch }

/* ═══ le tre colonne ═══ */
.pp-colonne{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); padding-top:18px }
.pp-col{ min-width:0; padding:0 22px; border-left:1px solid var(--filetto); display:grid; grid-template-columns:minmax(0,1fr); gap:30px; align-content:start }
.pp-col:first-child{ padding-left:0; border-left:0 }
.pp-col:last-child{ padding-right:0 }
.pp-rubrica{ margin:0 0 12px; padding-top:6px; border-top:4px solid var(--inchiostro); font:700 var(--c-nota)/1.3 var(--f-cifre); letter-spacing:.12em; text-transform:uppercase }
.pp-blocco > summary{ display:none }
.pp-dentro{ display:grid; grid-template-columns:minmax(0,1fr); gap:14px; min-width:0 }
/* il turno in una colonna: lo stesso disegno della Home, un gradino più stretto */
.pp-col .numero-turno{ font-size:clamp(var(--c-dato), 7vw, var(--c-grande)) }
.pp-col .numero-turno.parola{ font-size:var(--c-titolo); line-height:.9 }
.pp-col .turno-testa{ flex-wrap:nowrap; gap:12px }
.pp-col .turno-testa > div{ min-width:0 }
.pp-col .turno-testa:has(.parola){ flex-wrap:wrap }
.pp-col .dida-oggi{ font-size:var(--c-titoletto) }
.pp-col .lato b{ font-size:var(--c-evidenza) }
.pp-col .lato img,.pp-col .lato .senza{ width:28px; height:28px }
.pp-col .cifra{ font-size:var(--c-sottotitolo) }
.pp-col .ora-tp{ font-size:var(--c-titoletto) }
.pp-col .tessera-partita{ padding:10px 14px }
.pp-nota-tp{ grid-column:1/-1; font:600 var(--c-etichetta)/1.3 var(--f-cifre); letter-spacing:.06em; text-transform:uppercase; color:var(--grigio) }
.pp-tocca{ margin:22px 0 0; padding-top:12px; border-top:1px solid var(--filetto); font-size:var(--c-testo); color:var(--grigio); display:flex; flex-wrap:wrap; gap:6px 18px }
.pp-tocca a,.pp-vai a{ color:var(--inchiostro); font-weight:600 }
.pp-vai{ margin:8px 0 0; font-size:var(--c-testo) }

/* la classifica e i marcatori nella colonna stretta: nessun nome troncato (va a capo se serve) */
.pp-lato .classifica{ width:100%; border-collapse:collapse }
.pp-lato .classifica td,.pp-lato .classifica th{ padding:6px 3px; font-size:var(--c-nota) }
.pp-lato .classifica th{ font-size:var(--c-etichetta) }
.pp-lato .classifica td.sq{ font-size:var(--c-testo); white-space:normal }
.pp-lato .classifica td.pt{ font-size:var(--c-evidenza) }
.pp-lato .classifica td.sq a{ color:var(--inchiostro) }
.pp-lato .sq-cl{ gap:8px }
.pp-lato .sq-cl img,.pp-lato .sq-cl .senza,.pp-lato .sq-cl .stemma-svg{ width:22px; height:22px }
.pp-lato .sq-cl .stemma-svg svg{ height:22px }
.pp-mk td.sq a:not(.sq-cl){ color:var(--inchiostro); text-decoration:none; font-weight:600 }
.pp-mk td.sq a:not(.sq-cl):hover{ text-decoration:underline }

/* il tabellone di una coppa */
.pp-h3{ margin:0 0 8px; font:700 var(--c-titoletto)/1.1 var(--f-titolo); text-transform:uppercase; display:flex; gap:10px; align-items:baseline; flex-wrap:wrap }
.pp-h3 small{ font:600 var(--c-etichetta) var(--f-cifre); letter-spacing:.08em; color:var(--grigio) }
.pp-tb-turno > summary{ padding:6px 0 }
.pp-tb-turno > summary .pp-h3{ margin:0 }
.pp-tb-turno[open] > summary{ margin-bottom:4px }
.pp-tb{ list-style:none; margin:0 0 14px; padding:0; display:grid }
.pp-tb li{ display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:4px 8px; align-items:center; padding:7px 0; border-bottom:1px solid var(--filetto) }
.pp-tb li small{ grid-column:1/-1; text-align:center; font:600 var(--c-etichetta) var(--f-cifre); letter-spacing:.06em; text-transform:uppercase; color:var(--grigio) }
.pp-tb .r{ font:700 var(--c-testo) var(--f-cifre); color:var(--inchiostro); text-decoration:none; border:1px solid var(--filetto); padding:2px 6px; text-align:center; white-space:nowrap }
.pp-tb .r:hover{ border-color:var(--inchiostro) }
.pp-tb .r.ora{ color:var(--grigio); font-weight:600 }
.pp-tb-sq{ min-width:0; font-size:var(--c-nota) }
.pp-tb-sq.o{ display:flex; justify-content:flex-end; text-align:right }
.pp-tb-sq .sq-cl{ font-size:var(--c-testo) }
.pp-tb-sq.o .sq-cl{ flex-direction:row-reverse }
.pp-tb-sq.passa .sq-cl span{ font-weight:800 }
.pp-tb-sq:not(.passa) .sq-cl span{ color:var(--grigio) }

/* ═══ la fascia della storia: «Nella storia» e, accanto, «Accadde oggi» ═══ */
.pp-fascia-storia{ display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:0 }
.pp-fascia-storia.sola{ grid-template-columns:minmax(0,1fr) }
.pp-fascia-storia > .sezione{ min-width:0; align-content:start }
.pp-fascia-storia > #nella-storia{ padding-right:24px }
.pp-accadde{ padding-left:22px; border-left:1px solid var(--filetto) }
.pp-fascia-storia:not(.sola) .ns-vetrina{ grid-template-columns:repeat(3,minmax(0,1fr)) }
.pp-ac-data{ margin:0 0 6px }
.pp-ac{ display:grid; gap:4px; margin-bottom:18px }
.pp-ac-l{ list-style:none; margin:0; padding:0; display:grid }
.pp-ac-l li{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:0 10px; align-items:baseline; padding:7px 0; border-bottom:1px solid var(--filetto) }
.pp-ac-l li a{ color:var(--inchiostro); font:600 var(--c-testo)/1.3 var(--f-testo); text-decoration:none }
.pp-ac-l li a:hover{ text-decoration:underline }
.pp-ac-n{ font:900 var(--c-titoletto)/1 var(--f-titolo) }
.pp-ac-l li small{ grid-column:1/-1; font:var(--c-nota)/1.35 var(--f-testo); color:var(--grigio) }
.vs-link{ color:inherit; text-decoration:none } .vs-link:hover{ text-decoration:underline }
.vs-nomi .sq-cl{ gap:6px; vertical-align:middle } .vs-nomi .sq-cl img,.vs-nomi .sq-cl .senza,.vs-nomi .sq-cl .stemma-svg{ width:20px; height:20px } .vs-nomi .sq-cl .stemma-svg svg{ height:20px }
.vs-nomi a{ color:var(--inchiostro) }
/* il turno è una PAROLA in coppa («Sedicesimi»): come nella Home (home.css) */
.numero-turno.parola{ font-size:clamp(var(--c-titolo), 6vw, var(--c-dato)); line-height:.9 }
.turno-testa:has(.parola){ flex-wrap:wrap; row-gap:6px }

@media (max-width:1100px){
  .pp-colonne{ grid-template-columns:repeat(2,minmax(0,1fr)) }
  .pp-col.pp-lato{ grid-column:1/-1; padding:24px 0 0; border-left:0; border-top:1px solid var(--filetto); grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 22px }
  .pp-col.pp-lato > :last-child{ padding-left:22px; border-left:1px solid var(--filetto) }
  .pp-col:nth-child(2){ padding-right:0 }
  .pp-fascia-storia{ grid-template-columns:minmax(0,1fr) }
  .pp-fascia-storia > #nella-storia{ padding-right:0 }
  .pp-accadde{ padding-left:0; border-left:0 }
}

/* ═══ IL TELEFONO: i quattro blocchi chiusi, si aprono con un tocco (stessa forma dei blocchi apribili della Home) ═══ */
/* ★ 13/10/2026 (testi che si sovrappongono, tablet in piedi): fra 761 e 960 px classifica e marcatori stavano affiancati in
     due colonne da ~316 px, e nei marcatori «Frosinone» toccava le reti e «Guðmundsson» usciva di 22 px anche al corpo minimo:
     lì la colonna è una sola (classifica sopra, marcatori sotto) */
@media (min-width:761px) and (max-width:960px){
  .pp-col.pp-lato{ grid-template-columns:minmax(0,1fr) }
  .pp-col.pp-lato > :last-child{ padding-left:0; border-left:0 }
}
@media (max-width:760px){
  .pp-testata{ padding-top:8px; gap:10px }
  .pp-riga-data{ grid-template-columns:1fr auto }
  .pp-riga-data .pp-centro{ display:none }
  .pp-scelta .sel{ font-size:var(--c-evidenza) }
  .pp-apertura{ padding:16px 0 14px }
  .pp-titolo{ font-size:var(--c-titolo); max-width:none }
  .pp-catenaccio{ font-size:var(--c-testo) }
  .pp-colonne,.pp-col.pp-lato{ grid-template-columns:minmax(0,1fr); padding-top:0; gap:0; border:0 }
  .pp-col,.pp-col.pp-lato,.pp-col.pp-lato > :last-child{ padding:0; border:0; gap:0 }
  .pp-blocco{ border-bottom:1px solid var(--filetto) }
  .pp-blocco > summary{ list-style:none; display:flex; align-items:center; justify-content:space-between; gap:14px; cursor:pointer; padding:14px 0; min-height:44px }
  .pp-blocco > summary::-webkit-details-marker{ display:none }
  .pp-blocco > summary:focus-visible{ outline:2px solid var(--verdetto); outline-offset:3px }
  .pp-som{ display:grid; gap:2px; min-width:0 }
  .pp-som b{ font:700 var(--c-titoletto)/1.1 var(--f-titolo); text-transform:uppercase; letter-spacing:.02em }
  .pp-som small{ font:600 var(--c-etichetta)/1.3 var(--f-cifre); letter-spacing:.06em; text-transform:uppercase; color:var(--grigio) }
  .pp-blocco > summary:hover .apri-ico{ border-color:var(--verdetto); background:var(--velo) }
  .pp-blocco[open] > summary .apri-ico::after{ display:none }
  .pp-blocco .pp-rubrica{ display:none }
  .pp-blocco[open] > .pp-dentro{ padding-bottom:18px }
  .pp-col .turno-testa{ display:none }
  .pp-col .lato b{ font-size:var(--c-evidenza) }
  .pp-tocca{ margin-top:14px }
  .pp-fascia-storia:not(.sola) .ns-vetrina{ grid-template-columns:repeat(2,minmax(0,1fr)) }
  /* la ricerca: come nella Home (il campo in cima alla pagina, la testata del telefono non l'ha) */
  .cerca-home{ padding-top:0 }
}
/* ★ AUTOCONTENIMENTO (regola B.2 di Fabio): il nome si stringe da solo (data-adatta, guscio) e resta su una riga; un nome di
     più parole, se proprio non entra, va a capo FRA le parole; mai dentro una parola, mai troncato, mai abbreviato */
.ns-risultati li > span{ min-width:0 }
.ns-risultati .pp-sq-t{ display:flex; align-items:center; gap:6px; min-width:0; white-space:normal }
.ns-risultati .o .pp-sq-t{ justify-content:flex-end }
.ns-risultati .pp-sq-t img,.ns-risultati .pp-sq-t .senza,.ns-risultati .pp-sq-t .stemma-svg{ margin:0; flex:none }
.ns-risultati .pp-nm,.sq-cl > span[data-adatta]{ display:block; min-width:0 }
.ns-vetrina .pp-sq-t{ white-space:normal }
.sq-cl{ max-width:100%; min-width:0 }
/* ★ sul telefono (e fino a 520 px) due nomi affiancati in mezza riga non entrano interi («Sambenedettese», «Associazione
     Calcio Sampierdarenese»): si cambia l'IMPAGINAZIONE, non il nome. La partita va su due righe — casa sopra, ospite sotto,
     il risultato a destra — come le tessere dei turni. Vale per «Nella storia» e per il tabellone della coppa. */
@media (max-width:520px){
  .ns-risultati li,.pp-tb li{ grid-template-columns:minmax(0,1fr) auto; grid-template-rows:auto auto; gap:4px 12px; align-items:center }
  .ns-risultati li > span:first-child,.pp-tb li > .pp-tb-sq:first-child{ grid-column:1; grid-row:1 }
  .ns-risultati li > .o,.pp-tb li > .pp-tb-sq.o{ grid-column:1; grid-row:2; text-align:left; justify-content:flex-start }
  .ns-risultati li > .r,.pp-tb li > .r{ grid-column:2; grid-row:1/3; align-self:center }
  .ns-risultati .o .pp-sq-t{ justify-content:flex-start }
  .pp-tb-sq.o .sq-cl{ flex-direction:row }
  .ns-risultati li small,.pp-tb li small{ grid-column:1/-1; grid-row:3; text-align:left }
  /* ★ 14/10/2026 (Fabio: «così c'è meno possibilità di errore»): impilata, la riga si legge come la partita; tutta la riga apre la
     partita (lo strato del risultato la copre), i nomi e gli altri link stanno sopra e aprono la loro scheda. */
  .ns-risultati li,.pp-tb li{ position:relative }
  .ns-risultati li > a.r::after,.pp-tb li > a.r::after{ content:''; position:absolute; inset:0 }
  .ns-risultati li a:not(.r),.pp-tb li a:not(.r),.ns-risultati li img,.pp-tb li img{ position:relative; z-index:1 }
}
/* la stagione che apre la sua pagina: nel colore del testo che la porta */
.pp-stag{ color:inherit; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px }
.pp-stag:hover{ text-decoration-thickness:2px }
.pp-ac-l li small a{ color:var(--inchiostro) }
/* la squadra del primato: lo stemma accanto al nome, dentro il link (B.4) */
.vs-sq{ display:inline-flex; align-items:center; gap:10px; min-width:0; max-width:100% }
.vs-sq img,.vs-sq .senza,.vs-sq .stemma-svg{ width:40px; height:40px; object-fit:contain; flex:none }
.vs-sq .stemma-svg svg{ height:40px; width:auto }
.vs-sq .senza{ display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--filetto); font:700 var(--c-testo) var(--f-titolo); color:var(--grigio) }
.vs-sq > span{ min-width:0; display:block }

/* ★ 07/10 sera — le tessere SEPARATE (Fabio): la squadra (stemma + nome) apre la sua scheda, il numero apre la partita.
     La tessera è un riquadro; i link sono la riga della squadra e la cifra (o l'ora), ognuno col suo bersaglio. */
.tessera-partita.divisa:hover{ transform:none; box-shadow:none }
.tessera-partita.divisa a.lato{ color:var(--inchiostro); text-decoration:none; min-height:36px }
.tessera-partita.divisa a.lato:hover b,.tessera-partita.divisa a.lato:focus-visible b{ text-decoration:underline; text-underline-offset:3px }
.tessera-partita.divisa a.cifra{ color:var(--inchiostro); text-decoration:none; min-width:44px; min-height:40px; display:inline-flex; align-items:center; justify-content:flex-end }
.tessera-partita.divisa a.cifra:hover,.tessera-partita.divisa a.cifra:focus-visible{ text-decoration:underline; text-decoration-thickness:3px; text-underline-offset:4px }
.tessera-partita.divisa a.ora-tp{ color:var(--inchiostro); text-decoration:none; min-height:44px; display:flex; align-items:center }
.tessera-partita.divisa a.ora-tp:hover{ text-decoration:underline; text-underline-offset:4px }
.tessera-partita.divisa .lato.perde b{ color:var(--grigio) }
/* la bandiera delle nazioni (B.4: «la bandiera per le nazionali») al posto dello stemma */
.bandiera{ display:inline-flex; align-items:center; justify-content:center; flex:none; line-height:1 }
.lato .bandiera,.sq-cl .bandiera{ width:32px; height:32px; font-size:var(--c-titoletto) }
.pp-lato .sq-cl .bandiera,.pp-tb .sq-cl .bandiera{ width:22px; height:22px; font-size:var(--c-evidenza) }
.bandiera img{ height:.8em; width:auto; margin:0 !important; border:1px solid var(--filetto) }
/* ★ 07/10 sera: l'immagine di flags/ nel testo è alta quanto una lettera; nei riquadri delle squadre riempie il suo quadrato */
.lato .bandiera img,.sq-cl .bandiera img{ width:100%; height:auto; max-height:100%; object-fit:contain }
.bandiera{ margin-right:.2em }
.bandiera.iniz{ border:1px solid var(--filetto); font:700 var(--c-nota) var(--f-titolo); color:var(--grigio) }
.pp-sq-t .bandiera{ margin-right:.25em }
/* «La stagione» e «Nella storia» dentro il blocco apribile: sul computer niente riga del tocco, la sezione col suo titolo */
.pp-sez > .sezione,.pp-sez > .pp-fascia-storia{ margin-top:56px }
@media (max-width:760px){
  .pp-sez > .sezione,.pp-sez > .pp-fascia-storia{ margin-top:0 }
  .pp-sez .sezione > header{ display:none }
  .pp-sez .sezione{ border-top:0; padding-top:0; margin-top:0 }
  .pp-sez .pp-accadde{ border-top:2px solid var(--inchiostro); padding-top:14px; margin-top:24px }
  .pp-sez .pp-accadde > header{ display:flex }
}
/* «Tutti i marcatori»: la lista intera nella stessa pagina, chiusa */
.pp-tutti{ margin-top:10px }
/* ★ 07/10/2026 sera (collaudo: «Tutti i marcatori» allargava la pagina a 1.368 px su 1.366, e a 904 su 900): la tabella dei
     marcatori sta nella sua colonna; i nomi si adattano (compatta), le cifre hanno la loro misura */
.pp-mk{ table-layout:fixed; width:100% }
.pp-mk th:first-child,.pp-mk td:first-child{ width:2.2em }
.pp-mk th:nth-child(n+4),.pp-mk td:nth-child(n+4){ width:3.4em }
.pp-mk td.sq,.pp-mk td.sq a{ overflow-wrap:normal; min-width:0 }
/* ★ 13/10/2026 (testi che si sovrappongono): «Guðmundsson» usciva dalla sua cella e finiva sopra lo stemma della squadra.
     Il nome del marcatore passa dalla compatta() del guscio (data-adatta) ma qui continua ad andare a capo FRA le parole
     al suo corpo, come prima (white-space:normal vince sul «nowrap» che compatta() scrive): così si stringe solo quando
     UNA parola da sola non entra nella cella, e solo quel nome. «PRES.» usciva di 3 px dalla colonna: le tre colonne
     delle cifre prendono la misura dell'etichetta più lunga. */
.pp-mk td.sq > [data-adatta]{ display:block; min-width:0; white-space:normal !important }
.pp-mk th{ letter-spacing:.04em }
.pp-mk th:nth-child(n+6),.pp-mk td:nth-child(n+6){ width:3.9em }
/* le tabelle strette della colonna di destra: la freccia dell'ordinamento (js/ndc-ordina-colonne.js, th.ndc-ord::after) sta
     SOTTO l'etichetta, così non le toglie larghezza («RETI ↕RIG. ↕PRES.» si sovrapponevano in una colonna da 416 px) */
.pp-lato th.ndc-ord{ vertical-align:bottom }
.pp-lato th.ndc-ord::after{ display:block; margin:0; line-height:1 }
/* ═══ 13/10/2026 — IL MENU «GIORNATA» (Fabio: «se voglio vedere una specifica giornata non posso»): sotto i due turni, solo per
     Serie A e Serie B (.pp-colonne.con-giornate). Sul computer sta sotto le colonne dei turni e la classifica gli scorre accanto
     (la terza colonna prende le due righe); sotto i 1100 px è una riga intera fra i turni e la classifica; sul telefono è una
     riga della colonna come le altre, col menu largo quanto lo schermo: niente scorrimento laterale. ═══ */
.pp-giornate{ min-width:0; display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; align-self:start; margin-top:26px; padding-top:10px; border-top:4px solid var(--inchiostro) }
.pp-g-et{ display:grid; gap:2px; min-width:0 }
.pp-g-et b{ font:700 var(--c-nota)/1.3 var(--f-cifre); letter-spacing:.12em; text-transform:uppercase }
.pp-g-et small{ font:600 var(--c-etichetta)/1.3 var(--f-cifre); letter-spacing:.06em; text-transform:uppercase; color:var(--grigio) }
.pp-giornate select{ flex:0 1 340px; min-width:0; max-width:100%; height:48px; padding:0 10px; font:600 var(--c-evidenza) var(--f-testo); border:2px solid var(--inchiostro); background:var(--carta); color:var(--inchiostro); cursor:pointer }
.pp-giornate select:disabled{ border-color:var(--filetto); color:var(--grigio); cursor:default }
.pp-g-tutte{ color:var(--inchiostro); font-weight:600; font-size:var(--c-testo) }
@media (min-width:1101px){
  .pp-colonne.con-giornate{ grid-template-rows:auto 1fr }
  .pp-colonne.con-giornate > .pp-giornate{ grid-column:1 / span 2; grid-row:2; margin-right:22px }
  .pp-colonne.con-giornate > .pp-lato{ grid-column:3; grid-row:1 / span 2 }
}
@media (max-width:1100px){ .pp-giornate{ grid-column:1/-1; margin-bottom:24px } }
@media (max-width:760px){
  .pp-giornate{ margin:0; padding:14px 0; border-top:0; border-bottom:1px solid var(--filetto); gap:10px }
  .pp-g-et b{ font:700 var(--c-titoletto)/1.1 var(--f-titolo); letter-spacing:.02em }
  .pp-giornate select{ flex:1 1 100%; width:100% }
}