/*
 * Spostato integralmente da themes/default/layouts/head.php (era il blocco
 * <style> inline dopo assets/vendor/theme.css), senza modifiche di
 * contenuto, con due sole eccezioni volute:
 *
 * 1. l'@import del font NON è qui: un @import deve essere la prima riga
 *    del file per essere rispettato dal browser, e un @import annidato
 *    dentro un <link> già caricato crea comunque una richiesta in serie
 *    (prima si scarica questo file, poi il browser scopre l'@import e ne
 *    parte un'altra). L'URL del font è un token (fontUrl in theme.json), e
 *    un file .css statico non può interpolarlo: viene invece emesso come
 *    <link rel="stylesheet" href="<fontUrl>"> nel <head>, prima di questo
 *    file (vedi themes/default/layouts/head.php). Più corretto anche per
 *    le performance: il browser lo scopre e lo scarica subito, in
 *    parallelo, invece che dopo aver scaricato ed elaborato theme.css.
 *
 * 2. `body { font-family: 'Montserrat', sans-serif; }` usa la variabile
 *    del token invece del valore fisso, cosi un tema diverso puo
 *    cambiare font senza toccare questo file.
 */

body { font-family: var(--c-font-body); }

.hero-section {
    height: 100vh;
    background-size: cover;
    background-position: center;
    position: relative;
}

/* LOGO CONTAINER BASE */
.logo-container {
    position: fixed;
    left: 50%;
    top: 50%;
    /* Importante: usiamo translate per centrare perfettamente all'inizio */
    transform: translate(-50%, -50%);
    z-index: 100;
    transition: none; /* JS gestisce tutto in home */
    display: flex; /* Rimuove spazi indesiderati dei link/img */
    justify-content: center;
    align-items: center;
    width: auto; /* Lasciamo che si adatti al contenuto SVG */
}

/* PAGINE INTERNE (STATICO) */
.logo-container.static-logo {
    top: 48px !important; /* Centro navbar */
}

.logo-container svg {
    /* Di base (Pagine Interne e Mobile Statico): Tutto NERO */
    filter: brightness(0);
    /* Aggiunge fluidità se ci sono cambi di stato */
    transition: width 0.1s, height 0.1s;
    /* Nota: NON mettiamo transition sul filter qui perché lo gestiamo real-time col JS in home */
}

/* MOBILE: Gestione Specifica */
@media (max-width: 768px) {
    /* Inizio (Hero): deve stare dentro lo schermo */
    .logo-container svg {
        max-width: 90vw; /* Massima larghezza 90% viewport */
        height: auto;    /* Altezza proporzionale */
    }

    /* Fine Scroll / Pagine Interne Mobile */
    /* Ancoriamo a sinistra invece che al centro */
    .logo-container.static-logo,
    .logo-container.mobile-scrolled {
        left: 50% !important;
        transform: translate(-50%, -50%) !important;

        /* Se è un flex container, centria il contenuto */
        display: flex;
        justify-content: center;
    }
}

/* Navbar transitions */
.navbar { transition: all 0.4s ease; background-color: transparent; }
.navbar.scrolled { background-color: white; }
.nav-icons svg { transition: stroke 0.4s ease; }
