/*
Theme Name: Sunya
Theme URI: https://dadesign.it
Author: Davide Arduini
Author URI: https://dadesign.it
Description: Tema WordPress custom leggero e modulare. Nessun page builder, nessuna dipendenza. Puro codice, massime performance.
Version: 1.11.2
Requires at least: 6.0
Tested up to: 7.1
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sunya
Domain Path: /languages
Tags: custom-menu, custom-logo, featured-images, footer-widgets, translation-ready, accessibility-ready, custom-colors, custom-background
*/

/* ==========================================================================
   SUNYA THEME - Core Stylesheet
   
   Struttura CSS modulare:
   - style.css         → Reset + Base + Variabili + Layout
   - css/header.css    → Header e navigazione
   - css/footer.css    → Footer e widget
   - css/buttons.css   → Pulsanti e animazioni
   - css/cards.css     → Card e animazioni
   - css/forms.css     → Form e input
   
   Ogni foglio viene caricato condizionalmente dal suo modulo PHP.
   ========================================================================== */


/* --------------------------------------------------------------------------
   CSS Custom Properties (Variabili)
   I valori di default vengono sovrascritti dal Customizer via wp_add_inline_style
   -------------------------------------------------------------------------- */

:root {

    /* --- Colori principali --- */
    --sunya-color-primary: #1a1a2e;
    --sunya-color-secondary: #16213e;
    --sunya-color-accent: #e94560;
    --sunya-color-accent-rgb: 233, 69, 96;
    --sunya-color-accent-hover: #c73a52;
    --sunya-color-text: #2d2d2d;
    --sunya-color-text-light: #6b7280;
    --sunya-color-bg: #ffffff;
    --sunya-color-bg-alt: #f8f9fa;
    --sunya-color-border: #e5e7eb;

    /* --- Tipografia --- */
    --sunya-font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    --sunya-font-heading: var(--sunya-font-body);
    --sunya-font-size-base: 1rem;
    --sunya-font-size-sm: 0.875rem;
    --sunya-font-size-lg: 1.125rem;
    --sunya-font-size-xl: 1.25rem;
    --sunya-font-size-2xl: 1.5rem;
    --sunya-font-size-3xl: 1.875rem;
    --sunya-font-size-4xl: 2.25rem;
    --sunya-line-height-base: 1.6;
    --sunya-line-height-heading: 1.2;
    --sunya-font-weight-normal: 400;
    --sunya-font-weight-medium: 500;
    --sunya-font-weight-bold: 700;

    /* --- Spacing --- */
    --sunya-spacing-xs: 0.25rem;
    --sunya-spacing-sm: 0.5rem;
    --sunya-spacing-md: 1rem;
    --sunya-spacing-lg: 1.5rem;
    --sunya-spacing-xl: 2rem;
    --sunya-spacing-2xl: 3rem;
    --sunya-spacing-3xl: 4rem;
    --sunya-spacing-section: 5rem;

    /* --- Layout --- */
    --sunya-container-width: 1200px;
    --sunya-wide-width: 1400px;
    --sunya-content-width: 800px;
    --sunya-container-padding: 1.5rem;

    /* v1.10.3 — Gutter del CONTENUTO di pagina.
       --sunya-container-padding governa .sunya-container, cioe' header,
       footer, pre-footer e barra breadcrumb: alzarlo li sposterebbe tutti.
       Questo token vale solo per il contenuto e si alza da solo sotto i
       768px, dove 1rem e' risultato troppo stretto (misurato su dadesign
       il 10 e il 12/08/2026, e su kinesis il 27/08). */
    --sunya-content-gutter: var(--sunya-container-padding);

    --sunya-sidebar-width: 300px;

    /* --- Border radius --- */
    --sunya-radius-sm: 4px;
    --sunya-radius-md: 8px;
    --sunya-radius-lg: 12px;
    --sunya-radius-full: 9999px;

    /* --- Shadows --- */
    --sunya-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --sunya-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.07);
    --sunya-shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
    --sunya-shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.1);

    /* --- Transizioni --- */
    --sunya-transition-fast: 150ms ease;
    --sunya-transition-base: 250ms ease;
    --sunya-transition-slow: 400ms ease;
    --sunya-transition-smooth: 300ms cubic-bezier(0.4, 0, 0.2, 1);
}


