/* ============================================================
   EHBH EVENT — Bar-Mitsva David-Reouven
   Palette : bleu royal + argent (aucun doré)
   Script  : Pinyon Script (prénom)
   Serif   : Cormorant Garamond (titres)
   Sans    : Assistant (corps de texte, compatible hébreu)
   ============================================================ */

:root{
  /* --- Couleurs --- */
  --navy-950:#050A1C;
  --navy-900:#0A1633;
  --navy-800:#0F1E42;
  --royal-700:#1D3A82;
  --royal-500:#3159B0;
  --royal-400:#4C74C9;

  --silver-100:#F5F7FC;
  --silver-200:#E7EAF3;
  --silver-300:#D6DBE8;
  --silver-500:#98A2BC;
  --silver-700:#5C6683;

  --ink:#0A1633;

  /* Dégradé métallique argenté (boutons, sceau, monogrammes) */
  --silver-sheen:linear-gradient(135deg,#F6F7FB 0%,#C9CFDE 28%,#F9FAFD 50%,#AEB6CC 72%,#F1F2F8 100%);
  --silver-sheen-soft:linear-gradient(135deg,#EDEFF6 0%,#CBD1E1 50%,#EDEFF6 100%);

  /* --- Typo --- */
  --font-script:'Pinyon Script', cursive;
  --font-serif:'Cormorant Garamond', serif;
  --font-sans:'Assistant', system-ui, sans-serif;

  /* --- Rythme --- */
  --section-pad-y: clamp(4.5rem, 10vw, 7.5rem);
  --ease-soft: cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; scroll-behavior:auto !important; }
}

body{
  margin:0;
  font-family:var(--font-sans);
  color:var(--ink);
  background:var(--navy-900);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.no-scroll{ overflow:hidden; height:100vh; }

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; cursor:pointer; }
svg use, svg path{ fill:currentColor; }

.section-inner{
  max-width:640px;
  margin:0 auto;
  padding:0 1.5rem;
}
.section-inner-wide{ max-width:900px; }

.section{
  position:relative;
  padding:var(--section-pad-y) 0;
}

.eyebrow{
  font-family:var(--font-serif);
  font-style:italic;
  font-weight:500;
  font-size:0.95rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--silver-300);
  text-align:center;
  margin:0 0 .75rem;
}
.eyebrow-dark{ color:var(--royal-500); }

.section-title{
  font-family:var(--font-serif);
  font-weight:600;
  font-size:clamp(1.9rem,6vw,2.6rem);
  text-align:center;
  color:var(--silver-100);
  margin:0 0 .5rem;
}
.section-title-dark{ color:var(--navy-900); }

/* ============================================================
   SCROLL REVEAL (micro-animations)
   ============================================================ */
.reveal{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .8s var(--ease-soft), transform .8s var(--ease-soft);
}
.reveal.in-view{ opacity:1; transform:translateY(0); }

/* ============================================================
   DIVIDER — sceau récurrent (motif signature)
   ============================================================ */
.divider-seal{
  width:40px; height:40px;
  margin:0 auto 1.75rem;
  color:var(--silver-300);
  opacity:.85;
}
.divider-seal svg{ width:100%; height:100%; }
.divider-seal-light{ color:var(--royal-500); }

/* ============================================================
   ÉCRAN D'ENVELOPPE
   ============================================================ */
#envelope-screen{
  position:fixed; inset:0;
  z-index:1000;
  overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(ellipse at 50% 20%, rgba(76,116,201,.25), transparent 60%),
    linear-gradient(160deg,var(--navy-950),var(--navy-900) 55%,var(--navy-800));
  transition:opacity .6s var(--ease-soft);
}
#envelope-screen.envelope-hidden{
  opacity:0;
  pointer-events:none;
}
#envelope-screen::after{
  content:'';
  position:absolute; inset:0;
  background-image:radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px);
  background-size:26px 26px;
  opacity:.5;
  pointer-events:none;
}

.envelope-scene{
  position:relative;
  display:flex; flex-direction:column; align-items:center;
  gap:2rem;
  padding:1.5rem;
}

.envelope-kicker{
  font-family:var(--font-serif);
  font-style:italic;
  color:var(--silver-500);
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:.8rem;
  margin:0;
}

