/* MAC DRC SARL — Prestige nocturne */
:root{
  --navy:#0B1530; --navy2:#13214A; --navy3:#1C2D5A; --deep:#070E22;
  --gold:#C9A23A; --gold-l:#E9C25A; --gold-d:#9A6F12;
  --green:#3F8F4E; --green-l:#9CD3A8;
  /* thème courant (sections sombres) */
  --bg:var(--navy); --panel:#101C3D; --line:rgba(201,162,58,.32); --rule:#22355F;
  --text:#FFFFFF; --body:#C9D3E6; --muted:#A9B6CF; --accent:var(--gold); --accent-text:var(--gold-l);
  --display:"Archivo","Arial Narrow",Arial,sans-serif;
  --sans:"Source Sans 3","Segoe UI",Roboto,Arial,sans-serif;
  --pad:clamp(20px,5vw,72px);
}
.env{--accent:var(--green);--accent-text:var(--green-l)}
.alt{
  --bg:#F3F5F9; --panel:#FFFFFF; --line:#D5DBE6; --rule:#D5DBE6;
  --text:#0B1530; --body:#3C4A66; --muted:#55607A; --accent-text:var(--gold-d);
  background:var(--bg); color:var(--body);
}
.env .alt{--accent-text:#2D6B39}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--navy);color:var(--body);font:400 1.0625rem/1.65 var(--sans);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--accent-text)}a:hover{color:var(--text)}
:focus-visible{outline:3px solid var(--gold-l);outline-offset:3px}
h1,h2,h3{font-family:var(--display);color:var(--text);margin:0;line-height:1.02;letter-spacing:-.01em}
h1{font-weight:900;font-stretch:115%}
h2{font-size:clamp(2.1rem,4vw,3.5rem);font-weight:800;font-stretch:112%;max-width:20ch}
h3{font-size:1.4rem;font-weight:700;font-stretch:106%;line-height:1.15}
p{margin:0 0 1rem}
.wrap{width:100%;max-width:1320px;margin-inline:auto;padding-inline:var(--pad)}
.skip{position:absolute;left:-999px;top:0;background:var(--gold);color:var(--navy);padding:.6rem 1rem;z-index:99}
.skip:focus{left:1rem}

/* boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:var(--sans);font-weight:700;font-size:1.02rem;text-decoration:none;padding:1rem 1.7rem;border:1.5px solid transparent;border-radius:3px;cursor:pointer;line-height:1.1}
.btn-gold{background:var(--gold);color:var(--navy)}
.btn-gold:hover{background:var(--gold-l);color:var(--navy)}
.env .btn-gold{background:var(--green);color:#fff}.env .btn-gold:hover{background:#4CA35C;color:#fff}
.btn-line{border-color:rgba(255,255,255,.7);color:#fff;background:transparent}
.btn-line:hover{background:#fff;color:var(--navy)}
.btn-wa{background:#1F8F55;color:#fff}.btn-wa:hover{background:#25a865;color:#fff}

.kicker{font-family:var(--sans);font-weight:700;font-size:.85rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-text);margin:0 0 1.3rem}
.lead{font-size:1.2rem;line-height:1.6;color:var(--body);max-width:50ch}

/* en-tête */
.top{position:sticky;top:0;z-index:50;background:rgba(11,21,48,.95);backdrop-filter:blur(10px);border-bottom:1px solid rgba(201,162,58,.18)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;height:80px}
.brand{display:flex;align-items:center;gap:.8rem;text-decoration:none;color:#fff}
.brand:hover{color:#fff}
.brand img{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid var(--gold)}
.brand b{display:block;font-family:var(--display);font-weight:800;font-stretch:118%;font-size:1.3rem;letter-spacing:.02em;line-height:1}
.brand small{display:block;font-size:.72rem;letter-spacing:.16em;color:var(--muted);margin-top:4px}
.nav ul{display:flex;gap:1.7rem;list-style:none;margin:0;padding:0}
.nav a{font-weight:600;font-size:.98rem;color:#D3DCEC;text-decoration:none;padding:.4rem 0;border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current="page"]{color:#fff;border-bottom-color:var(--gold)}
.menu-btn{display:none;background:none;border:0;color:#fff;padding:.5rem;cursor:pointer}
.top .btn{padding:.8rem 1.2rem;font-size:.95rem}
@media (max-width:1150px){
  .nav{position:absolute;left:0;right:0;top:80px;background:var(--navy);border-bottom:1px solid var(--rule);display:none}
  .nav.open{display:block}
  .nav ul{flex-direction:column;gap:0;padding:.4rem var(--pad) 1.2rem}
  .nav a{display:block;padding:1rem 0;font-size:1.15rem;border-bottom:1px solid var(--rule)}
  .menu-btn{display:block}
  .top .btn{display:none}
}

/* héros d'accueil : photo pleine largeur */
.hero{position:relative;min-height:calc(100vh - 80px);min-height:calc(100svh - 80px);display:flex;align-items:center;overflow:hidden;background:var(--navy)}
.hero-img{position:absolute;inset:0;overflow:hidden}
.hero-img img{width:100%;height:100%;object-fit:cover;object-position:62% center}
.hero-img::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,21,48,.97) 0%,rgba(11,21,48,.86) 32%,rgba(11,21,48,.28) 64%,rgba(11,21,48,0) 82%),linear-gradient(0deg,var(--navy) 0%,rgba(11,21,48,0) 26%)}
.hero-text{position:relative;z-index:1;width:100%;max-width:1320px;margin-inline:auto;padding:clamp(4rem,9vw,7rem) var(--pad)}
.hero-text>*{max-width:640px}
.hero h1{font-size:clamp(2.8rem,6vw,5.3rem);line-height:.98}
.sub{display:block;font-weight:300;font-stretch:100%;color:var(--gold-l);margin-top:.18em}
.hero h1 .sub{font-size:.62em;line-height:1.08}
.hero h1::after{content:"";display:block;width:72px;height:3px;background:var(--gold);margin-top:2rem}
.hero .lead{margin:1.8rem 0 2.2rem;color:#C9D3E6}
.actions{display:flex;flex-wrap:wrap;gap:.8rem}
@media (max-width:760px){
  .hero{min-height:auto;flex-direction:column;align-items:stretch}
  .hero-img{position:relative;inset:auto;width:100%;height:clamp(340px,62vw + 160px,460px);order:-1}
  .hero-img img{object-position:58% 30%}
  .hero-img::after{background:linear-gradient(180deg,rgba(11,21,48,.35) 0%,rgba(11,21,48,0) 22%,rgba(11,21,48,0) 42%,rgba(11,21,48,.75) 72%,var(--navy) 100%)}
  .hero-text{padding-top:0;padding-bottom:3rem;margin-top:-6.5rem}
  .hero h1{font-size:clamp(2.3rem,10vw,3rem)}
  .actions .btn{flex:1 1 auto}
}

/* en-tête des pages intérieures */
.page-hero{position:relative;min-height:440px;display:flex;align-items:flex-end;overflow:hidden;border-bottom:3px solid var(--accent)}
.page-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.page-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,21,48,.96) 0%,rgba(11,21,48,.78) 45%,rgba(11,21,48,.25) 100%)}
.page-hero .wrap{position:relative;z-index:1;padding-top:5rem;padding-bottom:3.6rem}
.page-hero h1{font-size:clamp(2.5rem,5.4vw,4.6rem);max-width:16ch}
.page-hero .lead{margin-top:1.3rem;color:#D3DCEC}

/* sections */
section{padding:clamp(4.5rem,9vw,7rem) 0;background:var(--bg)}
.sec-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1.5rem;margin-bottom:3.2rem}
.sec-head .lead{max-width:46ch;color:var(--muted)}

