/* ==========================================================================
   WITH NÜRYA · page d'accueil
   ------------------------------------------------------------------------
   COULEURS DE MARQUE (fichier « Codes couleurs.txt »)
     Marron espresso   #3A2923  texte, titres, nav, boutons, fond contact
     Crème (base)      #F8F4EB  fond du site, cartes ateliers
     Rose pastel       #F7E7E3  fond section ateliers, bouton Envoyer, accents
     Crème très clair  #FDFBF6  nuance d'appoint
   TYPOGRAPHIE
     Titres : THE SEASON   Textes : Montserrat
   GRILLE (méthode suisse, Müller-Brockmann)
     corps 17 / interligne 28 -> unité verticale u = 28px
     gouttière = 1 ligne = 28px · 12 colonnes · marges latérales 98px @1440
   ========================================================================== */

/* --------------------------------------------------------------------------
   THE SEASON
   Police commerciale, pas d'hébergement libre possible.
   POUR L'ACTIVER : déposer TheSeason-Regular.woff2 et TheSeason-Italic.woff2
   dans un dossier « fonts/ », puis retirer les deux marqueurs de commentaire
   ci-dessous. Tant qu'elle n'est pas activée, le rendu utilise
   Cormorant Garamond, le substitut le plus proche.
   --------------------------------------------------------------------------
@font-face{
  font-family:'The Season';
  src:url('../../fonts/TheSeason-Regular.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'The Season';
  src:url('../../fonts/TheSeason-Italic.woff2') format('woff2');
  font-weight:400;font-style:italic;font-display:swap;
}
   -------------------------------------------------------------------------- */

:root{
  /* --- couleurs de marque --- */
  --espresso:    #3A2923;
  --creme:       #F8F4EB;
  --rose:        #F7E7E3;
  --creme-clair: #FDFBF6;

  --ligne:       rgba(58,41,35,.16);
  --ligne-forte: rgba(58,41,35,.32);
  --ligne-clair: rgba(248,244,235,.22);

  /* --- polices --- */
  --titre: 'The Season','Cormorant Garamond',Georgia,serif;
  --texte: 'Montserrat',system-ui,sans-serif;

  /* --- grille --- */
  --u: 28px;
  --gap: 28px;
  --maxw: 1244px;
  --pad: clamp(22px, 6.8vw, 98px);

  /* --- échelle typographique --- */
  --t-micro: .70rem;
  --t-petit: .76rem;
  --t-corps: 1.0625rem;
  --t-lead:  clamp(1.06rem, .92rem + .5vw, 1.26rem);
  --t-h3:    clamp(1.45rem, 1.2rem + .8vw, 1.66rem);
  --t-h2:    clamp(1.9rem,  1.35rem + 2vw, 3.05rem);
  --t-h1:    clamp(2.6rem,  1.5rem + 4.2vw, 5.2rem);

  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  background:var(--creme);
  color:var(--espresso);
  font-family:var(--texte);
  font-size:var(--t-corps);
  font-weight:400;
  line-height:calc(var(--u) / 17 * 1em);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{display:block;max-width:100%;height:auto;}
a{color:inherit;}
::selection{background:var(--espresso);color:var(--creme);}

/* --- primitives de grille ------------------------------------------------ */
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad);}
.grid{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:var(--gap);row-gap:calc(var(--u) * 2);
}
@media(max-width:900px){ .grid{grid-template-columns:repeat(6,minmax(0,1fr));} }

/* --- typographie --------------------------------------------------------- */
.h1{font-family:var(--titre);font-size:var(--t-h1);font-weight:400;line-height:1.0;letter-spacing:-.015em;}
.h2{font-family:var(--titre);font-size:var(--t-h2);font-weight:400;line-height:1.1;letter-spacing:-.008em;color:var(--espresso);}
.h3{font-family:var(--titre);font-size:var(--t-h3);font-weight:400;line-height:1.2;color:var(--espresso);}
.lead{font-size:var(--t-lead);font-weight:300;line-height:1.65;}
.kicker{
  font-size:var(--t-petit);font-weight:500;
  letter-spacing:.24em;text-transform:uppercase;
  color:var(--espresso);
  display:flex;align-items:center;gap:.9rem;
}
.kicker::before{
  content:attr(data-num);
  font-family:var(--titre);font-size:1.05rem;
  letter-spacing:.04em;text-transform:none;opacity:.6;
}
.kicker::after{content:"";flex:none;width:46px;height:1px;background:currentColor;opacity:.4;}
.legende{
  font-size:var(--t-micro);letter-spacing:.16em;text-transform:uppercase;
  font-weight:500;color:rgba(58,41,35,.75);
}