.envelope{
  position:relative;
  width:min(78vw, 300px);
  aspect-ratio:3/2;
  background:none; border:0; padding:0;
  perspective:1400px;
}

.envelope-shadow{
  position:absolute;
  left:8%; right:8%; bottom:-18px;
  height:28px;
  background:radial-gradient(ellipse, rgba(0,0,0,.45), transparent 70%);
  filter:blur(4px);
}

.envelope-body{
  position:absolute; inset:0;
  display:block;
}

.envelope-back{
  position:absolute; inset:0;
  border-radius:6px;
  z-index:1;
  background:linear-gradient(155deg,var(--navy-800),var(--navy-900));
  box-shadow:inset 0 0 0 1px rgba(214,219,232,.18);
}

/* Rabat de l'enveloppe */
.envelope-flap{
  position:absolute;
  top:0; left:0; right:0;
  height:60%;
  clip-path:polygon(0 0, 100% 0, 50% 100%);
  background:linear-gradient(200deg,var(--navy-800),var(--navy-900) 70%);
  box-shadow:inset 0 -1px 0 rgba(214,219,232,.15);
  transform-origin:top center;
  transform-style:preserve-3d;
  backface-visibility:hidden;
  transition:transform .7s var(--ease-soft);
  z-index:3;
  display:flex; align-items:flex-end; justify-content:center;
  padding-bottom:8%;
}

/* Sceau argenté */
.seal{
  position:relative;
  width:20%;
  aspect-ratio:1;
  border-radius:50%;
  background:var(--silver-sheen);
  box-shadow:0 2px 10px rgba(0,0,0,.35), inset 0 1px 2px rgba(255,255,255,.7), inset 0 -2px 3px rgba(0,0,0,.25);
  display:flex; align-items:center; justify-content:center;
  transition:opacity .4s ease .15s, transform .4s ease .15s;
}
.seal-half{
  position:absolute;
  width:55%; height:55%;
  color:var(--navy-900);
  transition:transform .5s var(--ease-soft), opacity .5s var(--ease-soft);
}
.seal-half svg{ width:100%; height:100%; }
.seal-half-right{ opacity:0; }

/* Carte d'invitation cachée dans l'enveloppe */
.invitation-card{
  position:absolute;
  left:6%; right:6%;
  bottom:6%;
  height:82%;
  border-radius:4px;
  background:var(--silver-100);
  box-shadow:0 10px 30px rgba(0,0,0,.4);
  z-index:2;
  opacity:0;
  transform:translateY(6%) scale(.98);
  transition:transform 1s var(--ease-soft), box-shadow 1s var(--ease-soft), border-radius .6s ease, opacity .5s ease;
  overflow:hidden;
}
.invitation-card-inner{
  position:absolute; inset:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:.4rem;
  background:
    radial-gradient(circle at 50% 0%, rgba(76,116,201,.12), transparent 60%),
    var(--silver-100);
  opacity:0;
  transition:opacity .4s ease;
}
.invitation-card-monogram{
  width:34px; height:34px;
  color:var(--royal-500);
  margin-bottom:.3rem;
}
.invitation-card-monogram svg{ width:100%; height:100%; }
.invitation-card-name{
  font-family:var(--font-script);
  font-size:2.1rem;
  color:var(--navy-900);
  line-height:1;
}
.invitation-card-sub{
  font-family:var(--font-serif);
  font-style:italic;
  letter-spacing:.1em;
  text-transform:uppercase;
  font-size:.75rem;
  color:var(--royal-500);
}

.envelope-hint{
  font-family:var(--font-sans);
  font-size:.85rem;
  letter-spacing:.06em;
  color:var(--silver-500);
  animation:pulse-hint 2.2s ease-in-out infinite;
  margin:0;
}
@keyframes pulse-hint{
  0%,100%{ opacity:.55; }
  50%{ opacity:1; }
}

/* --- Séquence d'ouverture (classes ajoutées en JS) --- */
.envelope.is-opening .envelope-flap{
  transform:rotateX(-178deg);
}
.envelope.is-opening .seal{
  opacity:0;
  transform:scale(1.15);
}
.envelope.is-opening .seal-half-left{ transform:translateX(-140%) rotate(-25deg); }
.envelope.is-opening .seal-half-right{ opacity:1; transform:translateX(140%) rotate(25deg); }

