nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 500;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 44px;
  background: rgba(8,8,16,.92);
  backdrop-filter: blur(14px);
  border-top: 1px solid rgba(255,255,255,.06);
  border-bottom: 2px solid rgba(200,155,224,.25);
  transition: padding .3s;
}
@media(max-width:768px) {
  nav { padding: 12px 20px; }
}

/* Yvet Tatouage — Style.css */
/* Studio Ale Project — St Maximin 83 */

:root{--bg:#080810;--bg2:#0f0f1a;--ink:#f0ece0;--ink2:rgba(240,236,224,.6);--ink3:rgba(240,236,224,.22);--pu:#c89be0;--or:#f4a261;--te:#74d7b8;--pi:#e07b9a;--f:'Jost',sans-serif}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--f);background:var(--bg);color:var(--ink);overflow-x:hidden;cursor:none}
.cur{position:fixed;width:11px;height:11px;border-radius:50%;background:var(--pu);pointer-events:none;z-index:9999;transform:translate(-50%,-50%);mix-blend-mode:screen;transition:width .18s,height .18s}
.crr{position:fixed;width:34px;height:34px;border-radius:50%;border:1px solid rgba(200,155,224,.4);pointer-events:none;z-index:9998;transform:translate(-50%,-50%);transition:width .18s,height .18s}
#sp{position:fixed;inset:0;z-index:2000;background:var(--bg);display:flex;align-items:center;justify-content:center;transition:opacity .9s,visibility .9s}
#sp.hide{opacity:0;visibility:hidden;pointer-events:none}
#sp img{width:240px;mix-blend-mode:screen;filter:brightness(1.1);opacity:0;transform:scale(.72) rotate(-8deg);animation:spIn 1s cubic-bezier(.23,1,.32,1) forwards .3s}
@keyframes spIn{0%{opacity:0;transform:scale(.72) rotate(-8deg)}60%{opacity:1;transform:scale(1.05) rotate(2deg)}100%{opacity:1;transform:scale(1) rotate(0)}}


ul.nm{display:flex;gap:36px;list-style:none}
ul.nm a{font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--ink2);text-decoration:none;transition:color .25s}

