/*
Theme Name: Paghera
Description: Tema a blocchi per paghera.com. Foto protagoniste, lusso sobrio.
Version: 0.1.0
Requires at least: 6.5
Requires PHP: 8.1
Text Domain: paghera
*/
.eyebrow{font-size:.6875rem;letter-spacing:.22em;text-transform:uppercase;color:var(--wp--preset--color--ottone);font-weight:500}
.wp-block-post-title a{text-decoration:none;color:inherit}
.wp-block-post-featured-image img{display:block}
/* Blocchi a tutta larghezza: calcolo diretto, senza margini negativi che
   sommandosi facevano uscire il contenuto dallo schermo sui telefoni. */
html{overflow-x:clip}
body{overflow-x:clip;max-width:100%}
.wp-site-blocks .alignfull{
  width:100vw;max-width:100vw;
  margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
}
.wp-block-cover__inner-container{max-width:100%;margin-inline:auto}

/* WordPress mette 24px di stacco fra testata e contenuto: si vedeva come una
   striscia chiara sopra le foto a tutta larghezza. Si toglie solo li'. */
.wp-site-blocks > main:has(> .sezione-hero:first-child),
.wp-site-blocks > main:has(> :first-child > .wp-block-cover:first-child),
.wp-site-blocks > main:has(> :first-child > .sezione-hero:first-child){margin-block-start:0}
.wp-site-blocks > header.wp-block-template-part + .alignfull{margin-block-start:0}

