/*@import url(https://db.onlinewebfonts.com/c/da24d3e600802f6abd65ae6893c250be?family=Baby+Garland);*/
@import url(https://db.onlinewebfonts.com/c/96e294248d770c606cd118ba159520e2?family=Judy%27s+Garland);
/*@import url(https://db.onlinewebfonts.com/c/93784f20a3a5af826a74b217fa0786f4?family=Garlando);*/
@import url(https://db.onlinewebfonts.com/c/1c587cd97662ab09cb8ba96867f212e7?family=DINOT-Regular);
@import url(https://db.onlinewebfonts.com/c/ff70d844b657b4659f8e2a8d9dffb6b1?family=Garlands);
@import url(https://db.onlinewebfonts.com/c/aba11e642d5736b5064210067c096af5?family=MANUSCRITE);

@font-face {
    font-family: "Judy's Garland";
    src: url("https://db.onlinewebfonts.com/t/96e294248d770c606cd118ba159520e2.eot");
    src: url("https://db.onlinewebfonts.com/t/96e294248d770c606cd118ba159520e2.eot?#iefix")format("embedded-opentype"),
    url("https://db.onlinewebfonts.com/t/96e294248d770c606cd118ba159520e2.woff2")format("woff2"),
    url("https://db.onlinewebfonts.com/t/96e294248d770c606cd118ba159520e2.woff")format("woff"),
    url("https://db.onlinewebfonts.com/t/96e294248d770c606cd118ba159520e2.ttf")format("truetype"),
    url("https://db.onlinewebfonts.com/t/96e294248d770c606cd118ba159520e2.svg#Judy's Garland")format("svg");
}

@font-face {
    font-family: "manuscrite";
    src: url("https://db.onlinewebfonts.com/t/aba11e642d5736b5064210067c096af5.eot");
    src: url("https://db.onlinewebfonts.com/t/aba11e642d5736b5064210067c096af5.eot?#iefix")format("embedded-opentype"),
    url("https://db.onlinewebfonts.com/t/aba11e642d5736b5064210067c096af5.woff2")format("woff2"),
    url("https://db.onlinewebfonts.com/t/aba11e642d5736b5064210067c096af5.woff")format("woff"),
    url("https://db.onlinewebfonts.com/t/aba11e642d5736b5064210067c096af5.ttf")format("truetype"),
    url("https://db.onlinewebfonts.com/t/aba11e642d5736b5064210067c096af5.svg#MANUSCRITE")format("svg");
}
@font-face {
    font-family: "DINOT-Regular";
    src: url("https://db.onlinewebfonts.com/t/1c587cd97662ab09cb8ba96867f212e7.eot");
    src: url("https://db.onlinewebfonts.com/t/1c587cd97662ab09cb8ba96867f212e7.eot?#iefix")format("embedded-opentype"),
    url("https://db.onlinewebfonts.com/t/1c587cd97662ab09cb8ba96867f212e7.woff2")format("woff2"),
    url("https://db.onlinewebfonts.com/t/1c587cd97662ab09cb8ba96867f212e7.woff")format("woff"),
    url("https://db.onlinewebfonts.com/t/1c587cd97662ab09cb8ba96867f212e7.ttf")format("truetype"),
    url("https://db.onlinewebfonts.com/t/1c587cd97662ab09cb8ba96867f212e7.svg#DINOT-Regular")format("svg");
}
@font-face {
    font-family: "Garlands";
    src: url("https://db.onlinewebfonts.com/t/ff70d844b657b4659f8e2a8d9dffb6b1.eot");
    src: url("https://db.onlinewebfonts.com/t/ff70d844b657b4659f8e2a8d9dffb6b1.eot?#iefix")format("embedded-opentype"),
    url("https://db.onlinewebfonts.com/t/ff70d844b657b4659f8e2a8d9dffb6b1.woff2")format("woff2"),
    url("https://db.onlinewebfonts.com/t/ff70d844b657b4659f8e2a8d9dffb6b1.woff")format("woff"),
    url("https://db.onlinewebfonts.com/t/ff70d844b657b4659f8e2a8d9dffb6b1.ttf")format("truetype"),
    url("https://db.onlinewebfonts.com/t/ff70d844b657b4659f8e2a8d9dffb6b1.svg#Garlands")format("svg");
}

@font-face {
    font-family: "Garlando";
    src: url("https://db.onlinewebfonts.com/t/93784f20a3a5af826a74b217fa0786f4.eot");
    src: url("https://db.onlinewebfonts.com/t/93784f20a3a5af826a74b217fa0786f4.eot?#iefix")format("embedded-opentype"),
    url("https://db.onlinewebfonts.com/t/93784f20a3a5af826a74b217fa0786f4.woff2")format("woff2"),
    url("https://db.onlinewebfonts.com/t/93784f20a3a5af826a74b217fa0786f4.woff")format("woff"),
    url("https://db.onlinewebfonts.com/t/93784f20a3a5af826a74b217fa0786f4.ttf")format("truetype"),
    url("https://db.onlinewebfonts.com/t/93784f20a3a5af826a74b217fa0786f4.svg#Garlando")format("svg");
}

@font-face{font-family:'Biro';
    src:url('../fonts/biro_script/Biro_Script_reduced.woff2') format('woff2');
    font-display:swap
}

:root{
    --b:#1a0002;--b2:#2e0306;--b3:#4a0509;--acc:#c8704a;--acc2:#e8a07a;
    --rose:#f0b8be;--gold:#d4a053;--cream:#f8ede6;--white:#fff;
    --glow:rgba(200,112,74,.55);
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;
    /* Taille de base fluide : sert d'unité rem pour tout le site */
    font-size:clamp(14px, 0.85vw + 12px, 17px);
}
body{background: linear-gradient(rgba(26,0,2,0.85), rgba(26,0,2,0.9)), url('../background.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    background-repeat: no-repeat;
    color:var(--cream);
    font-family:Georgia,serif;
    overflow-x:hidden;
    line-height:1.6;
    font-size:1rem;
    text-wrap:pretty;
}

/* Évite que titres / mots ne débordent sur petits écrans */
h1,h2,h3,h4,h5,h6,p,span,a,li,em{overflow-wrap:break-word;word-break:break-word;hyphens:auto;}

/* ─── NAV ─── */
nav{position:fixed;top:0;left:0;right:0;z-index:100;
    padding:clamp(12px, 2vw, 20px) clamp(16px, 3.5vw, 40px);
    display:flex;justify-content:space-between;align-items:center;
    transition:background .4s,backdrop-filter .4s}
nav.scrolled{background:rgba(26,0,2,.85);backdrop-filter:blur(20px);border-bottom:1px solid rgba(200,112,74,.15)}
.nav-logo{font-family:'Garland',serif;font-size:clamp(1.1rem, 1.8vw, 1.4rem);background:linear-gradient(135deg,var(--rose),var(--acc));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:.05em}
.nav-links{display:flex;gap:clamp(16px, 2.4vw, 32px);list-style:none; font-family: "manuscrite", serif}
.nav-links a{font-size:clamp(.7rem, 1vw, .82rem);letter-spacing:.2em;text-transform:uppercase;color:rgba(248,237,230,.6);text-decoration:none;transition:color .3s;position:relative}
.nav-links a::after{content:'';position:absolute;left:0;bottom:-5px;width:0;height:2px;background:var(--rose);box-shadow:0 0 8px var(--rose);transition:width .35s ease;}
.nav-links a:hover{color:var(--rose)}
.nav-links a:hover::after{width:100%}
.nav-links a:hover,
.nav-links a.active{color:var(--rose);}
.nav-links a:hover::after,
.nav-links a.active::after{width:100%;}

/* ─── BURGER BUTTON (mobile) ─── */
.nav-burger{display:none;width:42px;height:42px;background:transparent;border:none;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:0;z-index:110;}
.nav-burger span{display:block;width:26px;height:2px;background:var(--rose);border-radius:2px;box-shadow:0 0 8px rgba(240,184,190,.4);transition:transform .35s ease,opacity .25s ease;transform-origin:center;}
.nav-burger.open span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.nav-burger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.nav-burger.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* ─── HERO ─── */
#hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden}
.bg-canvas{position:absolute;inset:0;z-index:0}
.orb{position:absolute;border-radius:50%;filter:blur(80px);animation:orbFloat linear infinite;opacity:.8}
.orb1{width:500px;height:500px;background:radial-gradient(circle,rgba(200,112,74,.25),transparent 70%);top:-100px;right:-100px;animation-duration:20s}
.orb2{width:350px;height:350px;background:radial-gradient(circle,rgba(212,160,83,.18),transparent 70%);bottom:0;left:-80px;animation-duration:15s;animation-delay:-7s}
.orb3{width:250px;height:250px;background:radial-gradient(circle,rgba(232,160,168,.2),transparent 70%);top:40%;left:30%;animation-duration:25s;animation-delay:-12s}
.orb4{width:180px;height:180px;background:radial-gradient(circle,rgba(255,200,150,.15),transparent 70%);top:10%;left:60%;animation-duration:18s;animation-delay:-5s}
.orb5{width:300px;height:300px;background:radial-gradient(circle,rgba(180,120,255,.18),transparent 70%);bottom:20%;right:20%;animation-duration:22s;animation-delay:-10s}
.orb6{width:120px;height:120px;background:radial-gradient(circle,rgba(255,255,255,.12),transparent 70%);top:70%;left:10%;animation-duration:12s;animation-delay:-3s}
.orb7{width:220px;height:220px;background:radial-gradient(circle,rgba(120,200,255,.15),transparent 70%);top:50%;right:10%;animation-duration:28s;animation-delay:-15s}
@keyframes orbFloat{0%{transform:translate(0,0) scale(1)}25%{transform:translate(30px,-50px) scale(1.05)}50%{transform:translate(-40px,40px) scale(.95)}75%{transform:translate(20px,60px) scale(1.02)}100%{transform:translate(0,0) scale(1)}}

.hero-lines{position:absolute;inset:0;overflow:hidden;opacity:.06}
.hero-lines::before{content:'';position:absolute;inset:-50%;background:repeating-linear-gradient(70deg,transparent,transparent 40px,rgba(200,112,74,1) 40px,rgba(200,112,74,1) 41px);transform:rotate(-15deg) scale(2)}

.hero-content{position:relative;z-index:2;text-align:center;
    padding:clamp(80px, 14vw, 120px) clamp(20px, 5vw, 40px) clamp(40px, 8vw, 60px);
    max-width:900px}
.hero-eyebrow{font-family:'Biro',cursive;
    font-size:clamp(1rem, 3.2vw, 1.9rem);
    color:var(--acc2);opacity:0;transform:translateY(30px);
    animation:up .9s ease .2s forwards;letter-spacing:.1em}
.hero-title{font-family:'Garland',serif;font-size:clamp(2.5rem, 9vw, 5rem);line-height:.9;opacity:0;transform:translateY(40px);animation:up 1s ease .4s forwards}
.hero-title .line1{
    margin-top: 30px;
    display:block;
    font-size:clamp(2rem, 8vw, 5rem);
    font-family: "manuscrite", cursive;
    font-weight:800;
    line-height:.9;
    letter-spacing:-.03em;
    text-align:center;
    max-width:100%;
}
.hero-title .line2{display:block;background:linear-gradient(135deg,#fff 0%,var(--rose) 0%,var(--acc2) 50%,var(--acc2) 100%);-webkit-background-clip:text;background-clip:text;font-size:.65em;letter-spacing:.05em; margin-right: -200px }
.hero-sub{font-family:'Biro',cursive;
    font-size:clamp(.95rem, 2.4vw, 1.3rem);
    color:rgba(240,184,190,.7);
    margin:clamp(16px, 3vw, 24px) 0 clamp(28px, 6vw, 56px);
    opacity:0;animation:up .9s ease .7s forwards}

/* ─── STATS TICKER ─── */
.stats-row{display:flex;justify-content:center;gap:0;
    font-family: "Garlands", serif;opacity:0;animation:up .9s ease .9s forwards;flex-wrap:wrap}
.stat-box{padding:clamp(14px, 2.4vw, 24px) clamp(18px, 3.2vw, 40px);
    border-left:1px solid rgba(200,112,74,.2);text-align:center;position:relative;overflow:hidden;cursor:default;
    min-width:0;flex:0 1 auto}
.stat-box:first-child{border-left:none}
.stat-box::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(200,112,74,.08),transparent);opacity:0;transition:opacity .4s}
.stat-box:hover::before{opacity:1}
.stat-n{font-family:'Garlands',serif;
    font-size:clamp(1.7rem, 5.5vw, 2.6rem);
    display:inline;line-height:normal;background:linear-gradient(135deg,var(--rose),var(--acc),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.stat-prefix{font-family:'Garlands',serif;
    font-size:clamp(1.7rem, 5.5vw, 2.6rem);
    line-height:normal;background:linear-gradient(135deg,var(--rose),var(--acc),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.stat-l{font-size:clamp(.6rem, 1.4vw, .72rem);
    letter-spacing:.25em;text-transform:uppercase;color:rgba(200,112,74,.7);margin-top:6px}

/* ─── SCROLL CTA ─── */
.scroll-cta{position:absolute;bottom:36px;left:50%;transform:translateX(-50%);z-index:2;opacity:0;animation:fadeIn 1s ease 1.5s forwards;display:flex;flex-direction:column;align-items:center;gap:10px}
.scroll-cta span{font-size:clamp(.55rem, 1.4vw, .7rem);letter-spacing:.3em;text-transform:uppercase;color:rgba(200,112,74,.5)}
.scroll-cta .arr{width:20px;height:20px;border-right:1px solid var(--acc);border-bottom:1px solid var(--acc);transform:rotate(45deg);animation:bounce 2s ease-in-out infinite}
@keyframes bounce{0%,100%{transform:rotate(45deg) translateY(0)}50%{transform:rotate(45deg) translateY(6px)}}

/* ─── MARQUEE BAND ─── */
.marquee-band{background:linear-gradient(to right,var(--acc),var(--gold),var(--acc2),var(--acc));padding:clamp(8px, 1.5vw, 14px) 0;overflow:hidden;position:relative}
.marquee-track{display:flex;gap:0;width:max-content;animation:marquee 20s linear infinite}
.marquee-item{font-family:"manuscrite",serif;
    font-size:clamp(1.1rem, 3.8vw, 2.1rem);
    color:var(--b);
    padding:0 clamp(20px, 4vw, 40px);
    white-space:nowrap;display:flex;align-items:center;gap:20px}
.marquee-sep{opacity:.4;font-size:.7rem}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/*.image-alignee{position:absolute;top:0;right:0;max-width:100%;height:auto;}*/
.image-alignee{
    width:100%;
    height:auto;
    object-fit:cover;
    display:block;
}
/*@media screen and (max-width: 700px){*/
/*    .image-alignee{*/
/*        width:100%;*/
/*        height:auto;*/
/*        object-fit:cover;*/
/*        display:block;*/
/*    }*/
/*}*/

.card img{filter:grayscale(100%);transition:.4s ease;}
.card:hover img{filter:grayscale(0%);transform:scale(1.05);}

/* ─── SECTION BASE ─── */
.sec{padding:clamp(60px, 10vw, 100px) clamp(20px, 4vw, 40px);max-width:1100px;margin:0 auto}
.sec-head{text-align:center;margin-bottom:clamp(40px, 7vw, 70px)}
.sec-tag{font-family:'Biro',cursive;
    font-size:clamp(1rem, 2.6vw, 1.6rem);
    color:var(--acc2);display:block;margin-bottom:8px}
.sec-h{font-family:"manuscrite",serif;
    font-size:clamp(2rem, 5.5vw, 4rem);
    background:linear-gradient(135deg,var(--rose),var(--acc),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1.1}
.sec-line{width:60px;height:2px;background:linear-gradient(to right,transparent,var(--acc),transparent);margin:20px auto 0}

/* ─── SERVICE CARDS ─── */
.cards-wrap{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(200,112,74,.12);border:1px solid rgba(200,112,74,.12)}
.card-2{background:var(--b2);padding:clamp(24px, 4vw, 40px) clamp(20px, 3vw, 32px);position:relative;overflow:hidden;transition:background .4s}
.card{background:var(--b2);padding:clamp(24px, 4vw, 40px) clamp(20px, 3vw, 32px);position:relative;overflow:hidden;transition:background .4s;min-width:0}
.card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(to right,transparent,var(--acc),transparent);transform:scaleX(0);transition:transform .5s ease;transform-origin:center}
.card:hover{background:linear-gradient(145deg,rgba(74,5,9,.9),rgba(26,0,2,1))}
.card:hover::after{transform:scaleX(1)}
.card-num{font-family:'Garland',serif;
    font-size:clamp(2.5rem, 7vw, 4rem);
    color:rgba(200,112,74,.08);position:absolute;top:16px;right:20px;line-height:1;pointer-events:none;transition:color .4s}
.card:hover .card-num{color:rgba(200,112,74,.15)}
.card-tag{font-family:'Biro',cursive;
    font-size:clamp(1.05rem, 2.8vw, 1.9rem);
    color:var(--acc2);letter-spacing:.15em;opacity:.7;margin-bottom:6px}
.card-h{font-family:'Garlands',serif;
    font-size:clamp(1rem, 2vw, 1.4rem);
    color:var(--rose);
    margin-bottom:clamp(18px, 3vw, 30px);
    line-height:1.2}
.plist{list-style:none;display:flex;flex-direction:column;gap:clamp(10px, 2vw, 16px)}
.prow{display:flex;justify-content:space-between;align-items:flex-end;
    padding-bottom:clamp(10px, 2vw, 16px);
    gap:10px;
    border-bottom:1px solid rgba(240,184,190,.07)}
.prow:last-child{border-bottom:none;padding-bottom:0}
.plabel{font-size:clamp(.78rem, 1.6vw, .9rem);
    color:rgba(248,237,230,.8);flex:1;padding-right:12px;line-height:1.4;
    font-family: DINOT-Regular, serif}
.plabel em{display:block;font-size:clamp(.65rem, 1.3vw, .75rem);font-style:normal;color:rgba(200,112,74,.6);margin-top:3px}
.pprice{font-family:'Garland',serif;
    font-size:clamp(1.05rem, 2.8vw, 1.7rem);
    background:linear-gradient(135deg,var(--rose),var(--acc));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;white-space:nowrap;transition:all .3s}
.card:hover .pprice{background:linear-gradient(135deg,#fff,var(--rose),var(--gold));-webkit-background-clip:text;background-clip:text}
.card-badge{display:inline-block;
    padding:clamp(4px, 1vw, 6px) clamp(10px, 1.6vw, 12px);
    border-radius:999px;
    font-size:clamp(.65rem, 1.3vw, .78rem);
    font-weight:600;color:#fff;background:linear-gradient(135deg,#ffb347,#ffcc33);box-shadow:0 0 10px rgba(255,200,80,.4);animation:premiumPulse 2.5s ease-in-out infinite;position:relative;overflow:hidden;}
@keyframes premiumPulse{0%{transform:scale(1);box-shadow:0 0 10px rgba(255,200,80,.3);}50%{transform:scale(1.05);box-shadow:0 0 20px rgba(255,200,80,.6);}100%{transform:scale(1);box-shadow:0 0 10px rgba(255,200,80,.3);}}
.card-note{margin-top:clamp(14px, 2.5vw, 20px);
    padding:clamp(10px, 1.8vw, 12px) clamp(12px, 2vw, 16px);
    border-left:2px solid rgba(200,112,74,.4);background:rgba(200,112,74,.05);
    font-size:clamp(.7rem, 1.4vw, .82rem);
    color:rgba(200,112,74,.8);font-style:italic;line-height:1.5}
.card.wide{grid-column:span 2}

/* ─── CONDITION SECTION ─── */
#condition{padding:clamp(50px, 8vw, 80px) clamp(20px, 4vw, 40px);position:relative;overflow:hidden}
#condition::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(74,5,9,.6),var(--b));z-index:0}
#condition::after{content:'';position:absolute;inset:0;background-image:repeating-linear-gradient(0deg,transparent,transparent 60px,rgba(200,112,74,.03) 60px,rgba(200,112,74,.03) 61px),repeating-linear-gradient(90deg,transparent,transparent 60px,rgba(200,112,74,.03) 60px,rgba(200,112,74,.03) 61px)}
.cond-inner{position:relative;z-index:1;max-width:700px;margin:0 auto;text-align:center}
.cond-frame{border:1px solid rgba(200,112,74,.25);
    padding:clamp(34px, 6vw, 60px) clamp(24px, 5vw, 48px);
    position:relative;background:rgba(26,0,2,.6);backdrop-filter:blur(10px)}
.cond-corner{position:absolute;width:20px;height:20px;border-color:var(--acc);border-style:solid;opacity:.6}
.cc-tl{top:-1px;left:-1px;border-width:2px 0 0 2px}
.cc-tr{top:-1px;right:-1px;border-width:2px 2px 0 0}
.cc-bl{bottom:-1px;left:-1px;border-width:0 0 2px 2px}
.cc-br{bottom:-1px;right:-1px;border-width:0 2px 2px 0}
.cond-icon{font-size:clamp(1.7rem, 4vw, 2.5rem);display:block;margin-bottom:16px;animation:spin 8s linear infinite}
@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.cond-h{font-family:"manuscrite",serif;
    font-size:clamp(1.6rem, 5vw, 2.8rem);
    letter-spacing:.12em;background:linear-gradient(135deg,var(--rose),var(--acc),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:20px}
.cond-text{font-size:clamp(.85rem, 1.8vw, .95rem);color:rgba(248,237,230,.8);line-height:2;margin-bottom:8px}
.cond-accent{font-family:"manuscrite",cursive;
    font-size:clamp(1.2rem, 3vw, 1.8rem);
    color:var(--rose);display:block;margin-top:12px}

/* ─── FOOTER ─── */
footer{background:var(--b);border-top:1px solid rgba(200,112,74,.1);padding:clamp(34px, 6vw, 50px) clamp(20px, 4vw, 40px)}
.foot-name{font-family:"manuscrite",serif;
    font-size:clamp(1.4rem, 4vw, 2rem);
    text-align:center;background:linear-gradient(135deg,var(--rose),var(--acc));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
    margin-bottom:clamp(20px, 4vw, 36px)}
.foot-links{display:flex;justify-content:center;flex-wrap:wrap;gap:16px;
    margin-bottom:clamp(24px, 4vw, 40px);
    font-style:italic;line-height:1.5;}
.foot-link{display:flex;align-items:center;gap:10px;
    padding:clamp(10px, 2vw, 14px) clamp(18px, 3vw, 28px);
    border:1px solid rgba(200,112,74,.25);color:var(--cream);text-decoration:none;
    font-size:clamp(.7rem, 1.4vw, .82rem);
    letter-spacing:.05em;transition:all .35s;position:relative;overflow:hidden}
.foot-link::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(200,112,74,.15),transparent);transform:translateX(-100%);transition:transform .35s}
.foot-link:hover{border-color:var(--acc);color:var(--rose);box-shadow:0 0 30px rgba(200,112,74,.2)}
.foot-link:hover::before{transform:translateX(0)}
.foot-copy{text-align:center;font-size:clamp(.6rem, 1.4vw, .72rem);letter-spacing:.2em;text-transform:uppercase;color:rgba(200,112,74,.25);margin-top:24px; font-family: "manuscrite"}

/* ─── REVEALS ─── */
.rv{opacity:0;transform:translateY(50px);transition:opacity .8s ease,transform .8s ease}
.rv.on{opacity:1;transform:translateY(0)}
.rv-l{opacity:0;transform:translateX(-60px);transition:opacity .8s ease,transform .8s ease}
.rv-l.on{opacity:1;transform:translateX(0)}
.rv-r{opacity:0;transform:translateX(60px);transition:opacity .8s ease,transform .8s ease}
.rv-r.on{opacity:1;transform:translateX(0)}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}.d4{transition-delay:.4s}

/* ─── ANIMATIONS ─── */
@keyframes up{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* ─── RESPONSIVE BREAKPOINTS ─── */
@media (max-width: 1024px){
    .nav-links{gap:24px}
}

@media (max-width: 800px){
    .nav-burger{display:flex}
    .nav-links{
        position:fixed;top:0;right:0;
        width:min(80vw, 340px);height:100vh;
        flex-direction:column;justify-content:center;align-items:center;
        gap:28px;padding:80px 30px 40px;
        background:rgba(26,0,2,.96);backdrop-filter:blur(20px);
        border-left:1px solid rgba(200,112,74,.18);
        box-shadow:-20px 0 60px rgba(0,0,0,.5);
        transform:translateX(100%);transition:transform .45s cubic-bezier(.7,.1,.3,1);
        z-index:105;
    }
    .nav-links.open{transform:translateX(0)}
    .nav-links a{font-size:1rem;letter-spacing:.25em;}
    body.menu-open{overflow:hidden}
    body.menu-open::before{content:'';position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:99;animation:fadeIn .35s ease forwards;}

    .cards-wrap{grid-template-columns:1fr}
    .card.wide{grid-column:span 1}
    .stats-row{gap:0}
    .foot-links{flex-direction:column;align-items:center}
    .foot-link{width:100%;max-width:320px;justify-content:center}
}

@media (max-width: 380px){
    .nav-links{width:100vw; border-left:none}
    .nav-links a{font-size:.95rem}
    .stat-box{padding:14px 16px}
}

/* ──────────────────────────────────────────────
   GALLERY — ALBUMS
   ────────────────────────────────────────────── */

/* boutons navigation lightbox */
.nav{position:absolute;top:50%;transform:translateY(-50%);
    font-size:clamp(28px, 4vw, 40px);
    color:white;background:rgba(0,0,0,0.4);border:none;cursor:pointer;
    padding:clamp(8px, 1.5vw, 10px) clamp(12px, 2vw, 15px);
    border-radius:50%;transition:0.3s;z-index:4;}
.nav:hover{background:rgba(255,255,255,0.2);}
.prev{left:clamp(8px, 2vw, 20px);}
.next{right:clamp(8px, 2vw, 20px);}
.close{position:absolute;
    top:clamp(12px, 2vw, 20px);
    right:clamp(14px, 2.5vw, 25px);
    font-size:clamp(24px, 3.5vw, 30px);color:white;cursor:pointer;z-index:5;}

/* container */
.gallery{padding:clamp(40px, 6vw, 60px) clamp(16px, 4vw, 40px);background:#0f0f10;color:white;}

/* ──── GALLERY TABS — RESPONSIVE INTELLIGENT ────
   Desktop : flex-wrap centré
   Tablette : flex-wrap centré, padding réduit
   Mobile  : scroll horizontal avec snap, scrollbar masquée
   ──────────────────────────────────────────────── */
.gallery-tabs-wrap{
    position:relative;
    margin:0 auto clamp(24px, 4vw, 40px);
    max-width:1400px;
}
.gallery-tabs{
    display:flex;flex-wrap:wrap;justify-content:center;
    gap:clamp(6px, 1vw, 10px);
    text-align:center;
}
.tab{
    font-family:"manuscrite",cursive;
    padding:clamp(8px, 1.6vw, 12px) clamp(16px, 2.8vw, 28px);
    border-radius:30px;border:none;cursor:pointer;
    background:#1c1c1e;color:#aaa;
    transition:.3s;
    font-size:clamp(.85rem, 1.8vw, 1rem);
    letter-spacing:.04em;
    white-space:nowrap;
    flex-shrink:0;
}
.tab.active,.tab:hover{
    background:linear-gradient(135deg,#ffcc66,#ff6b6b);
    color:#000;transform:translateY(-2px);
}

/* le wrapper .grid devient l'empilement vertical des albums */
.grid{display:flex;flex-direction:column;gap:clamp(40px, 6vw, 60px);max-width:1400px;margin:0 auto;}

/* section album */
.album-section{position:relative;padding-top:8px;animation:fadeIn .5s ease both;}

/* titre d'album : nom à gauche, méta (année + compteur) à droite */
.album-title{
    display:flex;align-items:center;justify-content:space-between;
    flex-wrap:wrap;gap:clamp(8px, 1.6vw, 14px);
    margin-bottom:14px;padding-bottom:14px;
    border-bottom:1px solid rgba(255,204,102,.15);
    font-family:"manuscrite",cursive;font-weight:400;
}
.album-title .album-name{
    font-size:clamp(1.4rem, 4vw, 2.4rem);
    background:linear-gradient(135deg,#ffcc66,#ff6b6b);
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
    letter-spacing:.04em;line-height:1;
}
.album-title .album-meta{display:inline-flex;align-items:center;gap:clamp(8px, 1.6vw, 14px);flex-wrap:wrap;}
.album-title .album-year{
    font-family:Georgia, serif;font-style:italic;
    font-size:clamp(.78rem, 1.7vw, .95rem);
    letter-spacing:.18em;color:#ffcc66;
    padding:clamp(3px, .6vw, 4px) clamp(9px, 1.6vw, 12px);
    border:1px solid rgba(255,204,102,.35);
    border-radius:999px;background:rgba(255,204,102,.05);line-height:1;
}
.album-title .album-count{
    font-family:Georgia,serif;font-style:italic;
    font-size:clamp(.7rem, 1.5vw, .85rem);
    letter-spacing:.15em;text-transform:uppercase;color:rgba(255,204,102,.55);
}

/* description sous le titre de l'album (visible dans la galerie globale) */
.album-desc{
    margin:0 0 clamp(16px, 3vw, 22px);
    font-family:DINOT-Regular, serif;
    font-size:clamp(.85rem, 1.9vw, 1rem);
    line-height:1.7;
    color:rgba(255,255,255,.72);
    max-width:780px;
}

/* grille interne d'un album */
.album-grid{display:grid;
    grid-template-columns:repeat(auto-fill, minmax(clamp(140px, 22vw, 220px), 1fr));
    gap:clamp(8px, 1.6vw, 16px);
}

/* item — placeholder sombre pendant le chargement */
.item{
    overflow:hidden;border-radius:16px;position:relative;cursor:pointer;
    background:linear-gradient(135deg,#1c1c1e,#0f0f10);
    opacity:0;transform:translateY(20px);
    animation:fadeIn .6s forwards;
}
.item img{
    width:100%;
    height:clamp(140px, 24vw, 260px);
    object-fit:cover;
    display:block;
    filter:brightness(.6) blur(10px);
    transform:scale(1.04);
    opacity:.6;
    transition:opacity .55s ease, filter .55s ease, transform .55s ease;
    will-change:transform,filter,opacity;
}
.item img.loaded{
    opacity:1;
    filter:brightness(.9);
    transform:scale(1);
}
.item:hover img.loaded{transform:scale(1.12);filter:brightness(1.1);}
.item::after{content:"";position:absolute;inset:0;border-radius:16px;border:1px solid transparent;pointer-events:none;transition:.4s;}
.item:hover::after{border:1px solid rgba(255,204,102,.6);box-shadow:0 0 25px rgba(255,204,102,.3);}

/* ──────────────────────────────────────────────
   LIGHTBOX (image centrée + pastille flottante)
   ────────────────────────────────────────────── */
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,0.92);display:none;align-items:center;justify-content:center;z-index:999;}
.lightbox img{max-width:92%;max-height:82vh;border-radius:12px;animation:zoomIn .3s ease;box-shadow:0 20px 60px rgba(0,0,0,.6);}
@keyframes zoomIn{from{transform:scale(.8);}to{transform:scale(1);}}

/* Spinner de chargement */
.lb-spinner{
    position:absolute;top:50%;left:50%;
    width:clamp(36px, 6vw, 48px);
    height:clamp(36px, 6vw, 48px);
    margin:calc(-1 * clamp(18px, 3vw, 24px)) 0 0 calc(-1 * clamp(18px, 3vw, 24px));
    border:3px solid rgba(255,204,102,.18);
    border-top-color:#ffcc66;
    border-radius:50%;
    opacity:0;
    pointer-events:none;
    z-index:2;
    transition:opacity .2s ease;
}
.lightbox.loading .lb-spinner{
    opacity:1;
    animation:lbSpin .9s linear infinite;
}
@keyframes lbSpin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

.lightbox.loading img{opacity:.25;transition:opacity .2s ease;}

/* Pastille flottante */
.lightbox-caption{
    position:absolute;
    top:clamp(12px, 2.5vw, 24px);left:50%;transform:translateX(-50%);
    display:none;align-items:center;
    gap:clamp(8px, 1.6vw, 14px);
    padding:clamp(7px, 1.4vw, 10px) clamp(14px, 2.5vw, 22px);
    background:rgba(0,0,0,.55);
    backdrop-filter:blur(10px);
    border:1px solid rgba(255,204,102,.25);
    border-radius:999px;
    font-family:"manuscrite", cursive;
    color:#ffcc66;
    letter-spacing:.06em;
    z-index:3;
    animation:capIn .35s ease;
    max-width:90vw;
}
.lightbox.show-caption .lightbox-caption{display:inline-flex;}
.lightbox-caption .lc-album{
    font-size:clamp(.9rem, 2vw, 1.15rem);
    background:linear-gradient(135deg,#ffcc66,#ff6b6b);
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
    white-space:nowrap;
}
.lightbox-caption .lc-counter{
    font-family:Georgia,serif;font-style:italic;
    font-size:clamp(.65rem, 1.4vw, .78rem);
    letter-spacing:.18em;text-transform:uppercase;
    color:rgba(255,204,102,.65);
    padding-left:clamp(8px, 1.6vw, 14px);
    border-left:1px solid rgba(255,204,102,.25);
}
@keyframes capIn{from{opacity:0;transform:translate(-50%,-8px);}to{opacity:1;transform:translate(-50%,0);}}

/* ──────────────────────────────────────────────
   RESPONSIVE — GALERIE
   ────────────────────────────────────────────── */

/* Tablette / mobile large */
@media (max-width: 800px){
    .album-grid{gap:10px}

    /* Onglets : on garde le wrap mais plus compact */
    .gallery-tabs{gap:6px}
    .tab{
        padding:8px 18px;
        font-size:.88rem;
        letter-spacing:.03em;
    }
}

/* Mobile : scroll horizontal pour les onglets quand il y a beaucoup d'albums */
@media (max-width: 600px){
    .gallery-tabs-wrap{
        margin-left:calc(-1 * clamp(16px, 4vw, 40px));
        margin-right:calc(-1 * clamp(16px, 4vw, 40px));
        padding-left:clamp(16px, 4vw, 40px);
        padding-right:clamp(16px, 4vw, 40px);
        /* Indicateurs visuels que ça scroll : dégradés sur les bords */
        -webkit-mask-image:linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%);
                mask-image:linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%);
    }
    .gallery-tabs{
        flex-wrap:nowrap;
        justify-content:flex-start;
        overflow-x:auto;
        overflow-y:hidden;
        scroll-snap-type:x proximity;
        scroll-padding:0 clamp(16px, 4vw, 40px);
        -webkit-overflow-scrolling:touch;
        padding:4px 4px 12px;
        gap:8px;
        scrollbar-width:none;        /* Firefox */
        -ms-overflow-style:none;     /* IE/Edge */
    }
    .gallery-tabs::-webkit-scrollbar{display:none}  /* Chrome/Safari */
    .tab{
        scroll-snap-align:center;
        padding:7px 16px;
        font-size:.85rem;
    }
}

/* Petits mobiles */
@media (max-width: 480px){
    .album-grid{grid-template-columns:repeat(2, 1fr);gap:8px;}
    .item img{height:clamp(130px, 38vw, 180px);}

    /* Titre album : empilé proprement */
    .album-title{flex-direction:column;align-items:flex-start;gap:8px;}
    .album-title .album-meta{width:100%;justify-content:flex-start;}

    .tab{padding:6px 14px;font-size:.82rem;}

    /* Lightbox : navigation plus proche des bords sur petit écran */
    .nav{font-size:24px;padding:6px 10px}
    .lightbox img{max-width:96%}
}

/* Très petits écrans */
@media (max-width: 360px){
    .tab{padding:6px 12px;font-size:.78rem;letter-spacing:.02em}
    .album-title .album-name{font-size:1.3rem}
    .album-desc{font-size:.85rem;line-height:1.55}
}

/* ─── Préférence accessibilité : moins d'animations ─── */
@media (prefers-reduced-motion: reduce){
    *,*::before,*::after{
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
        transition-duration:.01ms !important;
        scroll-behavior:auto !important;
    }
}