.envelope.is-opening .invitation-card{
  opacity:1;
  transition-delay:.25s;
}
/* La carte affiche un bref aperçu (nom + monogramme) juste après être sortie de l'enveloppe */
.envelope.is-opening .invitation-card-inner{
  opacity:1;
  transition-delay:.55s;
}
.envelope.is-rising .invitation-card{
  transform:scale(7);
  border-radius:0;
  z-index:1100;
}
/* L'aperçu s'efface avant l'agrandissement, pour éviter un texte fantôme géant */
.envelope.is-rising .invitation-card-inner{
  opacity:0;
  transition:opacity .2s ease;
}

/* ============================================================
   LECTEUR AUDIO
   ============================================================ */
.audio-player{
  position:fixed;
  right:1rem; bottom:1rem;
  z-index:120;
  display:flex; align-items:center; gap:.6rem;
  padding:.5rem .7rem;
  border-radius:999px;
  background:rgba(10,22,51,.72);
  backdrop-filter:blur(10px);
  box-shadow:0 6px 18px rgba(0,0,0,.3), inset 0 0 0 1px rgba(214,219,232,.2);
  transition:opacity .4s ease;
}
.audio-toggle{
  width:34px; height:34px;
  border-radius:50%;
  border:0;
  background:var(--silver-sheen);
  color:var(--navy-900);
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.audio-toggle svg{ width:18px; height:18px; }
.icon-sound-off{ display:none; }
.audio-toggle[aria-pressed="false"] .icon-sound-on{ display:none; }
.audio-toggle[aria-pressed="false"] .icon-sound-off{ display:block; }

.audio-title{
  font-size:.8rem;
  color:var(--silver-300);
  max-width:0;
  overflow:hidden;
  white-space:nowrap;
  transition:max-width .5s ease, margin .5s ease;
}
.audio-player:hover .audio-title,
.audio-player:focus-within .audio-title{
  max-width:140px;
  margin-right:.2rem;
}

/* ============================================================
   HERO
   ============================================================ */
.section-hero{
  min-height:100vh;
  display:flex;
  align-items:center;
  padding-top:calc(var(--section-pad-y) + 2rem);
  overflow:hidden;
}
.hero-bg{
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse 60% 45% at 50% 12%, rgba(76,116,201,.35), transparent 65%),
    radial-gradient(ellipse 70% 50% at 85% 90%, rgba(49,89,176,.25), transparent 60%),
    linear-gradient(170deg,var(--navy-950),var(--navy-900) 60%,var(--navy-800));
  z-index:0;
}
.hero-bg::after{
  content:'';
  position:absolute; inset:0;
  background-image:radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:30px 30px;
}
.hero-inner{
  position:relative; z-index:1;
  text-align:center;
  display:flex; flex-direction:column; align-items:center;
}
.hero-inner .eyebrow{ color:var(--silver-300); }

.hero-name{
  font-family:var(--font-script);
  font-size:clamp(3.6rem,16vw,6.5rem);
  line-height:1;
  margin:.2rem 0 0;
  background:var(--silver-sheen);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:drop-shadow(0 2px 12px rgba(0,0,0,.35));
}
.hero-occasion{
  font-family:var(--font-serif);
  font-style:italic;
  font-size:clamp(1.05rem,3vw,1.3rem);
  color:var(--silver-300);
  margin:.4rem 0 1.8rem;
}

.hero-date{
  display:flex; flex-direction:column; align-items:center; gap:.5rem;
  margin-bottom:2.4rem;
}
.hero-date-hebrew{
  font-family:var(--font-serif);
  font-weight:600;
  font-size:1.25rem;
  color:var(--silver-100);
  letter-spacing:.04em;
}
.hero-date-divider{
  width:34px; height:1px;
  background:var(--silver-sheen-soft);
}
.hero-date-greg{
  font-size:.9rem;
  color:var(--silver-500);
  letter-spacing:.03em;
}

.countdown{
  display:flex; gap:.9rem;
  margin-bottom:2.6rem;
}
.countdown-item{
  display:flex; flex-direction:column; align-items:center;
  width:58px;
  padding:.7rem 0 .6rem;
  border-radius:10px;
  background:rgba(255,255,255,.04);
  box-shadow:inset 0 0 0 1px rgba(214,219,232,.16);
}
.countdown-num{
  font-family:var(--font-serif);
  font-weight:600;
  font-size:1.5rem;
  color:var(--silver-100);
  font-variant-numeric:tabular-nums;
}
.countdown-label{
  font-size:.62rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--silver-500);
  margin-top:.2rem;
}