/* --------------------------------------------------------------------------
   Reset & Box Model
   -------------------------------------------------------------------------- */

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

html {
    font-size: 100%;
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    font-family: var(--sunya-font-body);
    font-size: var(--sunya-font-size-base);
    font-weight: var(--sunya-font-weight-normal);
    line-height: var(--sunya-line-height-base);
    color: var(--sunya-color-text);
    background-color: var(--sunya-color-bg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: clip;
    font-synthesis: none;
}


/* --------------------------------------------------------------------------
   Tipografia base
   -------------------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 {
    font-family: var(--sunya-font-heading);
    font-weight: var(--sunya-font-weight-bold);
    line-height: var(--sunya-line-height-heading);
    /* v1.5.2: era --sunya-color-primary (legacy, sempre scuro): i titoli
       non seguivano la modalita' base e restavano scuri su fondo scuro.
       --sunya-color-heading e' emesso dal Customizer a partire dal testo
       della modalita' attiva. */
    color: var(--sunya-color-heading, var(--sunya-color-primary));
    margin-bottom: var(--sunya-spacing-md);
    letter-spacing: var(--sunya-heading-letter-spacing, normal);
}

h1 { font-size: var(--sunya-font-size-4xl); }
h2 { font-size: var(--sunya-font-size-3xl); }
h3 { font-size: var(--sunya-font-size-2xl); }
h4 { font-size: var(--sunya-font-size-xl); }
h5 { font-size: var(--sunya-font-size-lg); }
h6 { font-size: var(--sunya-font-size-base); }

p {
    margin-bottom: var(--sunya-spacing-md);
}

p:last-child {
    margin-bottom: 0;
}

/* v1.9.4 (D3-A): il link e' un inchiostro sulla carta di pagina, non un
   riempimento — legge --sunya-color-link (mode-aware, emesso dal
   Customizer) e ricade sull'accent solo dove il token non esiste:
   il :root del parent NON lo definisce, quindi su un impianto non
   configurato questa catena e' un no-op (identico a prima).
   Stessa catena per l'outline di focus: e' un tratto sulla carta,
   accent nudo su carta chiara e' 1.23. */
a {
    color: var(--sunya-color-link, var(--sunya-color-accent));
    text-decoration: none;
    transition: color var(--sunya-transition-fast);
}

a:hover,
a:focus-visible {
    color: var(--sunya-color-link-hover, var(--sunya-color-accent-hover));
}

