/* Henry — système DA partagé (prototype) « le ciel qui se dégage ». Voix Steed. */
@import url("https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,600;1,9..144,500&family=Hanken+Grotesk:wght@400;500;600;700;800&display=swap");
:root{
  --navy-deep:#0e1726;--navy:#16243a;--navy-clear:#1b2e48;--teal:#3fb6b2;
  --line:#e4e8ec;--orange:#e8743b;--orange-cta:#bf551f;
  --sans:"Hanken Grotesk",ui-sans-serif,system-ui,sans-serif;--serif:"Fraunces",ui-serif,Georgia,serif;
  --maxw:1100px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--navy-deep);color:#fff;font-family:var(--sans);overflow-x:hidden;line-height:1.6}
body::after{content:"";position:fixed;inset:0;z-index:60;pointer-events:none;opacity:0.05;mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
a{color:inherit}
/* Nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;gap:24px;justify-content:space-between;
  padding:16px clamp(20px,4vw,56px);background:rgba(12,20,34,0.55);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,0.06)}
.brand{display:flex;align-items:center;gap:9px;font-weight:800;font-size:21px;letter-spacing:-0.02em;text-decoration:none;color:#fff}
.dia{width:10px;height:10px;background:var(--orange);transform:rotate(45deg);border-radius:2px;flex:none}
.navlinks{display:none;gap:28px;margin-left:auto}
.navlinks a{font-size:14px;color:rgba(228,232,236,0.72);text-decoration:none;transition:color .2s}
.navlinks a:hover{color:#fff}
.navcta{font-size:14px;font-weight:600;color:#fff;background:var(--orange-cta);border-radius:999px;padding:10px 18px;text-decoration:none;white-space:nowrap}
@media(min-width:860px){.navlinks{display:flex}}
/* Hero (pages de détail) */
.hero{position:relative;overflow:hidden;background:radial-gradient(120% 90% at 30% 6%,#1a2740,#0e1726 58%,#090f1b);padding:clamp(120px,20vh,220px) clamp(20px,7vw,110px) clamp(70px,10vh,120px)}
.hero .in{max-width:var(--maxw);margin:0 auto}
.kicker{font-size:13px;font-weight:600;letter-spacing:0.26em;text-transform:uppercase;color:var(--teal);margin-bottom:24px}
.hero h1{font-family:var(--serif);font-weight:600;letter-spacing:-0.02em;line-height:0.96;font-size:clamp(2.8rem,8vw,6rem)}
.hero .sub{margin-top:24px;max-width:60ch;font-size:clamp(1.1rem,1.8vw,1.5rem);color:rgba(228,232,236,0.82)}
.ctas{margin-top:38px;display:flex;flex-wrap:wrap;gap:16px}
.btn{display:inline-block;border-radius:999px;padding:15px 30px;font-weight:600;text-decoration:none;transition:transform .2s}
.btn-p{background:var(--orange-cta);color:#fff}
.btn-p:hover{transform:translateY(-1px)}
.btn-s{border:1px solid rgba(255,255,255,0.3);color:#fff}
.btn-s:hover{background:rgba(255,255,255,0.08)}
/* Monde dégagé + sections */
.cleared{position:relative;background:linear-gradient(180deg,#15243a 0%,#1b2e48 45%,#0e1726 100%)}
.sec{max-width:var(--maxw);margin:0 auto;padding:clamp(80px,12vh,150px) clamp(20px,7vw,110px)}
.eyebrow{font-size:13px;font-weight:600;letter-spacing:0.26em;text-transform:uppercase;color:var(--teal);margin-bottom:24px}
h2{font-family:var(--serif);font-weight:600;letter-spacing:-0.02em;line-height:1.04}
.big{font-size:clamp(2.2rem,5.5vw,3.9rem)}
.huge{font-size:clamp(2.6rem,8vw,5.6rem);line-height:0.99}
.h3{font-size:clamp(1.6rem,2.6vw,2.2rem)}
.lead{margin-top:22px;color:rgba(228,232,236,0.78);font-size:clamp(1.08rem,1.6vw,1.4rem);max-width:62ch}
.claim{margin-top:30px;font-family:var(--serif);font-weight:600;font-size:clamp(1.6rem,3.2vw,2.5rem)}
.claim em{font-style:italic;color:var(--orange)}
.muted{color:rgba(228,232,236,0.66)}
.refs{margin-top:30px;font-size:0.97rem;letter-spacing:0.02em;color:rgba(228,232,236,0.62)}
.door{display:inline-block;margin-top:28px;font-weight:600;color:#fff;text-decoration:none;border-bottom:2px solid rgba(63,182,178,0.55);padding-bottom:3px}
.door span{color:var(--teal)}
.door:hover{border-color:var(--teal)}
.two{display:grid;gap:clamp(36px,5vw,68px);margin-top:14px}
@media(min-width:820px){.two{grid-template-columns:1fr 1fr}}
.num{display:block;font-family:var(--serif);font-size:clamp(2rem,4vw,3rem);color:rgba(232,116,59,0.8);margin-bottom:10px}
/* Piliers */
.pillars{margin-top:48px;display:flex;flex-direction:column;gap:14px}
.pillar{display:flex;gap:22px;align-items:flex-start;padding:26px clamp(18px,3vw,34px);border:1px solid rgba(255,255,255,0.09);border-radius:18px;background:rgba(255,255,255,0.025)}
.pillar.soft{border-style:dashed;background:none}
.pillar .pn{flex:none;width:38px;height:38px;display:flex;align-items:center;justify-content:center;border-radius:999px;background:var(--navy-deep);color:#fff;font-weight:700;font-size:14px}
.pillar.soft .pn{background:none;border:1px solid rgba(255,255,255,0.18);color:rgba(228,232,236,0.7)}
.pillar h3{font-family:var(--serif);font-weight:600;font-size:1.4rem}
.pillar p{margin-top:8px;color:rgba(228,232,236,0.78)}
.pillar .ex{margin-top:10px;font-size:0.95rem;font-style:italic;color:rgba(228,232,236,0.58)}
/* Lois (loi du réel) */
.lois{margin-top:30px;display:flex;flex-direction:column;gap:18px}
.loi{border-left:2px solid var(--teal);padding-left:18px}
.loi b{font-weight:600}
.loi span{display:block;margin-top:4px;font-size:0.97rem;color:rgba(228,232,236,0.66)}
/* Sections de teinte */
.proof{text-align:center}.proof .lead,.proof .claim{margin-left:auto;margin-right:auto}
.center{text-align:center}.center .lead{margin-left:auto;margin-right:auto}
.close{text-align:center;background:radial-gradient(60% 80% at 50% 120%,rgba(232,116,59,0.14),transparent 60%)}
/* Footer */
.foot{max-width:var(--maxw);margin:0 auto;padding:50px clamp(20px,7vw,110px);display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;border-top:1px solid rgba(255,255,255,0.08);color:rgba(228,232,236,0.6);font-size:14px}
.foot .brand{font-size:18px}
/* Reveals */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.16,.8,.24,1),transform .9s cubic-bezier(.16,.8,.24,1)}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}