#hero{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:100px 44px 60px;text-align:center}
.gl{position:absolute;border-radius:50%;pointer-events:none;filter:blur(80px)}
.g1{width:480px;height:480px;background:rgba(200,155,224,.09);top:-80px;right:-80px;animation:d1 13s ease-in-out infinite}
.g2{width:300px;height:300px;background:rgba(244,162,97,.06);bottom:60px;left:-40px;animation:d2 16s ease-in-out infinite}
@keyframes d1{0%,100%{transform:translate(0,0)}50%{transform:translate(-28px,28px)}}
@keyframes d2{0%,100%{transform:translate(0,0)}50%{transform:translate(18px,-22px)}}
.hc{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center}
@keyframes logoFloat{0%,100%{transform:translateY(0) rotate(0deg)}40%{transform:translateY(-7px) rotate(1deg)}70%{transform:translateY(-3px) rotate(-.5deg)}}
@keyframes fu{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

.htag{margin-top:26px;font-size:24px;font-weight:300;letter-spacing:.03em;color:var(--ink2);max-width:420px;line-height:1.6;opacity:0;animation:fu .8s ease forwards 1.15s}
.htag strong{font-weight:600;color:var(--pu)}
.hbts{margin-top:32px;display:flex;gap:12px;opacity:0;animation:fu .7s ease forwards 1.35s}

.btn{font-family:var(--f);font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;padding:12px 28px;border-radius:50px;cursor:none;transition:all .25s;border:none;display:inline-block}
.bp{background:linear-gradient(135deg,var(--pu),var(--pi));color:#080810}

.bg{background:transparent;color:var(--ink);border:1px solid rgba(255,255,255,.16)}

section{padding:72px 44px;position:relative;overflow:hidden}
.sa{background:var(--bg2)}
.slbl{font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;margin-bottom:6px;display:block}
.stit{font-size:46px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;line-height:1;margin-bottom:4px}
.sh2{display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-bottom:32px;position:relative;z-index:2}
.brush{display:block;margin-top:6px;overflow:visible}

/* ── FLASH GRID ── */

.fc{border-radius:10px;overflow:hidden;position:relative;background:#fff;outline:2px solid rgba(200,155,224,.45);cursor:none;transition:outline-color .3s,box-shadow .3s}
.fc img{width:100%;height:auto;display:block;transition:transform .5s cubic-bezier(.23,1,.32,1)}
.fc:hover{outline-color:rgba(200,155,224,.92);box-shadow:0 0 0 3px rgba(200,155,224,.08),0 8px 28px rgba(200,155,224,.15)}
.fc:hover img{transform:scale(1.05)}
.fc::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(200,155,224,.14) 0%,transparent 55%);opacity:0;transition:opacity .35s ease;pointer-events:none;z-index:1}
.fc:hover::after{opacity:1}
.fb{position:absolute;top:8px;right:8px;font-size:8px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:4px 9px;border-radius:20px;background:#74d7b8;color:#080810;z-index:2}
.fc.pris .fb{background:rgba(0,0,0,.32);color:rgba(255,255,255,.28)}
.fc.pris img{opacity:.3;filter:grayscale(1)}

/* ── MASONRY TATTOO ── */

/* ── DESSIN ── */
.dg{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px;position:relative;z-index:2}
.dc{border-radius:12px;overflow:hidden;background:#fff;outline:2px solid rgba(116,215,184,.38);cursor:none;transition:all .35s cubic-bezier(.23,1,.32,1)}
.dc:hover{transform:translateY(-4px) rotate(-.4deg);outline-color:rgba(116,215,184,.9);box-shadow:0 14px 36px rgba(116,215,184,.09)}
.dc .iw{aspect-ratio:4/5;background:#f5f5f5;display:flex;align-items:center;justify-content:center;overflow:hidden}
.dc .iw img{width:100%;height:100%;object-fit:cover}
.di{padding:11px 13px;background:#fff}
.di strong{font-size:13px;font-weight:600}
.di p{font-size:11px;color:#888;margin-top:2px}

/* ── ABOUT ── */
#about{display:grid;grid-template-columns:300px 1fr;gap:52px;align-items:center;padding:72px 44px}
.ai{aspect-ratio:3/4;border-radius:130px 130px 28px 28px;background:rgba(200,155,224,.07);border:1.5px solid rgba(200,155,224,.18);overflow:hidden;display:flex;align-items:center;justify-content:center}
.ai img{width:100%;height:100%;object-fit:cover}
.at h2{font-size:40px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;margin-bottom:14px;line-height:1.15}
.at h2 em{font-style:italic;font-weight:200;color:var(--pu)}
.at p{font-size:14px;line-height:1.9;color:var(--ink2);margin-bottom:12px}
.tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:18px}
.tag{font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:5px 13px;border-radius:20px;border:1px solid}
.tp{border-color:var(--pu);color:var(--pu)}.to{border-color:var(--or);color:var(--or)}.tt{border-color:var(--te);color:var(--te)}

/* ── CONTACT ── */
#contact{text-align:center;padding:88px 44px;position:relative;overflow:hidden}
.cl{width:72px;mix-blend-mode:screen;margin:0 auto 18px;display:block;opacity:.55}
#contact h2{font-size:44px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;margin-bottom:8px;position:relative;z-index:2}
#contact h2 em{font-style:italic;font-weight:200;color:var(--pu)}
#contact p.sub{font-size:13px;color:var(--ink2);margin-bottom:32px;position:relative;z-index:2}
.cls{display:flex;justify-content:center;gap:11px;flex-wrap:wrap;position:relative;z-index:2}
.cl2{display:flex;align-items:center;gap:9px;padding:13px 22px;border-radius:11px;border:1px solid rgba(255,255,255,.1);color:var(--ink);text-decoration:none;font-size:13px;font-weight:500;transition:all .25s;background:rgba(255,255,255,.03);cursor:none}

footer{padding:22px 44px;border-top:1px solid rgba(255,255,255,.05);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}
footer img{height:42px;mix-blend-mode:screen;opacity:.5}
footer p{font-size:11px;color:var(--ink3)}
.sep{height:1px;background:linear-gradient(to right,transparent,rgba(200,155,224,.15),rgba(244,162,97,.1),transparent)}
.rv{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.rv.visible{opacity:1;transform:translateY(0)}
.ph{opacity:.14}

/* ── LIGHTBOX ── */
#lb{display:none;position:fixed;inset:0;z-index:3000;background:rgba(8,8,16,.96);align-items:center;justify-content:center;cursor:none}
#lb.open{display:flex}
#lb img{max-width:94vw;max-height:94vh;border-radius:8px;object-fit:contain;box-shadow:0 0 80px rgba(0,0,0,.8)}
#lb-close{position:fixed;top:24px;right:28px;background:none;border:none;color:rgba(240,236,224,.6);font-size:28px;cursor:none;transition:color .2s;z-index:3001}
#lb-close:hover{color:var(--pu)}
#lb-prev,#lb-next{position:fixed;top:50%;transform:translateY(-50%);background:rgba(200,155,224,.12);border:1px solid rgba(200,155,224,.25);color:var(--ink);font-size:22px;padding:12px 18px;border-radius:8px;cursor:none;transition:background .2s;z-index:3001}
#lb-prev{left:20px}#lb-next{right:20px}
#lb-prev:hover,#lb-next:hover{background:rgba(200,155,224,.28)}

@media(prefers-reduced-motion:reduce){.rv{opacity:1!important;transform:none!important;transition:none!important}}
.hcat {
  font-size: 48px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(240,236,224,.88);
  opacity: 0;
  animation: fu .7s ease forwards .55s;
  margin: 0;
  line-height: 1;
}

@media(max-width:768px){
  ul.nm{display:none}
  section{padding:50px 20px}#about{grid-template-columns:1fr;gap:28px}
  .ai{max-height:260px;border-radius:80px 80px 20px 20px}
  footer{padding:16px 20px}.htag{font-size:19px}.stit{font-size:30px}
  #contact h2{font-size:30px}.at h2{font-size:28px}
  .fg{grid-template-columns:repeat(3,1fr)}
  .mg{columns:3 100px}
  #lb img{max-width:98vw;max-height:90vh}
  #lb-prev{left:8px}#lb-next{right:8px}
}

/* ── CAROUSEL FLASH ── */
.carousel-wrap{position:relative;overflow:visible;padding:40px 0}
.carousel-track{display:flex;gap:16px;transition:transform 0.85s cubic-bezier(0.4,0,0.2,1);will-change:transform}
.carousel-slide{flex:0 0 240px;border-radius:10px;background:#fff;outline:2px solid transparent;transition:transform .85s cubic-bezier(.25,.46,.45,.94),opacity .7s ease,filter .7s ease;opacity:.3;transform:scale(.88);cursor:none}
.carousel-slide.active{opacity:1;transform:scale(1.18);outline-color:rgba(200,155,224,.9)}


.carousel-slide img{width:100%;height:auto;display:block;transition:transform .5s cubic-bezier(.23,1,.32,1)}
.carousel-nav{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:12px;position:relative;z-index:2}

.cnav-btn svg path{transition:opacity .25s}
.cnav-btn:hover svg path{opacity:0.32}
.carousel-dots{display:flex;gap:5px;align-items:center}
.cdot{width:4px;height:4px;border-radius:50%;background:rgba(240,236,224,.2);transition:all .35s;cursor:none}
.cdot.active{width:18px;border-radius:2px;background:#c89be0}
.carousel-counter{font-size:10px;font-weight:500;letter-spacing:.18em;color:rgba(240,236,224,.25);min-width:44px;text-align:center}

/* ── CAROUSEL TATTOO ── */
.tc-wrap{position:relative;overflow:visible;padding:40px 0}
.tc-track{display:flex;gap:16px;transition:transform 0.85s cubic-bezier(0.4,0,0.2,1);will-change:transform}
.tc-slide{flex:0 0 340px;border-radius:10px;background:#fff;outline:2px solid transparent;transition:transform .85s cubic-bezier(.25,.46,.45,.94),opacity .7s ease,filter .7s ease;opacity:.3;transform:scale(.82);cursor:none}
.tc-slide.active{opacity:1;transform:scale(1.18);outline-color:rgba(244,162,97,.9)}


.tc-slide img{width:100%;height:auto;display:block}

/* ── BOUNCE HOVER ── */
}

/* Nav links */
ul.nm a {
  display: inline-block;
}

/* Bouton Contact nav */

/* Boutons hero */
.btn {
  display: inline-block;
  transform-origin: center bottom;
}

/* Boutons flèche carousel */

/* Tags section about */
.tag {
  display: inline-block;
  transform-origin: center bottom;
  transition: color .25s, border-color .25s;
}

/* Liens contact */
.cl2 {
  transform-origin: center bottom;
}

@keyframes logo-bounce {
  0%   { transform: scale(0.88) translateY(0); }
  25%  { transform: scale(0.9) translateY(-10px); }
  45%  { transform: scale(0.88) translateY(0px); }
  62%  { transform: scale(0.9) translateY(-5px); }
  78%  { transform: scale(0.88) translateY(0px); }
  90%  { transform: scale(0.89) translateY(-2px); }
  100% { transform: scale(0.88) translateY(0); }
}
@keyframes logo-float {
  0%,100% { transform: scale(0.88) translateY(0px) rotate(0deg); }
  30%     { transform: scale(0.89) translateY(-5px) rotate(0.5deg); }
  65%     { transform: scale(0.88) translateY(-2px) rotate(-0.3deg); }
}

@keyframes logo-hero-bounce {
  0%   { transform: translateY(0) rotate(0deg) scale(1); }
  20%  { transform: translateY(-18px) rotate(2deg) scale(1.04); }
  40%  { transform: translateY(0px) rotate(0deg) scale(1); }
  58%  { transform: translateY(-9px) rotate(1deg) scale(1.02); }
  74%  { transform: translateY(0px) rotate(0deg) scale(1); }
  88%  { transform: translateY(-4px) rotate(0.5deg) scale(1.01); }
  100% { transform: translateY(0) rotate(0deg) scale(1); }
}
@keyframes logo-hero-float {
  0%,100% { transform: translateY(0px) rotate(0deg); }
  35%     { transform: translateY(-8px) rotate(1.2deg); }
  65%     { transform: translateY(-3px) rotate(-0.6deg); }
}

@keyframes balloon-pull {
  0%   { transform: translateY(0px) rotate(0deg); }
  10%  { transform: translateY(-55px) rotate(5deg); }
  25%  { transform: translateY(-28px) rotate(-3deg); }
  38%  { transform: translateY(-62px) rotate(4deg); }
  52%  { transform: translateY(-18px) rotate(-2deg); }
  66%  { transform: translateY(-48px) rotate(3deg); }
  78%  { transform: translateY(-8px) rotate(-1deg); }
  90%  { transform: translateY(-20px) rotate(1.5deg); }
  100% { transform: translateY(0px) rotate(0deg); }
}



.hloc {
  font-size: 9px;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--te);
  opacity: 0;
  animation: fu .7s ease forwards .8s;
  margin: 5px 0 0 0;
}
@media(max-width:768px){
  .hlogo { width: 260px; }
  .hcat  { font-size: 48px; }
}

/* ── BOUTONS : flottaison douce ── */
@keyframes btn-float {
  0%,100% { transform: translateY(0px); }
  40%     { transform: translateY(-5px); }
  70%     { transform: translateY(-2px); }
}
ul.nm a { display: inline-block; }
ul.nm a:hover {
  color: var(--pu);
  animation: btn-float 1.2s ease-in-out forwards;
}
.nc:hover {
  animation: btn-float 1.2s ease-in-out forwards;
}
.btn:hover {
  animation: btn-float 1.2s ease-in-out forwards;
  filter: brightness(1.08);
}
.cnav-btn:hover {
  animation: btn-float 1.2s ease-in-out forwards;
  filter: brightness(1.5);
}
.tag:hover {
  animation: btn-float 1.2s ease-in-out forwards;
}
.cl2:hover {
  animation: btn-float 1.2s ease-in-out forwards;
  border-color: var(--pu);
  background: rgba(200,155,224,.07);
}

/* ── CAROUSEL IMAGES : bords arrondis ── */
.carousel-slide img { border-radius: 8px; }
.tc-slide img { border-radius: 8px; }

/* ── CAROUSEL DESSIN ── */
.dc-wrap{position:relative;overflow:visible;padding:40px 0}
.dc-track{display:flex;gap:16px;transition:transform 0.85s cubic-bezier(0.4,0,0.2,1);will-change:transform}
.dc-slide{flex:0 0 300px;border-radius:10px;background:#fff;outline:2px solid transparent;transition:transform .85s cubic-bezier(.25,.46,.45,.94),opacity .7s ease,filter .7s ease;opacity:.3;transform:scale(.82);cursor:none}
.dc-slide.active{opacity:1;transform:scale(1.18);outline-color:rgba(116,215,184,.9)}


.dc-slide img { width:100%; display:block; border-radius:8px; }

/* ── CAROUSEL PEINTURE ── */
.pc-wrap{position:relative;overflow:visible;padding:40px 0}
.pc-track{display:flex;gap:16px;align-items:center;transition:transform 0.85s cubic-bezier(0.4,0,0.2,1);will-change:transform}
.pc-slide{flex:0 0 300px;border-radius:10px;outline:2px solid transparent;transition:transform .85s cubic-bezier(.25,.46,.45,.94),opacity .7s ease,filter .7s ease;opacity:.3;transform:scale(.82);cursor:none;background:none}
.pc-slide.active{opacity:1;transform:scale(1.18);outline-color:rgba(224,123,154,.9)}
.pc-slide img{width:100%;height:auto;display:block;border-radius:8px}


.pc-slide img { width:100%; display:block; border-radius:8px; }

/* Dots peinture compacts */
#pc-dots .cdot { width: 3px; height: 3px; }
#pc-dots .cdot.active { width: 14px; }
.carousel-nav { flex-wrap: nowrap; }

/* ── MOBILE FIXES ── */
@media(max-width:768px){
  /* Nav carousel */
  .carousel-nav { gap:10px; margin-top:16px; flex-wrap:nowrap }
  .cnav-btn svg { width:52px !important; height:36px !important }
  .carousel-counter { font-size:9px; min-width:36px }
  .carousel-dots { gap:4px }
  .cdot { width:3px !important; height:3px !important }
  .cdot.active { width:12px !important }

  /* Sections padding */
  section { padding:40px 16px }
  #about { padding:40px 16px; grid-template-columns:1fr; gap:24px }

  /* Hero */
  .hlogo { width:220px !important }
  .hcat { font-size:26px !important }

  /* Nav */
  nav { padding:10px 16px }
  ul.nm { gap:16px }
  ul.nm a { font-size:9px }

  /* Titres sections */
  .stit { font-size:28px }

  /* Contact liens */
  .cls { flex-direction:column; align-items:center }
  .cl2 { width:100%; justify-content:center; max-width:280px }

  /* Footer */
  footer { padding:14px 16px; flex-direction:column; align-items:center; gap:6px }

  /* About */
  .ai { max-height:220px }
  .at h2 { font-size:24px }
}

/* ── LED ACTIVE MOBILE — halo constant via ::after ──
   fc-neon/tc-neon etc. sont des animations 23s qui clignotent → peu visibles.
   Le ::after donne un halo permanent, indépendant du filter animation. */
@media(max-width:768px) {
  .carousel-slide.active::after,
  .tc-slide.active::after,
  .dc-slide.active::after,
  .pc-slide.active::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    z-index: -1;
    transition: box-shadow .6s ease;
  }
  #flash    .carousel-slide.active::after { box-shadow: 0 0 20px 5px rgba(200,155,224,.80), 0 0 50px 10px rgba(200,155,224,.40), 0 8px 35px 3px rgba(200,155,224,.30); }
  #tattoo   .tc-slide.active::after       { box-shadow: 0 0 20px 5px rgba(244,162,97,.80),  0 0 50px 10px rgba(244,162,97,.40),  0 8px 35px 3px rgba(244,162,97,.30);  }
  #dessin   .dc-slide.active::after       { box-shadow: 0 0 20px 5px rgba(116,215,184,.80), 0 0 50px 10px rgba(116,215,184,.40), 0 8px 35px 3px rgba(116,215,184,.30); }
  #peinture .pc-slide.active::after       { box-shadow: 0 0 20px 5px rgba(224,123,154,.80), 0 0 50px 10px rgba(224,123,154,.40), 0 8px 35px 3px rgba(224,123,154,.30); }
}

@media(max-width:480px){
  ul.nm { display:none }
  /* Slides encore plus petites sur 480px */
  .carousel-slide { flex: 0 0 216px !important; }
  .tc-slide        { flex: 0 0 190px !important; }
  .dc-slide        { flex: 0 0 180px !important; }
  .pc-slide        { flex: 0 0 180px !important; }
  .hlogo { width:180px !important }
  .hcat { font-size:22px !important }
  .stit { font-size:22px }
}

.hstudio {
  font-size: 17px;
  font-weight: 400;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: rgba(240,236,224,.92);
  opacity: 0;
  animation: fu .7s ease forwards .7s;
  margin: 3px 0 0 0;
}

/* ── FORMULAIRE RDV ── */
.rdv-form { text-align: left; }
.rdv-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.rdv-field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.rdv-full { grid-column: 1 / -1; }
.rdv-field label { font-size: 9px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--ink2); }
.rdv-field input, .rdv-field select, .rdv-field textarea {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 8px;
  padding: 12px 16px;
  color: var(--ink);
  font-family: var(--f);
  font-size: 13px;
  transition: border-color .25s, background .25s;
  outline: none;
  width: 100%;
  resize: vertical;
}
.rdv-field input:focus, .rdv-field select, .rdv-field textarea:focus {
  border-color: var(--or);
  background: rgba(244,162,97,.05);
}
.rdv-field select { cursor: none; appearance: none; }
.rdv-field select option { background: #0f0f1a; color: var(--ink); }
.rdv-submit {
  width: 100%;
  padding: 16px;
  font-size: 11px;
  letter-spacing: .2em;
  margin-top: 8px;
  background: linear-gradient(135deg, var(--or), var(--pi));
  color: #080810;
  border: none;
  cursor: none;
}
.rdv-submit:hover { filter: brightness(1.1); }
@media(max-width:768px) {
  .rdv-row { grid-template-columns: 1fr; }
}

/* ── BOUTON RDV SECTION ABOUT ── */
.btn-rdv-about {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 28px;
  padding: 16px 36px;
  background: linear-gradient(135deg, var(--or), var(--pi));
  color: #080810;
  font-family: var(--f);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 50px;
  cursor: none;
  transition: transform .25s, box-shadow .25s, filter .25s;
}
.btn-rdv-about:hover {
  transform: translateY(-3px);
  filter: brightness(1.08);
  box-shadow: 0 12px 32px rgba(244,162,97,.35), 0 4px 16px rgba(224,123,154,.25);
  animation: btn-float 1.2s ease-in-out forwards;
}
@media(max-width:768px) {
  .btn-rdv-about { width: 100%; justify-content: center; margin-top: 24px; }
}
.nc, .nc-rdv {
  font-family: var(--f);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-decoration: none;
  padding: 9px 20px;
  border-radius: 40px;
  cursor: none;
  border: 1.5px solid;
  display: inline-block;
  transition: transform .25s, filter .25s, background .25s;
}
.nc {
  color: var(--pu);
  border-color: rgba(200,155,224,.55);
  background: rgba(200,155,224,.08);
}
.nc:hover {
  background: rgba(200,155,224,.18);
  border-color: var(--pu);
  animation: btn-float 1.2s ease-in-out forwards;
}
.nc-rdv {
  color: var(--pu);
  border-color: rgba(200,155,224,.55);
  background: rgba(200,155,224,.08);
}
.nc-rdv:hover {
  background: rgba(200,155,224,.18);
  border-color: var(--pu);
  animation: btn-float 1.2s ease-in-out forwards;
}

/* ── EFFET LED NÉON ── */

/* Boutons hero : Voir les flashs (violet) + Instagram (contour) */
.bp:hover {
  box-shadow: 0 0 10px rgba(200,155,224,.6), 0 4px 30px rgba(200,155,224,.35), 0 8px 60px rgba(200,155,224,.15);
  filter: brightness(1.08);
}
.bg:hover {
  border-color: var(--pu);
  color: var(--pu);
  box-shadow: 0 0 10px rgba(200,155,224,.4), 0 4px 24px rgba(200,155,224,.2), 0 8px 50px rgba(200,155,224,.1);
}

/* Bouton RDV nav */
.nc-rdv:hover {
  box-shadow: 0 0 10px rgba(200,155,224,.55), 0 4px 28px rgba(200,155,224,.3), 0 8px 60px rgba(200,155,224,.14);
}

/* Boutons Instagram dans les sections */
.btn.bg:hover {
  border-color: var(--pu);
  color: var(--pu);
  box-shadow: 0 0 10px rgba(200,155,224,.4), 0 4px 24px rgba(200,155,224,.2), 0 8px 50px rgba(200,155,224,.1);
}

/* Slides flash actives — lueur violette */
.carousel-slide.active {
  
}

/* Slides tattoo actives — lueur orange */
.tc-slide.active {
  
}

/* Slides dessin actives — lueur teal */
.dc-slide.active {
  
}

/* Slides peinture actives — lueur rose */
.pc-slide.active {
  
}

/* ── BOUTONS CAROUSEL PILL ── */
.cnav-pill {
  font-family: var(--f);
  font-size: 16px;
  font-weight: 500;
  padding: 8px 20px;
  border-radius: 40px;
  border: 1.5px solid;
  cursor: none;
  transition: all .25s;
  background: none;
  letter-spacing: .05em;
}
.cnav-pill:hover {
  animation: btn-float 1.2s ease-in-out forwards;
  filter: brightness(1.5);
  box-shadow: 0 0 10px currentColor, 0 4px 24px currentColor;
}

/* ── NÉON IRRÉGULIER SYNCHRONISÉ ── */
@keyframes neon-flicker {
  /* Allumage lent */
  0%    { filter: drop-shadow(0 6px 30px rgba(200,155,224,.35)) drop-shadow(0 12px 60px rgba(200,155,224,.18)) drop-shadow(0 24px 100px rgba(200,155,224,.08)); }
  2%    { filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)) drop-shadow(0 60px 220px rgba(200,155,224,.15)); }
  /* Micro coupure */
  3.5%  { filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)); }
  3.8%  { filter: drop-shadow(0 2px 8px rgba(200,155,224,.08)); }
  4%    { filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)) drop-shadow(0 60px 220px rgba(200,155,224,.15)); }
  /* Double blink */
  9%    { filter: drop-shadow(0 2px 10px rgba(200,155,224,.12)); }
  9.3%  { filter: drop-shadow(0 7px 44px rgba(200,155,224,.88)) drop-shadow(0 16px 80px rgba(200,155,224,.58)) drop-shadow(0 32px 140px rgba(200,155,224,.28)); }
  9.6%  { filter: drop-shadow(0 2px 6px rgba(200,155,224,.06)); }
  10%   { filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)) drop-shadow(0 60px 220px rgba(200,155,224,.15)); }
  /* Triple flutter */
  19.4% { filter: drop-shadow(0 2px 8px rgba(200,155,224,.07)); }
  19.6% { filter: drop-shadow(0 7px 44px rgba(200,155,224,.85)) drop-shadow(0 16px 78px rgba(200,155,224,.55)); }
  19.9% { filter: drop-shadow(0 1px 4px rgba(200,155,224,.03)); }
  20.2% { filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)) drop-shadow(0 60px 220px rgba(200,155,224,.15)); }
  /* Dimming progressif */
  38%   { filter: drop-shadow(0 6px 36px rgba(200,155,224,.62)) drop-shadow(0 14px 68px rgba(200,155,224,.38)) drop-shadow(0 28px 120px rgba(200,155,224,.2)); }
  40%   { filter: drop-shadow(0 8px 48px rgba(200,155,224,.92)) drop-shadow(0 18px 88px rgba(200,155,224,.62)) drop-shadow(0 35px 155px rgba(200,155,224,.32)); }
  40.5% { filter: drop-shadow(0 3px 14px rgba(200,155,224,.22)); }
  40.8% { filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)) drop-shadow(0 60px 220px rgba(200,155,224,.15)); }
  /* Flutter rapide */
  52.4% { filter: drop-shadow(0 6px 38px rgba(200,155,224,.72)) drop-shadow(0 14px 72px rgba(200,155,224,.45)); }
  52.6% { filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)); }
  52.9% { filter: drop-shadow(0 3px 12px rgba(200,155,224,.18)); }
  53.1% { filter: drop-shadow(0 7px 46px rgba(200,155,224,.88)) drop-shadow(0 17px 85px rgba(200,155,224,.6)); }
  53.4% { filter: drop-shadow(0 1px 4px rgba(200,155,224,.04)); }
  53.6% { filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)) drop-shadow(0 60px 220px rgba(200,155,224,.15)); }
  /* Blink lent */
  70%   { filter: drop-shadow(0 3px 16px rgba(200,155,224,.22)); }
  71.5% { filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)) drop-shadow(0 60px 220px rgba(200,155,224,.15)); }
  72%   { filter: drop-shadow(0 5px 28px rgba(200,155,224,.52)) drop-shadow(0 12px 55px rgba(200,155,224,.32)); }
  72.2% { filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)) drop-shadow(0 60px 220px rgba(200,155,224,.15)); }
  /* Rafale finale */
  83%   { filter: drop-shadow(0 2px 8px rgba(200,155,224,.07)); }
  83.2% { filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)); }
  83.5% { filter: drop-shadow(0 4px 20px rgba(200,155,224,.35)); }
  83.8% { filter: drop-shadow(0 8px 48px rgba(200,155,224,.92)) drop-shadow(0 17px 86px rgba(200,155,224,.62)); }
  84.1% { filter: drop-shadow(0 1px 4px rgba(200,155,224,.03)); }
  84.4% { filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)) drop-shadow(0 60px 220px rgba(200,155,224,.15)); }
  /* Retour au calme */
  100%  { filter: drop-shadow(0 6px 30px rgba(200,155,224,.35)) drop-shadow(0 12px 60px rgba(200,155,224,.18)) drop-shadow(0 24px 100px rgba(200,155,224,.08)); }
}