.scroll-cue{
  width:1px; height:46px;
  position:relative;
  display:block;
}
.scroll-cue-line{
  position:absolute; inset:0;
  background:linear-gradient(var(--silver-500), transparent);
}
.scroll-cue-line::after{
  content:'';
  position:absolute; left:-2.5px; top:0;
  width:6px; height:6px;
  border-radius:50%;
  background:var(--silver-300);
  animation:scroll-cue-move 1.8s ease-in-out infinite;
}
@keyframes scroll-cue-move{
  0%{ transform:translateY(0); opacity:1; }
  85%{ opacity:0; }
  100%{ transform:translateY(40px); opacity:0; }
}

/* ============================================================
   INTRO
   ============================================================ */
.section-intro{
  background:linear-gradient(180deg,var(--silver-100),#EEF1F8);
  text-align:center;
}
.intro-text{
  font-family:var(--font-serif);
  font-style:italic;
  font-weight:500;
  font-size:clamp(1.3rem,4.4vw,1.7rem);
  line-height:1.5;
  color:var(--navy-900);
  margin:0 0 1.6rem;
  quotes:none;
}
.intro-text-secondary{
  font-size:1rem;
  line-height:1.8;
  color:var(--silver-700);
  max-width:52ch;
  margin:0 auto 1.8rem;
}
.intro-signature{
  font-family:var(--font-script);
  font-size:1.6rem;
  color:var(--royal-500);
  margin:0;
}

/* ============================================================
   PROGRAMME — CARTES ÉVÉNEMENT
   ============================================================ */
.section-programme{
  background:linear-gradient(180deg,var(--navy-900),var(--navy-950));
  text-align:center;
}
.programme-hebrew-date{
  font-size:.9rem;
  color:var(--silver-500);
  letter-spacing:.05em;
  margin:0 0 3rem;
}

.events{
  display:flex;
  flex-direction:column;
  gap:1.75rem;
  text-align:left;
}

.event-card{
  position:relative;
  padding:clamp(1.75rem, 4vw, 3rem);
  border-radius:20px;
  background:linear-gradient(165deg, rgba(255,255,255,.045), rgba(255,255,255,.015));
  box-shadow:inset 0 0 0 1px rgba(214,219,232,.16), 0 20px 40px rgba(0,0,0,.25);
}

.event-card-head{
  display:flex;
  align-items:center;
  gap:1.1rem;
  margin-bottom:1.25rem;
}
.event-icon{
  flex-shrink:0;
  width:64px; height:64px;
  border-radius:50%;
  background:var(--navy-950);
  box-shadow:0 0 0 1px rgba(214,219,232,.3), inset 0 0 18px rgba(76,116,201,.18);
  display:flex; align-items:center; justify-content:center;
  color:var(--silver-100);
}
.event-icon svg{ width:30px; height:30px; }

.event-eyebrow{
  font-family:var(--font-serif);
  font-style:italic;
  font-size:.85rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--royal-400);
  margin:0 0 .2rem;
  text-align:left;
}
.event-title{
  font-family:var(--font-serif);
  font-weight:600;
  font-size:clamp(1.4rem, 3.4vw, 1.7rem);
  color:var(--silver-100);
  margin:0;
}

.event-desc{
  font-size:1rem;
  line-height:1.75;
  color:var(--silver-300);
  max-width:56ch;
  margin:0 0 1.6rem;
}

.event-meta{
  display:flex;
  flex-direction:column;
  gap:.7rem;
  padding-top:1.4rem;
  border-top:1px solid rgba(214,219,232,.14);
}
.event-meta-row{
  display:flex;
  align-items:center;
  gap:.7rem;
  font-size:.95rem;
  color:var(--silver-200);
}
.event-meta-icon{
  flex-shrink:0;
  width:20px; height:20px;
  color:var(--royal-400);
}
.event-address{
  color:var(--silver-100);
  border-bottom:1px solid rgba(76,116,201,.4);
  transition:color .2s ease, border-color .2s ease;
}
.event-address:hover, .event-address:focus-visible{
  color:var(--royal-400);
  border-color:var(--royal-400);
}