/* --- boutons ------------------------------------------------------------- */
.btn{
  --bg:var(--espresso); --fg:var(--creme);
  position:relative;overflow:hidden;isolation:isolate;
  display:inline-flex;align-items:center;justify-content:center;gap:.7rem;
  padding:calc(var(--u) * .62) calc(var(--u) * 1.25);
  background:var(--bg);color:var(--fg);border:1px solid var(--bg);
  font-size:var(--t-petit);font-weight:500;letter-spacing:.18em;text-transform:uppercase;
  text-decoration:none;cursor:pointer;font-family:var(--texte);
  transition:color .45s var(--ease),border-color .45s var(--ease);
}
.btn::before{
  content:"";position:absolute;inset:0;z-index:-1;background:var(--fg);
  transform:scaleY(0);transform-origin:bottom;
  transition:transform .5s var(--ease-out);
}
.btn:hover::before{transform:scaleY(1);}
.btn:hover{color:var(--bg);}
.btn--ghost{--bg:transparent;--fg:var(--espresso);border-color:var(--ligne-forte);}
.btn--ghost::before{background:var(--espresso);}
.btn--ghost:hover{color:var(--creme);border-color:var(--espresso);}
.btn--clair{--bg:transparent;--fg:var(--creme);border-color:var(--ligne-clair);}
.btn--clair::before{background:var(--creme);}
.btn--clair:hover{color:var(--espresso);border-color:var(--creme);}
/* bouton Envoyer : rose pastel sur espresso */
.btn--rose{--bg:var(--rose);--fg:var(--espresso);border-color:var(--rose);}
.btn--rose::before{background:var(--espresso);}
.btn--rose:hover{color:var(--rose);border-color:var(--rose);}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:2px solid var(--espresso);outline-offset:3px;
}
.sur-espresso a:focus-visible,.sur-espresso button:focus-visible,
.sur-espresso input:focus-visible,.sur-espresso textarea:focus-visible,.sur-espresso select:focus-visible{
  outline-color:var(--rose);
}

.lien{
  display:inline-flex;align-items:center;gap:.55rem;
  font-size:var(--t-petit);letter-spacing:.14em;text-transform:uppercase;font-weight:500;
  color:var(--espresso);text-decoration:none;
  padding-bottom:4px;border-bottom:1px solid var(--ligne-forte);
  transition:border-color .3s var(--ease),gap .3s var(--ease);
}
.lien:hover{border-color:var(--espresso);gap:.95rem;}

/* ========================= BARRE DE PROGRESSION ========================== */
.progression{
  position:fixed;top:0;left:0;right:0;height:2px;z-index:130;
  background:var(--espresso);transform:scaleX(0);transform-origin:left;
  will-change:transform;
}

/* ========================= NAVIGATION ==================================== */
.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 120;
  padding-block: calc(var(--u) * .78);
  color: var(--creme);
  transition: background .5s var(--ease), color .5s var(--ease), padding .4s var(--ease), box-shadow .4s var(--ease);
}

.nav.is-stuck {
  background: rgba(248, 244, 235, .95);
  backdrop-filter: saturate(1.2) blur(10px);
  box-shadow: 0 1px 0 var(--ligne);
  color: var(--espresso);
  padding-block: calc(var(--u) * .5);
}

.nav__inner {
  max-width: var(--maxw);
  margin-inline: auto;
  padding-inline: var(--pad);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--gap);
}

.nav__brand {
  display: flex;
  align-items: center;
  gap: .7rem;
  text-decoration: none;
  color: inherit;
}

.nav__icone {
  width: 34px;
  height: auto;
  transition: transform .8s var(--ease), filter .5s var(--ease);
}

.nav:not(.is-stuck) .nav__icone {
  filter: brightness(0) invert(1);
}

.nav__brand:hover .nav__icone {
  transform: rotate(90deg);
}

.nav__word {
  font-family: var(--titre);
  font-size: 1.14rem;
  letter-spacing: .3em;
  font-weight: 400;
  text-transform: uppercase;
}

.nav__links {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 1.15);
  list-style: none;
}

.nav__links a {
  font-size: var(--t-petit);
  letter-spacing: .16em;
  text-transform: uppercase;
  font-weight: 500;
  color: inherit;
  text-decoration: none;
  position: relative;
  padding-block: 4px;
}

.nav__links a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: 0;
  height: 1px;
  background: currentColor;
  transition: right .35s var(--ease);
}

.nav__links a:hover::after {
  right: 0;
}

.nav__cta {
  padding: .72rem 1.25rem;
  border: 1px solid currentColor;
  opacity: .92;
}

.nav__cta::after {
  display: none;
}

.nav__cta:hover {
  opacity: 1;
}

.burger {
  display: none;
  width: 44px;
  height: 44px;
  border: 1px solid currentColor;
  background: transparent;
  cursor: pointer;
  position: relative;
  color: inherit;
}

.burger span {
  position: absolute;
  left: 12px;
  right: 12px;
  height: 1px;
  background: currentColor;
  transition: transform .35s var(--ease), opacity .25s;
}

.burger span:nth-child(1) { top: 16px; }
.burger span:nth-child(2) { top: 22px; }
.burger span:nth-child(3) { top: 28px; }