@keyframes nav-led-flicker {
  0%    { box-shadow: 0 0 6px rgba(200,155,224,.2), 0 4px 20px rgba(200,155,224,.1), 0 8px 50px rgba(200,155,224,.05), 0 20px 100px rgba(200,155,224,.02); border-bottom-color: rgba(200,155,224,.25); }
  2%    { box-shadow: 0 0 16px rgba(200,155,224,.75), 0 6px 55px rgba(200,155,224,.48), 0 16px 110px rgba(200,155,224,.28), 0 32px 170px rgba(200,155,224,.12); border-bottom-color: rgba(200,155,224,.8); }
  3.5%  { box-shadow: 0 0 16px rgba(200,155,224,.75), 0 6px 55px rgba(200,155,224,.48), 0 16px 110px rgba(200,155,224,.28), 0 32px 170px rgba(200,155,224,.12); border-bottom-color: rgba(200,155,224,.8); }
  3.8%  { box-shadow: 0 0 2px rgba(200,155,224,.05); border-bottom-color: rgba(200,155,224,.05); }
  4%    { box-shadow: 0 0 16px rgba(200,155,224,.75), 0 6px 55px rgba(200,155,224,.48), 0 16px 110px rgba(200,155,224,.28), 0 32px 170px rgba(200,155,224,.12); border-bottom-color: rgba(200,155,224,.8); }
  9%    { box-shadow: 0 0 3px rgba(200,155,224,.1); border-bottom-color: rgba(200,155,224,.1); }
  9.3%  { box-shadow: 0 0 14px rgba(200,155,224,.65), 0 6px 48px rgba(200,155,224,.4), 0 14px 95px rgba(200,155,224,.22); border-bottom-color: rgba(200,155,224,.7); }
  9.6%  { box-shadow: 0 0 2px rgba(200,155,224,.04); border-bottom-color: rgba(200,155,224,.04); }
  10%   { box-shadow: 0 0 16px rgba(200,155,224,.75), 0 6px 55px rgba(200,155,224,.48), 0 16px 110px rgba(200,155,224,.28), 0 32px 170px rgba(200,155,224,.12); border-bottom-color: rgba(200,155,224,.8); }
  18.5% { box-shadow: 0 0 10px rgba(200,155,224,.5), 0 5px 38px rgba(200,155,224,.3), 0 12px 75px rgba(200,155,224,.16); border-bottom-color: rgba(200,155,224,.55); }
  19%   { box-shadow: 0 0 16px rgba(200,155,224,.75), 0 6px 55px rgba(200,155,224,.48), 0 16px 110px rgba(200,155,224,.28), 0 32px 170px rgba(200,155,224,.12); border-bottom-color: rgba(200,155,224,.8); }
  19.4% { box-shadow: 0 0 2px rgba(200,155,224,.06); border-bottom-color: rgba(200,155,224,.06); }
  19.6% { box-shadow: 0 0 13px rgba(200,155,224,.6), 0 5px 42px rgba(200,155,224,.35); border-bottom-color: rgba(200,155,224,.65); }
  19.9% { box-shadow: 0 0 1px rgba(200,155,224,.02); border-bottom-color: rgba(200,155,224,.02); }
  20.2% { box-shadow: 0 0 16px rgba(200,155,224,.75), 0 6px 55px rgba(200,155,224,.48), 0 16px 110px rgba(200,155,224,.28), 0 32px 170px rgba(200,155,224,.12); border-bottom-color: rgba(200,155,224,.8); }
  38%   { box-shadow: 0 0 8px rgba(200,155,224,.38), 0 5px 30px rgba(200,155,224,.22), 0 10px 65px rgba(200,155,224,.12); border-bottom-color: rgba(200,155,224,.42); }
  40%   { box-shadow: 0 0 15px rgba(200,155,224,.7), 0 6px 52px rgba(200,155,224,.44), 0 15px 100px rgba(200,155,224,.25); border-bottom-color: rgba(200,155,224,.75); }
  40.5% { box-shadow: 0 0 4px rgba(200,155,224,.18); border-bottom-color: rgba(200,155,224,.18); }
  40.8% { box-shadow: 0 0 16px rgba(200,155,224,.75), 0 6px 55px rgba(200,155,224,.48), 0 16px 110px rgba(200,155,224,.28), 0 32px 170px rgba(200,155,224,.12); border-bottom-color: rgba(200,155,224,.8); }
  52.4% { box-shadow: 0 0 11px rgba(200,155,224,.52), 0 5px 40px rgba(200,155,224,.32); border-bottom-color: rgba(200,155,224,.58); }
  52.6% { box-shadow: 0 0 16px rgba(200,155,224,.75), 0 6px 55px rgba(200,155,224,.48), 0 16px 110px rgba(200,155,224,.28), 0 32px 170px rgba(200,155,224,.12); border-bottom-color: rgba(200,155,224,.8); }
  52.9% { box-shadow: 0 0 5px rgba(200,155,224,.22); border-bottom-color: rgba(200,155,224,.22); }
  53.1% { box-shadow: 0 0 14px rgba(200,155,224,.68), 0 5px 48px rgba(200,155,224,.4); border-bottom-color: rgba(200,155,224,.72); }
  53.4% { box-shadow: 0 0 1px rgba(200,155,224,.03); border-bottom-color: rgba(200,155,224,.03); }
  53.6% { box-shadow: 0 0 16px rgba(200,155,224,.75), 0 6px 55px rgba(200,155,224,.48), 0 16px 110px rgba(200,155,224,.28), 0 32px 170px rgba(200,155,224,.12); border-bottom-color: rgba(200,155,224,.8); }
  70%   { box-shadow: 0 0 4px rgba(200,155,224,.18); border-bottom-color: rgba(200,155,224,.18); }
  71.5% { box-shadow: 0 0 16px rgba(200,155,224,.75), 0 6px 55px rgba(200,155,224,.48), 0 16px 110px rgba(200,155,224,.28), 0 32px 170px rgba(200,155,224,.12); border-bottom-color: rgba(200,155,224,.8); }
  72%   { box-shadow: 0 0 9px rgba(200,155,224,.42), 0 5px 32px rgba(200,155,224,.24); border-bottom-color: rgba(200,155,224,.48); }
  72.2% { box-shadow: 0 0 16px rgba(200,155,224,.75), 0 6px 55px rgba(200,155,224,.48), 0 16px 110px rgba(200,155,224,.28), 0 32px 170px rgba(200,155,224,.12); border-bottom-color: rgba(200,155,224,.8); }
  83%   { box-shadow: 0 0 2px rgba(200,155,224,.06); border-bottom-color: rgba(200,155,224,.06); }
  83.2% { box-shadow: 0 0 16px rgba(200,155,224,.75), 0 6px 55px rgba(200,155,224,.48), 0 16px 110px rgba(200,155,224,.28), 0 32px 170px rgba(200,155,224,.12); border-bottom-color: rgba(200,155,224,.8); }
  83.5% { box-shadow: 0 0 6px rgba(200,155,224,.28); border-bottom-color: rgba(200,155,224,.3); }
  83.8% { box-shadow: 0 0 14px rgba(200,155,224,.68), 0 5px 48px rgba(200,155,224,.4); border-bottom-color: rgba(200,155,224,.72); }
  84.1% { box-shadow: 0 0 1px rgba(200,155,224,.02); border-bottom-color: rgba(200,155,224,.02); }
  84.4% { box-shadow: 0 0 16px rgba(200,155,224,.75), 0 6px 55px rgba(200,155,224,.48), 0 16px 110px rgba(200,155,224,.28), 0 32px 170px rgba(200,155,224,.12); border-bottom-color: rgba(200,155,224,.8); }
  98%   { box-shadow: 0 0 10px rgba(200,155,224,.45), 0 5px 36px rgba(200,155,224,.28); border-bottom-color: rgba(200,155,224,.5); }
  100%  { box-shadow: 0 0 6px rgba(200,155,224,.2), 0 4px 20px rgba(200,155,224,.1), 0 8px 50px rgba(200,155,224,.05), 0 20px 100px rgba(200,155,224,.02); border-bottom-color: rgba(200,155,224,.25); }
}