a:focus-visible {
    outline: 2px solid var(--sunya-color-link, var(--sunya-color-accent));
    outline-offset: 2px;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

ul, ol {
    padding-left: var(--sunya-spacing-xl);
    margin-bottom: var(--sunya-spacing-md);
}

blockquote {
    margin: var(--sunya-spacing-lg) 0;
}


/* --------------------------------------------------------------------------
   Contrasto automatico: elementi con sfondo proprio

   Qualsiasi elemento che dichiara un background-color esplicito (tramite
   classe Gutenberg .has-background, o blocchi core con sfondo) deve avere
   un colore del testo esplicito — altrimenti lo eredita dal contesto
   (Cover block, Group con sfondo scuro, sezioni hero, ecc.).

   La pseudo-classe :where() ha specificità 0: non sovrascrive mai una
   regola con selettore normale, né i colori impostati dall'utente
   tramite .has-text-color nell'editor.
   -------------------------------------------------------------------------- */

/* Contrasto automatico: colore scuro solo su sfondi chiari.
   Esclude classi scure Gutenberg per non forzare testo scuro su sfondo scuro. */
:where(
    .has-background:not([class*="has-black"]):not([class*="has-dark"]):not([class*="has-contrast"]):not([class*="has-midnight"]):not([class*="has-deep"]),
    .wp-block-group.has-background:not([class*="has-black"]):not([class*="has-dark"]):not([class*="has-contrast"])
):not(.has-text-color) {
    color: var(--sunya-color-primary);
}

/* Cover is-light con immagine scura: WP imposta testo nero via :where() —
   forziamo bianco con selettori normali (specificità > 0). */
.wp-block-cover.is-light:not(.has-text-color) h1,
.wp-block-cover.is-light:not(.has-text-color) h2,
.wp-block-cover.is-light:not(.has-text-color) h3,
.wp-block-cover.is-light:not(.has-text-color) h4,
.wp-block-cover.is-light:not(.has-text-color) h5,
.wp-block-cover.is-light:not(.has-text-color) h6,
.wp-block-cover.is-light:not(.has-text-color) p {
    color: #ffffff;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
}

/* Citazione dentro Cover: bianco su overlay scuro */
.wp-block-cover .wp-block-quote:not(.has-text-color),
.wp-block-cover .wp-block-pullquote:not(.has-text-color) {
    color: #ffffff;
}

.wp-block-cover .wp-block-quote:not(.has-text-color) cite,
.wp-block-cover .wp-block-pullquote:not(.has-text-color) cite {
    color: rgba(255, 255, 255, 0.75);
}

/* WAVE/Lighthouse workaround: questi tool non rilevano background-image
   né overlay rgba come sfondo effettivo. Vedono solo background-color.
   Il color-primary come fallback garantisce contrasto calcolabile.
   L'immagine + overlay si sovrappone comunque: aspetto invariato. */
.wp-block-cover {
    background-color: var(--sunya-color-primary, #1a1a2e);
}

table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: var(--sunya-spacing-lg);
}

th, td {
    padding: var(--sunya-spacing-sm) var(--sunya-spacing-md);
    border-bottom: 1px solid var(--sunya-color-border);
    text-align: left;
}

th {
    font-weight: var(--sunya-font-weight-bold);
    color: var(--sunya-color-primary);
}

code, pre {
    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
    font-size: var(--sunya-font-size-sm);
}

code {
    background-color: var(--sunya-color-bg-alt);
    padding: 0.125em 0.375em;
    border-radius: var(--sunya-radius-sm);
}

pre {
    background-color: var(--sunya-color-bg-alt);
    padding: var(--sunya-spacing-lg);
    border-radius: var(--sunya-radius-md);
    overflow-x: auto;
    margin-bottom: var(--sunya-spacing-lg);
}

pre code {
    background: none;
    padding: 0;
}

hr {
    border: none;
    border-top: 1px solid var(--sunya-color-border);
    margin: var(--sunya-spacing-xl) 0;
}


/* --------------------------------------------------------------------------
   Layout - Container
   -------------------------------------------------------------------------- */

.sunya-container {
    width: 100%;
    max-width: var(--sunya-container-width);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--sunya-container-padding);
    padding-right: var(--sunya-container-padding);
}

.sunya-container--narrow {
    max-width: 800px;
}

.sunya-container--wide {
    max-width: 1400px;
}

.sunya-container--full {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
}


/* --------------------------------------------------------------------------
   Gutenberg Alignments

   WordPress 6.9+ con theme.json genera il layout automaticamente:
   - .is-layout-constrained → max-width da contentSize/wideSize
   - .has-global-padding    → padding body con margin negativi su alignfull
   - useRootPaddingAwareAlignments → WP gestisce padding e full-width

   Queste regole CSS sono FALLBACK per contenuto che non passa
   dal block editor (shortcode, plugin, contenuto classico).
   Quando WP applica is-layout-constrained, le sue regole hanno
   già la specificità corretta e queste non interferiscono.

   Gerarchia delle larghezze:
   - Blocchi normali  → max-width: 1200px  (da theme.json contentSize)
   - .alignwide       → max-width: 1400px  (da theme.json wideSize)
   - .alignfull       → 100% viewport; padding laterale solo se WP marca il
                        blocco con .has-global-padding (vedi sotto)
   -------------------------------------------------------------------------- */

