/* --- 1. CONFIGURATION GÉNÉRALE --- */
:root {
    --primary-gold: #E0DCD3;
    --neutral-dark: #423D39;
    --bg-surface: #E0DCD3;    /* Ta nouvelle couleur sable */
    --shadow-dark: #c1bdb5;   /* Ombre portée adaptée */
    --shadow-light: #fffbf1;  /* Lumière chaude adaptée */
}

body {
    background-color: var(--bg-surface);
    color: var(--neutral-dark);
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

/* --- 2. BOUTONS NEUMORPHISMES (EFFET PILULE) --- */

/* Bouton qui "SORT" (Outset) - Idéal pour l'appel à l'action principal */
.sculpted-button {
    background: var(--bg-surface);
    border-radius: 56px;
    border: none;
    padding: 14px 32px;
    color: var(--neutral-dark);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 0.7rem;
    cursor: pointer;
    
    /* Ombre extérieure pour l'effet de relief */
    box-shadow: 
        8px 8px 16px var(--shadow-dark), 
        -8px -8px 16px var(--shadow-light);
    
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.sculpted-button:hover {
    transform: translateY(-2px);
    box-shadow: 
        12px 12px 24px var(--shadow-dark), 
        -12px -12px 24px var(--shadow-light);
}

/* Bouton "ENFONCÉ" (Inset) - Ton test */
.sculpted-button-inset {
    background: var(--bg-surface);
    border-radius: 56px;
    border: none;
    padding: 14px 32px;
    color: var(--neutral-dark);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 0.7rem;
    
    /* Tes valeurs d'ombres internes */
    box-shadow: 
        inset 11px 11px 22px #c1bdb5, 
        inset -11px -11px 22px #fffbf1;
        
    transition: all 0.3s ease;
}

/* Bouton Doré (Accent) - Toujours en relief */
.sculpted-button-accent {
    background: var(--primary-gold);
    color: white !important;
    border-radius: 56px;
    box-shadow: 
        8px 8px 16px #b8a68a, 
        -8px -8px 16px var(--shadow-light);
}

/* --- 3. CORRECTION DES CARTES DE PROJETS --- */

/* On enlève l'ombre de la carte globale */
.sculpted-card {
    background: transparent; /* Plus de fond */
    border: none;            /* Plus de bordure */
    box-shadow: none;        /* PLUS D'OMBRE ICI */
    transition: all 0.4s ease;
    border-radius: 2rem;
    overflow: hidden;
}

/* ON APPLIQUE L'OMBRE DIRECTEMENT SUR L'IMAGE */
.sculpted-card img {
    width: 100%;
    height: auto;
    object-cover: cover;
    border-radius: 2rem; /* Même radius que la maquette */
    
    /* Ton Neumorphisme propre ici (Ombre sombre douce + Lumière claire) */
    box-shadow: 
        12px 12px 24px var(--shadow-dark), 
        -12px -12px 24px var(--shadow-light);
    
    transition: transform 0.6s cubic-bezier(0.2, 1, 0.3, 1), box-shadow 0.4s ease;
}

/* Effet au survol élégant (on accentue le relief et l'image grossit) */
.sculpted-card:hover img {
    transform: scale(1.03);
    box-shadow: 
        18px 18px 36px var(--shadow-dark), 
        -18px -18px 36px var(--shadow-light);
}

/* --- 4. NAVIGATION & GLASSMORPHISM --- */

header.glass-nav {
    background: rgba(224, 220, 211, 0.8);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid #ccc; /* Couleur de secours pour vieux navigateurs */
    border-bottom: 1px solid rgba(0, 0, 0, 0.03);
}

/* --- 5. ANIMATION GSAP & TYPOGRAPHIE --- */

.hero-text h1 {
    font-size: clamp(3.5rem, 10vw, 9rem) !important;
    line-height: 0.9 !important; /* Un peu plus d'espace entre les lignes */
    margin-bottom: 2rem !important;
    font-weight: 900 !important;
    letter-spacing: -0.02em !important; /* Moins serré pour éviter les chevauchements */
    display: block !important;
}

.hero-text h1 span {
    display: block;
    overflow: visible !important; /* CRITIQUE : Autorise les lettres à dépasser de leur ligne */
    padding-left: 0.1em;           /* Donne de l'espace au "L'" du début */
    padding-right: 0.1em;          /* Donne de l'espace au "e" final de Vivre */
}
/* Correction pour les petits sous-titres */
.subtitle, .text-accent.uppercase {
    padding-left: 5px; /* Évite que la première lettre ne colle au bord gauche */
    display: inline-block;
}
/* --- 6. COMPLÉMENTS PAGES INTERNES --- */

/* Lien bouton accent doré */
.sculpted-button-accent {
    background: #C6A77D;
    color: white;
    border-radius: 56px;
    border: none;
    padding: 14px 32px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 0.7rem;
    cursor: pointer;
    box-shadow: 8px 8px 16px #b8a68a, -8px -8px 16px var(--shadow-light);
    transition: all 0.3s ease;
    text-decoration: none;
    display: inline-block;
}

.sculpted-button-accent:hover {
    transform: translateY(-2px);
    box-shadow: 12px 12px 24px #b8a68a, -12px -12px 24px var(--shadow-light);
}

/* Cartes projets avec hover élégant */
.projet {
    transition: all 0.4s ease;
}

/* Titres pages internes */
main h1 {
    line-height: 0.9;
}

/* Formulaire : focus accessible */
input:focus, textarea:focus, select:focus {
    outline: 2px solid rgba(198, 167, 125, 0.4);
    outline-offset: 2px;
}

/* Scroll fluide global */
html {
    scroll-behavior: smooth;
}