/* Nav et logo synchronisés sur le même cycle de 23s */





/* ── PERFORMANCE ANIMATIONS ── */
.balloon, nav {
  will-change: filter, transform;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}
/* Mobile : translateZ(0) + backface-visibility:hidden bloquent filter sur Android/iOS */
@media(max-width:768px) {
  .balloon {
    backface-visibility: visible;
    -webkit-backface-visibility: visible;
    transform: none;
    -webkit-transform: none;
    will-change: filter;
  }
}
.carousel-slide, .tc-slide, .dc-slide, .pc-slide {
  will-change: transform, opacity;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.carousel-track, .tc-track, .dc-track, .pc-track {
  will-change: transform;
  backface-visibility: hidden;
}
.hlogo, .hcat, .hloc, .hstudio {
  will-change: opacity, transform;
}
/* Flottaison logo plus fluide */
@keyframes balloon-drift {
  0%,100% { transform: translateY(0px) rotate(0deg) translateZ(0); }
  20%  { transform: translateY(-22px) rotate(2.5deg) translateZ(0); }
  45%  { transform: translateY(-8px) rotate(-1.5deg) translateZ(0); }
  65%  { transform: translateY(-28px) rotate(1.8deg) translateZ(0); }
  82%  { transform: translateY(-12px) rotate(-2deg) translateZ(0); }
}


/* ── BALLOON LOGO HERO ── */
.balloon {
  display: flex;
  flex-direction: column;
  align-items: center;
  transform-origin: center bottom;
  cursor: none;
  will-change: filter, transform;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform: translateZ(0);
  animation:
    balloon-drift 9s ease-in-out infinite 1.4s,
    neon-flicker 23s linear infinite 0s;
  /* Safari/iPad fix — -webkit-animation pour garantir le rendu LED */
  -webkit-animation:
    balloon-drift 9s ease-in-out infinite 1.4s,
    neon-flicker 23s linear infinite 0s;
}
.balloon:hover {
  animation:
    balloon-pull 2s cubic-bezier(.23,1,.32,1) forwards,
    balloon-drift 9s ease-in-out infinite 2.05s,
    neon-flicker 23s linear infinite;
  -webkit-animation:
    balloon-pull 2s cubic-bezier(.23,1,.32,1) forwards,
    balloon-drift 9s ease-in-out infinite 2.05s,
    neon-flicker 23s linear infinite;
}


/* ── NAV SYNCHRONIZED ── */
nav {
  will-change: box-shadow, border-bottom-color;
  animation: nav-led-flicker 23s linear infinite;
  -webkit-animation: nav-led-flicker 23s linear infinite;
}


/* ── FORMULAIRE RDV ── */
.rdv-form { text-align: left; }
.rdv-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.rdv-field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.rdv-full { grid-column: 1 / -1; }
.rdv-field label { font-size: 9px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--ink2); }
.rdv-field input, .rdv-field select, .rdv-field textarea {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 8px;
  padding: 12px 16px;
  color: var(--ink);
  font-family: var(--f);
  font-size: 13px;
  transition: border-color .25s, background .25s;
  outline: none;
  width: 100%;
  resize: vertical;
}
.rdv-field input:focus, .rdv-field textarea:focus { border-color: var(--or); background: rgba(244,162,97,.05); }
.rdv-field select { cursor: none; appearance: none; }
.rdv-field select option { background: #0f0f1a; color: var(--ink); }
.rdv-submit { width: 100%; padding: 16px; font-size: 11px; letter-spacing: .2em; margin-top: 8px; background: linear-gradient(135deg,var(--or),var(--pi)); color: #080810; border: none; cursor: none; }
@media(max-width:768px) { .rdv-row { grid-template-columns: 1fr; } }


/* ── MOBILE CAROUSEL FIX ── */
@media(max-width:768px) {

  /* Nav : afficher les liens sur mobile */
  ul.nm { display:flex; gap:14px; }
  ul.nm a { font-size:8px; letter-spacing:.12em; }
  nav { padding:10px 12px; gap:8px; flex-wrap:nowrap; }
  .nc-rdv { font-size:8px; padding:7px 12px; white-space:nowrap; }

  /* Slides — source de vérité mobile (sync avec getSlideW JS) */
  .carousel-slide { flex:0 0 240px !important; }
  .tc-slide        { flex:0 0 220px !important; }
  .dc-slide        { flex:0 0 200px !important; }
  .pc-slide        { flex:0 0 200px !important; }

  /* Boutons nav : plus petits sur mobile */
  .cnav-pill { font-size:13px; padding:6px 14px; }

  /* Overflow caché sur les wraps */
  .carousel-wrap, .tc-wrap, .dc-wrap, .pc-wrap {
    overflow: visible;
    padding: 30px 0;
  }

  /* LED hover trop agressive sur mobile — désactiver */
  .cnav-pill:hover { box-shadow: none; }
}

@media(max-width:480px) {
  ul.nm { display:none; }
  nav { justify-content:space-between; }
}


/* ── FLOTTAISON SLIDE ACTIVE ── */
@keyframes slide-drift {
  0%,100% { transform: scale(1.18) translateY(0px) rotate(0deg); }
  20%     { transform: scale(1.18) translateY(-18px) rotate(1.8deg); }
  45%     { transform: scale(1.18) translateY(-7px) rotate(-1.2deg); }
  65%     { transform: scale(1.18) translateY(-22px) rotate(1.4deg); }
  82%     { transform: scale(1.18) translateY(-10px) rotate(-1.5deg); }
}
@keyframes tc-drift {
  0%,100% { transform: scale(1.18) translateY(0px) rotate(0deg); }
  22%     { transform: scale(1.18) translateY(-20px) rotate(-1.6deg); }
  48%     { transform: scale(1.18) translateY(-8px) rotate(1.0deg); }
  68%     { transform: scale(1.18) translateY(-24px) rotate(-1.2deg); }
  85%     { transform: scale(1.18) translateY(-9px) rotate(0.8deg); }
}
@keyframes dc-drift {
  0%,100% { transform: scale(1.18) translateY(0px) rotate(0deg); }
  25%     { transform: scale(1.18) translateY(-19px) rotate(1.5deg); }
  50%     { transform: scale(1.18) translateY(-6px) rotate(-1.0deg); }
  72%     { transform: scale(1.18) translateY(-23px) rotate(1.2deg); }
  88%     { transform: scale(1.18) translateY(-8px) rotate(-0.8deg); }
}
@keyframes pc-drift {
  0%,100% { transform: scale(1.18) translateY(0px) rotate(0deg); }
  18%     { transform: scale(1.18) translateY(-21px) rotate(-1.7deg); }
  42%     { transform: scale(1.18) translateY(-7px) rotate(1.1deg); }
  64%     { transform: scale(1.18) translateY(-25px) rotate(-1.3deg); }
  83%     { transform: scale(1.18) translateY(-10px) rotate(0.9deg); }
}

/* Flottaison sur la slide active de chaque section */





/* Au survol : ballon qui tire vers le haut */

/* ── FLASH : drift avec scale 1.28 (tablet 1.22, mobile 1.18) ── */
@keyframes flash-drift {
  0%,100% { transform: scale(1.28) translateY(0px) rotate(0deg); }
  20%     { transform: scale(1.28) translateY(-18px) rotate(1.8deg); }
  45%     { transform: scale(1.28) translateY(-7px) rotate(-1.2deg); }
  65%     { transform: scale(1.28) translateY(-22px) rotate(1.4deg); }
  82%     { transform: scale(1.28) translateY(-10px) rotate(-1.5deg); }
}
@keyframes flash-drift-tablet {
  0%,100% { transform: scale(1.22) translateY(0px) rotate(0deg); }
  20%     { transform: scale(1.22) translateY(-18px) rotate(1.8deg); }
  45%     { transform: scale(1.22) translateY(-7px) rotate(-1.2deg); }
  65%     { transform: scale(1.22) translateY(-22px) rotate(1.4deg); }
  82%     { transform: scale(1.22) translateY(-10px) rotate(-1.5deg); }
}
@keyframes flash-drift-soft {
  0%,100% { transform: scale(1.18) translateY(0px) rotate(0deg); }
  30%     { transform: scale(1.18) translateY(-9px) rotate(0.8deg); }
  65%     { transform: scale(1.18) translateY(-3px) rotate(-0.5deg); }
}

@keyframes slide-pull {
  0%   { transform: scale(1.18) translateY(0px) rotate(0deg); }
  15%  { transform: scale(1.18) translateY(-18px) rotate(2deg); }
  30%  { transform: scale(1.18) translateY(-8px) rotate(-1deg); }
  45%  { transform: scale(1.18) translateY(-22px) rotate(1.5deg); }
  60%  { transform: scale(1.18) translateY(-6px) rotate(-0.8deg); }
  80%  { transform: scale(1.18) translateY(-14px) rotate(1deg); }
  100% { transform: scale(1.18) translateY(0px) rotate(0deg); }
}









/* ── FLOTTAISON DOUCE MOBILE — même esprit ballon, amplitude réduite ── */
@keyframes slide-drift-soft {
  0%,100% { transform: scale(1.18) translateY(0px) rotate(0deg); }
  30%     { transform: scale(1.18) translateY(-9px) rotate(0.8deg); }
  65%     { transform: scale(1.18) translateY(-3px) rotate(-0.5deg); }
}
@keyframes tc-drift-soft {
  0%,100% { transform: scale(1.18) translateY(0px) rotate(0deg); }
  28%     { transform: scale(1.18) translateY(-10px) rotate(-0.7deg); }
  68%     { transform: scale(1.18) translateY(-4px) rotate(0.5deg); }
}
@keyframes dc-drift-soft {
  0%,100% { transform: scale(1.18) translateY(0px) rotate(0deg); }
  35%     { transform: scale(1.18) translateY(-8px) rotate(0.6deg); }
  70%     { transform: scale(1.18) translateY(-3px) rotate(-0.4deg); }
}
@keyframes pc-drift-soft {
  0%,100% { transform: scale(1.18) translateY(0px) rotate(0deg); }
  32%     { transform: scale(1.18) translateY(-11px) rotate(-0.9deg); }
  66%     { transform: scale(1.18) translateY(-4px) rotate(0.6deg); }
}

/* ── NEON SOUS TITRES ET BRUSHSTROKES ── */

/* Cycle 23s irrégulier — même timing que nav et logo */
@keyframes brush-flicker {
  0%    { opacity: 0.5; filter: brightness(1) blur(0px); }
  2%    { opacity: 1;   filter: brightness(1.4) blur(0.5px); }
  3.8%  { opacity: 0.05; filter: brightness(0.2) blur(0px); }
  4%    { opacity: 1;   filter: brightness(1.4) blur(0.5px); }
  9%    { opacity: 0.1;  filter: brightness(0.3); }
  9.3%  { opacity: 1;   filter: brightness(1.3) blur(0.4px); }
  9.6%  { opacity: 0.05; }
  10%   { opacity: 1;   filter: brightness(1.4) blur(0.5px); }
  19.4% { opacity: 0.08; }
  19.7% { opacity: 1;   filter: brightness(1.3); }
  20%   { opacity: 0.04; }
  20.2% { opacity: 1;   filter: brightness(1.4) blur(0.5px); }
  38%   { opacity: 0.65; filter: brightness(1.1); }
  40%   { opacity: 1;   filter: brightness(1.4) blur(0.5px); }
  40.5% { opacity: 0.2; }
  40.8% { opacity: 1;   filter: brightness(1.4) blur(0.5px); }
  52.4% { opacity: 0.7;  filter: brightness(1.1); }
  52.7% { opacity: 0.04; }
  53%   { opacity: 1;   filter: brightness(1.4) blur(0.5px); }
  53.4% { opacity: 0.03; }
  53.6% { opacity: 1;   filter: brightness(1.4) blur(0.5px); }
  70%   { opacity: 0.15; }
  71.5% { opacity: 1;   filter: brightness(1.3) blur(0.4px); }
  72%   { opacity: 0.55; }
  72.2% { opacity: 1;   filter: brightness(1.4) blur(0.5px); }
  83%   { opacity: 0.04; }
  83.2% { opacity: 1;   filter: brightness(1.4) blur(0.5px); }
  83.5% { opacity: 0.35; }
  83.8% { opacity: 1;   filter: brightness(1.3) blur(0.4px); }
  84.1% { opacity: 0.02; }
  84.4% { opacity: 1;   filter: brightness(1.4) blur(0.5px); }
  100%  { opacity: 0.5;  filter: brightness(1) blur(0px); }
}

/* Flicker sur les brushstrokes SVG */
.brush {
  animation: brush-flicker 23s linear infinite;
  filter: drop-shadow(0 0 6px currentColor) drop-shadow(0 2px 14px currentColor);
}

/* Neon sous les titres de section */
.stit {
  text-shadow:
    0 0 8px rgba(240,236,224,.12),
    0 2px 20px rgba(240,236,224,.06);
  animation: title-glow 23s linear infinite 1s;
}

@keyframes title-glow {
  0%,100% { text-shadow: 0 0 6px rgba(240,236,224,.1), 0 2px 18px rgba(240,236,224,.05); }
  2%      { text-shadow: 0 0 16px rgba(240,236,224,.45), 0 4px 36px rgba(240,236,224,.22), 0 8px 60px rgba(240,236,224,.1); }
  3.8%    { text-shadow: 0 0 2px rgba(240,236,224,.04); }
  4%      { text-shadow: 0 0 16px rgba(240,236,224,.45), 0 4px 36px rgba(240,236,224,.22), 0 8px 60px rgba(240,236,224,.1); }
  9%      { text-shadow: 0 0 2px rgba(240,236,224,.05); }
  9.4%    { text-shadow: 0 0 14px rgba(240,236,224,.38), 0 4px 30px rgba(240,236,224,.18); }
  9.7%    { text-shadow: 0 0 1px rgba(240,236,224,.03); }
  10%     { text-shadow: 0 0 16px rgba(240,236,224,.45), 0 4px 36px rgba(240,236,224,.22), 0 8px 60px rgba(240,236,224,.1); }
  19.4%   { text-shadow: 0 0 1px rgba(240,236,224,.03); }
  19.7%   { text-shadow: 0 0 14px rgba(240,236,224,.38), 0 4px 30px rgba(240,236,224,.18); }
  20%     { text-shadow: 0 0 1px rgba(240,236,224,.02); }
  20.2%   { text-shadow: 0 0 16px rgba(240,236,224,.45), 0 4px 36px rgba(240,236,224,.22), 0 8px 60px rgba(240,236,224,.1); }
  38%     { text-shadow: 0 0 10px rgba(240,236,224,.28), 0 3px 24px rgba(240,236,224,.14); }
  40%     { text-shadow: 0 0 16px rgba(240,236,224,.42), 0 4px 34px rgba(240,236,224,.2); }
  40.5%   { text-shadow: 0 0 2px rgba(240,236,224,.06); }
  40.8%   { text-shadow: 0 0 16px rgba(240,236,224,.45), 0 4px 36px rgba(240,236,224,.22), 0 8px 60px rgba(240,236,224,.1); }
  52.4%   { text-shadow: 0 0 8px rgba(240,236,224,.22), 0 3px 20px rgba(240,236,224,.12); }
  52.7%   { text-shadow: 0 0 1px rgba(240,236,224,.03); }
  53%     { text-shadow: 0 0 16px rgba(240,236,224,.45), 0 4px 36px rgba(240,236,224,.22); }
  53.4%   { text-shadow: 0 0 1px rgba(240,236,224,.02); }
  53.6%   { text-shadow: 0 0 16px rgba(240,236,224,.45), 0 4px 36px rgba(240,236,224,.22), 0 8px 60px rgba(240,236,224,.1); }
  70%     { text-shadow: 0 0 2px rgba(240,236,224,.06); }
  71.5%   { text-shadow: 0 0 14px rgba(240,236,224,.4), 0 4px 32px rgba(240,236,224,.2); }
  72%     { text-shadow: 0 0 8px rgba(240,236,224,.22); }
  72.2%   { text-shadow: 0 0 16px rgba(240,236,224,.45), 0 4px 36px rgba(240,236,224,.22), 0 8px 60px rgba(240,236,224,.1); }
  83%     { text-shadow: 0 0 1px rgba(240,236,224,.03); }
  83.2%   { text-shadow: 0 0 16px rgba(240,236,224,.45), 0 4px 36px rgba(240,236,224,.22); }
  83.5%   { text-shadow: 0 0 6px rgba(240,236,224,.18); }
  83.8%   { text-shadow: 0 0 14px rgba(240,236,224,.4), 0 4px 30px rgba(240,236,224,.2); }
  84.1%   { text-shadow: 0 0 1px rgba(240,236,224,.02); }
  84.4%   { text-shadow: 0 0 16px rgba(240,236,224,.45), 0 4px 36px rgba(240,236,224,.22), 0 8px 60px rgba(240,236,224,.1); }
}

/* Désactiver sur mobile */
@media(max-width:768px) {
  .brush { animation: none; filter: none; }
  .stit { animation: none; text-shadow: none; }
}


/* ── NEON SLIDES ACTIVES — ombre vers le bas synchronisée ── */

/* Flash — violet */
@keyframes fc-neon {
  0%    { box-shadow: 0 8px 20px rgba(200,155,224,.2), 0 16px 50px rgba(200,155,224,.1), 0 30px 80px rgba(200,155,224,.05); }
  2%    { box-shadow: 0 10px 35px rgba(200,155,224,.85), 0 20px 70px rgba(200,155,224,.55), 0 40px 130px rgba(200,155,224,.28), 0 70px 180px rgba(200,155,224,.12); }
  3.8%  { box-shadow: 0 4px 8px rgba(200,155,224,.06); }
  4%    { box-shadow: 0 10px 35px rgba(200,155,224,.85), 0 20px 70px rgba(200,155,224,.55), 0 40px 130px rgba(200,155,224,.28), 0 70px 180px rgba(200,155,224,.12); }
  9%    { box-shadow: 0 4px 8px rgba(200,155,224,.06); }
  9.4%  { box-shadow: 0 9px 30px rgba(200,155,224,.75), 0 18px 60px rgba(200,155,224,.45), 0 36px 110px rgba(200,155,224,.22); }
  9.7%  { box-shadow: 0 3px 6px rgba(200,155,224,.04); }
  10%   { box-shadow: 0 10px 35px rgba(200,155,224,.85), 0 20px 70px rgba(200,155,224,.55), 0 40px 130px rgba(200,155,224,.28), 0 70px 180px rgba(200,155,224,.12); }
  19.4% { box-shadow: 0 3px 6px rgba(200,155,224,.04); }
  19.7% { box-shadow: 0 9px 30px rgba(200,155,224,.72), 0 18px 58px rgba(200,155,224,.42); }
  20%   { box-shadow: 0 2px 4px rgba(200,155,224,.03); }
  20.2% { box-shadow: 0 10px 35px rgba(200,155,224,.85), 0 20px 70px rgba(200,155,224,.55), 0 40px 130px rgba(200,155,224,.28), 0 70px 180px rgba(200,155,224,.12); }
  38%   { box-shadow: 0 7px 22px rgba(200,155,224,.5), 0 14px 48px rgba(200,155,224,.28), 0 28px 90px rgba(200,155,224,.14); }
  40%   { box-shadow: 0 10px 34px rgba(200,155,224,.82), 0 20px 68px rgba(200,155,224,.52), 0 38px 125px rgba(200,155,224,.26); }
  40.5% { box-shadow: 0 4px 10px rgba(200,155,224,.08); }
  40.8% { box-shadow: 0 10px 35px rgba(200,155,224,.85), 0 20px 70px rgba(200,155,224,.55), 0 40px 130px rgba(200,155,224,.28), 0 70px 180px rgba(200,155,224,.12); }
  52.4% { box-shadow: 0 7px 24px rgba(200,155,224,.52), 0 14px 50px rgba(200,155,224,.3); }
  52.7% { box-shadow: 0 2px 5px rgba(200,155,224,.04); }
  53%   { box-shadow: 0 10px 35px rgba(200,155,224,.85), 0 20px 70px rgba(200,155,224,.55), 0 40px 130px rgba(200,155,224,.28); }
  53.4% { box-shadow: 0 2px 4px rgba(200,155,224,.03); }
  53.6% { box-shadow: 0 10px 35px rgba(200,155,224,.85), 0 20px 70px rgba(200,155,224,.55), 0 40px 130px rgba(200,155,224,.28), 0 70px 180px rgba(200,155,224,.12); }
  70%   { box-shadow: 0 4px 10px rgba(200,155,224,.1); }
  71.5% { box-shadow: 0 9px 32px rgba(200,155,224,.78), 0 18px 65px rgba(200,155,224,.48), 0 36px 115px rgba(200,155,224,.24); }
  72%   { box-shadow: 0 6px 18px rgba(200,155,224,.38), 0 12px 40px rgba(200,155,224,.2); }
  72.2% { box-shadow: 0 10px 35px rgba(200,155,224,.85), 0 20px 70px rgba(200,155,224,.55), 0 40px 130px rgba(200,155,224,.28), 0 70px 180px rgba(200,155,224,.12); }
  83%   { box-shadow: 0 2px 5px rgba(200,155,224,.04); }
  83.2% { box-shadow: 0 10px 35px rgba(200,155,224,.85), 0 20px 70px rgba(200,155,224,.55), 0 40px 130px rgba(200,155,224,.28); }
  83.5% { box-shadow: 0 5px 16px rgba(200,155,224,.32); }
  83.8% { box-shadow: 0 9px 30px rgba(200,155,224,.75), 0 18px 62px rgba(200,155,224,.45); }
  84.1% { box-shadow: 0 2px 4px rgba(200,155,224,.03); }
  84.4% { box-shadow: 0 10px 35px rgba(200,155,224,.85), 0 20px 70px rgba(200,155,224,.55), 0 40px 130px rgba(200,155,224,.28), 0 70px 180px rgba(200,155,224,.12); }
  100%  { box-shadow: 0 8px 20px rgba(200,155,224,.2), 0 16px 50px rgba(200,155,224,.1), 0 30px 80px rgba(200,155,224,.05); }
}

/* Tattoo — orange */
@keyframes tc-neon {
  0%,100% { box-shadow: 0 8px 20px rgba(244,162,97,.2), 0 16px 50px rgba(244,162,97,.1), 0 30px 80px rgba(244,162,97,.05); }
  2%      { box-shadow: 0 10px 35px rgba(244,162,97,.85), 0 20px 70px rgba(244,162,97,.55), 0 40px 130px rgba(244,162,97,.28), 0 70px 180px rgba(244,162,97,.12); }
  3.8%    { box-shadow: 0 4px 8px rgba(244,162,97,.06); }
  4%      { box-shadow: 0 10px 35px rgba(244,162,97,.85), 0 20px 70px rgba(244,162,97,.55), 0 40px 130px rgba(244,162,97,.28), 0 70px 180px rgba(244,162,97,.12); }
  9%      { box-shadow: 0 4px 8px rgba(244,162,97,.06); }
  9.4%    { box-shadow: 0 9px 30px rgba(244,162,97,.75), 0 18px 60px rgba(244,162,97,.45); }
  9.7%    { box-shadow: 0 3px 6px rgba(244,162,97,.04); }
  10%     { box-shadow: 0 10px 35px rgba(244,162,97,.85), 0 20px 70px rgba(244,162,97,.55), 0 40px 130px rgba(244,162,97,.28), 0 70px 180px rgba(244,162,97,.12); }
  40%     { box-shadow: 0 10px 34px rgba(244,162,97,.82), 0 20px 68px rgba(244,162,97,.52), 0 38px 125px rgba(244,162,97,.26); }
  40.5%   { box-shadow: 0 4px 10px rgba(244,162,97,.08); }
  40.8%   { box-shadow: 0 10px 35px rgba(244,162,97,.85), 0 20px 70px rgba(244,162,97,.55), 0 40px 130px rgba(244,162,97,.28), 0 70px 180px rgba(244,162,97,.12); }
  70%     { box-shadow: 0 4px 10px rgba(244,162,97,.1); }
  71.5%   { box-shadow: 0 9px 32px rgba(244,162,97,.78), 0 18px 65px rgba(244,162,97,.48); }
  72.2%   { box-shadow: 0 10px 35px rgba(244,162,97,.85), 0 20px 70px rgba(244,162,97,.55), 0 40px 130px rgba(244,162,97,.28), 0 70px 180px rgba(244,162,97,.12); }
  84.4%   { box-shadow: 0 10px 35px rgba(244,162,97,.85), 0 20px 70px rgba(244,162,97,.55), 0 40px 130px rgba(244,162,97,.28), 0 70px 180px rgba(244,162,97,.12); }
}

/* Dessin — teal */
@keyframes dc-neon {
  0%,100% { box-shadow: 0 8px 20px rgba(116,215,184,.2), 0 16px 50px rgba(116,215,184,.1), 0 30px 80px rgba(116,215,184,.05); }
  2%      { box-shadow: 0 10px 35px rgba(116,215,184,.85), 0 20px 70px rgba(116,215,184,.55), 0 40px 130px rgba(116,215,184,.28), 0 70px 180px rgba(116,215,184,.12); }
  3.8%    { box-shadow: 0 4px 8px rgba(116,215,184,.06); }
  4%      { box-shadow: 0 10px 35px rgba(116,215,184,.85), 0 20px 70px rgba(116,215,184,.55), 0 40px 130px rgba(116,215,184,.28), 0 70px 180px rgba(116,215,184,.12); }
  9.4%    { box-shadow: 0 9px 30px rgba(116,215,184,.75), 0 18px 60px rgba(116,215,184,.45); }
  9.7%    { box-shadow: 0 3px 6px rgba(116,215,184,.04); }
  10%     { box-shadow: 0 10px 35px rgba(116,215,184,.85), 0 20px 70px rgba(116,215,184,.55), 0 40px 130px rgba(116,215,184,.28), 0 70px 180px rgba(116,215,184,.12); }
  52.7%   { box-shadow: 0 2px 5px rgba(116,215,184,.04); }
  53%     { box-shadow: 0 10px 35px rgba(116,215,184,.85), 0 20px 70px rgba(116,215,184,.55), 0 40px 130px rgba(116,215,184,.28); }
  84.4%   { box-shadow: 0 10px 35px rgba(116,215,184,.85), 0 20px 70px rgba(116,215,184,.55), 0 40px 130px rgba(116,215,184,.28), 0 70px 180px rgba(116,215,184,.12); }
}

/* Peinture — rose */
@keyframes pc-neon {
  0%,100% { box-shadow: 0 8px 20px rgba(224,123,154,.2), 0 16px 50px rgba(224,123,154,.1), 0 30px 80px rgba(224,123,154,.05); }
  2%      { box-shadow: 0 10px 35px rgba(224,123,154,.85), 0 20px 70px rgba(224,123,154,.55), 0 40px 130px rgba(224,123,154,.28), 0 70px 180px rgba(224,123,154,.12); }
  3.8%    { box-shadow: 0 4px 8px rgba(224,123,154,.06); }
  4%      { box-shadow: 0 10px 35px rgba(224,123,154,.85), 0 20px 70px rgba(224,123,154,.55), 0 40px 130px rgba(224,123,154,.28), 0 70px 180px rgba(224,123,154,.12); }
  9.4%    { box-shadow: 0 9px 30px rgba(224,123,154,.75), 0 18px 60px rgba(224,123,154,.45); }
  9.7%    { box-shadow: 0 3px 6px rgba(224,123,154,.04); }
  10%     { box-shadow: 0 10px 35px rgba(224,123,154,.85), 0 20px 70px rgba(224,123,154,.55), 0 40px 130px rgba(224,123,154,.28), 0 70px 180px rgba(224,123,154,.12); }
  40%     { box-shadow: 0 10px 34px rgba(224,123,154,.82), 0 20px 68px rgba(224,123,154,.52); }
  40.5%   { box-shadow: 0 4px 10px rgba(224,123,154,.08); }
  40.8%   { box-shadow: 0 10px 35px rgba(224,123,154,.85), 0 20px 70px rgba(224,123,154,.55), 0 40px 130px rgba(224,123,154,.28), 0 70px 180px rgba(224,123,154,.12); }
  83%     { box-shadow: 0 2px 5px rgba(224,123,154,.04); }
  83.2%   { box-shadow: 0 10px 35px rgba(224,123,154,.85), 0 20px 70px rgba(224,123,154,.55), 0 40px 130px rgba(224,123,154,.28); }
  84.4%   { box-shadow: 0 10px 35px rgba(224,123,154,.85), 0 20px 70px rgba(224,123,154,.55), 0 40px 130px rgba(224,123,154,.28), 0 70px 180px rgba(224,123,154,.12); }
}

/* Appliquer sur chaque slide active avec flottaison */
.carousel-slide.active {
  animation: slide-drift 7s ease-in-out infinite, fc-neon 23s linear infinite;
}
/* Flash — scale 1.28 dans la keyframe, remplace le !important statique */
#flash .carousel-slide.active {
  animation: flash-drift 7s ease-in-out infinite, fc-neon 23s linear infinite;
}
.tc-slide.active {
  animation: tc-drift 8s ease-in-out infinite, tc-neon 23s linear infinite;
}
.dc-slide.active {
  animation: dc-drift 6.5s ease-in-out infinite, dc-neon 23s linear infinite;
}
.pc-slide.active {
  animation: pc-drift 7.5s ease-in-out infinite, pc-neon 23s linear infinite;
}

/* Survol : ballon + neon */
.carousel-slide.active:hover { animation: slide-pull 2.4s ease-out forwards, slide-drift 7s ease-in-out infinite 1.6s, fc-neon 23s linear infinite; }
#flash .carousel-slide.active:hover { animation: slide-pull 2.4s ease-out forwards, flash-drift 7s ease-in-out infinite 1.6s, fc-neon 23s linear infinite; }
.tc-slide.active:hover       { animation: slide-pull 2.4s ease-out forwards, tc-drift 8s ease-in-out infinite 1.6s, tc-neon 23s linear infinite; }
.dc-slide.active:hover       { animation: slide-pull 2.4s ease-out forwards, dc-drift 6.5s ease-in-out infinite 1.6s, dc-neon 23s linear infinite; }
.pc-slide.active:hover       { animation: slide-pull 2.4s ease-out forwards, pc-drift 7.5s ease-in-out infinite 1.6s, pc-neon 23s linear infinite; }

/* Mobile — flottaison douce + neon LED */
@media(max-width:768px) {
  .carousel-slide.active { animation: slide-drift-soft 7s ease-in-out infinite, fc-neon 23s linear infinite !important; box-shadow: none !important; }
  .tc-slide.active        { animation: tc-drift-soft   8s ease-in-out infinite, tc-neon 23s linear infinite !important; box-shadow: none !important; }
  .dc-slide.active        { animation: dc-drift-soft 6.5s ease-in-out infinite, dc-neon 23s linear infinite !important; box-shadow: none !important; }
  .pc-slide.active        { animation: pc-drift-soft 7.5s ease-in-out infinite, pc-neon 23s linear infinite !important; box-shadow: none !important; }
  /* backface-visibility:hidden bloque filter:drop-shadow sur Android/iOS —
     même bug que le logo, on le neutralise sur les slides actives */
  .carousel-slide.active, .tc-slide.active, .dc-slide.active, .pc-slide.active {
    backface-visibility: visible !important;
    -webkit-backface-visibility: visible !important;
  }
}





/* ══════════════════════════════════════════════════════════════════

/* ══════════════════════════════════════════════════════════════════

/* ══════════════════════════════════════════════════════════════════
   PILE DE CARTES — cascade droite uniquement (schéma validé)

   Active : au centre, plein cadre
   Right-1 : décalé +peek à droite, derrière
   Right-2 : décalé +2×peek à droite, encore plus derrière
   Left-* : masqués (fidèle au schéma)

   Profondeur via brightness + ombre portée, pas d'opacité
══════════════════════════════════════════════════════════════════ */

/* Espacement entre les cartes */
:root              { --peek: 138px; }
@media(max-width:1024px) { :root { --peek: 114px; } }
@media(max-width:768px)  { :root { --peek:  84px; } }
@media(max-width:480px)  { :root { --peek:  62px; } }

.carousel-track, .tc-track, .dc-track, .pc-track { position:relative; align-items:center; }
.carousel-slide, .tc-slide, .dc-slide, .pc-slide  {
  position:relative; flex-shrink:0;
  transition: transform .85s cubic-bezier(.25,.46,.45,.94),
              filter    .7s ease;
}

/* Active — premier plan, plein éclat */
.carousel-slide.active, .tc-slide.active, .dc-slide.active, .pc-slide.active {
  z-index: 10 !important;
  filter: none;
}

/* ── Cartes GAUCHE — masquées (fidèle au schéma) ── */
.carousel-slide.left-1,  .tc-slide.left-1,  .dc-slide.left-1,  .pc-slide.left-1,
.carousel-slide.left-2,  .tc-slide.left-2,  .dc-slide.left-2,  .pc-slide.left-2,
.carousel-slide.left-far,.tc-slide.left-far,.dc-slide.left-far,.pc-slide.left-far {
  opacity: 0 !important;
  pointer-events: none;
  transition: none;
}

/* ── Cartes DROITE — cascade, profondeur par brightness + ombre ── */
.carousel-slide.right-1, .tc-slide.right-1, .dc-slide.right-1, .pc-slide.right-1 {
  z-index: 6;
  opacity: 1;
  transform: translateX(calc(var(--pile-x,0px) + var(--peek))) scale(.96) !important;
  filter: brightness(.72);
}
.carousel-slide.right-2, .tc-slide.right-2, .dc-slide.right-2, .pc-slide.right-2 {
  z-index: 4;
  opacity: 1;
  transform: translateX(calc(var(--pile-x,0px) + 2*var(--peek))) scale(.92) !important;
  filter: brightness(.52);
}
.carousel-slide.right-far, .tc-slide.right-far, .dc-slide.right-far, .pc-slide.right-far {
  z-index: 2;
  opacity: 1;
  transform: translateX(calc(var(--pile-x,0px) + 3*var(--peek))) scale(.88) !important;
  filter: brightness(.36);
}

/* ── LED + ombre portée sur les voisines droite ── */
/* Flash — violet */
#flash .carousel-slide.right-1 {
  filter: brightness(.75) drop-shadow(-6px 8px 24px rgba(0,0,0,.55)) drop-shadow(0 0 18px rgba(200,155,224,.55));
}
#flash .carousel-slide.right-2 {
  filter: brightness(.55) drop-shadow(-4px 6px 18px rgba(0,0,0,.50)) drop-shadow(0 0 10px rgba(200,155,224,.35));
}
#flash .carousel-slide.right-far {
  filter: brightness(.38) drop-shadow(-3px 5px 14px rgba(0,0,0,.45));
}
/* Tattoo — orange */
#tattoo .tc-slide.right-1 {
  filter: brightness(.75) drop-shadow(-6px 8px 24px rgba(0,0,0,.55)) drop-shadow(0 0 18px rgba(244,162,97,.55));
}
#tattoo .tc-slide.right-2 {
  filter: brightness(.55) drop-shadow(-4px 6px 18px rgba(0,0,0,.50)) drop-shadow(0 0 10px rgba(244,162,97,.35));
}
#tattoo .tc-slide.right-far {
  filter: brightness(.38) drop-shadow(-3px 5px 14px rgba(0,0,0,.45));
}
/* Dessin — teal */
#dessin .dc-slide.right-1 {
  filter: brightness(.75) drop-shadow(-6px 8px 24px rgba(0,0,0,.55)) drop-shadow(0 0 18px rgba(116,215,184,.55));
}
#dessin .dc-slide.right-2 {
  filter: brightness(.55) drop-shadow(-4px 6px 18px rgba(0,0,0,.50)) drop-shadow(0 0 10px rgba(116,215,184,.35));
}
#dessin .dc-slide.right-far {
  filter: brightness(.38) drop-shadow(-3px 5px 14px rgba(0,0,0,.45));
}
/* Peinture — rose */
#peinture .pc-slide.right-1 {
  filter: brightness(.75) drop-shadow(-6px 8px 24px rgba(0,0,0,.55)) drop-shadow(0 0 18px rgba(224,123,154,.55));
}
#peinture .pc-slide.right-2 {
  filter: brightness(.55) drop-shadow(-4px 6px 18px rgba(0,0,0,.50)) drop-shadow(0 0 10px rgba(224,123,154,.35));
}
#peinture .pc-slide.right-far {
  filter: brightness(.38) drop-shadow(-3px 5px 14px rgba(0,0,0,.45));
}