/*
 * Fallback per contenuto NON gestito dal layout engine di WP.
 * Quando WP applica .is-layout-constrained, le sue regole inline
 * (con specificità più alta via .wp-container-*) prevalgono.
 * Usiamo :not() per escludere i blocchi con allineamento esplicito.
 *
 * ⚠️ La catena di :not() sta dentro :where() dalla 1.11.1: senza,
 * il selettore pesa 0,7,0 e nessun child può dare una larghezza al
 * proprio contenitore di pagina senza !important. Con :where() il peso
 * scende a 0,1,0 (solo .sunya-entry-content) e la regola resta un
 * fallback vero: si applica quando nessuno dice altro, cede a chiunque
 * lo dica. Non alzare la specificità e non togliere :where().
 * Le regole .alignwide e .alignfull qui sotto sono 0,2,0 e vincono
 * comunque, come prima.
 */
.sunya-entry-content > :where(:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.sunya-breadcrumb-wrap)) {
    max-width: var(--sunya-container-width, 1200px);
    margin-left: auto;
    margin-right: auto;
}

/* Wide: più largo del contenuto ma non full-viewport */
.sunya-entry-content > .alignwide {
    max-width: var(--sunya-wide-width, 1400px);
    margin-left: auto;
    margin-right: auto;
}

/* Full: tutta la larghezza del viewport, nessun vincolo di larghezza. */
.sunya-entry-content > .alignfull {
    max-width: none;
}

/* Padding laterale delle sezioni full-width.

   Prima della v1.2.9 il tema azzerava il padding di OGNI .alignfull. Il buco
   restava invisibile finche' il blocco portava un padding inline dall'editor
   o una regola per-sezione nel child; senza nessuno dei due, il testo delle
   sezioni con sfondo arrivava a filo schermo (dadesign.it/chi-sono, 2026-08-12).

   WP marca con .has-global-padding i soli container che devono ricevere il
   padding di root: e' esattamente l'insieme giusto. Il markup custom che si
   impagina da solo (.atlas-hero e simili) non ha quella classe e resta a zero.
   Usiamo pero' --sunya-content-gutter (v1.10.3: era --sunya-container-padding)
   e non il root padding di theme.json, perche' il valore deve seguire il tema
   e perche' il contenuto ha bisogno di piu' aria del contenitore su mobile.

   :where(.alignfull) azzera il proprio peso: la specificita' totale resta
   0,2,0, cosi' le regole per-sezione dei child scritte come
   `.sunya-entry-content > .classe` continuano a vincere per ordine sorgente. */
.sunya-entry-content > :where(.alignfull).has-global-padding {
    padding-left: var(--sunya-content-gutter, 1.5rem);
    padding-right: var(--sunya-content-gutter, 1.5rem);
}

/* Immagini full-width: stretch completo */
.sunya-entry-content > .alignfull img {
    width: 100%;
    height: auto;
    border-radius: 0;
}

/* Fix: l'immagine di sfondo del Cover block usa position: absolute
   e deve riempire il contenitore — la regola generica height: auto
   sopra non si applica a questo caso (specificità 0,3,1 > 0,2,1) */
.sunya-entry-content > .alignfull img.wp-block-cover__image-background {
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    object-fit: cover;
    position: absolute;
    inset: 0;
}

/* Cover full-width: padding interno per il testo, nessun bordo */
.sunya-entry-content > .wp-block-cover.alignfull {
    border-radius: 0;
    padding-left: var(--sunya-container-padding, 1.5rem);
    padding-right: var(--sunya-container-padding, 1.5rem);
}

