/* ============================================================
   BASE.CSS — reset e variabili globali
   Palette: nero · bianco · grigio caldo · oro
   ============================================================ */

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

:root {
    /* Colori principali */
    --color-primary:    #B8960C;
    --color-secondary:  #1A1A1A;
    --color-accent:     #8A6E00;

    /* Colori caldi */
    --color-warm-red:   #C94B2C;
    --color-coral:      #D95F3B;
    --color-terracotta: #E07A5F;
    --color-warm-bg:    #FDF4EE;

    /* Backgrounds */
    --color-bg:         #FFFFFF;
    --color-bg-soft:    #F8F6F1;
    --color-bg-dark:    #111111;

    /* Testo */
    --color-text:       #1A1A1A;
    --color-text-muted: #6B6B6B;

    /* Bordi */
    --color-border:     #E8E4DC;
    --color-border-gold:#B8960C;

    /* Tipografia */
    --font-main:        'Inter', sans-serif;
    --font-serif:       'Georgia', serif;
    --font-chinese:     'Noto Sans SC', sans-serif;

    /* Layout */
    --max-width: 1200px;
    --radius:    8px;
    --radius-lg: 16px;
}

html { scroll-behavior: smooth; }

body {
    font-family: var(--font-main);
    color: var(--color-text);
    background: var(--color-bg);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

:lang(zh) { font-family: var(--font-chinese); }

img { max-width: 100%; display: block; }
a   { color: inherit; text-decoration: none; }

.container {
    width: 100%;
    max-width: var(--max-width);
    margin: 0 auto;
    padding: 0 2rem;
}

/* Divisore oro */
.mc-gold-divider {
    height: 1px;
    background: linear-gradient(to right, transparent, var(--color-primary), transparent);
    opacity: 0.35;
}

/* ============================================================
   ANIMAZIONI HERO — nascosta da CSS, attivata da JS
   ============================================================ */

.hero-anim {
    opacity: 0;
    transition: opacity 1.1s ease;
}

.hero-anim.hero-visible {
    opacity: 1;
}

/* ============================================================
   ANIMAZIONI SCROLL — fade + slide up
   ============================================================ */

.anim-fade {
    opacity: 0;
    transform: translateY(28px);
    transition:
        opacity 0.9s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}

.anim-fade.anim-visible {
    opacity: 1;
    transform: translateY(0);
}