/* Mobile — conserver le rendu */
@media(max-width:768px) {
  .carousel-slide.right-1, .tc-slide.right-1, .dc-slide.right-1, .pc-slide.right-1 {
    transform: translateX(calc(var(--pile-x,0px) + var(--peek))) scale(.95) !important;
  }
  .carousel-slide.right-2, .tc-slide.right-2, .dc-slide.right-2, .pc-slide.right-2 {
    transform: translateX(calc(var(--pile-x,0px) + 2*var(--peek))) scale(.91) !important;
  }
  .carousel-slide.right-far, .tc-slide.right-far, .dc-slide.right-far, .pc-slide.right-far {
    transform: translateX(calc(var(--pile-x,0px) + 3*var(--peek))) scale(.87) !important;
  }
}

/* ── FLASH : slides +20% ── */
#flash .carousel-slide { flex: 0 0 336px; }
/* scale géré dans @keyframes flash-drift */

/* Tablette (769–1024px) */
@media(max-width:1024px) and (min-width:769px) {
  #flash .carousel-slide { flex: 0 0 288px; }
  #flash .carousel-slide.active { animation: flash-drift-tablet 7s ease-in-out infinite, fc-neon 23s linear infinite; }
  /* Tattoo/Dessin/Peinture — tailles tablette (sync avec getSlideW JS) */
  .tc-slide { flex: 0 0 300px; }
  .dc-slide { flex: 0 0 260px; }
  .pc-slide { flex: 0 0 260px; }
}

