/* =========================
   MOBILE PATCH & COULEURS
   ========================= */

:root {
    --fan-gold: #e3cba8;
    --warm-grey-text: #aea08e;
}

/* 1. HARMONISATION COULEURS */
.hero-title {
    color: var(--fan-gold) !important;
}

.hero-subtitle {
    color: var(--warm-grey-text) !important;
    opacity: 1 !important;
}

.hero-description {
    color: #9ca3af !important;
}

.section-title h2 {
    color: var(--fan-gold) !important;
}

.subtitle {
    font-size: 13px !important;
    color: #a3a3a3 !important;
    letter-spacing: 0.5em !important;
    font-weight: 600 !important;
    margin-bottom: 28px !important;
}

/* 2. REEQUILIBRAGE MOBILE (Téléphone) */
@media (max-width: 768px) {

    /* LOGO MOBILE : ALIGNEMENT STRICT (Axe 22%) */
    .hero-logo {
        left: 22% !important;
        transform: translateX(-50%) !important;
        width: 11% !important;
        /* Micro-ajustement de précision */
        /* Réduction pour plus de finesse */
        margin: 0 !important;
    }

    /* Bloc Texte Héros : Utilisation du nouvel ID final */
    /* Bloc Texte Héros : Utilisation du nouvel ID final */
    #hero-text-master {
        position: absolute !important;
        left: 22% !important;
        /* Alignement STRICT sous le logo Mobile */
        top: 45% !important;
        /* Remontée équilibrée */
        width: auto !important;
        /* Largeur adaptative pour un centrage parfait */
        max-width: none !important;
        margin: 0 !important;
        text-align: center !important;
        transform: translateX(-50%) !important;
        z-index: 50 !important;
    }

    .hero-title {
        font-size: 52px !important;
        margin-bottom: 8px !important;
    }

    .hero-subtitle {
        font-size: 24px !important;
        margin-bottom: 40px !important;
    }

    /* Sceau Culturel Mobile : AGRANDISSEMENT MASSIF (1/3 de l'impact visuel) */
    .hero-seal {
        width: 100% !important;
        /* Force le conteneur à prendre toute la largeur pour un centrage parfait */
        align-items: center !important;
    }

    .hero-seal span {
        text-align: center !important;
        /* Sécurité supplémentaire */
    }

    .hero-seal span:nth-child(1) {
        font-size: 90px !important;
        /* 唐 - Impact fort */
        margin-bottom: 25px !important;
    }

    .hero-seal span:nth-child(2) {
        font-size: 60px !important;
        /* 風 */
        margin-bottom: 18px !important;
    }

    .hero-seal span:nth-child(3) {
        font-size: 38px !important;
        /* 韻 */
    }

    /* Le bouton est supprimé */
    .hero-cta {
        display: none !important;
    }

    /* 3. BANDEAU MOBILE : ADAPTATION DU VERTICAL (même style que Desktop) */
    .announcement-bar {
        width: 36px !important;
        /* Plus étroit sur mobile pour économiser l'espace */
        /* Revert to desktop vertical properties */
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        height: 100% !important;
        border-right: 1px solid rgba(212, 165, 116, 0.08) !important;
        border-bottom: none !important;
        flex-direction: column !important;
        background: transparent !important;
    }

    .announcement-track {
        writing-mode: vertical-rl !important;
        /* Cohérent avec Desktop */
        text-orientation: upright !important;
        width: 100% !important;
        height: auto !important;
        animation: marquee-vert 60s linear infinite !important;
    }

    #top-nav {
        top: 0 !important;
    }

    .announcement-track span {
        font-size: 16px !important;
        /* Réduit pour mobile */
        font-weight: 500 !important;
        letter-spacing: 0.08em !important;
        padding: 30px 0 !important;
        opacity: 0.9 !important;
        /* Légèrement plus visible */
    }
}