/* piliers : grille à filets dorés */
.pillars{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.pillar{background:var(--bg);border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:2.6rem 2.2rem;display:flex;flex-direction:column;gap:1rem;text-decoration:none;color:var(--body);transition:background .2s}
.pillar:hover{background:var(--panel);color:var(--body)}
.pillar .code{font-family:var(--display);font-weight:300;font-size:1.05rem;letter-spacing:.06em;color:var(--gold)}
.pillar p{color:var(--muted);margin:0}
.pillar .more{margin-top:auto;font-weight:700;color:var(--gold-l)}
.pillar.green .code,.pillar.green .more{color:var(--green-l)}

/* cartes */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.card{background:var(--bg);display:flex;flex-direction:column;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.card img{width:100%;aspect-ratio:16/10;object-fit:cover}
.card .in{padding:2.2rem 2rem;display:flex;flex-direction:column;gap:.8rem}
.card .code{font-family:var(--display);font-weight:300;font-size:2.6rem;line-height:1;color:var(--accent)}
.card p{color:var(--muted);margin:0}
.card.green .code{color:var(--green)}
.card ul{margin:.3rem 0 0;padding-left:1.1rem;color:var(--muted)}

/* tuiles */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}
.tile{background:var(--panel);padding:2rem;border-top:3px solid var(--gold)}
.tile.green{border-top-color:var(--green)}
.tile p{color:var(--muted);margin:.8rem 0 0}

/* démarche */
.steps{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.steps li{display:grid;grid-template-columns:96px 1fr;gap:1.5rem;padding:1.8rem 0;border-bottom:1px solid var(--line);align-items:baseline}
.steps .n{font-family:var(--display);font-weight:300;font-size:3rem;color:var(--gold);line-height:.8}
.steps p{color:var(--muted);margin:.5rem 0 0}
@media (max-width:560px){.steps li{grid-template-columns:60px 1fr}.steps .n{font-size:2.3rem}}

/* bande des sièges */
.route{background:var(--gold);color:var(--navy);padding:clamp(3.2rem,6vw,4.8rem) 0}
.route .row{display:flex;flex-wrap:wrap;align-items:center;gap:1.4rem 2.5rem}
.route .city{font-family:var(--display);font-weight:900;font-stretch:115%;font-size:clamp(2.4rem,5vw,4.4rem);line-height:.95}
.route p{margin:.5rem 0 0;font-weight:600;color:#2A2410}
.route .dash{flex:1 1 100px;min-width:80px;border-top:2px dashed rgba(11,21,48,.6)}

/* listes et fiche */
.split{display:grid;grid-template-columns:1fr 1.5fr;gap:clamp(2rem,5vw,4.5rem);align-items:start}
@media (max-width:860px){.split{grid-template-columns:1fr}}
.sheet{border-top:2px solid var(--gold);margin:0}
.sheet div{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem;padding:1.1rem 0;border-bottom:1px solid var(--rule)}
.sheet dt{color:var(--muted);text-transform:uppercase;letter-spacing:.12em;font-size:.82rem;align-self:center}
.sheet dd{margin:0;font-family:var(--display);font-weight:700;font-size:1.25rem;color:var(--text)}
.ticks{list-style:none;margin:0;padding:0}
.ticks li{display:flex;gap:.9rem;padding:.95rem 0;border-bottom:1px solid var(--rule);color:var(--text)}
.ticks li::before{content:"";flex:0 0 9px;height:9px;background:var(--gold);margin-top:.6rem}

/* citation */
.quote{border-left:4px solid var(--accent);padding:.4rem 0 .4rem 1.8rem;font-family:var(--display);font-weight:600;font-size:clamp(1.6rem,2.8vw,2.3rem);line-height:1.2;color:var(--text);max-width:30ch}

/* raisons */
.reasons{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2.4rem 3rem}
.reason{display:flex;gap:1.2rem}
.reason .n{font-family:var(--display);font-weight:300;font-size:2.4rem;color:var(--gold);line-height:.9}
.reason p{color:var(--muted);margin:.5rem 0 0}

/* galerie */
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:20px}
.gallery figure{margin:0;position:relative;aspect-ratio:4/3;background:#fff;overflow:hidden}
.gallery img{width:100%;height:100%;object-fit:cover}
.gallery img.contain{object-fit:contain}
.gallery figcaption{position:absolute;left:0;right:0;bottom:0;padding:1.6rem 1rem .8rem;background:linear-gradient(transparent,rgba(11,21,48,.92));color:#fff;font-weight:700}

/* appel à l'action */
.cta{border-top:1px solid var(--rule)}
.cta .wrap{display:flex;flex-wrap:wrap;gap:2.5rem;justify-content:space-between;align-items:flex-end}
.cta h2{flex:1 1 520px;font-size:clamp(2.4rem,5vw,4.6rem);max-width:none}
.cta h2 .sub{font-size:.6em;line-height:1.1}
.reach{display:flex;flex-direction:column;gap:.5rem}
.cta .reach{flex:0 1 380px}
.reach a.big{font-family:var(--display);font-weight:700;font-stretch:108%;font-size:1.75rem;color:var(--text);text-decoration:none}
.reach a.big:hover{color:var(--gold-l)}

/* contact */
.contact-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(2rem,5vw,4.5rem)}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr}}
.office{padding:1.6rem 0;border-bottom:1px solid var(--rule)}
.office h3{margin-bottom:.6rem}
.office p{color:var(--muted);margin:0 0 .6rem}
form{background:var(--panel);padding:clamp(1.4rem,3vw,2.4rem);border-top:3px solid var(--gold)}
label{display:block;font-weight:600;font-size:.95rem;color:var(--text);margin-bottom:.4rem}
input,select,textarea{width:100%;font:inherit;color:#fff;background:var(--navy);border:1px solid #2A3D6B;border-radius:3px;padding:.85rem .9rem;margin-bottom:1.2rem}
input:focus,select:focus,textarea:focus{border-color:var(--gold);outline:none}
textarea{min-height:150px;resize:vertical}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media (max-width:560px){.row2{grid-template-columns:1fr}}
.form-note{font-size:.95rem;color:var(--muted);margin:1rem 0 0}

.h404{font-size:clamp(2.8rem,7vw,5.5rem)}
.h404 .sub{font-size:.4em}

/* pied de page */
footer{background:var(--deep);border-top:1px solid var(--rule);padding:4rem 0 2rem;color:var(--muted);font-size:.98rem}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:2.5rem}
@media (max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot-grid{grid-template-columns:1fr}}
footer h4{font-family:var(--sans);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-l);margin:0 0 1rem;font-size:.85rem}
footer ul{list-style:none;margin:0;padding:0}
footer li{margin:.45rem 0}
footer a{color:var(--muted);text-decoration:none}footer a:hover{color:#fff}
.legal{margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--rule);display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;font-size:.85rem;color:#8794AE}

/* bouton WhatsApp flottant */
.wa-float{position:fixed;right:18px;bottom:18px;width:58px;height:58px;border-radius:50%;background:#1F8F55;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(0,0,0,.4);z-index:60}
.wa-float:hover{background:#25a865}
.wa-float svg{width:30px;height:30px}

/* ---------- Animations ---------- */
@keyframes rise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes zoom{from{transform:scale(1.12)}to{transform:scale(1)}}
@keyframes drift{from{transform:scale(1.04) translateX(0)}to{transform:scale(1.1) translateX(-1.5%)}}
@keyframes grow{from{width:0}to{width:72px}}
@keyframes fadein{from{opacity:0}to{opacity:1}}

/* entrée de l'accueil */
.hero-img img{animation:zoom 2.8s cubic-bezier(.16,1,.3,1) var(--boot) both, drift 22s ease-in-out calc(var(--boot) + 2.8s) infinite alternate}
.hero-text .kicker{animation:rise 1s calc(var(--boot) + .2s) cubic-bezier(.16,1,.3,1) both}


.hero h1::after{animation:grow 1.2s calc(var(--boot) + 1.3s) cubic-bezier(.16,1,.3,1) both}
.hero .lead{animation:rise 1.1s calc(var(--boot) + 1.15s) cubic-bezier(.16,1,.3,1) both}
.hero .actions{animation:rise 1.1s calc(var(--boot) + 1.35s) cubic-bezier(.16,1,.3,1) both}

/* entrée des pages intérieures */
.page-hero img{animation:zoom 2.2s cubic-bezier(.2,.7,.2,1) both}
.page-hero .kicker{animation:rise .8s .2s cubic-bezier(.2,.7,.2,1) both}

.page-hero .lead{animation:rise .9s .55s cubic-bezier(.2,.7,.2,1) both}

/* apparition au défilement */
.js .reveal{opacity:0;transform:translateY(32px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.js .reveal.is-in{opacity:1;transform:none}
.js .route .city.reveal{transform:translateX(-30px)}
.js .route .city.reveal.is-in{transform:none}
.js .route .dash{transform:scaleX(0);transform-origin:left;transition:transform 1.4s .3s cubic-bezier(.2,.7,.2,1)}
.js .route.is-in .dash{transform:scaleX(1)}

/* survols */
.pillar,.card,.tile{transition:background .25s,transform .25s,box-shadow .25s}
.pillar:hover,.tile:hover{transform:translateY(-4px)}
.card img{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.card:hover img{transform:scale(1.04)}
.card{overflow:hidden}
.gallery img{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.gallery figure:hover img{transform:scale(1.05)}
.btn{transition:background .2s,color .2s,transform .2s}
.btn:hover{transform:translateY(-2px)}
.pillar .more{transition:letter-spacing .25s}
.pillar:hover .more{letter-spacing:.04em}

/* en-tête qui s'affine au défilement */
.top{transition:background .3s,box-shadow .3s}
.top.scrolled{background:rgba(7,14,34,.97);box-shadow:0 8px 30px rgba(0,0,0,.35)}

/* bouton WhatsApp : pulsation discrète */
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(37,168,101,.55)}70%{box-shadow:0 0 0 16px rgba(37,168,101,0)}100%{box-shadow:0 0 0 0 rgba(37,168,101,0)}}
.wa-float{animation:pulse 2.6s 3s infinite}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .reveal{opacity:1;transform:none}
  .js .route .dash{transform:none}
}

/* ---------- Moderne & dynamique ---------- */
/* barre de progression */
.progress{position:fixed;top:0;left:0;height:3px;width:100%;background:linear-gradient(90deg,var(--gold),var(--gold-l));transform:scaleX(0);transform-origin:left;z-index:100;pointer-events:none}

/* mots qui défilent dans le titre */
.rot{position:relative;display:inline-grid;font-weight:600;color:#fff;vertical-align:bottom;overflow:hidden;height:1.15em;line-height:1.15}
.rot i{grid-area:1/1;font-style:normal;white-space:nowrap;transform:translateY(110%);opacity:0;transition:transform .7s cubic-bezier(.7,0,.2,1),opacity .5s}
.rot i.on{transform:none;opacity:1}
.rot i.out{transform:translateY(-110%);opacity:0}
.rot::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--gold)}

/* bandeau défilant */
.marquee{background:var(--navy2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;padding:1.15rem 0}
.marquee .track{display:flex;width:max-content;animation:marq 45s linear infinite}
.marquee:hover .track{animation-play-state:paused}
.marquee span{font-family:var(--display);font-weight:600;font-stretch:108%;font-size:1.15rem;color:#D3DCEC;white-space:nowrap;padding:0 1.6rem;display:flex;align-items:center;gap:3.2rem}
.marquee span::after{content:"";width:7px;height:7px;background:var(--gold);transform:rotate(45deg);margin-left:1.6rem}
@keyframes marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* chiffres clés */
.stats{background:var(--navy)}
.stats .wrap{display:grid;grid-template-columns:repeat(4,1fr);border-left:1px solid var(--rule)}
.stat{padding:2.6rem 1.8rem;border-right:1px solid var(--rule)}
.stat b{display:block;font-family:var(--display);font-weight:800;font-stretch:115%;font-size:clamp(2.6rem,4.5vw,3.8rem);line-height:1;color:var(--gold-l);font-variant-numeric:tabular-nums}
.stat span{display:block;margin-top:.7rem;color:var(--muted);font-size:.98rem}
@media (max-width:860px){.stats .wrap{grid-template-columns:1fr 1fr;border-left:0}.stat{border-right:0;border-bottom:1px solid var(--rule);padding:1.8rem .5rem}}

/* piliers en photo */
.pillar.photo{position:relative;overflow:hidden;min-height:440px;justify-content:flex-end;color:#D3DCEC;isolation:isolate}
.pillar.photo .pillar-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.pillar.photo::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,21,48,.35) 0%,rgba(11,21,48,.75) 48%,rgba(11,21,48,.97) 100%);transition:background .5s}
.pillar.photo h3{color:#fff}
.pillar.photo p{color:#C9D3E6;max-height:0;opacity:0;overflow:hidden;transition:max-height .6s cubic-bezier(.2,.7,.2,1),opacity .5s}
.pillar.photo:hover .pillar-bg,.pillar.photo:focus-visible .pillar-bg{transform:scale(1.08)}
.pillar.photo:hover::before{background:linear-gradient(180deg,rgba(11,21,48,.5) 0%,rgba(11,21,48,.88) 45%,rgba(11,21,48,.98) 100%)}
.pillar.photo:hover p,.pillar.photo:focus-visible p{max-height:10em;opacity:1}
.pillar.photo::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:0;background:var(--gold);transition:width .6s cubic-bezier(.2,.7,.2,1)}
.pillar.photo.green::after{background:var(--green)}
.pillar.photo:hover::after{width:100%}
.pillar.photo:hover{transform:none}
@media (hover:none){.pillar.photo p{max-height:none;opacity:1}.pillar.photo{min-height:380px}}

/* parallaxe douce des photos d'en-tête */
.hero-img,.page-hero img{will-change:transform}

/* transition entre les pages */
@keyframes pagein{from{opacity:0}to{opacity:1}}
body{animation:pagein .5s ease both}
@keyframes pageout{from{opacity:1}to{opacity:0}}
body.leaving{animation:pageout .3s ease forwards}

/* cartes : lueur au survol */
.card,.tile{position:relative}
.card::after,.tile::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(400px circle at var(--mx,50%) var(--my,50%),rgba(233,194,90,.09),transparent 45%);opacity:0;transition:opacity .3s}
.card:hover::after,.tile:hover::after{opacity:1}
.alt .card::after,.alt .tile::after{background:radial-gradient(400px circle at var(--mx,50%) var(--my,50%),rgba(201,162,58,.12),transparent 45%)}

@media (prefers-reduced-motion:reduce){
  .marquee .track{animation:none;flex-wrap:wrap;width:auto}
  .marquee .track span:nth-child(n+10){display:none}
  .rot i{transition:none}
  .progress{display:none}
  body{animation:none}
}
.pillar.photo .more{margin-top:.6rem}
.pillar.photo .code{color:var(--gold-l)}
.pillar.photo.green .code{color:var(--green-l)}


/* ---------- Luxe : brillance & mouvement ---------- */
:root{--boot:0s;--ease:cubic-bezier(.16,1,.3,1)}
.has-loader{--boot:2.1s}

/* rideau d'introduction */
.loader{position:fixed;inset:0;z-index:300;background:radial-gradient(120% 90% at 50% 40%,#13214A 0%,#0B1530 55%,#070E22 100%);display:flex;align-items:center;justify-content:center;animation:lift 1.1s 1.55s cubic-bezier(.77,0,.18,1) forwards;pointer-events:none}
.loader::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold-l),transparent)}
.noload .loader{display:none}
.loader-in{display:flex;flex-direction:column;align-items:center;gap:1.1rem;text-align:center}
.loader img{width:84px;height:84px;border-radius:50%;border:2px solid var(--gold);object-fit:cover;opacity:0;animation:logoin 1s .1s var(--ease) forwards}
.loader-name{font-family:var(--display);font-weight:800;font-stretch:120%;font-size:1.9rem;letter-spacing:.5em;margin-right:-.5em;color:#fff;opacity:0;animation:track 1.3s .25s var(--ease) forwards}
.loader-line{display:block;height:1px;width:0;background:linear-gradient(90deg,transparent,var(--gold-l),transparent);animation:line 1s .45s var(--ease) forwards}
.loader-tag{font-size:.78rem;letter-spacing:.32em;text-transform:uppercase;color:var(--muted);opacity:0;animation:fadein .8s .7s ease forwards}
@keyframes logoin{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:none}}
@keyframes track{from{opacity:0;letter-spacing:1.1em;filter:blur(6px)}to{opacity:1;letter-spacing:.5em;filter:none}}
@keyframes line{to{width:min(320px,70vw)}}
@keyframes lift{0%{transform:translateY(0)}100%{transform:translateY(-100%);visibility:hidden}}

/* titres : mots qui montent derrière un masque */
.w{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .02em .1em;margin:0 -.02em -.1em}
.wi{display:inline-block;transform:translateY(105%);transition:transform 1.2s var(--ease);transition-delay:calc(var(--i,0) * 55ms + var(--wd,0s))}
.split-in .wi{transform:none}

/* or métallique */
.metal,.cta .sub,.h404 .sub,.stat b{background:linear-gradient(100deg,#A97C22 0%,#E9C25A 20%,#FFF2C6 30%,#E9C25A 40%,#B8892B 58%,#F6DA8E 76%,#A97C22 100%);background-size:240% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation-name:shine;animation-duration:8s;animation-timing-function:linear;animation-iteration-count:infinite}
.hero h1 .sub{animation:rise 1.1s calc(var(--boot) + 1s) var(--ease) both}
.hero h1 .metal{animation:shine 8s linear calc(var(--boot) + 2s) infinite}
@keyframes shine{from{background-position:120% 0}to{background-position:-120% 0}}
.rot,.rot i{-webkit-text-fill-color:#fff;color:#fff}

/* reflet lumineux sur la photo d'accueil */
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 38%,rgba(255,238,200,.07) 46%,rgba(255,238,200,.16) 50%,rgba(255,238,200,.07) 54%,transparent 62%);background-size:300% 100%;background-position:150% 0;mix-blend-mode:screen;animation:gleam 10s ease-in-out calc(var(--boot) + 3s) infinite}
@keyframes gleam{0%{background-position:150% 0}55%,100%{background-position:-50% 0}}

/* boutons dorés brillants */
.btn{position:relative;overflow:hidden;isolation:isolate;transition:background .3s,color .3s,box-shadow .4s,transform .5s var(--ease)}
.btn-gold{background:linear-gradient(135deg,#B8892B 0%,#E3BB52 42%,#F6DB8F 52%,#D0A63D 64%,#B8892B 100%);background-size:180% 100%;background-position:0 0;color:#0B1530;box-shadow:inset 0 1px 0 rgba(255,255,255,.5),inset 0 -1px 0 rgba(0,0,0,.15),0 14px 34px -14px rgba(233,194,90,.65)}
.btn-gold:hover{background-position:100% 0;color:#0B1530;box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 18px 40px -12px rgba(233,194,90,.85)}
.btn::after{content:"";position:absolute;top:-20%;bottom:-20%;left:0;width:45%;z-index:-1;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:translateX(-160%) skewX(-20deg);transition:transform .9s var(--ease)}
.btn-gold::after{z-index:1;mix-blend-mode:soft-light}
.btn:hover::after{transform:translateX(330%) skewX(-20deg)}
.hero .btn-gold::after{animation:sheen 5.5s calc(var(--boot) + 3s) infinite}
@keyframes sheen{0%,70%{transform:translateX(-160%) skewX(-20deg)}88%,100%{transform:translateX(330%) skewX(-20deg)}}
.btn-line{backdrop-filter:blur(6px);background:rgba(255,255,255,.04)}
.env .btn-gold{background:linear-gradient(135deg,#2F7A40,#4CA35C 50%,#2F7A40);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 14px 34px -14px rgba(76,163,92,.7)}

/* barre de menu en verre dépoli */
.top{background:rgba(11,21,48,.62);-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);border-bottom:0}
.top::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,rgba(233,194,90,.55),transparent)}
.top.scrolled{background:rgba(7,14,34,.78)}
.brand img{transition:transform .8s var(--ease)}
.brand:hover img{transform:rotate(-8deg) scale(1.06)}
.nav a{position:relative;border-bottom:0}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease)}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}

/* photos dévoilées par un rideau */
.js .card.reveal img{clip-path:inset(0 0 100% 0);transition:clip-path 1.4s cubic-bezier(.77,0,.18,1) .1s,transform .9s var(--ease)}
.js .card.reveal.is-in img{clip-path:inset(0 0 0 0)}
.js .gallery figure.reveal{clip-path:inset(0 100% 0 0);opacity:1;transform:none;transition:clip-path 1.4s cubic-bezier(.77,0,.18,1)}
.js .gallery figure.reveal.is-in{clip-path:inset(0 0 0 0)}
.js .pillar.photo.reveal .pillar-bg{clip-path:inset(100% 0 0 0);transition:clip-path 1.5s cubic-bezier(.77,0,.18,1),transform 1.2s var(--ease)}
.js .pillar.photo.reveal.is-in .pillar-bg{clip-path:inset(0)}

/* apparitions plus soyeuses */
.js .reveal{transition:opacity 1.1s var(--ease),transform 1.2s var(--ease)}
.tile,.pillar,.card{transition:transform .6s var(--ease),background .4s,box-shadow .6s}
.tile:hover{box-shadow:0 30px 60px -30px rgba(0,0,0,.45)}

@media (prefers-reduced-motion:reduce){
  .loader{display:none}
  .wi{transform:none!important}
  .js .card.reveal img,.js .gallery figure.reveal,.js .pillar.photo.reveal .pillar-bg{clip-path:none}
  .hero::after{display:none}
}

/* mot tournant : un seul mot visible à la fois */
.rot i{visibility:hidden;transition:transform .7s cubic-bezier(.7,0,.2,1),opacity .45s,visibility 0s .7s}
.rot i.on{visibility:visible;transition:transform .7s cubic-bezier(.7,0,.2,1) .15s,opacity .45s .15s,visibility 0s}
.rot i.out{visibility:visible;transition:transform .55s cubic-bezier(.7,0,.2,1),opacity .35s,visibility 0s .55s}