/* Mobile */
@media(max-width:768px) {
  #flash .carousel-slide { flex: 0 0 200px !important; }
  #flash .carousel-slide.active { animation: flash-drift-soft 7s ease-in-out infinite, fc-neon 23s linear infinite !important; box-shadow: none !important; }
}


/* ── SAFARI / IPAD FIX — préfixes webkit pour keyframes ── */

/* Neon-flicker avec préfixe webkit */
@-webkit-keyframes neon-flicker {
  0%    { -webkit-filter: drop-shadow(0 6px 30px rgba(200,155,224,.35)) drop-shadow(0 12px 60px rgba(200,155,224,.18)); filter: drop-shadow(0 6px 30px rgba(200,155,224,.35)) drop-shadow(0 12px 60px rgba(200,155,224,.18)); }
  2%    { -webkit-filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)); filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)); }
  3.8%  { -webkit-filter: drop-shadow(0 2px 8px rgba(200,155,224,.08)); filter: drop-shadow(0 2px 8px rgba(200,155,224,.08)); }
  4%    { -webkit-filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)); filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)); }
  50%   { -webkit-filter: drop-shadow(0 8px 45px rgba(200,155,224,.88)) drop-shadow(0 16px 80px rgba(200,155,224,.58)); filter: drop-shadow(0 8px 45px rgba(200,155,224,.88)) drop-shadow(0 16px 80px rgba(200,155,224,.58)); }
  53.4% { -webkit-filter: drop-shadow(0 1px 4px rgba(200,155,224,.04)); filter: drop-shadow(0 1px 4px rgba(200,155,224,.04)); }
  53.6% { -webkit-filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)); filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)); }
  84.4% { -webkit-filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)); filter: drop-shadow(0 8px 50px rgba(200,155,224,.95)) drop-shadow(0 18px 90px rgba(200,155,224,.65)) drop-shadow(0 36px 160px rgba(200,155,224,.35)); }
  100%  { -webkit-filter: drop-shadow(0 6px 30px rgba(200,155,224,.35)) drop-shadow(0 12px 60px rgba(200,155,224,.18)); filter: drop-shadow(0 6px 30px rgba(200,155,224,.35)) drop-shadow(0 12px 60px rgba(200,155,224,.18)); }
}