/*
 * Blocchi full-width con contenuto interno: il contenuto resta centrato.
 * Copre sia il vecchio wrapper (__inner-container) sia il nuovo
 * sistema layout di WP 6.x.
 */
.sunya-entry-content > .alignfull > .wp-block-cover__inner-container,
.sunya-entry-content > .alignfull > .wp-block-group__inner-container {
    max-width: var(--sunya-container-width, 1200px);
    margin-left: auto;
    margin-right: auto;
}

/* Allineamento sinistro e destro */
.sunya-entry-content > .alignleft {
    float: left;
    margin-right: var(--sunya-spacing-lg);
    margin-bottom: var(--sunya-spacing-md);
    max-width: 50%;
}

.sunya-entry-content > .alignright {
    float: right;
    margin-left: var(--sunya-spacing-lg);
    margin-bottom: var(--sunya-spacing-md);
    max-width: 50%;
}

.sunya-entry-content > .aligncenter {
    clear: both;
    text-align: center;
}

/* Fallback: .alignwide dentro .sunya-container (template legacy) */
.sunya-container .alignwide {
    max-width: var(--sunya-wide-width, 1400px);
    margin-left: auto;
    margin-right: auto;
}


/* --------------------------------------------------------------------------
   Integrazione WordPress 6.x Layout Engine

   Con useRootPaddingAwareAlignments: true in theme.json, WP gestisce:
   - Padding laterale sul <body> via --wp--style--root--padding-*
   - Classe .has-global-padding sui container constrained
   - Margin negativi su .alignfull per compensare il padding body

   NON aggiungiamo padding ai figli di .is-layout-constrained
   perché WP lo gestisce già via body padding. Aggiungere padding
   qui causerebbe un doppio margine laterale.

   Le regole sotto servono solo per casi edge e per assicurare
   che il sistema Sunya e quello WP non confliggano.
   -------------------------------------------------------------------------- */

/*
 * Quando WP applica is-layout-constrained, i blocchi normali
 * ricevono max-width e margin auto dal CSS generato da WP.
 * Il padding laterale è gestito dal body (.has-global-padding).
 * Non serve aggiungere nulla qui — le regole fallback sopra
 * si attivano solo dove WP non interviene.
 */

/*
 * Fallback: se WP NON applica is-layout-constrained
 * (contenuto da plugin, shortcode, editor classico)
 * E il contenitore non ha il global-padding di WP,
 * aggiungiamo il padding laterale noi.
 *
 * v1.10.7: esclusa .sunya-breadcrumb-wrap. Quando WP inserisce la barra
 * DENTRO il contenuto (pagine che aprono con un Cover) la barra e' un
 * figlio diretto e prendeva il gutter, che si sommava ai 16px del suo
 * .sunya-container interno: testo del breadcrumb a 36px su quelle pagine
 * e a 16px su tutte le altre dello stesso sito. La barra e' chrome del
 * tema, non contenuto, e si impagina da se' come header e footer.
 */
.sunya-entry-content:not(.is-layout-constrained):not(.is-layout-flow):not(.has-global-padding) > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.sunya-breadcrumb-wrap) {
    padding-left: var(--sunya-content-gutter, 1.5rem);
    padding-right: var(--sunya-content-gutter, 1.5rem);
}