.event-card-tbd{
  background:linear-gradient(165deg, rgba(76,116,201,.1), rgba(255,255,255,.015));
}
.tbd-badge{
  display:inline-block;
  align-self:flex-start;
  font-size:.7rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--navy-900);
  background:var(--silver-sheen);
  padding:.35rem .8rem;
  border-radius:999px;
}

@media (min-width:640px){
  .event-card-head{ align-items:flex-start; }
  .event-meta-row{ font-size:1rem; }
}

/* ============================================================
   GALERIE
   ============================================================ */
.section-gallery{
  background:linear-gradient(180deg,#EEF1F8,var(--silver-100));
}
.gallery-wrap{
  position:relative;
  display:flex; align-items:center;
  gap:.5rem;
  max-width:640px;
  margin:0 auto;
  padding:0 .5rem;
}
.gallery-track{
  flex:1 1 0%;
  min-width:0;
  display:flex;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  gap:1rem;
  padding:.5rem;
  scrollbar-width:none;
  border-radius:14px;
}
.gallery-track::-webkit-scrollbar{ display:none; }

.gallery-slide{
  flex:0 0 82%;
  scroll-snap-align:center;
  margin:0;
  aspect-ratio:4/5;
  border-radius:14px;
  overflow:hidden;
  background:linear-gradient(155deg,var(--silver-200),var(--silver-300));
  box-shadow:0 12px 28px rgba(10,22,51,.14);
  position:relative;
}
.gallery-slide img{
  width:100%; height:100%;
  object-fit:cover;
}
/* Etat "placeholder" ajouté en JS si l'image n'existe pas encore */
.gallery-slide.is-placeholder img{ display:none; }
.gallery-slide.is-placeholder::before{
  content:'Photo à ajouter';
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-serif);
  font-style:italic;
  color:var(--silver-700);
}
.gallery-slide.is-placeholder::after{
  content:'';
  position:absolute; inset:0;
  background-image:radial-gradient(rgba(76,116,201,.18) 1.5px, transparent 1.5px);
  background-size:18px 18px;
}

.gallery-arrow{
  flex-shrink:0;
  width:40px; height:40px;
  border-radius:50%;
  border:0;
  background:var(--silver-sheen);
  color:var(--navy-900);
  font-size:1.4rem;
  line-height:1;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 14px rgba(10,22,51,.18);
  transition:transform .2s ease;
}
.gallery-arrow:hover{ transform:scale(1.08); }
.gallery-arrow:active{ transform:scale(.95); }

.gallery-dots{
  display:flex; justify-content:center; gap:.45rem;
  margin-top:1.4rem;
}
.gallery-dots button{
  width:7px; height:7px;
  border-radius:50%;
  border:0;
  background:var(--silver-500);
  opacity:.5;
  padding:0;
  transition:opacity .25s ease, transform .25s ease, background .25s ease;
}
.gallery-dots button.is-active{
  opacity:1;
  background:var(--royal-500);
  transform:scale(1.3);
}

/* ============================================================
   RSVP
   ============================================================ */
.section-rsvp{
  background:linear-gradient(180deg,var(--navy-950),var(--navy-900));
  text-align:center;
}
.rsvp-deadline{
  font-size:.9rem;
  color:var(--silver-500);
  margin:0 0 2.4rem;
}
.rsvp-form{
  text-align:left;
  display:flex; flex-direction:column; gap:1.2rem;
  background:rgba(255,255,255,.03);
  padding:1.8rem 1.5rem;
  border-radius:16px;
  box-shadow:inset 0 0 0 1px rgba(214,219,232,.14);
}
.field label, .field-presence legend{
  display:block;
  font-size:.82rem;
  letter-spacing:.04em;
  color:var(--silver-300);
  margin-bottom:.4rem;
}
.field-presence{ border:0; padding:0; margin:0; }
input[type="text"], input[type="number"], textarea{
  width:100%;
  font:inherit;
  color:var(--silver-100);
  background:rgba(255,255,255,.05);
  border:1px solid rgba(214,219,232,.22);
  border-radius:10px;
  padding:.7rem .85rem;
  transition:border-color .2s ease, background .2s ease;
}
input[type="text"]:focus, input[type="number"]:focus, textarea:focus{
  outline:none;
  border-color:var(--royal-400);
  background:rgba(255,255,255,.08);
}
textarea{ resize:vertical; }

