/* Correzioni e miglioramenti del 27/10/2026.
   Da riportare nel sorgente Astro (BaseLayout) alla prossima build. */

/* 1. Barra mobile: non deve mai essere più larga dello schermo */
@media (width<=680px){
  .mobile-nav{max-width:calc(100% - 1rem);gap:.2rem}
  .mobile-nav .mobile-nav-button,.mobile-nav .nav-logo{flex:0 1 2.65rem;min-width:0}
}

/* 2. Loghi */
/* Sole 24 ORE Formazione è già chiaro su scuro: niente filtro, solo un bordo leggero */
:root[data-theme=dark] .org-logo[src*=sole-24-ore]{filter:none!important;border-radius:50%;box-shadow:0 0 0 1px #ffffff2e}
/* Fascia loghi in home */
.se-logos-section .logo-strip{display:grid;grid-template-columns:repeat(3,1fr);justify-items:center;align-items:center;gap:1.4rem 1.6rem;padding:1.6rem 1.4rem}
.se-logos-section .logo-strip p{grid-column:1/-1}
@media (width>=1100px){.se-logos-section .logo-strip{grid-template-columns:repeat(6,1fr)}}
.se-logos-section .logo-strip p{color:var(--muted);font-size:.9rem;line-height:1.55;text-align:center;margin:.4rem 0 0}
.se-logos-section .org-logo{height:2.3rem;max-width:9.5rem;object-fit:contain;opacity:.82;transition:opacity .2s,transform .2s}
.se-logos-section .org-logo[src*=sole-24-ore],.se-logos-section .org-logo[src*=edulia],.se-logos-section .org-logo[src*=comune-casalromano]{height:2.9rem}
.se-logos-section .org-logo[src*=cna-mantova],.se-logos-section .org-logo[src*=universita-pegaso]{height:2rem}
@media (hover:hover){.se-logos-section .org-logo:hover{opacity:1;transform:translateY(-2px)}}
@media (prefers-reduced-motion:no-preference){
  .js .se-logos-section .org-logo{opacity:0;transform:translateY(10px);transition:opacity .5s cubic-bezier(.2,.7,.2,1) var(--se-d,0s),transform .5s cubic-bezier(.2,.7,.2,1) var(--se-d,0s)}
  .js .se-logos-section.se-in .org-logo{opacity:.82;transform:none}
}

/* 3. Pulsante "Contattami" della home nel tema chiaro (prima aveva colori fissi) */
:root[data-theme=light] .hero-actions .button.primary{color:var(--bg);background:var(--text);border-color:var(--text)}

/* 4. Contenuti di terze parti caricati solo al clic (Spotify, mappa) */
.se-gate{border:1px dashed var(--line);background:var(--surface);color:var(--text);border-radius:1rem;flex-direction:column;justify-content:center;align-items:flex-start;gap:.8rem;min-height:220px;padding:1.4rem;display:flex}
.playlist-card .se-gate{min-height:420px}
.route-map .se-gate{border:0;border-radius:0;align-items:center;text-align:center;height:100%}
.se-gate p{color:var(--muted);max-width:34rem;margin:0;font-size:.92rem;line-height:1.55}
.se-gate .button{cursor:pointer}

/* 5. Lightbox: contatore, didascalia, comparsa dell'immagine */
.lightbox{grid-template-rows:1fr auto;padding:3.6rem 1rem 1rem}
.lightbox img{max-height:calc(100vh - 7.5rem)}
.lightbox .se-lb-bar{color:#f4f4f2;text-align:center;font-size:.92rem;line-height:1.45;max-width:min(92vw,52rem);margin:.8rem auto 0}
.lightbox .se-lb-count{color:#ffffffa6;font-variant-numeric:tabular-nums;margin-right:.6rem}
.lightbox button:focus-visible{outline:2px solid #fff;outline-offset:2px}
[data-lightbox]:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
@media (prefers-reduced-motion:no-preference){
  .lightbox:not([hidden]){animation:se-fade .2s ease-out}
  .lightbox img.se-lb-in{animation:se-zoom .28s cubic-bezier(.2,.7,.2,1)}
}
@keyframes se-fade{from{opacity:0}}
@keyframes se-zoom{from{opacity:0;transform:scale(.97)}}

/* 6. Carosello: frecce disattivate agli estremi, focus visibile */
.carousel-btn[disabled]{opacity:0;pointer-events:none}
.carousel-btn{transition:opacity .2s}
.carousel-track:focus-visible{outline:2px solid var(--blue);outline-offset:3px}

/* 7. Cambio tema: rivelazione circolare dal pulsante (solo durante il cambio) */
html.se-theme-switch::view-transition-old(root),html.se-theme-switch::view-transition-new(root){mix-blend-mode:normal;animation:none}
html.se-theme-switch::view-transition-new(root){animation:se-reveal .55s cubic-bezier(.2,.7,.2,1)}
@keyframes se-reveal{from{clip-path:circle(0 at var(--se-x,50%) var(--se-y,0))}to{clip-path:circle(150% at var(--se-x,50%) var(--se-y,0))}}

/* 8. Stampa e PDF: tutto visibile, niente navigazione, colori da carta */
@media print{
  :root,:root[data-theme]{--bg:#fff;--surface:#fff;--surface-strong:#f1f1f1;--text:#111;--muted:#444;--line:#d4d4d4;--icon-filter:none;--shadow:none}
  html,body{background:#fff!important;color:#111!important}
  [data-reveal],.js [data-reveal]:not(.is-in){opacity:1!important;transform:none!important;transition:none!important}
  .page-intro>*,.hero-heading>*,.post-header>*,.about-hero>*{animation:none!important;opacity:1!important;transform:none!important}
  .skip-link,.desktop-nav,.mobile-nav,.read-progress,.lightbox,.carousel-btn,[data-theme-toggle],.se-gate,.playlist-embed,.route-map,.site-footer .social-links,.hero-actions .social-links{display:none!important}
  :root[data-theme=dark] .org-logo{filter:none!important}
  .cv-item,.cert-item,figure,.gallery-item,.polaroid,.value-card,.venture-card{break-inside:avoid}
  .carousel-track{overflow:visible!important;flex-wrap:wrap}
  .carousel-track figure{flex:1 1 30%}
  a{color:inherit;text-decoration:underline}
  img{max-width:100%!important}
}

/* 9. Conferma d'invio anche senza JavaScript (contatto.php rimanda a #inviato-…) */
.se-sent{display:none}
.se-sent:target{display:block}

/* 10. Movimento ridotto: nessuna animazione continua */
@media (prefers-reduced-motion:reduce){
  *,::before,::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .pixel-hero.hero-logo{animation:none!important}
}

/* 11. Ancore: il titolo non finisce sotto la barra, breve segnale d'arrivo */
main [id]{scroll-margin-top:2rem}
@media (width<=1080px){main [id]{scroll-margin-top:5.5rem}}
@media (prefers-reduced-motion:no-preference){
  :is(.area,.hobby,.post-press,.cv-item):target{position:relative}
  :is(.area,.hobby,.post-press,.cv-item):target::before{content:"";border:2px solid var(--blue);border-radius:1.1rem;opacity:0;pointer-events:none;animation:se-target 1.8s ease-out .45s both;position:absolute;inset:-.6rem}
}
@keyframes se-target{25%,55%{opacity:.55}to{opacity:0}}

/* 12. Form: invio in corso, conferma, campi da correggere */
.contact-form [type=submit][disabled]{cursor:progress;opacity:.85}
.contact-form [type=submit][disabled] .arr-icon{display:none}
.contact-form [type=submit][disabled]::after{content:"";border:2px solid currentColor;border-right-color:#0000;border-radius:50%;width:.9em;height:.9em;margin-left:.5rem;animation:se-spin .7s linear infinite;display:inline-block}
@keyframes se-spin{to{transform:rotate(1turn)}}
.form-status.ok::before{content:"✓ "}
@media (prefers-reduced-motion:no-preference){.form-status.se-shown{animation:se-status .24s cubic-bezier(.2,.7,.2,1) both}}
@keyframes se-status{from{opacity:0;transform:translateY(-4px)}}
.contact-form :is(input,select,textarea):user-invalid{border-color:#d84a3f;box-shadow:0 0 0 3px color-mix(in srgb,#d84a3f 18%,transparent)}

/* 13. Copia indirizzo email (pagina Contatti) */
.contact-card .se-copy{grid-column:1/-1;justify-self:start;cursor:pointer;color:#17181c;background:#ffffff8c;border:1px solid #17181c26;border-radius:999px;margin:-.8rem 0 1rem;padding:.35rem .8rem;font-size:.85rem;transition:background-color .2s,color .2s}
.contact-card .se-copy:hover{background:#ffffffd9}
.contact-card .se-copy.copied{color:#fff;background:#17181c}

/* 14. Focus da tastiera visibile su card e foto cliccabili */
:is(.post-banner,.note-home-card,.venture-card,.gallery-item,.press-media):focus-visible{outline:2px solid var(--blue);outline-offset:3px}
@media print{.se-copy{display:none!important}}

/* 15. Progetto in evidenza con immagine (Marea, pagina Lavoro) */
.se-feature{border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:1.5rem;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center;gap:1.6rem;margin-top:1rem;padding:1rem;text-decoration:none;display:grid;overflow:hidden}
.se-feature img{aspect-ratio:16/9;object-fit:cover;border-radius:1rem;width:100%;height:auto;display:block}
.se-feature>div{padding:.6rem .6rem .6rem 0}
.se-feature>div>span{color:var(--muted);font-size:.78rem;font-weight:800}
.se-feature h3{margin:1.4rem 0 .8rem;font-family:Instrument Serif,Georgia,serif;font-size:2.2rem;font-weight:400;line-height:1.05}
.se-feature p{color:var(--muted);margin:0 0 .6rem;font-size:.94rem}
.se-feature .se-feature-cta{color:var(--text);font-weight:600;margin:1rem 0 0}
.se-feature .arr-icon{width:.9em;height:.9em;vertical-align:-.1em}
.se-feature:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
@media (hover:hover) and (prefers-reduced-motion:no-preference){.se-feature img{transition:transform .4s}.se-feature:hover img{transform:scale(1.02)}}
@media (hover:hover){.se-feature:hover{border-color:color-mix(in srgb,var(--text) 28%,transparent)}}
@media (width<=760px){.se-feature{grid-template-columns:1fr}.se-feature>div{padding:0 .4rem .6rem}}

/* 16. Firma degli articoli: autore visibile nel testo, non solo nei metadati */
.se-byline{color:var(--muted);margin:1.2rem 0 0;font-size:.95rem;line-height:1.5}
.se-byline a{color:inherit;text-decoration:underline;text-underline-offset:3px}
/* territorio: titoli delle schede da h3 a h2, stesso aspetto */
.hobby-copy h2{letter-spacing:-.02em;margin:0 0 .7rem;font-family:Instrument Serif,Georgia,serif;font-size:clamp(1.8rem,3vw,2.4rem);font-weight:400;line-height:1.05}