/* --------------------------------------------------------------------------
   Aria in coda al contenuto di pagina (v1.10.3)

   Fino alla 1.10.2 template-no-title.php azzerava con uno stile inline il
   padding di .sunya-content-area, e l'ultimo blocco finiva a filo del
   pre-footer (misurato 0px su kinesis il 27/08). Sui siti dove non si
   vedeva, l'aria arrivava da uno spacer nel post_content o da una regola
   scritta a mano nel child: quattro numeri diversi su quattro siti.

   Il padding sta DENTRO l'ultimo blocco, non sul contenitore: su una
   sezione con fondo colorato il colore si estende, mentre un padding sul
   contenitore infilerebbe una fascia di sfondo pagina fra la sezione e il
   pre-footer. E' la forma che dadesign usava gia' dal 10/08.

   Cover escluso: misurato sull'ultimo blocco della home di davidearduini
   (min-height 700px, contenuto centrato), il padding non allunga il blocco
   — altezza 700px prima e dopo — ma sposta il testo di 32px.

   Scopato a .sunya-page__content, cioe' page.php e template-no-title.php:
   sugli articoli il caso non e' stato misurato e resta invariato.

   E scopato al contenitore --flush (v1.10.3, corretto sul lab il 27/08):
   questa aria SOSTITUISCE il padding che il contenitore non ha. Sul
   template di default .sunya-content-area il padding ce l'ha gia', e senza
   questa guardia le due arie si sommavano — misurato 160px su demo-sunya
   e sample-page contro gli 80 di prima.

   Specificita' 0,3,0 (v1.10.6). I due `:where()` sulle esclusioni restano a
   peso zero, ma l'antenato --flush pesa: serve per battere il reset di
   WPForms `div.wpforms-container-full:not(:empty)`, che dichiara la
   shorthand `padding` a 0,2,1 e vinceva quando il form e' l'ultimo blocco
   della pagina (misurato su kinesis /contatti/ e /lavora-con-noi/:
   padding-bottom 0 invece di 80).
   La colonna delle classi domina quella dei tipi: 0,3,0 batte 0,2,1.
   Un child resta comunque in grado di governarla: `.sunya-page__content >
   .classe:last-child` sta a 0,3,0, pareggia, e vince per ordine sorgente
   perche' il foglio del child e' accodato dopo quello del parent.
   ⚠️ Abbassare ancora il peso — es. mettere anche --flush in :where() —
   rimette il tema alla merce' del CSS dei plugin. ---------------------- */

.sunya-content-area--flush .sunya-page__content > :last-child:where(:not(.wp-block-cover)):where(:not(style)) {
    padding-bottom: var(--sunya-spacing-section);
}


/* --------------------------------------------------------------------------
   Layout - Site structure
   -------------------------------------------------------------------------- */

/*
 * Layout sito: Flexbox colonna.
 * - TopBar, Header e Footer occupano la loro altezza naturale
 * - Main riempie lo spazio rimanente (flex: 1)
 * - Footer resta sempre in fondo anche con pagine corte
 * - L'ordine visivo segue sempre l'ordine DOM
 */