.nav.is-open .burger span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.nav.is-open .burger span:nth-child(2) { opacity: 0; }
.nav.is-open .burger span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* Fixes Spécifiques Mobile */
@media(max-width: 900px) {
  .burger {
    display: block;
    z-index: 1001;
  }

  .nav__links {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: var(--espresso);
    color: var(--creme);
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: calc(var(--u) * .7);
    padding: 0 var(--pad);
    clip-path: inset(0 0 100% 0);
    transition: clip-path .5s var(--ease-out);
    z-index: 1000;
    overflow-y: auto; /* Permet le scroll interne si le menu est long */
  }

  .nav.is-open .nav__links {
    clip-path: inset(0 0 0 0);
  }

  .nav__links li {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .4s var(--ease), transform .4s var(--ease);
  }

  .nav.is-open .nav__links li {
    opacity: 1;
    transform: none;
  }

  .nav.is-open .nav__links li:nth-child(1) { transition-delay: .10s; }
  .nav.is-open .nav__links li:nth-child(2) { transition-delay: .15s; }
  .nav.is-open .nav__links li:nth-child(3) { transition-delay: .20s; }
  .nav.is-open .nav__links li:nth-child(4) { transition-delay: .25s; }
  .nav.is-open .nav__links li:nth-child(5) { transition-delay: .30s; }

  .nav__links a {
    font-family: var(--titre);
    font-size: 2.1rem;
    letter-spacing: .02em;
    text-transform: none;
  }

  /* Force la réinitialisation de la couleur du bouton fermer en mode ouvert */
  .nav.is-open .burger {
    color: var(--creme) !important;
    border-color: var(--creme) !important;
  }
}

/* ========================= HERO PLEIN ÉCRAN ============================== */
.hero{
  position:relative;min-height:100svh;
  display:flex;flex-direction:column;justify-content:flex-end;
  padding-bottom:calc(var(--u) * 2.5);
  overflow:hidden;isolation:isolate;
  color:var(--creme);
}
.hero__fond{position:absolute;inset:-8% 0 -8% 0;z-index:-2;will-change:transform;}
.hero__fond img{width:100%;height:100%;object-fit:cover;object-position:center 42%;transform:scale(1.06);}
.hero__voile{
  position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(to top, rgba(30,20,17,.93) 0%, rgba(30,20,17,.84) 34%, rgba(30,20,17,.62) 62%, rgba(30,20,17,.42) 84%, rgba(30,20,17,.70) 100%),
    linear-gradient(to right, rgba(30,20,17,.62) 0%, rgba(30,20,17,.26) 52%, rgba(30,20,17,0) 86%);
}
@media(max-width:900px){
  .hero__voile{
    background:linear-gradient(to top, rgba(30,20,17,.95) 0%, rgba(30,20,17,.90) 46%, rgba(30,20,17,.74) 74%, rgba(30,20,17,.62) 100%);
  }
}
.hero__inner{width:100%;}
.hero__logo{width:min(210px,44vw);margin-bottom:calc(var(--u) * .55);opacity:.97;}
.hero .h1{max-width:18ch;}
.hero .h1 em{font-style:italic;color:var(--rose);}
.hero__sub{
  margin-top:calc(var(--u) * .7);max-width:42ch;
  font-size:var(--t-lead);font-weight:300;color:rgba(248,244,235,.94);
}
.hero__actions{display:flex;flex-wrap:wrap;gap:calc(var(--u) * .5);margin-top:calc(var(--u) * 1);}
.hero__actions .btn{--bg:var(--creme);--fg:var(--espresso);}
.hero__actions .btn::before{background:var(--espresso);}
.hero__actions .btn:hover{color:var(--creme);}
.hero__bas{
  display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--u);
  margin-top:calc(var(--u) * 1.8);
  padding-top:calc(var(--u) * .7);
  border-top:1px solid var(--ligne-clair);
}
.hero__meta{display:flex;gap:calc(var(--u) * 1.3);flex-wrap:wrap;}
.hero__meta span{
  font-size:var(--t-micro);letter-spacing:.2em;text-transform:uppercase;
  color:rgba(248,244,235,.85);
}
.hero__defiler{
  display:flex;align-items:center;gap:.7rem;
  font-size:var(--t-micro);letter-spacing:.2em;text-transform:uppercase;
  color:rgba(248,244,235,.85);text-decoration:none;
}
.hero__defiler i{
  display:block;width:1px;height:34px;background:rgba(248,244,235,.4);
  position:relative;overflow:hidden;
}
.hero__defiler i::after{
  content:"";position:absolute;inset:0;background:var(--creme);
  animation:filet 2.4s var(--ease) infinite;
}
@keyframes filet{
  0%{transform:translateY(-100%);}
  55%{transform:translateY(0);}
  100%{transform:translateY(100%);}
}
@media(max-width:900px){
  .hero{padding-bottom:calc(var(--u) * 1.6);}
  .hero__bas{margin-top:calc(var(--u) * 1.6);}
  .hero__defiler{display:none;}
}

