/**
 * tema.css
 *
 * Mappa dei colori ed effetti grafici di base del sito. Palette
 * derivata dai colori reali del logo (la tartaruga disegnata,
 * public/images/loghi/labcucus-tartaruga.png — campionati i pixel
 * dominanti: un verde giada/smeraldo come colore primario, un verde
 * menta come luce/accento), non scelta a caso o presa da una tavolozza
 * generica.
 *
 * Il rosso "sigillo" (--c-sigillo) è un richiamo deliberato al timbro
 * rosso/sigillo che accompagna calligrafie e dipinti cinesi (印章):
 * usato con parsimonia, solo per l'unico invito all'azione che conta
 * davvero (il sostegno al progetto), non come colore decorativo
 * diffuso — è il resto della pagina a dover restare quieto perché
 * quell'unico elemento risalti.
 *
 * Font: "Manrope" per tutto il testo in caratteri latini (una sola
 * famiglia, pesi diversi per la gerarchia — non serve una seconda
 * famiglia solo per differenziarsi); "Noto Serif SC" riservato ai
 * caratteri cinesi mostrati in grande come elemento visivo (non per il
 * testo cinese corrente nell'interfaccia, quello resta nei font di
 * sistema già scelti in font-cinese.css) — un tratto con più carattere
 * calligrafico per i pochi caratteri usati come elemento di design
 * nella pagina iniziale.
 */

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;700;800&family=Noto+Serif+SC:wght@700&display=swap');

:root {
    /* --- Colori primari, dal logo --- */
    --c-giada: #00a874;       /* verde primario del marchio */
    --c-menta: #3deaa8;       /* accento/luce, usato per bordi luminosi e gradienti */
    --c-inchiostro: #10241d;  /* quasi-nero con base verde, non un nero neutro generico */
    --c-sigillo: #c23b32;     /* rosso sigillo, SOLO per l'invito al sostegno */
    --c-nebbia: #eef4f0;      /* sfondo pagina, bianco velato di giada */
    --c-pietra: #55685e;      /* testo secondario, bordi discreti */

    /* --- Variazioni derivate (stessa tinta, luminosità diversa) --- */
    --c-giada-scuro: #00784f;
    --c-inchiostro-attenuato: rgba(16, 36, 29, .72);
    --c-bordo: rgba(16, 36, 29, .12);

    /* --- Tipografia --- */
    --font-testo: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-cinese-display: 'Noto Serif SC', 'KaiTi', 'STKaiti', serif;

    /* --- Effetti ricorrenti --- */
    --ombra-morbida: 0 8px 24px rgba(16, 36, 29, .10);
    --ombra-sollevata: 0 16px 40px rgba(16, 36, 29, .16);
    --transizione-morbida: .25s cubic-bezier(.4, 0, .2, 1);
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family: var(--font-testo);
    color: var(--c-inchiostro);
    background: var(--c-nebbia);
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3 {
    font-weight: 800;
    line-height: 1.15;
    margin: 0 0 .5em;
}

p {
    margin: 0 0 1em;
    color: var(--c-inchiostro-attenuato);
}

a {
    color: inherit;
}

/* Motivo esagonale, ripreso dal disegno del carapace della tartaruga:
   usato come texture di sfondo discreta in punti selezionati della
   pagina (non ovunque), un unico filo visivo tra il logo e il resto del
   sito. Basato su un pattern SVG inline ripetuto via background-image:
   nessun file immagine aggiuntivo da caricare. */
.motivo-esagoni {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='100' viewBox='0 0 56 100'%3E%3Cpath d='M28 0 L56 16 L56 48 L28 64 L0 48 L0 16 Z' fill='none' stroke='%2300a874' stroke-opacity='0.08' stroke-width='1.5'/%3E%3Cpath d='M28 64 L56 80 L56 100 M28 64 L0 80 L0 100' fill='none' stroke='%2300a874' stroke-opacity='0.08' stroke-width='1.5'/%3E%3C/svg%3E");
    background-repeat: repeat;
}

/* Focus da tastiera sempre visibile — accessibilità, non solo estetica. */
:focus-visible {
    outline: 3px solid var(--c-menta);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
    * {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }
}