/* ============================================================================
   PostEx — Accueil « Épuré cinétique »
   Clair, aéré, sobre. Titres contenus, une seule couleur d'accent (ambre),
   micro-animations rapides pilotées au scroll (home.js pousse --p).
   Repli complet prefers-reduced-motion.
   ========================================================================== */

:root{ --lux-vh:100vh; }
@supports (height:100dvh){ :root{ --lux-vh:100dvh; } }

/* Header sur accueil clair : texte encre dès le départ (page est claire) */
.header:not(.is-scrolled){color:var(--t-hi)}
.header:not(.is-scrolled) .nav a{color:var(--t-mid)}
.header:not(.is-scrolled) .nav a:hover{color:var(--t-hi);background:rgba(15,23,42,.05)}
.header:not(.is-scrolled) .nav a.is-active{color:var(--brand-3)}
.header:not(.is-scrolled) .burger{color:var(--t-hi);box-shadow:inset 0 0 0 1px var(--line)}
.header:not(.is-scrolled) .btn--ghost{color:var(--t-hi);box-shadow:inset 0 0 0 1.5px var(--line-2)}
.header:not(.is-scrolled) .btn--ghost:hover{box-shadow:inset 0 0 0 1.5px var(--t-hi)}

.lux-eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--f-mono);font-size:.7rem;font-weight:700;
  letter-spacing:.2em;text-transform:uppercase;color:var(--t-lo);
}
.lux-dot{width:7px;height:7px;border-radius:50%;background:var(--amber);
  box-shadow:0 0 0 4px rgba(255,196,0,.16);flex:none}

.lux-br{display:none}
@media (min-width:700px){ .lux-br{display:inline} }

.lux-title{
  font-family:var(--f-sans);font-weight:700;letter-spacing:-.028em;
  font-size:clamp(1.9rem,3.6vw,3rem);line-height:1.12;color:var(--t-hi);margin:0;
  text-wrap:balance;
}

/* ────────────────────────────── HERO ───────────────────────────────────── */
.lux-hero{
  background:var(--paper);
  padding:calc(var(--nav-h) + clamp(48px,9vh,96px)) var(--gut) clamp(56px,9vh,104px);
  text-align:center;
}
.lux-hero__copy{max-width:760px;margin-inline:auto}
.lux-hero__title{
  font-family:var(--f-sans);font-weight:700;letter-spacing:-.032em;
  font-size:clamp(2.3rem,4.4vw,3.9rem);line-height:1.06;color:var(--t-hi);
  margin:clamp(16px,2.6vh,24px) 0 0;text-wrap:balance;
  opacity:0;transform:translateY(14px);animation:luxIn .7s var(--ease) .08s both;
}
.lux-accent{position:relative;white-space:nowrap}
.lux-accent::after{content:"";position:absolute;left:.02em;right:.02em;bottom:.03em;height:.14em;
  background:var(--amber);border-radius:3px;z-index:-1;opacity:.85}
.lux-hero__sub{
  margin:clamp(14px,2.4vh,22px) auto 0;max-width:520px;
  font-size:clamp(.98rem,1.3vw,1.12rem);line-height:1.65;color:var(--t-mid);
  opacity:0;transform:translateY(12px);animation:luxIn .7s var(--ease) .2s both;
}
.lux-hero__actions{
  display:flex;gap:12px;justify-content:center;flex-wrap:wrap;
  margin-top:clamp(22px,3.6vh,32px);
  opacity:0;transform:translateY(12px);animation:luxIn .7s var(--ease) .3s both;
}
.lux-hero .lux-eyebrow{opacity:0;animation:luxIn .7s var(--ease) both}
@keyframes luxIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* Camion « product shot » : carte arrondie qui se pose en douceur au scroll */
.lux-hero__stage{margin:clamp(36px,6vh,64px) auto 0;max-width:1160px;padding:0}
.lux-hero__frame{
  border-radius:clamp(18px,2.4vw,28px);overflow:hidden;
  box-shadow:0 1px 2px rgba(11,13,18,.06),0 30px 70px -30px rgba(11,13,18,.30);
  transform:translateY(calc((1 - var(--p,0)) * 26px)) scale(calc(.975 + var(--p,0) * .025));
  will-change:transform;
  opacity:0;animation:luxIn .9s var(--ease) .42s both;
}
.lux-hero__img{width:100%;height:auto;display:block}