/* ========================= BANDEAU ======================================= */
.bandeau{background:var(--espresso);color:var(--rose);padding-block:calc(var(--u) * 1.05);overflow:hidden;}
.bandeau__piste{
  display:flex;gap:calc(var(--u) * 1.4);align-items:center;
  white-space:nowrap;width:max-content;will-change:transform;
}
.bandeau__piste span{font-family:var(--titre);font-style:italic;font-size:1.5rem;letter-spacing:.03em;}
.bandeau__piste svg{width:16px;height:16px;opacity:.7;flex:none;}

/* ========================= SECTIONS ====================================== */
section{padding-block:calc(var(--u) * 4.5);position:relative;}
.section-head{margin-bottom:calc(var(--u) * 2);}
.section-head .h2{margin-top:calc(var(--u) * .55);max-width:24ch;}

/* --- À propos --- */
.apropos__media{grid-column:1 / span 5;position:sticky;top:calc(var(--u) * 3.6);align-self:start;}
.apropos__media img{width:100%;aspect-ratio:3/4;object-fit:cover;}
.apropos__media figcaption{margin-top:calc(var(--u) * .5);}
.apropos__text{grid-column:7 / span 6;}
.apropos__text p{margin-top:calc(var(--u) * .75);max-width:52ch;font-weight:300;}
.apropos__signature{
  margin-top:calc(var(--u) * 1.2);
  font-family:var(--titre);font-style:italic;font-size:1.55rem;
  line-height:1.35;color:var(--espresso);
}
.apropos__chiffres{
  display:flex;flex-wrap:wrap;gap:calc(var(--u) * 1.6);
  margin-top:calc(var(--u) * 1.6);padding-top:calc(var(--u) * .9);
  border-top:1px solid var(--ligne);
}
.apropos__chiffres div strong{
  display:block;font-family:var(--titre);font-weight:400;
  font-size:2.9rem;line-height:1;color:var(--espresso);font-variant-numeric:tabular-nums;
}
.apropos__chiffres div span{
  font-size:var(--t-micro);letter-spacing:.16em;text-transform:uppercase;color:rgba(58,41,35,.75);
}
@media(max-width:900px){
  .apropos__media{grid-column:1 / -1;position:static;}
  .apropos__text{grid-column:1 / -1;}
}

/* --- Vitrine des créations, bande photo pleine largeur --- */
.vitrine{padding-block:0;}
.vitrine__intro{padding-block:calc(var(--u) * 4.5) calc(var(--u) * 1.5);}
.vitrine__intro .h2{margin-top:calc(var(--u) * .55);max-width:20ch;}
.vitrine__media{
  position:relative;width:100vw;margin-left:calc(50% - 50vw);
  height:clamp(300px,50vw,720px);overflow:hidden;background:var(--rose);
}
/* image décalée vers le haut : la parallaxe joue dans le débord, jamais sur le fond */
.vitrine__media img{
  position:absolute;inset:-9% 0;width:100%;height:118%;
  object-fit:cover;object-position:center 46%;will-change:transform;
}
.vitrine__pied{
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--u);
  padding-block:calc(var(--u) * .8) calc(var(--u) * 4.5);
}
.vitrine__pied p{max-width:44ch;font-weight:300;}

/* --- Ateliers (fond rose pastel) --- */
.ateliers{background:var(--rose);}
.cartes{row-gap:calc(var(--u) * 2.5);}
.carte{
  grid-column:span 6;display:flex;flex-direction:column;background:var(--creme);
  transition:transform .7s var(--ease-out),box-shadow .7s var(--ease-out);
}
.carte:hover{transform:translateY(-8px);box-shadow:0 30px 60px -30px rgba(58,41,35,.3);}
@media(max-width:900px){ .carte{grid-column:1 / -1;} }
.carrousel{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--creme-clair);}
.carrousel .vue{position:absolute;inset:0;opacity:0;transition:opacity .8s var(--ease);}
.carrousel .vue.est-active{opacity:1;}
.carrousel img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease-out);}
.carte:hover .carrousel .vue.est-active img{transform:scale(1.05);}
.carrousel__points{position:absolute;left:calc(var(--u) * .5);bottom:calc(var(--u) * .5);display:flex;gap:6px;z-index:2;}
.carrousel__points button{
  width:24px;height:2px;border:none;padding:0;cursor:pointer;
  background:rgba(248,244,235,.55);transition:background .3s;
}
.carrousel__points button.est-active{background:var(--creme);}
.carte__corps{padding:calc(var(--u) * 1) calc(var(--u) * 1) calc(var(--u) * 1.2);display:flex;flex-direction:column;flex:1;}
.carte__meta{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:.45rem;}
.carte__meta .h3{min-width:0;}
.carte__meta .legende{flex:none;white-space:nowrap;}
.carte__desc{margin-top:calc(var(--u) * .5);font-weight:300;flex:1;max-width:48ch;}
.carte__details{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:calc(var(--u) * .5);margin-top:calc(var(--u) * .8);
  padding-top:calc(var(--u) * .55);border-top:1px solid var(--ligne);
}
.carte__details .legende{display:block;margin-bottom:.25rem;}
.carte__details strong{display:block;font-weight:500;font-size:.9rem;line-height:1.3;}
@media(max-width:420px){ .carte__details{grid-template-columns:1fr 1fr;} }
.carte .btn{margin-top:calc(var(--u) * .9);align-self:flex-start;}