/* Nav LED sur Safari */
@-webkit-keyframes nav-led-flicker {
  0%,100% { box-shadow: 0 0 6px rgba(200,155,224,.2), 0 4px 20px rgba(200,155,224,.1), 0 8px 50px rgba(200,155,224,.05); }
  2%      { box-shadow: 0 0 16px rgba(200,155,224,.75), 0 6px 55px rgba(200,155,224,.48), 0 16px 110px rgba(200,155,224,.28), 0 32px 170px rgba(200,155,224,.12); }
  3.8%    { box-shadow: 0 0 2px rgba(200,155,224,.05); }
  4%      { box-shadow: 0 0 16px rgba(200,155,224,.75), 0 6px 55px rgba(200,155,224,.48), 0 16px 110px rgba(200,155,224,.28), 0 32px 170px rgba(200,155,224,.12); }
  50%     { box-shadow: 0 0 14px rgba(200,155,224,.65), 0 5px 48px rgba(200,155,224,.4), 0 14px 95px rgba(200,155,224,.22); }
  53.4%   { box-shadow: 0 0 1px rgba(200,155,224,.03); }
  53.6%   { box-shadow: 0 0 16px rgba(200,155,224,.75), 0 6px 55px rgba(200,155,224,.48), 0 16px 110px rgba(200,155,224,.28); }
  84.4%   { box-shadow: 0 0 16px rgba(200,155,224,.75), 0 6px 55px rgba(200,155,224,.48), 0 16px 110px rgba(200,155,224,.28), 0 32px 170px rgba(200,155,224,.12); }
}