/* ─────────────────────────── MANIFESTE ─────────────────────────────────── */
.lux-manifesto{background:var(--paper)}
.lux-manifesto__stick{
  position:sticky;top:0;min-height:var(--lux-vh);
  display:flex;align-items:center;justify-content:center;
  padding:0 var(--gut);text-align:center;
}
.lux-manifesto__text{
  max-width:820px;margin:0;
  font-family:var(--f-sans);font-weight:700;letter-spacing:-.022em;
  font-size:clamp(1.5rem,3vw,2.5rem);line-height:1.3;color:var(--t-hi);
  text-wrap:balance;
}
.lux-manifesto__text .w{
  opacity:calc((var(--p,0) * var(--wn,18) - var(--i,0)) * .85 + .12);
  transition:opacity .1s linear;
}

/* ─────────────────────────── CHIFFRES ──────────────────────────────────── */
.lux-stats{background:var(--paper);padding:clamp(56px,9vh,110px) var(--gut)}
.lux-stats__grid{
  max-width:980px;margin-inline:auto;
  display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,48px);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:clamp(34px,6vh,56px) 0;
}
.lux-stat{text-align:center}
.lux-stat__num{
  font-family:var(--f-display);font-weight:700;line-height:.92;
  font-size:clamp(2.7rem,5.6vw,4.6rem);color:var(--t-hi);
  font-variant-numeric:tabular-nums;margin:0;
}
.lux-stat__num small{font-size:.38em;color:var(--t-lo);margin-left:.1em;font-weight:700}
.lux-stat__label{
  margin:10px 0 0;font-family:var(--f-mono);font-size:.68rem;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;color:var(--t-lo);
}
@media (max-width:700px){
  .lux-stats__grid{grid-template-columns:1fr;gap:26px;padding:30px 0}
}

/* ─────────────────────────── SOLUTIONS ─────────────────────────────────── */
.lux-slides{background:var(--paper);padding:clamp(30px,5vh,60px) var(--gut) clamp(56px,8vh,100px);
  display:grid;gap:clamp(22px,3.5vh,36px)}
.lux-slide{max-width:1160px;margin-inline:auto;width:100%}
.lux-card{
  display:grid;grid-template-columns:1.25fr 1fr;align-items:center;gap:clamp(24px,4vw,56px);
  background:var(--paper-2);border:1px solid var(--line);border-radius:clamp(18px,2.2vw,26px);
  padding:clamp(18px,2.4vw,28px);
  box-shadow:0 1px 2px rgba(11,13,18,.04);
  transition:box-shadow .35s var(--ease),transform .35s var(--ease),border-color .35s;
  opacity:calc(.25 + var(--p,0) * 2.4);
  transform:translateY(calc((1 - min(var(--p,0) * 2.6, 1)) * 22px));
}
.lux-card:hover{box-shadow:0 20px 50px -22px rgba(11,13,18,.22);transform:translateY(-3px);border-color:var(--line-2)}
.lux-slide:nth-child(even) .lux-card{grid-template-columns:1fr 1.25fr}
.lux-slide:nth-child(even) .lux-card__media{order:2}
.lux-card__media{border-radius:clamp(12px,1.6vw,18px);overflow:hidden;aspect-ratio:16/10}
.lux-card__img{width:100%;height:100%;object-fit:cover;transform:scale(1.001);
  transition:transform .8s var(--ease)}
.lux-card:hover .lux-card__img{transform:scale(1.045)}
.lux-card__body{padding:clamp(4px,1vw,12px) clamp(4px,1.4vw,18px)}
.lux-card__n{font-family:var(--f-mono);font-size:.68rem;font-weight:700;letter-spacing:.26em;
  color:var(--t-lo);margin:0 0 10px}
.lux-card__n::after{content:"";display:inline-block;width:34px;height:1.5px;background:var(--amber);
  margin-left:12px;vertical-align:.24em}
.lux-card__title{
  font-family:var(--f-sans);font-weight:700;letter-spacing:-.025em;
  font-size:clamp(1.45rem,2.4vw,2.05rem);line-height:1.12;color:var(--t-hi);margin:0;
}
.lux-card__line{margin:10px 0 0;color:var(--t-mid);font-size:.99rem;line-height:1.62;max-width:400px}
.lux-card__link{
  display:inline-flex;align-items:center;gap:.5em;margin-top:18px;
  font-weight:700;font-size:.95rem;color:var(--t-hi);
}
.lux-card__link svg{width:1em;height:1em;transition:transform .3s var(--ease-spring)}
.lux-card:hover .lux-card__link svg{transform:translateX(4px)}
@media (max-width:860px){
  .lux-card,.lux-slide:nth-child(even) .lux-card{grid-template-columns:1fr;gap:16px}
  .lux-slide:nth-child(even) .lux-card__media{order:0}
}