.sunya-site {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.sunya-main {
    flex: 1;
}

.sunya-content-area {
    padding-top: var(--sunya-spacing-section);
    padding-bottom: var(--sunya-spacing-section);
}

/* v1.10.3 — Contenitore a filo, per i template il cui contenuto apre e
   chiude da solo (oggi: template-no-title.php). Sostituisce lo stile
   inline che quel template scriveva nel markup fino alla 1.10.2.
   Il verticale resta a zero DI PROPOSITO: l'aria di testa la da' la barra
   breadcrumb, quella di coda l'ultimo blocco. Cosi' un Cover in apertura e
   una sezione colorata in chiusura restano a filo senza eccezioni. */
.sunya-content-area--flush {
    padding-top: 0;
    padding-bottom: 0;
}

/* Layout con sidebar */
.sunya-layout--sidebar-right {
    display: grid;
    grid-template-columns: 1fr var(--sunya-sidebar-width);
    gap: var(--sunya-spacing-2xl);
}

.sunya-layout--sidebar-left {
    display: grid;
    grid-template-columns: var(--sunya-sidebar-width) 1fr;
    gap: var(--sunya-spacing-2xl);
}

.sunya-layout--full-width {
    max-width: 100%;
}


/* --------------------------------------------------------------------------
   Accessibilità
   -------------------------------------------------------------------------- */

/* Skip link */
.sunya-skip-link {
    position: absolute;
    top: -100%;
    left: 50%;
    transform: translateX(-50%);
    /* v1.5.4: era --sunya-color-primary (legacy, navy fisso). */
    background: var(--sunya-color-surface-dark, var(--sunya-color-primary));
    color: var(--sunya-color-text-on-dark, #ffffff);
    padding: var(--sunya-spacing-sm) var(--sunya-spacing-lg);
    z-index: 100000;
    border-radius: 0 0 var(--sunya-radius-md) var(--sunya-radius-md);
    font-weight: var(--sunya-font-weight-medium);
    transition: top var(--sunya-transition-fast);
}

.sunya-skip-link:focus {
    top: 0;
    color: #ffffff;
    outline: 2px solid var(--sunya-color-accent);
    outline-offset: 2px;
}

/* Screen reader text
   .screen-reader-text è generata dal core (comment form, widget, wp_link_pages):
   senza regola il testo resta visibile. Aliasata a .sunya-sr-only. */
.sunya-sr-only,
.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.sunya-sr-only:focus,
.screen-reader-text:focus {
    position: static;
    width: auto;
    height: auto;
    padding: var(--sunya-spacing-sm);
    margin: 0;
    overflow: visible;
    clip: auto;
    white-space: normal;
}

/* Classi generate dal core WordPress (richieste da Theme Check).
   Stile minimo, neutro: il child le sovrascrive se il brand lo richiede. */
.sticky {
    border-left: 3px solid var(--sunya-color-accent);
}

.bypostauthor > .sunya-comment__body {
    border-left: 3px solid var(--sunya-color-accent);
}

.wp-caption {
    max-width: 100%;
    margin-bottom: var(--sunya-spacing-md);
}

.wp-caption img {
    display: block;
    max-width: 100%;
    height: auto;
}

.wp-caption-text,
.gallery-caption {
    font-size: 0.875em;
    line-height: 1.4;
    color: var(--sunya-color-text-light);
    margin-top: var(--sunya-spacing-xs);
}

/* Focus visibile migliorato */
:focus-visible {
    outline: 2px solid var(--sunya-color-accent);
    outline-offset: 2px;
}

/* Rispetta prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}


/* --------------------------------------------------------------------------
   Utility classes
   -------------------------------------------------------------------------- */

.sunya-text-center { text-align: center; }
.sunya-text-left { text-align: left; }
.sunya-text-right { text-align: right; }

.sunya-hidden { display: none !important; }
.sunya-visible { display: block !important; }

.sunya-flex { display: flex; }
.sunya-flex-center { display: flex; align-items: center; justify-content: center; }
.sunya-flex-between { display: flex; align-items: center; justify-content: space-between; }
.sunya-flex-wrap { flex-wrap: wrap; }
.sunya-flex-column { flex-direction: column; }
.sunya-gap-sm { gap: var(--sunya-spacing-sm); }
.sunya-gap-md { gap: var(--sunya-spacing-md); }
.sunya-gap-lg { gap: var(--sunya-spacing-lg); }

.sunya-grid { display: grid; }
.sunya-grid-2 { grid-template-columns: repeat(2, 1fr); }
.sunya-grid-3 { grid-template-columns: repeat(3, 1fr); }
.sunya-grid-4 { grid-template-columns: repeat(4, 1fr); }

.sunya-mt-0 { margin-top: 0; }
.sunya-mb-0 { margin-bottom: 0; }
.sunya-mt-md { margin-top: var(--sunya-spacing-md); }
.sunya-mb-md { margin-bottom: var(--sunya-spacing-md); }
.sunya-mt-lg { margin-top: var(--sunya-spacing-lg); }
.sunya-mb-lg { margin-bottom: var(--sunya-spacing-lg); }
.sunya-mt-xl { margin-top: var(--sunya-spacing-xl); }
.sunya-mb-xl { margin-bottom: var(--sunya-spacing-xl); }
.sunya-mt-section { margin-top: var(--sunya-spacing-section); }
.sunya-mb-section { margin-bottom: var(--sunya-spacing-section); }

.sunya-pt-0 { padding-top: 0; }
.sunya-pb-0 { padding-bottom: 0; }
.sunya-pt-section { padding-top: var(--sunya-spacing-section); }
.sunya-pb-section { padding-bottom: var(--sunya-spacing-section); }


/* --------------------------------------------------------------------------
   Search Form (searchform.php)
   -------------------------------------------------------------------------- */

.sunya-search-form {
    display: flex;
    max-width: 480px;
    border: 1px solid var(--sunya-color-border);
    border-radius: var(--sunya-radius-md);
    overflow: hidden;
    transition: border-color var(--sunya-transition-fast);
}

.sunya-search-form:focus-within {
    border-color: var(--sunya-color-accent);
}

.sunya-search-form__input {
    flex: 1;
    padding: var(--sunya-spacing-sm) var(--sunya-spacing-md);
    border: none;
    background: transparent;
    font-family: inherit;
    font-size: var(--sunya-font-size-base);
    color: var(--sunya-color-text);
    outline: none;
    min-width: 0;
}

.sunya-search-form__input::placeholder {
    color: var(--sunya-color-text-light);
}

.sunya-search-form__submit {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--sunya-spacing-sm) var(--sunya-spacing-md);
    border: none;
    background: var(--sunya-color-accent);
    color: #ffffff;
    cursor: pointer;
    transition: background-color var(--sunya-transition-fast);
}

.sunya-search-form__submit:hover,
.sunya-search-form__submit:focus-visible {
    background: var(--sunya-color-accent-hover);
}

/* Search form nel footer (sfondo scuro) */
.sunya-footer .sunya-search-form {
    border-color: rgba(255, 255, 255, 0.2);
}

.sunya-footer .sunya-search-form__input {
    color: var(--sunya-footer-color, #e5e7eb);
}

.sunya-footer .sunya-search-form__input::placeholder {
    color: rgba(255, 255, 255, 0.5);
}

/* Search form nella 404 — centrato */
.sunya-404__search .sunya-search-form {
    margin: var(--sunya-spacing-lg) auto;
}


/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media screen and (max-width: 1024px) {

    .sunya-layout--sidebar-right,
    .sunya-layout--sidebar-left {
        grid-template-columns: 1fr;
    }

    .sunya-grid-4 {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Su schermi medi, wide = full width disponibile */
    .sunya-entry-content > .alignwide {
        max-width: 100%;
    }

    /* Float annullati su tablet */
    .sunya-entry-content > .alignleft,
    .sunya-entry-content > .alignright {
        float: none;
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    /* Su tablet, il padding laterale dei blocchi si riduce con la variabile */
    .sunya-entry-content.is-layout-constrained > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.sunya-breadcrumb-wrap) {
        padding-left: var(--sunya-content-gutter);
        padding-right: var(--sunya-content-gutter);
    }
}

@media screen and (max-width: 768px) {

    :root {
        --sunya-font-size-4xl: 1.875rem;
        --sunya-font-size-3xl: 1.5rem;
        --sunya-font-size-2xl: 1.25rem;
        --sunya-spacing-section: 3rem;
        --sunya-container-padding: 1rem;

        /* v1.10.3 — 20px, non 16. E' l'unico valore mai giudicato
           accettabile su una pagina vera: 1rem era stato scartato due
           volte su dadesign ("card ed etichette a filo schermo", 10/08 e
           12/08). Header, footer, pre-footer e breadcrumb restano a 1rem
           perche' leggono --sunya-container-padding. */
        --sunya-content-gutter: 1.25rem;
    }

    .sunya-grid-3 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media screen and (max-width: 480px) {

    .sunya-grid-2,
    .sunya-grid-3 {
        grid-template-columns: 1fr;
    }
}