/* --- Agenda --- */
.agenda__liste{grid-column:1 / -1;border-top:1px solid var(--ligne-forte);}
.agenda__ligne{
  position:relative;isolation:isolate;
  display:grid;grid-template-columns:1.15fr 2.2fr 1.1fr .9fr auto;
  gap:var(--gap);align-items:center;
  padding-block:calc(var(--u) * .9);padding-inline:calc(var(--u) * .5);
  border-bottom:1px solid var(--ligne);
  transition:color .5s var(--ease);
}
.agenda__ligne::before{
  content:"";position:absolute;inset:0;z-index:-1;background:var(--espresso);
  transform:scaleY(0);transform-origin:bottom;
  transition:transform .55s var(--ease-out);
}
.agenda__ligne:hover::before{transform:scaleY(1);}
.agenda__ligne:hover{color:var(--creme);}
.agenda__ligne:hover .agenda__date{color:var(--creme);}
.agenda__ligne:hover .agenda__lieu,
.agenda__ligne:hover .agenda__prix{color:rgba(248,244,235,.8);}
.agenda__ligne:hover .agenda__statut{border-color:var(--ligne-clair);}
.agenda__ligne:hover .agenda__statut.est-ouvert{background:var(--rose);color:var(--espresso);border-color:var(--rose);}
.agenda__date{font-family:var(--titre);font-size:1.42rem;color:var(--espresso);transition:color .5s var(--ease);}
.agenda__titre{font-weight:500;font-size:.98rem;}
.agenda__lieu,.agenda__prix{font-size:.88rem;color:rgba(58,41,35,.75);transition:color .5s var(--ease);}
.agenda__statut{
  font-size:var(--t-micro);letter-spacing:.16em;text-transform:uppercase;font-weight:500;
  padding:.4rem .85rem;border:1px solid var(--ligne-forte);white-space:nowrap;
  text-decoration:none;transition:all .4s var(--ease);
}
.agenda__statut.est-complet{color:rgba(58,41,35,.5);}
.agenda__statut.est-ouvert{background:var(--espresso);color:var(--creme);border-color:var(--espresso);}
@media(max-width:860px){
  .agenda__ligne{grid-template-columns:1fr auto;row-gap:.4rem;}
  .agenda__titre,.agenda__lieu,.agenda__prix{grid-column:1;}
  .agenda__date{grid-column:1;grid-row:1;}
  .agenda__statut{grid-column:2;grid-row:1 / span 2;align-self:center;}
}

/* --- Galerie (fond espresso) --- */
.galerie{background:var(--espresso);color:var(--creme);overflow:hidden;}
.galerie .h2{color:var(--creme);}
.galerie .kicker{color:var(--rose);}
.galerie__grille{row-gap:var(--gap);}
.galerie__item{overflow:hidden;position:relative;cursor:zoom-in;background:rgba(248,244,235,.08);}
.galerie__item img{
  position:absolute;inset:-6% 0;width:100%;height:112%;object-fit:cover;
  transition:transform 1.1s var(--ease-out),filter .6s var(--ease);
  will-change:transform;
}
.galerie__item:hover img{filter:brightness(1.06);}
.galerie__item::after{
  content:"Agrandir";position:absolute;left:calc(var(--u) * .5);bottom:calc(var(--u) * .5);
  font-size:var(--t-micro);letter-spacing:.2em;text-transform:uppercase;
  color:var(--creme);background:rgba(30,20,17,.72);padding:.4rem .7rem;
  opacity:0;transform:translateY(8px);transition:opacity .4s var(--ease),transform .4s var(--ease);
}
.galerie__item:hover::after{opacity:1;transform:none;}
.g-a,.g-b{height:clamp(320px,42vw,600px);}
.g-c,.g-d,.g-e{height:clamp(180px,25vw,360px);}
.g-a{grid-column:span 5;}
.g-b{grid-column:span 7;}
.g-c,.g-d,.g-e{grid-column:span 4;}
.g-f{grid-column:span 12;height:clamp(260px,34vw,480px);}
@media(max-width:900px){
  .g-a,.g-b{grid-column:span 6;height:clamp(300px,72vw,460px);}
  .g-c,.g-d,.g-e{grid-column:span 2;height:clamp(105px,24vw,180px);}
  .g-f{grid-column:span 6;height:clamp(200px,48vw,320px);}
}