/* ─────────────────────────── PROCESS ───────────────────────────────────── */
.lux-process{background:var(--paper);padding:clamp(56px,9vh,110px) var(--gut)}
.lux-process__inner{max-width:980px;margin-inline:auto}
.lux-process .lux-title{text-align:center;margin-bottom:clamp(36px,6vh,58px)}
.lux-route{position:relative;height:40px;margin-bottom:18px}
.lux-route svg{width:100%;height:100%}
.lux-route__bg{fill:none;stroke:var(--line-2);stroke-width:2;stroke-dasharray:1.5 8;stroke-linecap:round}
.lux-route__line{fill:none;stroke:var(--amber);stroke-width:2.5;stroke-linecap:round}
.lux-route__pin{position:absolute;top:50%;width:11px;height:11px;border-radius:50%;
  transform:translate(-50%,-50%);background:var(--ink);
  box-shadow:0 0 0 3.5px var(--paper),0 0 0 4.8px var(--line-2)}
.lux-route__pin--end{background:var(--brand)}
.lux-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3.5vw,40px);
  counter-reset:lstep;margin:0;padding:0}
.lux-step{list-style:none;counter-increment:lstep}
.lux-step__k{display:block;font-weight:700;letter-spacing:-.02em;
  font-size:clamp(1.1rem,1.7vw,1.3rem);color:var(--t-hi)}
.lux-step__k::before{content:counter(lstep,decimal-leading-zero);display:block;
  font-family:var(--f-mono);font-size:.66rem;font-weight:700;letter-spacing:.24em;
  color:var(--t-lo);margin-bottom:7px}
.lux-step__d{display:block;margin-top:6px;color:var(--t-mid);font-size:.95rem;line-height:1.6;max-width:280px}
@media (max-width:700px){
  .lux-route{display:none}
  .lux-steps{grid-template-columns:1fr;gap:24px}
  .lux-step__d{max-width:none}
}

/* ─────────────────────────── CITATION ──────────────────────────────────── */
.lux-quote{background:var(--paper);padding:clamp(40px,7vh,90px) var(--gut) clamp(72px,11vh,130px)}
.lux-quote__inner{max-width:760px;margin-inline:auto;text-align:center;
  opacity:calc(.2 + var(--p,0) * 2.2)}
.lux-quote blockquote{
  margin:0;font-weight:700;letter-spacing:-.02em;font-style:italic;
  font-size:clamp(1.25rem,2.3vw,1.8rem);line-height:1.42;color:var(--t-hi);text-wrap:balance;
}
.lux-quote figcaption{margin-top:18px;font-family:var(--f-mono);font-size:.72rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--t-lo)}
.lux-quote figcaption b{color:var(--t-hi)}

/* ─────────────────────────── FINAL ─────────────────────────────────────── */
.lux-final{background:var(--ink);color:var(--t-on-ink);text-align:center;
  padding:clamp(72px,12vh,130px) var(--gut) 0;overflow:hidden;position:relative}
.lux-final::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--amber),rgba(255,196,0,.08) 65%,transparent)}
.lux-final__title{
  font-family:var(--f-sans);font-weight:700;letter-spacing:-.028em;
  font-size:clamp(1.9rem,3.6vw,3.1rem);line-height:1.14;color:#fff;margin:0;text-wrap:balance;
}
.lux-final__actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;
  margin:clamp(24px,4vh,36px) 0 clamp(60px,9vh,100px)}
.lux-ghost-light{color:#fff;box-shadow:inset 0 0 0 1.5px var(--line-ink-2)}
.lux-ghost-light:hover{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.65)}

.lux-marquee{border-top:1px solid var(--line-ink);padding:20px 0;overflow:hidden;
  mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.lux-marquee__track{display:flex;width:max-content;animation:luxMarquee 52s linear infinite}
.lux-marquee__track span{display:flex;align-items:center;flex:none}
.lux-marquee__track i{font-style:normal;font-family:var(--f-mono);font-size:.7rem;font-weight:700;
  letter-spacing:.2em;text-transform:uppercase;color:var(--t-on-ink-lo);padding:0 16px}
.lux-marquee__track b{color:var(--amber);font-weight:400}
@keyframes luxMarquee{to{transform:translateX(-50%)}}

/* ───────────────── Reduced motion : tout statique, tout lisible ────────── */
@media (prefers-reduced-motion:reduce){
  .lux-hero .lux-eyebrow,.lux-hero__title,.lux-hero__sub,.lux-hero__actions,.lux-hero__frame{
    animation:none;opacity:1;transform:none}
  .lux-manifesto__stick{position:static;min-height:auto;padding:clamp(72px,11vh,120px) var(--gut)}
  .lux-manifesto__text .w{opacity:1;transition:none}
  .lux-card{opacity:1;transform:none}
  .lux-quote__inner{opacity:1}
  .lux-marquee__track{animation:none}
  .lux-route__line{stroke-dashoffset:0 !important;stroke-dasharray:none !important}
}