.radio-row{ display:flex; flex-wrap:wrap; gap:.6rem; }
.radio-pill{
  position:relative;
  flex:1 1 auto;
}
.radio-pill input{
  position:absolute;
  opacity:0;
  inset:0;
  cursor:pointer;
}
.radio-pill span{
  display:block;
  text-align:center;
  font-size:.86rem;
  padding:.6rem .8rem;
  border-radius:10px;
  border:1px solid rgba(214,219,232,.22);
  color:var(--silver-300);
  transition:all .2s ease;
}
.radio-pill input:checked + span{
  background:var(--silver-sheen);
  color:var(--navy-900);
  border-color:transparent;
  font-weight:600;
}
.radio-pill input:focus-visible + span{
  outline:2px solid var(--royal-400);
  outline-offset:2px;
}

.field-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
}

.btn-submit{
  margin-top:.4rem;
  border:0;
  border-radius:999px;
  padding:.95rem 1.5rem;
  background:var(--silver-sheen);
  color:var(--navy-900);
  font-weight:700;
  letter-spacing:.03em;
  box-shadow:0 8px 22px rgba(10,22,51,.35);
  transition:transform .2s ease, box-shadow .2s ease;
}
.btn-submit:hover{ transform:translateY(-2px); box-shadow:0 12px 26px rgba(10,22,51,.4); }
.btn-submit:active{ transform:translateY(0); }
.btn-submit:disabled{ opacity:.6; cursor:wait; }

.rsvp-status{
  min-height:1.2em;
  font-size:.85rem;
  color:#E48A8A;
  margin:0;
  text-align:center;
}

.rsvp-success{
  text-align:center;
  padding:2.5rem 1.5rem;
  animation:fade-in .6s var(--ease-soft);
}
.rsvp-success-seal{
  width:52px; height:52px;
  margin:0 auto 1.2rem;
  color:var(--silver-100);
}
.rsvp-success-seal svg{ width:100%; height:100%; }
.rsvp-success p{
  font-family:var(--font-serif);
  font-style:italic;
  font-size:1.3rem;
  color:var(--silver-100);
  line-height:1.6;
}
@keyframes fade-in{ from{ opacity:0; transform:translateY(10px);} to{ opacity:1; transform:translateY(0);} }

/* ============================================================
   CONTACT
   ============================================================ */
.section-contact{
  background:linear-gradient(180deg,var(--silver-100),#EEF1F8);
  text-align:center;
}
.contact-name{
  font-family:var(--font-script);
  font-size:2.2rem;
  color:var(--navy-900);
  margin:0 0 1.6rem;
}
.contact-actions{
  display:flex; justify-content:center; gap:.9rem; flex-wrap:wrap;
}
.btn-contact{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.8rem 1.4rem;
  border-radius:999px;
  background:var(--royal-500);
  color:#fff;
  font-weight:600;
  box-shadow:0 8px 20px rgba(49,89,176,.3);
  transition:transform .2s ease;
}
.btn-contact svg{ width:18px; height:18px; }
.btn-contact:hover{ transform:translateY(-2px); }
.btn-contact-ghost{
  background:transparent;
  color:var(--navy-900);
  box-shadow:inset 0 0 0 1.5px var(--navy-900);
}

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer{
  padding:3rem 1.5rem 2.5rem;
  text-align:center;
  background:var(--navy-950);
}
.footer-signature{
  font-size:.8rem;
  letter-spacing:.05em;
  color:var(--silver-500);
  margin:0;
}
.footer-signature span{
  color:var(--silver-200);
  font-weight:600;
}

/* ============================================================
   RESPONSIVE — desktop refinements
   ============================================================ */
@media (min-width:760px){
  .hero-name{ font-size:7.5rem; }
  .gallery-slide{ flex-basis:44%; }
  .field-row{ gap:1.4rem; }
}

@media (min-width:1024px){
  .section-inner-wide{ max-width:1000px; }
  .gallery-slide{ flex-basis:31%; }
}

/* Focus visible global (accessibilité clavier) */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
  outline:2px solid var(--royal-400);
  outline-offset:3px;
}