:root{
    --bg-color:#0d0d0d;
    --accent:#b3000f;
    --text:#f0f0f0;
}

/* =========  BASE ========= */

*,*::before,*::after{box-sizing:border-box;}
body{
    margin:0;
    font-family:'Poppins',sans-serif;
    background:var(--bg-color);
    color:var(--text);
    line-height:1.6;
    overflow-x:hidden;
}

/* =========  BORDURES FLORALES ========= */

body::before,
body::after{
    content:"";
    position:fixed;
    top:0;
    bottom:0;
    width:180px;
    pointer-events:none;
    z-index:999;
    background-image:url('../img/floral-border.png'),url('../img/floral-border.png');
    background-repeat:no-repeat;
    background-position:top center,bottom center;
    background-size:180px auto;
    filter:drop-shadow(0 0 4px rgba(255,255,255,.8));
    animation:float 30s linear infinite;
}
body::before{left:0;}
body::after{right:0;transform:scaleX(-1);}
@keyframes float{0%{transform:translateY(0);}50%{transform:translateY(-40px);}100%{transform:translateY(0);}}

/* =========  EN-TÊTE ========= */

header{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    padding:1rem 2rem;
    display:flex;
    justify-content:space-between;
    align-items:center;
    transition:background .3s;
    z-index:1000;
}
header.scrolled{background:rgba(0,0,0,.85);}
.logo{
    font-family:'Cormorant Garamond',serif;
    font-size:1.8rem;
    letter-spacing:2px;
    color:var(--accent);
}
nav ul{list-style:none;display:flex;gap:1.5rem;margin:0;padding:0;}
nav a{position:relative;color:var(--text);text-decoration:none;}
nav a::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-4px;
    height:2px;
    width:0;
    background:var(--accent);
    transition:width .3s;
}
nav a:hover::after{width:100%;}
.btn-cv{
    border:2px solid var(--accent);
    padding:.5rem 1.2rem;
    font-weight:600;
    color:var(--accent);
    text-decoration:none;
    transition:background .3s,color .3s;
}
.btn-cv:hover{background:var(--accent);color:var(--text);}

/* =========  SECTIONS ========= */

section{
    min-height:100vh;
    padding:6rem 10vw;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    gap:1rem;
}
h1,h2{font-family:'Cormorant Garamond',serif;margin:0 0 1rem;}
h2{font-size:2.4rem;color:var(--accent);}

/* ----- HERO ----- */

#hero{
    position:relative;
    background:url('../img/hero.jpg') center/cover fixed;
    color:var(--text);
}
#hero::after{
    content:"";
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.40);          /* voile plus léger */
}
#hero>*{position:relative;}
#hero h1{
    font-size:4rem;
    color:#d91b25;                       /* rouge plus clair */
    text-shadow:
            0 0 8px rgba(255,255,255,.45),   /* halo lumineux */
            0 0 20px rgba(255,255,255,.25),
            2px 2px 6px rgba(0,0,0,.60);     /* profondeur */
}
#hero p{
    max-width:700px;
    font-size:1.2rem;
    color:#f3f3f3;                       /* texte très clair */
    text-shadow:0 0 4px rgba(0,0,0,.6);
}

/* ----- ABOUT ----- */

#about p{max-width:800px;}

/* ----- GALERIE ----- */
.gallery-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
    gap:1rem;
    width:100%;
    max-width:1200px;
}
.gallery-grid .item{
    position:relative;
    aspect-ratio:1/1;
    overflow:hidden;
    border:4px solid var(--accent);
}
.gallery-grid img,
.gallery-grid iframe{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

/* ----- MODAL ----- */
#modal{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.92);
    display:none;
    align-items:center;
    justify-content:center;
    padding:2rem;
    z-index:1100;
}
#modal img{max-width:90vw;max-height:90vh;border:5px solid var(--accent);}
#modal .close{
    position:absolute;
    top:20px;
    right:30px;
    font-size:2rem;
    font-weight:bold;
    color:var(--text);
    cursor:pointer;
}

/* ----- CONTACT ----- */
form{
    display:flex;
    flex-direction:column;
    gap:.8rem;
    width:100%;
    max-width:600px;
}
form input,form textarea{
    padding:.8rem 1rem;
    border:2px solid var(--accent);
    background:transparent;
    color:var(--text);
    resize:none;
    font-family:inherit;
}
form button{
    padding:.8rem 1rem;
    border:none;
    background:var(--accent);
    color:var(--text);
    font-weight:bold;
    cursor:pointer;
    transition:opacity .3s;
}
form button:hover{opacity:.8;}

/* ----- FOOTER ----- */
footer{
    padding:2rem 1rem;
    text-align:center;
    font-size:.9rem;
    color:#888;
    background:#000;
}

/* =========  PÉTALES ========= */
.petal{
    --fall:14s;
    --drift:7s;
    position:fixed;
    top:-60px;
    width:24px;
    height:24px;
    pointer-events:none;
    z-index:2000;
    opacity:.55;
    background:url('../img/petal.svg') center/contain no-repeat;
    animation:
            fall var(--fall) linear forwards,
            drift var(--drift) ease-in-out infinite;
    transform-origin:center;
}
@keyframes fall{to{top:110vh;}}
@keyframes drift{
    0%{transform:translateX(0) rotate(0);}
    50%{transform:translateX(80px) rotate(360deg);}
    100%{transform:translateX(0) rotate(720deg);}
}

/* =========  RESPONSIVE ========= */
@media(max-width:600px){
    #hero h1{font-size:2.8rem;}
    h2{font-size:1.8rem;}
    body::before,body::after{display:none;}
}