@font-face {
    font-family: 'Outfit';
    src: url('../fonts/Outfit-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
}

:root { 
    --brand-red: #AB1700; 
    --nav-height: 8vh;
}

html { scroll-behavior: smooth; overflow: hidden; cursor: url('../img/cursor-red.cur'), auto; }

body {
    background-color: white;
    color: black;
    font-family: 'Outfit', sans-serif;
    text-transform: lowercase;
    margin: 0;
    -webkit-font-smoothing: antialiased;
    scroll-snap-type: y mandatory;
    overflow-y: auto;
    height: 100vh;
}

.panel {
    min-height: calc(100vh - var(--nav-height)); 
    width: 100%;
    scroll-snap-align: start;
    scroll-snap-stop: always;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-bottom: 1px solid black;
    padding: 10vh 5%;
    position: relative;
    box-sizing: border-box;
}

.panel:last-of-type {
    min-height: 100vh; 
    border-bottom: none;
    padding-bottom: var(--nav-height);
}

/* IMAGE SCANNER */
#image-panel { padding: 0; height: calc(100vh - var(--nav-height)); }
.image-container { width: 100%; height: 100%; position: relative; background: white; overflow: hidden; }
.image-container img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; mix-blend-mode: multiply; transition: opacity 200ms cubic-bezier(0.23, 1, 0.32, 1); }
.image-container img.base-static { opacity: 1; z-index: 1; mix-blend-mode: normal; transition: none; }

/* MANIFESTE */
.split-container { display: flex; gap: 5vw; align-items: flex-start; }
.bio-col, .statuts-col { flex: 1; }

/* TYPOS & SQUIGGLE GLOBAL */
.vibrant-title { font-size: 9.3vw; color: var(--brand-red); font-weight: 300; margin: 0; line-height: 1; }
p { font-size: 2vw; line-height: 1.2; margin-bottom: 3vh; }
.section-header { color: black; font-size: 2vw; margin-bottom: 4vh; }


.project-list { justify-content: flex-start; padding-top: 10vh; }
.project-row { display: flex; justify-content: space-between; align-items: left; width: 100%; font-size: 2vw; border-bottom: 1px solid black; padding: 2vh 0; }

/* NAVIGATION */
nav {
    position: fixed; bottom: 0; height: var(--nav-height); width: 100%;
    display: flex; gap: 10.3vw; justify-content: flex-start; align-items: center;
    padding: 0 5%; border-top: 1px solid black; background: white; z-index: 1000;
}
nav a, a { font-size: 2vw; text-decoration: none; color: black; transition: color 0.3s; cursor: url('../img/cursor-black.cur'), pointer !important; }
nav a:hover, a:hover { color: var(--brand-red); }

/* ✅ Nav active (juste la couleur, propre) */
nav a.active { color: var(--brand-red) !important; }

/* NEWSLETTER */
.newsletter-signup-container { margin-top: 10vh; margin-bottom: 8vh; width: 100%; }
#custom-brevo-form { display: flex; align-items: baseline; justify-content: flex-start; gap: 0.8vw; border-top: 1px solid black; padding-top: 3vh; padding-bottom: 3vh; width: 100%; }
#custom-brevo-form p { margin: 0; font-size: 2vw; font-weight: 400 !important; white-space: nowrap; }
#custom-brevo-form input[type="email"] { all: unset; flex-grow: 1; font-family: 'Outfit', sans-serif; font-size: 2vw; font-weight: 400 !important; color: black; caret-color: var(--brand-red); min-width: 150px; text-align: left; }
#custom-brevo-form input[type="email"]::placeholder { color: #bbb; font-weight: 400 !important; opacity: 1; }
#custom-brevo-form button { all: unset; font-family: 'Outfit', sans-serif; font-size: 2vw; font-weight: 400 !important; color: black; cursor: url('../img/cursor-black.cur'), pointer; text-transform: lowercase; transition: color 0.2s; white-space: nowrap; }
#custom-brevo-form button:hover { color: var(--brand-red); }