/* ── Tattoo : 39 dots = trop large, on masque et on garde le compteur ── */
#tattoo .carousel-dots { display: none; }

/* ══════════════════════════════════════════════════════
   SECTION RDV — Formulaire de réservation (Netlify Forms)
══════════════════════════════════════════════════════ */

#rdv { max-width: 820px; margin: 0 auto; }

.rdv-head { margin-bottom: 44px; }
.rdv-head .stit { margin-top: 8px; }
.rdv-sub {
  margin-top: 14px;
  color: var(--ink2);
  font-size: 14px;
  line-height: 1.7;
  max-width: 560px;
}

/* Formulaire */
.rdv-form { display: flex; flex-direction: column; gap: 0; }

/* Blocs numérotés */
.rdv-bloc {
  border-top: 1px solid rgba(200,155,224,.15);
  padding: 32px 0 28px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.rdv-bloc:first-of-type { border-top: none; }

.rdv-bloc-title {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--or);
  margin-bottom: 4px;
}

.rdv-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.rdv-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.rdv-field label {
  font-family: var(--f);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink2);
}

.rdv-field input,
.rdv-field select,
.rdv-field textarea {
  font-family: var(--f);
  font-size: 13.5px;
  font-weight: 400;
  color: var(--ink);
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(200,155,224,.20);
  border-radius: 10px;
  padding: 13px 16px;
  outline: none;
  transition: border-color .25s, box-shadow .25s, background .25s;
  -webkit-appearance: none;
  appearance: none;
  resize: vertical;
}

.rdv-field input::placeholder,
.rdv-field textarea::placeholder { color: rgba(240,236,224,.22); }

.rdv-field input:focus,
.rdv-field select:focus,
.rdv-field textarea:focus {
  border-color: rgba(200,155,224,.65);
  background: rgba(200,155,224,.05);
  box-shadow: 0 0 0 3px rgba(200,155,224,.10);
}

.rdv-field select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='rgba(200,155,224,.55)' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 38px;
  cursor: pointer;
}
.rdv-field select option { background: #12121e; color: var(--ink); }
.rdv-field textarea { min-height: 100px; line-height: 1.6; }

/* Zone upload */
.rdv-upload { position: relative; }
.rdv-upload input[type="file"] {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
  z-index: 2;
  width: 100%;
  height: 100%;
  border: none;
  background: none;
  padding: 0;
}
.rdv-upload-label {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 28px 20px;
  border: 1.5px dashed rgba(200,155,224,.30);
  border-radius: 10px;
  text-align: center;
  cursor: pointer;
  transition: border-color .25s, background .25s;
  color: var(--ink2);
}
.rdv-upload-label:hover {
  border-color: rgba(200,155,224,.55);
  background: rgba(200,155,224,.04);
}
.rdv-upload-label svg { opacity: .55; }
.rdv-upload-label span { font-size: 13px; font-weight: 500; color: var(--ink); }
.rdv-upload-label small { font-size: 11px; color: var(--ink2); opacity: .7; }

/* RGPD */
.rdv-rgpd {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 24px 0 8px;
  border-top: 1px solid rgba(200,155,224,.12);
}
.rdv-rgpd input[type="checkbox"] {
  width: 18px;
  height: 18px;
  min-width: 18px;
  border-radius: 5px;
  border: 1px solid rgba(200,155,224,.35);
  background: transparent;
  accent-color: var(--or);
  cursor: pointer;
  margin-top: 2px;
  padding: 0;
}
.rdv-rgpd label {
  font-size: 11px;
  color: var(--ink2);
  line-height: 1.6;
  letter-spacing: 0;
  text-transform: none;
  cursor: pointer;
}

/* Bouton submit */
.rdv-submit {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  align-self: flex-start;
  margin-top: 24px;
  padding: 14px 32px;
  background: var(--or);
  color: #080810;
  font-weight: 700;
  border-radius: 50px;
  border: none;
  cursor: pointer;
  transition: transform .25s, box-shadow .25s, background .25s;
}
.rdv-submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(244,162,97,.38);
  background: #f5a870;
}

/* Succès */
.rdv-success {
  display: none;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  padding: 64px 24px;
  text-align: center;
  animation: fu .6s ease both;
}
.rdv-success h3 {
  font-size: 28px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.rdv-success p { font-size: 15px; color: var(--ink2); line-height: 1.6; max-width: 420px; }
.rdv-success-sub a { color: var(--or); text-decoration: none; }
.rdv-success-sub a:hover { text-decoration: underline; }

/* Mobile */
@media(max-width:640px) {
  .rdv-row { grid-template-columns: 1fr; }
  .rdv-submit { width: 100%; justify-content: center; }
  .rdv-bloc { padding: 24px 0 20px; }
}

#rdv { max-width: 780px; margin: 0 auto; }

.rdv-head { margin-bottom: 40px; }
.rdv-head .stit { margin-top: 8px; }
.rdv-sub {
  margin-top: 14px;
  color: var(--ink2);
  font-size: 14px;
  line-height: 1.6;
  max-width: 520px;
}

/* Formulaire */
.rdv-form { display: flex; flex-direction: column; gap: 20px; }

.rdv-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.rdv-field {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.rdv-field label {
  font-family: var(--f);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink2);
}

.rdv-field input,
.rdv-field select,
.rdv-field textarea {
  font-family: var(--f);
  font-size: 13px;
  font-weight: 400;
  color: var(--ink);
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(200,155,224,.22);
  border-radius: 10px;
  padding: 13px 16px;
  outline: none;
  transition: border-color .25s, box-shadow .25s, background .25s;
  -webkit-appearance: none;
  appearance: none;
  resize: vertical;
}

.rdv-field input::placeholder,
.rdv-field textarea::placeholder {
  color: rgba(240,236,224,.25);
}

.rdv-field input:focus,
.rdv-field select:focus,
.rdv-field textarea:focus {
  border-color: rgba(200,155,224,.7);
  background: rgba(200,155,224,.06);
  box-shadow: 0 0 0 3px rgba(200,155,224,.12);
}

/* Select arrow custom */
.rdv-field select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='rgba(200,155,224,.6)' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 38px;
  cursor: none;
}
.rdv-field select option {
  background: #12121e;
  color: var(--ink);
}

.rdv-field textarea { min-height: 110px; }

/* Bouton submit */
.rdv-submit {
  align-self: flex-start;
  margin-top: 6px;
  background: var(--or) !important;
  color: #080810 !important;
  cursor: none;
}
.rdv-submit:hover {
  background: #f4a261dd !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(244,162,97,.35);
}

/* Message de succès */
.rdv-success {
  display: none;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 48px 24px;
  text-align: center;
  animation: fu .6s ease both;
}
.rdv-success p {
  font-size: 18px;
  font-weight: 600;
  letter-spacing: .02em;
  line-height: 1.5;
}
.rdv-success p span {
  font-size: 13px;
  font-weight: 400;
  color: var(--ink2);
}

/* Mobile */
@media(max-width:640px) {
  .rdv-row { grid-template-columns: 1fr; }
  .rdv-submit { width: 100%; text-align: center; }
}