/* Bottoni e collegamenti del sito: servono ovunque, non solo nelle sezioni. */
.paghera-bottone,.paghera-link{touch-action:manipulation}
button.paghera-bottone{border:0;cursor:pointer;font-family:inherit}
.paghera-bottone{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 1.75rem;background:var(--wp--preset--color--verde);color:#fff;text-decoration:none;font-size:.8125rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase}
.paghera-bottone:hover{background:var(--wp--preset--color--inchiostro);color:#fff}
.paghera-link{display:inline-flex;align-items:center;min-height:48px;font-size:.8125rem;letter-spacing:.14em;text-transform:uppercase;border-bottom:1px solid var(--wp--preset--color--ottone);text-decoration:none}

img,video,iframe{max-width:100%;height:auto}

/* Home: fotografia della sede accanto al manifesto, fascia scura dei contatti, partner. */
.foto-sede{margin:0;aspect-ratio:4/3;overflow:hidden;background:var(--wp--preset--color--pietra-scura)}
.foto-sede img{width:100%;height:100%;object-fit:cover;display:block}
.foto-sede--video{position:relative;aspect-ratio:16/9}
.foto-sede video{width:100%;height:100%;object-fit:cover;display:block}
.foto-sede__intero{position:absolute;inset-inline-start:1rem;inset-block-end:1rem;padding:.6rem 1rem;border:1px solid rgba(247,246,241,.6);border-radius:2px;background:rgba(21,32,26,.62);color:#F7F6F1;font:500 .75rem/1 var(--wp--preset--font-family--jost);letter-spacing:.06em;cursor:pointer;transition:background-color .3s}
.foto-sede__intero:hover,.foto-sede__intero:focus-visible{background:rgba(21,32,26,.85)}
.foto-sede__intero:focus-visible{outline:2px solid var(--wp--preset--color--ottone-chiaro);outline-offset:3px}
.fascia-contatti .wp-block-column{min-width:0}
.recapiti-fascia{display:grid;grid-template-columns:1fr;gap:1.25rem;margin:0;padding-left:2.5rem;border-left:1px solid rgba(247,246,241,.18);color:#F7F6F1}
.recapiti-fascia dt{font-size:.6875rem;letter-spacing:.2em;text-transform:uppercase;color:#D9C28F;margin:0 0 .25rem}
.recapiti-fascia dd{margin:0;line-height:1.5}
.recapiti-fascia a{color:#F7F6F1;text-decoration:none;border-bottom:1px solid rgba(247,246,241,.35)}
.recapiti-fascia a:hover{color:#D9C28F;border-color:#D9C28F}
.partner{border-top:1px solid var(--wp--preset--color--linea)}
.partner__logo{margin:0 0 1.25rem;line-height:0}
.partner__logo img{width:min(240px,60vw);height:auto;display:block}
.partner__foto{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:.875rem;height:100%}
.partner__foto figure{margin:0;overflow:hidden;background:var(--wp--preset--color--pietra-scura)}
.partner__foto figure:first-child{grid-row:1/3}
.partner__foto img{width:100%;height:100%;object-fit:cover;display:block;aspect-ratio:1/1}
.partner__foto figure:first-child img{aspect-ratio:4/5}
@media (max-width:820px){
  .recapiti-fascia{padding-left:0;border-left:0;border-top:1px solid rgba(247,246,241,.18);padding-top:1.5rem;grid-template-columns:repeat(2,minmax(0,1fr))}
  .partner__foto{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .partner__foto figure:first-child{grid-row:auto;grid-column:1/3}
  .partner__foto figure:first-child img{aspect-ratio:16/10}
}

/* Fotografie in fondo alle pagine istituzionali e alle notizie. */
.pagina-foto{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.875rem}
.pagina-foto figure{margin:0;aspect-ratio:4/3;overflow:hidden;background:var(--wp--preset--color--pietra-scura)}
.pagina-foto img{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:820px){.pagina-foto{grid-template-columns:repeat(2,minmax(0,1fr));gap:.625rem}}

/* Punti di forza a tre colonne: usata nelle landing di campagna. */
.punti-forza{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem;margin-top:2rem}
.punti-forza h3{font-family:var(--wp--preset--font-family--cormorant);font-size:1.375rem;font-weight:400;margin:0 0 .5rem}
.punti-forza p{margin:0;font-size:.9375rem;color:var(--wp--preset--color--muto)}
@media (max-width:700px){.punti-forza{grid-template-columns:1fr;gap:1.5rem}}

/* Domande frequenti nelle landing di campagna: stesso aspetto di sezione-faq__voce
   (in sezione.css, che li' non carica), scopato sotto .domande. */
.domande{margin-top:1rem}
.domande .sezione-faq__voce{border-top:1px solid var(--wp--preset--color--linea)}
.domande .sezione-faq__voce:last-child{border-bottom:1px solid var(--wp--preset--color--linea)}
.domande .sezione-faq__voce summary{font-family:var(--wp--preset--font-family--cormorant);font-size:1.375rem;line-height:1.25;padding:1.125rem 2.5rem 1.125rem 0;cursor:pointer;list-style:none;position:relative;min-height:48px;display:flex;align-items:center}
.domande .sezione-faq__voce summary::-webkit-details-marker{display:none}
.domande .sezione-faq__voce summary::after{content:"";position:absolute;right:.5rem;top:50%;width:14px;height:14px;margin-top:-7px;background:linear-gradient(var(--wp--preset--color--ottone),var(--wp--preset--color--ottone)) center/14px 1px no-repeat,linear-gradient(var(--wp--preset--color--ottone),var(--wp--preset--color--ottone)) center/1px 14px no-repeat;transition:transform .2s}
.domande .sezione-faq__voce[open] summary::after{transform:rotate(45deg)}
.domande .sezione-faq__voce summary:focus-visible{outline:2px solid var(--wp--preset--color--verde);outline-offset:2px}
.domande .sezione-faq__risposta{color:var(--wp--preset--color--muto);padding-bottom:1.25rem;max-width:62ch}
.domande .sezione-faq__risposta p{margin:0 0 .75rem}
@media (max-width:700px){.domande .sezione-faq__voce summary{font-size:1.125rem}}
@media (prefers-reduced-motion:reduce){.domande .sezione-faq__voce summary::after{transition:none}}

/* Griglie di rimandi (Azienda, Come lavoriamo) e blocchi dei contatti.
   .indice* è definita in assets/pagina.css: la riusano anche i correlati. */
.contatti-blocchi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem;margin-top:2rem}
.contatti-blocco h3{font-family:var(--wp--preset--font-family--cormorant);font-size:1.375rem;font-weight:400;margin:0 0 .5rem}
.contatti-blocco p{margin:0 0 .5rem;font-size:.9375rem;color:var(--wp--preset--color--muto)}
.contatti-blocco a{color:var(--wp--preset--color--verde)}
@media (max-width:1000px){.contatti-blocchi{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.contatti-blocchi{grid-template-columns:1fr}}
.testa-fascia{padding:1.5rem 4vw;border-bottom:1px solid var(--wp--preset--color--linea)}
.testa-fascia .wp-block-site-logo{line-height:0}
.testa-fascia .wp-block-site-logo img{display:block;width:190px;height:auto}
@media (max-width:600px){.testa-fascia .wp-block-site-logo img{width:150px}}
.piede-fascia{background:var(--wp--preset--color--inchiostro);color:#F7F6F1;padding:4.5rem 4vw 3rem}
/* fra la fascia di chiusura e il piede restava la distanza fra blocchi di
   WordPress: una striscia chiara fra due fasce scure, che sembra un errore.
   Si attaccano, con una riga sottile a dividerle. */
.wp-site-blocks > footer{margin-block-start:0}
.fascia-cta + .piede-fascia,.fascia-contatti + .piede-fascia{border-block-start:1px solid rgba(247,246,241,.14)}
.piede-fascia a{color:inherit}
@media (max-width:820px){
  .wp-block-columns{gap:1.5rem}
  .wp-block-cover{min-height:440px!important}
}