/* ARCHIVES */
.archive-nav { text-align: center; font-size: 2vw; cursor: url('../img/cursor-black.cur'), pointer; padding: 1vh 0; color: var(--brand-red); transition: transform 0.2s; }
.archive-nav:hover { transform: scale(1.2); }
.newsletter-row { border-bottom: 1px solid black; width: 100%; display: flex; flex-direction: column; }
.newsletter-header { display: flex; justify-content: space-between; align-items: center; padding: 2vh 0; font-size: 2vw; cursor: url('../img/cursor-black.cur'), pointer; transition: color 0.3s; width: 100%; }
.newsletter-header.static { cursor: default; }
.newsletter-header:not(.static):hover { color: var(--brand-red); }
.newsletter-body { display: none; padding: 3vh 0 4vh 0; border-top: 1px dashed black; }
.newsletter-body.active { display: block; }
.radical-email, .radical-email * { font-family: 'Outfit', sans-serif !important; }
.radical-email a { color: var(--brand-red) !important; text-decoration: underline !important; cursor: url('../img/cursor-black.cur'), pointer !important; }
.radical-email a:hover { color: black !important; }
.radical-email img { max-width: 100% !important; height: auto !important; }

/* ATELIERS */
#ateliers-container { display: flex; flex-direction: column; gap: 0; }
.atelier-row { border-bottom: 1px solid black; width: 100%; display: flex; flex-direction: column; }
.atelier-header { display: flex; justify-content: space-between; align-items: center; padding: 2vh 0; font-size: 2vw; cursor: url('../img/cursor-black.cur'), pointer; transition: color 0.3s; width: 100%; }
.atelier-header.static { cursor: default; }
.atelier-header:not(.static):hover { color: var(--brand-red); }
.atelier-header .project-title { font-weight: 400; }
.atelier-header span:nth-child(2), .atelier-header span:nth-child(3) { text-align: left; }
.atelier-body { display: none; padding: 2vh 0 4vh 0; border-top: 1px dashed black; font-size: 2vw; line-height: 1.4; }
.atelier-body.active { display: block; }
.atelier-details { font-family: 'Outfit', sans-serif; text-transform: lowercase; }
.atelier-details p { font-size: 2vw; line-height: 1.3; margin-bottom: 2vh; }
.atelier-details strong { font-weight: 600; }
.ticket-row { display: flex; justify-content: space-between; padding: 1vh 0; font-size: 2vw; border-bottom: 1px solid #eee; }
.ticket-row:last-child { border-bottom: none; }

.atelier-cta { margin-top: 10vh; margin-bottom: 8vh; width: 100%; border-top: 1px solid black; padding-top: 3vh; }
.atelier-cta p { margin: 0 0 2vh 0; font-size: 2vw; font-weight: 400; }
.atelier-cta a { font-size: 2vw; cursor: url('../img/cursor-black.cur'), pointer; }

/* RESPONSIVE */
@media screen and (max-width: 768px) {
    .vibrant-title { font-size: 15vw; }
    p, .section-header, .project-row, nav a, a, #custom-brevo-form p, #custom-brevo-form input[type="email"], #custom-brevo-form button, .archive-nav, .newsletter-header, .radical-email *, .atelier-header, .atelier-details p, .ticket-row, .atelier-cta p, .atelier-cta a { font-size: 4.5vw !important; }
    .split-container { flex-direction: column; gap: 3vh; }
    nav { justify-content: space-around; gap: 2vw; padding: 0 2%; }
    nav a { font-size: 3.5vw !important; }
    #custom-brevo-form { flex-direction: column; align-items: flex-start; gap: 2vh; }
    #custom-brevo-form input[type="email"] { width: 100%; border-bottom: 1px solid #ccc; padding-bottom: 1vh; }
    .panel { padding-top: 10vh; padding-bottom: 10vh; }
    #home, #image-panel { padding-top: 0; padding-bottom: 0; }
    .newsletter-header, .atelier-header { flex-direction: column; align-items: flex-start; gap: 1vh; }
    .newsletter-header span:nth-child(2), .newsletter-header span:nth-child(3), .atelier-header span:nth-child(2), .atelier-header span:nth-child(3) { text-align: left; }
}


/* FIXED HEIGHT PANELS - ateliers & archives scroll inside */
.fixed-panel {
    height: calc(100vh - var(--nav-height));
    min-height: unset !important;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding-top: 5vh;
    padding-bottom: 2vh;
    box-sizing: border-box;
}