/*
 * Reset condiviso canonico (REGOLE CSS/css-reset.css).
 *
 * Neutro per design: tipografia, colori e stile dei componenti
 * vivono nei layer token e componente, non qui.
 * Non modificare per esigenze di progetto: le personalizzazioni
 * vanno in main.css.
 */

 #wpadminbar {top:auto; bottom:0;}

/* WP riserva comunque lo spazio in cima per la barra (_admin_bar_bump_cb,
   stampato via wp_head DOPO i nostri CSS: "html { margin-top: 32px
   !important; }" su <html> nudo, non su una classe) anche se la barra
   vera sta in basso: senza questa riga resta una striscia vuota color
   --color-surface sopra il primo blocco, visibile solo per chi e'
   loggato. Stessa specificita' del selettore di WP + stesso !important:
   arrivando prima nell'head perderemmo per ordine, quindi serve
   ":root" per salire di specificita' (0,1,1 contro 0,0,1) invece di
   contare sull'ordine di stampa. */
html:root {margin-top: 0 !important;}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

:root {
  /* Interlinea — valori dal Figma (text styles).
     Il Figma usa line-height 100% (= ratio 1) per TITOLI e UI, e
     1.5 solo per il testo di lettura a 24px. Qui:
       --leading-tight  titoli/UI. Il Figma dice 1.0 netto; usiamo
                        1.05 così gli accenti maiuscoli (È À) di
                        Geist non vengono tagliati in cima.
       --leading-text   testo di lettura (--body). = 36/24 del Figma.
       --leading-prose  occhielli editoriali con font grande (--h3/
                        --h4 ma testo di più righe): un filo d'aria. */
  --leading-tight: 1.05;
  --leading-text: 1.5;
  --leading-prose: 1.1;
}

body {
  min-block-size: 100vh;
  min-block-size: 100dvh;
  margin: 0;

  /* Testo di lettura: ratio 1.5 come "TESTI DESK 24px" del Figma.
     Ereditato da tutti i discendenti; i titoli lo ridefiniscono. */
  line-height: var(--leading-text);
}

:target {
  scroll-margin-block: 5ex;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
  overflow-wrap: break-word;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  text-wrap: balance;

  /* Titoli: ratio ~1 come nel Figma. Batte l'ereditarieta' da body
     per specificita' (0,0,1 vs 0,0,0), senza !important. */
  line-height: var(--leading-tight);
}

/* Elementi dentro un titolo (span, em, br...) seguono il titolo. */
:is(h1, h2, h3, h4, h5, h6) * {
  line-height: var(--leading-tight);
}

/* Titoli e paragrafi senza margine di default: lo spazio verticale
   lo decidono i componenti. Il ritmo del contenuto editoriale
   (the_content) si riattiva in un wrapper dedicato lato progetto,
   es. .entry-content > * + *. */
h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin-block: 0;
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-inline-size: 100%;
}

img,
picture,
video {
  block-size: auto;
}

input,
button,
textarea,
select {
  color: inherit;
  font: inherit;
}

button,
select,
summary,
[role="button"],
[type="button"],
[type="reset"],
[type="submit"],
[type="checkbox"],
[type="radio"] {
  cursor: pointer;
}

:disabled {
  cursor: not-allowed;
}

textarea:not([rows]) {
  min-block-size: 10em;
}

:focus-visible {
  outline: 2px solid var(--color-focus, currentColor);
  outline-offset: 3px;
}

main {
  isolation: isolate;
}

[hidden] {
  display: none !important;
}

@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