/* crédit photo sous la galerie */
.galerie__credit{
  margin-top:calc(var(--u) * 1.2);text-align:right;
  font-size:var(--t-micro);letter-spacing:.16em;text-transform:uppercase;
  color:rgba(248,244,235,.65);
}
.galerie__credit a{
  color:var(--rose);text-decoration:none;
  border-bottom:1px solid rgba(247,231,227,.35);padding-bottom:2px;
  transition:border-color .3s var(--ease);
}
.galerie__credit a:hover{border-color:var(--rose);}
@media(max-width:900px){ .galerie__credit{text-align:left;} }

/* --- Signature KSA Digital, avant le footer --- */
.signature{background:var(--creme-clair);padding-block:calc(var(--u) * 2.2);}
.signature__inner{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:.85rem;text-align:center;
}
.signature__texte{font-size:.9rem;font-weight:300;color:rgba(58,41,35,.8);}
.signature__btn{
  font-family:var(--texte);font-size:.9rem;font-weight:500;
  background:none;border:none;padding:0 0 3px;cursor:pointer;
  color:var(--espresso);border-bottom:1px solid var(--ligne-forte);
  transition:border-color .3s var(--ease);
}
.signature__btn:hover{border-color:var(--espresso);}

/* --- Modale KSA Digital (charte KSA : navy, bleu ciel, angles droits) --- */
.ksa{
  position:fixed;inset:0;z-index:210;
  display:grid;place-items:center;padding:var(--pad);
  background:rgba(6,9,14,.82);backdrop-filter:blur(4px);
  opacity:0;visibility:hidden;transition:opacity .4s var(--ease),visibility .4s;
}
.ksa.est-ouvert{opacity:1;visibility:visible;}
.ksa__boite{
  position:relative;width:min(680px,100%);max-height:88vh;overflow-y:auto;
  background:#06090e;color:#fff;
  padding:calc(var(--u) * 1.6) calc(var(--u) * 1.6) calc(var(--u) * 1.4);
  transform:translateY(18px);transition:transform .55s var(--ease-out);
  font-family:'Manrope',var(--texte);
}
.ksa.est-ouvert .ksa__boite{transform:none;}
.ksa__fermer{
  position:absolute;top:14px;right:14px;width:40px;height:40px;
  background:transparent;border:1px solid rgba(255,255,255,.25);
  color:#fff;font-size:1.3rem;line-height:1;cursor:pointer;
}
.ksa__fermer:hover{border-color:#68aff0;color:#68aff0;}
.ksa__eyebrow{
  font-size:.62rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:#68aff0;margin-bottom:.9rem;
}
.ksa__titre{
  font-family:'DM Serif Display',Georgia,serif;font-weight:400;
  font-size:clamp(1.8rem,1.3rem + 1.6vw,2.6rem);line-height:1.12;margin-bottom:.9rem;
}
.ksa__titre em{font-style:italic;color:#68aff0;}
.ksa__intro{font-size:.95rem;font-weight:300;line-height:1.7;color:rgba(255,255,255,.78);max-width:46ch;}
.ksa__services{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;background:rgba(255,255,255,.14);
  margin-top:calc(var(--u) * 1.1);border:1px solid rgba(255,255,255,.14);
}
@media(max-width:560px){ .ksa__services{grid-template-columns:1fr;} }
.ksa__service{
  background:#06090e;padding:1.1rem 1.15rem;text-decoration:none;color:#fff;
  display:block;transition:background .3s var(--ease);
}
.ksa__service:hover{background:#0d141e;}
.ksa__service span{
  display:block;font-size:.62rem;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;margin-bottom:.4rem;
}
.ksa__service strong{display:block;font-size:1rem;font-weight:600;margin-bottom:.25rem;}
.ksa__service p{font-size:.8rem;font-weight:300;color:rgba(255,255,255,.6);line-height:1.5;}
.ksa__service:nth-child(1) span{color:#68aff0;}
.ksa__service:nth-child(2) span{color:#68aff0;}
.ksa__service:nth-child(3) span{color:#dc0000;}
.ksa__service:nth-child(4) span{color:#ff5757;}
.ksa__pied{
  margin-top:calc(var(--u) * 1.1);padding-top:calc(var(--u) * .8);
  border-top:1px solid rgba(255,255,255,.14);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;
}
.ksa__wordmark{font-size:1.05rem;font-weight:800;letter-spacing:-.01em;}
.ksa__wordmark i{color:#68aff0;font-style:normal;}
.ksa__cta{
  display:inline-block;padding:.85rem 1.7rem;background:#68aff0;color:#06090e;
  font-size:.76rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  text-decoration:none;border:1px solid #68aff0;
  transition:background .3s var(--ease),color .3s var(--ease);
}
.ksa__cta:hover{background:transparent;color:#68aff0;}

/* --- Témoignages (crème très clair) --- */
.temoignages{background:var(--creme-clair);}
.temoignages__item{grid-column:span 4;display:flex;flex-direction:column;}
@media(max-width:900px){ .temoignages__item{grid-column:1 / -1;} }
.temoignages__item .mark{width:22px;height:22px;color:var(--espresso);opacity:.55;margin-bottom:calc(var(--u) * .6);}
.temoignages__item blockquote{
  font-family:var(--titre);font-size:1.45rem;line-height:1.42;color:var(--espresso);flex:1;
}
.temoignages__item figcaption{
  margin-top:calc(var(--u) * .7);padding-top:calc(var(--u) * .5);
  border-top:1px solid var(--ligne);
  font-size:var(--t-micro);letter-spacing:.16em;text-transform:uppercase;color:rgba(58,41,35,.75);
}


/* citation unique, mise en avant */
.temoignage-phare{grid-column:3 / span 8;display:flex;flex-direction:column;align-items:center;text-align:center;}
.temoignage-phare .mark{width:26px;height:26px;color:var(--espresso);opacity:.5;margin-bottom:calc(var(--u) * .8);}
.temoignage-phare blockquote{
  font-family:var(--titre);font-size:clamp(1.5rem,1.1rem + 1.2vw,2.15rem);
  line-height:1.36;color:var(--espresso);max-width:30ch;
}
.temoignage-phare figcaption{
  margin-top:calc(var(--u) * 1);padding-top:calc(var(--u) * .55);
  border-top:1px solid var(--ligne);
  font-size:var(--t-micro);letter-spacing:.18em;text-transform:uppercase;color:rgba(58,41,35,.75);
}
@media(max-width:900px){ .temoignage-phare{grid-column:1 / -1;} }

/* --- Contact (fond espresso) --- */
.contact{background:var(--espresso);color:var(--creme);}
.contact .h2{color:var(--creme);}
.contact .kicker{color:var(--rose);}
.contact__intro{grid-column:1 / span 5;}
.contact__intro p{margin-top:calc(var(--u) * .7);font-weight:300;max-width:38ch;color:rgba(248,244,235,.9);}
.contact__infos{margin-top:calc(var(--u) * 1.3);display:grid;gap:calc(var(--u) * .65);}
.contact__infos a{text-decoration:none;display:flex;gap:.85rem;align-items:baseline;}
.contact__infos .legende{color:rgba(248,244,235,.65);flex:none;min-width:5.6rem;}
.contact__infos a strong{
  font-weight:500;font-size:1rem;color:var(--rose);
  border-bottom:1px solid transparent;transition:border-color .3s;
}
.contact__infos a:hover strong{border-color:var(--rose);}
.contact__wa{
  display:inline-flex;align-items:center;gap:.45rem;
  font-size:var(--t-micro);letter-spacing:.14em;text-transform:uppercase;
  color:rgba(248,244,235,.6);
}
.contact__wa svg{width:13px;height:13px;flex:none;}
.contact__form{grid-column:7 / span 6;}
@media(max-width:900px){ .contact__intro,.contact__form{grid-column:1 / -1;} }
.champ{margin-bottom:calc(var(--u) * .85);}
.champ label{
  display:block;font-size:var(--t-micro);letter-spacing:.18em;text-transform:uppercase;
  font-weight:500;color:rgba(248,244,235,.75);margin-bottom:.4rem;
}
.champ input,.champ textarea,.champ select{
  width:100%;background:transparent;border:none;border-bottom:1px solid var(--ligne-clair);
  padding:.65rem 0;color:var(--creme);
  font-family:var(--texte);font-size:1rem;font-weight:300;
  transition:border-color .3s var(--ease);
}
.champ input::placeholder,.champ textarea::placeholder{color:rgba(248,244,235,.5);}
.champ input:focus,.champ textarea:focus,.champ select:focus{outline:none;border-color:var(--rose);}
.champ select option{color:var(--espresso);}

/* select premium : la balise native reste pour l'accessibilite et l'envoi */
.select-nurya{position:relative;}
.select-nurya select{
  position:absolute;inset:0;width:100%;height:100%;
  opacity:0;pointer-events:none;
}
.select-nurya__declencheur{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  background:transparent;border:none;border-bottom:1px solid var(--ligne-clair);
  padding:.65rem 0;color:var(--creme);cursor:pointer;text-align:left;
  font-family:var(--texte);font-size:1rem;font-weight:300;
  transition:border-color .3s var(--ease);
}
.select-nurya.est-ouvert .select-nurya__declencheur,
.select-nurya__declencheur:focus-visible{border-color:var(--rose);}
.select-nurya__fleche{
  flex:none;width:9px;height:9px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;
  transform:rotate(45deg) translate(-2px,-2px);
  transition:transform .35s var(--ease);opacity:.7;
}
.select-nurya.est-ouvert .select-nurya__fleche{transform:rotate(-135deg) translate(-3px,-3px);}
.select-nurya__liste{
  position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:20;
  background:#241812;border:1px solid rgba(248,244,235,.16);
  box-shadow:0 24px 50px -20px rgba(0,0,0,.6);
  padding:.35rem;margin:0;list-style:none;
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .3s var(--ease),transform .3s var(--ease),visibility .3s;
}
.select-nurya.est-ouvert .select-nurya__liste{opacity:1;visibility:visible;transform:none;}
.select-nurya__liste li{
  padding:.72rem .85rem;font-size:.94rem;font-weight:300;color:rgba(248,244,235,.85);
  cursor:pointer;display:flex;align-items:center;gap:.7rem;
  transition:background .2s var(--ease),color .2s var(--ease);
}
.select-nurya__liste li::before{
  content:"";flex:none;width:5px;height:5px;border:1px solid rgba(248,244,235,.4);
  border-radius:50%;transition:background .2s,border-color .2s;
}
.select-nurya__liste li:hover{background:rgba(248,244,235,.07);color:var(--creme);}
.select-nurya__liste li[aria-selected="true"]{color:var(--rose);}
.select-nurya__liste li[aria-selected="true"]::before{background:var(--rose);border-color:var(--rose);}

.champ textarea{resize:vertical;min-height:calc(var(--u) * 3.5);}
.champ--duo{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);}
@media(max-width:560px){ .champ--duo{grid-template-columns:1fr;gap:0;} }
.form__note{font-size:var(--t-micro);color:rgba(248,244,235,.72);margin-top:calc(var(--u) * .5);}

/* --- Footer --- */
.footer{background:var(--espresso);color:var(--creme);padding-block:calc(var(--u) * 2.5);}
.footer__haut{display:flex;flex-wrap:wrap;justify-content:space-between;gap:calc(var(--u) * 1.5);align-items:flex-start;}
.footer__mark{width:64px;}
.footer__nav{display:flex;flex-wrap:wrap;gap:calc(var(--u) * .9);list-style:none;}
.footer__nav a{
  font-size:var(--t-petit);letter-spacing:.16em;text-transform:uppercase;
  text-decoration:none;opacity:.85;transition:opacity .3s;
}
.footer__nav a:hover{opacity:1;}
.footer__bas{
  margin-top:calc(var(--u) * 2);padding-top:calc(var(--u) * .8);
  border-top:1px solid var(--ligne-clair);
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;
  font-size:var(--t-micro);letter-spacing:.14em;text-transform:uppercase;
  color:rgba(248,244,235,.72);
}
.footer__insta{
  font-family:var(--titre);font-style:italic;font-size:1.55rem;
  text-decoration:none;letter-spacing:.04em;color:var(--rose);
  border-bottom:1px solid rgba(247,231,227,.4);padding-bottom:3px;
  transition:border-color .3s;
}
.footer__insta:hover{border-color:var(--rose);}

/* --- Lightbox --- */
.lightbox{
  position:fixed;inset:0;z-index:200;background:rgba(30,20,17,.96);
  display:grid;place-items:center;padding:var(--pad);
  opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility .45s;
}
.lightbox.est-ouvert{opacity:1;visibility:visible;}
.lightbox img{
  max-width:min(1000px,92vw);max-height:86vh;object-fit:contain;
  transform:scale(.94);transition:transform .6s var(--ease-out);
}
.lightbox.est-ouvert img{transform:scale(1);}
.lightbox__fermer{
  position:absolute;top:var(--pad);right:var(--pad);
  width:48px;height:48px;border:1px solid var(--ligne-clair);background:transparent;
  color:var(--creme);font-size:1.5rem;cursor:pointer;line-height:1;
}

/* ========================= ANIMATIONS AU SCROLL ========================== */
.reveal{opacity:0;transform:translateY(26px);}
.reveal.est-visible{opacity:1;transform:none;transition:opacity 1s var(--ease-out),transform 1s var(--ease-out);}
.reveal[data-delai="1"].est-visible{transition-delay:.1s;}
.reveal[data-delai="2"].est-visible{transition-delay:.2s;}
.reveal[data-delai="3"].est-visible{transition-delay:.3s;}
.reveal[data-delai="4"].est-visible{transition-delay:.4s;}

/* révélation des titres, mot à mot */
.mot{display:inline-block;overflow:hidden;vertical-align:bottom;}
.mot > span{display:inline-block;transform:translateY(105%);transition:transform .95s var(--ease-out);}
.est-visible .mot > span{transform:none;}

/* volet d'image : le clip-path porte sur l'image, jamais sur l'élément observé,
   sinon la surface visible est nulle et l'IntersectionObserver ne déclenche pas */
.volet{overflow:hidden;}
.volet img{clip-path:inset(0 0 100% 0);transition:clip-path 1.15s var(--ease-out),transform 1.5s var(--ease-out);}
.volet.est-visible img{clip-path:inset(0 0 0 0);}
/* dézoom : uniquement sur les images sans parallaxe, sinon le JS écrase le transform */
.volet--zoom img{transform:scale(1.14);}
.volet--zoom.est-visible img{transform:scale(1);}

.skip{position:absolute;left:-9999px;top:0;z-index:300;background:var(--espresso);color:var(--creme);padding:.8rem 1.2rem;}
.skip:focus{left:0;}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;}
  html{scroll-behavior:auto;}
  .reveal{opacity:1;transform:none;}
  .volet img{clip-path:none;transform:none;}
  .mot > span{transform:none;}
  .apropos__media{position:static;}
}
