/* ============================================================
   manuelthomas.fr — refonte 2026 · design system « Plein cadre, deux portes »
   Adapté de la maquette Hi-fi v2 (Claude Design, 4 juillet 2026)
   ============================================================ */
:root{
  --ink:#0E1B2D; --ink-deep:#08111E; --ink-soft:#1C2B43; --ink-muted:#4A586E;
  --orange:#D8581E; --orange-deep:#B7461A; --orange-soft:#E87B47; --orange-wash:#F7E3D3;
  --ivory:#F4F3EE; --paper:#FCFBF6; --bone:#E6E4DC; --stone:#8C8A82; --shell:#FFFFFF;
  --line:rgba(14,27,45,0.12); --line-strong:rgba(14,27,45,0.24);
  --ok:#2E6E4F; --warn:#B57014; --err:#8B2A1F;
  --font-display:"Playfair Display","Didot",serif;
  --font-sans:"Geist","Söhne",-apple-system,BlinkMacSystemFont,sans-serif;
  --font-mono:"Geist Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --gutter:clamp(22px,3.4vw,56px);
}
*,*::before,*::after{box-sizing:border-box;}
html,body{margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--ivory); color:var(--ink);
  font-family:var(--font-sans); font-size:16px; line-height:1.55;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  font-feature-settings:"ss01","kern";
}
::selection{background:var(--orange); color:var(--shell);}
.skip-link{position:absolute; left:-9999px; top:0; z-index:100; background:var(--ink); color:#fff; padding:10px 16px; border-radius:0 0 8px 0;}
.skip-link:focus{left:0;}

/* ============ NAVIGATION SITE ============ */
.snav{display:flex; align-items:center; justify-content:space-between; gap:20px; padding:18px var(--gutter); background:var(--paper); border-bottom:1px solid var(--line); position:relative; z-index:10;}
.snav.on-dark{background:transparent; border-bottom:0; position:absolute; top:0; left:0; right:0; z-index:10; text-shadow:0 1px 10px rgba(0,0,0,.85), 0 1px 2px rgba(0,0,0,.6);}
.snav .logo{font-family:var(--font-display); font-size:21px; font-weight:500; letter-spacing:-.01em; white-space:nowrap; color:var(--ink); text-decoration:none; display:block;}
.snav .logo b{font-weight:500;}
.snav .logo em{font-style:normal; font-family:var(--font-sans); font-size:11px; font-weight:400; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-muted); display:block; margin-top:1px;}
.snav.on-dark .logo{color:#fff;}
.snav.on-dark .logo em{color:rgba(255,255,255,.6);}
.snav .slinks{display:flex; gap:24px; align-items:center;}
.snav .slinks a{text-decoration:none; font-size:14px; color:var(--ink); position:relative; padding-bottom:3px; white-space:nowrap;}
.snav.on-dark .slinks a{color:rgba(255,255,255,.86);}
.snav .slinks a::after{content:""; position:absolute; left:0; right:0; bottom:0; height:1.5px; background:var(--orange); transform:scaleX(0); transform-origin:left; transition:transform .2s ease;}
.snav .slinks a:hover::after, .snav .slinks a.current::after{transform:scaleX(1);}
.snav .slinks a.current{font-weight:500;}
.snav .nav-cta{white-space:nowrap;}

/* burger mobile */
.nav-toggle{display:none; background:transparent; border:1px solid var(--line-strong); border-radius:8px; width:44px; height:40px; cursor:pointer; position:relative; flex:none;}
.snav.on-dark .nav-toggle{border-color:rgba(255,255,255,.4);}
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{content:""; display:block; position:absolute; left:11px; right:11px; height:2px; background:var(--ink); border-radius:2px; transition:transform .2s ease, opacity .2s ease;}
.snav.on-dark .nav-toggle span, .snav.on-dark .nav-toggle span::before, .snav.on-dark .nav-toggle span::after{background:#fff;}
.nav-toggle span{top:19px;}
.nav-toggle span::before{top:-7px; left:0; right:0;}
.nav-toggle span::after{top:7px; left:0; right:0;}
body.nav-open .nav-toggle span{transform:rotate(45deg);}
body.nav-open .nav-toggle span::before{transform:rotate(-90deg) translateX(-7px); top:0;}
body.nav-open .nav-toggle span::after{opacity:0;}
.mnav{display:none;}
@media(max-width:900px){
  .snav .slinks{display:none;}
  .snav .nav-cta{display:none;}
  .nav-toggle{display:block;}
  body.nav-open .mnav{display:flex; flex-direction:column; position:fixed; inset:0; z-index:60; background:var(--ink-deep); padding:90px var(--gutter) 40px; gap:6px;}
  .mnav a{color:#fff; text-decoration:none; font-family:var(--font-display); font-size:clamp(26px,6vw,34px); padding:10px 0; border-bottom:1px solid rgba(255,255,255,.1);}
  .mnav a.current{color:var(--orange-soft);}
  .mnav .mnav-cta{margin-top:24px; border-bottom:0;}
  body.nav-open{overflow:hidden;}
  body.nav-open .snav{position:fixed; top:0; left:0; right:0; z-index:70; background:transparent; border-bottom:0;}
  body.nav-open .snav .logo{color:#fff;}
  body.nav-open .snav .logo em{color:rgba(255,255,255,.6);}
  body.nav-open .nav-toggle{border-color:rgba(255,255,255,.4);}
  body.nav-open .nav-toggle span, body.nav-open .nav-toggle span::before, body.nav-open .nav-toggle span::after{background:#fff;}
}

/* ============ PRIMITIVES ============ */
.display-xl,.display-l,.display-m{font-family:var(--font-display); font-weight:500; letter-spacing:-.01em; line-height:1.04; color:var(--ink); margin:0;}
.display-xl{font-size:clamp(46px,6.4vw,92px); letter-spacing:-.022em; line-height:.98;}
.display-l{font-size:clamp(36px,4.6vw,62px);}
.display-m{font-size:clamp(28px,3.3vw,42px); line-height:1.08;}
.display-xl em,.display-l em,.display-m em{font-style:italic; color:var(--orange); font-weight:500;}
.on-dark-txt .display-xl,.on-dark-txt .display-l,.on-dark-txt .display-m{color:#fff;}
.caps{font-family:var(--font-sans); font-size:12px; font-weight:500; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-muted);}
.num{font-family:var(--font-mono); font-feature-settings:"tnum"; letter-spacing:-.01em;}

.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:14px 22px; border-radius:999px; border:1px solid var(--ink); background:var(--ink); color:var(--shell); font-family:var(--font-sans); font-size:15px; font-weight:500; cursor:pointer; text-decoration:none; line-height:1; transition:transform .15s ease, background-color .15s ease, border-color .15s ease;}
.btn:hover{transform:translateY(-1px);}
.btn .arrow{transition:transform .2s ease;}
.btn:hover .arrow{transform:translateX(4px);}
.btn--accent{background:var(--orange); border-color:var(--orange); color:#fff;}
.btn--accent:hover{background:var(--orange-deep); border-color:var(--orange-deep);}
.btn--secondary{background:transparent; color:var(--ink); border-color:var(--line-strong);}
.btn--secondary:hover{border-color:var(--ink);}
.btn--ghost-light{background:transparent; color:#fff; border-color:rgba(255,255,255,.4);}
.btn--ghost-light:hover{border-color:#fff; background:rgba(255,255,255,.06);}
.btn--sm{padding:10px 16px; font-size:13px;}
.btn--lg{padding:17px 28px; font-size:16px;}

/* photos */
.ph{position:relative; background:linear-gradient(135deg,#22324a 0%,#0E1B2D 60%,#08111E 100%); overflow:hidden;}
.ph > img.real, .ph > picture.real{position:absolute; inset:0; width:100%; height:100%; z-index:0; display:block;}
.ph > picture.real img{width:100%; height:100%; object-fit:cover; display:block;}
.ph > img.real{object-fit:cover;}
.ph .scrim{position:absolute; inset:0; z-index:1; pointer-events:none;}
.scrim--hero{background:linear-gradient(to bottom, rgba(8,17,30,.82) 0%, rgba(8,17,30,.5) 28%, rgba(8,17,30,.62) 55%, rgba(8,17,30,.92) 100%);}
.on-dark-txt .caps, .on-dark-txt h1, .on-dark-txt .hero-lede{text-shadow:0 2px 16px rgba(0,0,0,.72);}
.f-social{display:flex; gap:16px; margin-top:8px;}
.f-social a{line-height:0; color:rgba(255,255,255,.6); transition:color .15s ease;}
.f-social a:hover{color:var(--orange);}
.f-social svg{width:20px; height:20px; fill:currentColor; display:block;}

/* showreel video plein cadre (façon Théâtre du Centaure) */
.showreel{position:relative; width:100%; aspect-ratio:16/9; background:#000; border-radius:8px; overflow:hidden;}
.showreel video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block;}
.showreel-sound{position:absolute; bottom:14px; right:14px; z-index:2; font-family:var(--font-mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:#fff; background:rgba(8,17,30,.6); border:1px solid rgba(255,255,255,.28); padding:7px 12px; border-radius:6px; cursor:pointer; transition:background .2s ease, border-color .2s ease;}
.showreel-sound:hover{background:var(--orange); border-color:var(--orange);}

/* rangée réseaux sociaux (logos monochromes, survol orange) */
.social-row{display:flex; gap:16px; align-items:center;}
.social-row a{color:var(--ink); line-height:0; display:inline-flex; transition:color .2s ease;}
.social-row a:hover{color:var(--orange);}
.social-row svg{width:24px; height:24px; fill:currentColor;}

/* prose */
.prose{font-size:17px; line-height:1.68; color:var(--ink); max-width:68ch;}
.prose.lead{font-size:19px; line-height:1.62;}
.prose p{margin:0 0 18px;}
.prose p:last-child{margin-bottom:0;}
.prose strong{font-weight:500;}
.prose a.tlink, a.tlink{color:var(--orange-deep); text-decoration:none; border-bottom:1.5px solid var(--orange-wash); padding-bottom:1px; transition:border-color .15s ease;}
.prose a.tlink:hover, a.tlink:hover{border-color:var(--orange);}
.kw-underline{border-bottom:1.5px dotted rgba(216,88,30,.5);}

.lk-list{display:flex; flex-direction:column; gap:0; border-top:1px solid var(--line); margin-top:8px;}
.lk-list a{display:flex; align-items:baseline; justify-content:space-between; gap:18px; padding:16px 2px; border-bottom:1px solid var(--line); text-decoration:none; color:var(--ink); transition:padding .18s ease, color .15s ease;}
.lk-list a:hover{padding-left:10px; color:var(--orange-deep);}
.lk-list a .lk-t{font-family:var(--font-display); font-size:21px; font-weight:500;}
.lk-list a .lk-d{font-size:13.5px; color:var(--ink-muted); max-width:38ch; text-align:right; line-height:1.4;}
@media(max-width:640px){.lk-list a{flex-direction:column; gap:5px;} .lk-list a .lk-d{text-align:left;}}

/* bandeau chiffres */
.stats{display:grid; grid-template-columns:repeat(4,1fr); background:var(--ink); color:var(--shell);}
@media(max-width:760px){.stats{grid-template-columns:repeat(2,1fr);}}
.stats .stat{padding:40px var(--gutter); border-left:1px solid rgba(255,255,255,.08);}
.stats .stat:first-child{border-left:0;}
@media(max-width:760px){.stats .stat:nth-child(odd){border-left:0;} .stats .stat:nth-child(n+3){border-top:1px solid rgba(255,255,255,.08);}}
.stats .num-l{font-family:var(--font-display); font-size:clamp(42px,4.8vw,68px); line-height:1; letter-spacing:-.02em; font-weight:500; margin-bottom:12px;}
.stats .num-l em{font-style:italic; color:var(--orange-soft);}
.stats .stat-label{font-size:13px; color:rgba(255,255,255,.65); line-height:1.4; letter-spacing:.02em;}
.stats--ivory{background:var(--ivory); color:var(--ink); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.stats--ivory .stat{padding:20px var(--gutter); border-left:1px solid var(--line);}
.stats--ivory .num-l{color:var(--ink); font-size:clamp(34px,3.4vw,48px); margin-bottom:6px;}
.stats--ivory .num-l em{color:var(--orange);}
.stats--ivory .stat-label{color:var(--ink-muted); font-size:12px;}
@media(max-width:760px){.stats--ivory .stat{border-left:1px solid var(--line);} .stats--ivory .stat:nth-child(odd){border-left:0;} .stats--ivory .stat:nth-child(n+3){border-top:1px solid var(--line);}}

/* sections */
.sec{padding:clamp(48px,6vw,92px) var(--gutter);}
.sec.tight{padding-top:clamp(34px,4vw,56px); padding-bottom:clamp(34px,4vw,56px);}
.sec-grid{display:grid; gap:clamp(34px,5vw,72px); align-items:center;}
.sec-grid.split{grid-template-columns:1fr 1fr;}
@media(max-width:840px){.sec-grid.split{grid-template-columns:1fr;}}
.eyebrow-row{display:flex; align-items:center; gap:12px; margin-bottom:18px;}
.eyebrow-row .dot{width:6px; height:6px; border-radius:50%; background:var(--orange);}

/* deux portes */
.doors{display:grid; grid-template-columns:1fr 1fr; gap:0;}
@media(max-width:760px){.doors{grid-template-columns:1fr;}}
.door{position:relative; min-height:440px; display:flex; flex-direction:column; justify-content:flex-end; padding:36px var(--gutter); text-decoration:none; overflow:hidden; isolation:isolate;}
.door:first-child{border-right:1px solid rgba(255,255,255,.12);}
.door .door-bg{position:absolute; inset:0; z-index:-1; transition:transform .6s cubic-bezier(.2,.7,.2,1);}
.door:hover .door-bg{transform:scale(1.04);}
.door::before{content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(to top, rgba(8,17,30,.86) 0%, rgba(8,17,30,.4) 45%, rgba(8,17,30,.15) 100%);}
.door > *{position:relative; z-index:2;}
.door .door-k{font-family:var(--font-mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--orange-soft); margin-bottom:14px;}
.door h3{font-family:var(--font-display); font-size:clamp(30px,3.4vw,46px); font-weight:500; line-height:1.02; color:#fff; margin:0 0 10px;}
.door h3 em{font-style:italic; color:var(--orange-soft);}
.door .door-d{font-size:14.5px; line-height:1.55; color:rgba(255,255,255,.82); max-width:40ch; margin:0 0 22px;}
.door .door-cta{display:inline-flex; align-items:center; gap:10px; font-size:15px; font-weight:500; color:#fff;}
.door .door-cta .arrow{transition:transform .2s ease;}
.door:hover .door-cta .arrow{transform:translateX(5px);}

/* mur d'affiches défilant */
.pwall{position:relative; height:660px; overflow:hidden; display:flex; gap:clamp(10px,1.1vw,16px); padding:0 var(--gutter);
  -webkit-mask:linear-gradient(to bottom, transparent 0, #000 7%, #000 92%, transparent 100%);
  mask:linear-gradient(to bottom, transparent 0, #000 7%, #000 92%, transparent 100%);}
.pcol{flex:1 1 0; min-width:0; overflow:hidden;}
.pcol-inner{display:flex; flex-direction:column; gap:clamp(10px,1.1vw,16px); animation:pscrollUp 50s linear infinite; will-change:transform;}
.pcol.down .pcol-inner{animation-name:pscrollDown;}
.pcol:nth-child(1) .pcol-inner{animation-duration:54s;}
.pcol:nth-child(2) .pcol-inner{animation-duration:42s;}
.pcol:nth-child(3) .pcol-inner{animation-duration:60s;}
.pcol:nth-child(4) .pcol-inner{animation-duration:46s;}
.pcol:nth-child(5) .pcol-inner{animation-duration:52s;}
@keyframes pscrollUp{from{transform:translateY(0);} to{transform:translateY(-50%);}}
@keyframes pscrollDown{from{transform:translateY(-50%);} to{transform:translateY(0);}}
.pwall:hover .pcol-inner{animation-play-state:paused;}
@media(prefers-reduced-motion:reduce){.pcol-inner{animation:none;}}
.poster{display:block; text-decoration:none; position:relative;}
.poster picture{display:block; width:100%;}
.poster img{width:100%; height:auto; aspect-ratio:2/3; object-fit:cover; border-radius:4px; display:block; box-shadow:0 2px 10px rgba(8,17,30,.12); transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease;}
.poster:hover img{transform:scale(1.025); box-shadow:0 16px 32px rgba(8,17,30,.28);}
.poster .pcap{position:absolute; left:0; right:0; bottom:0; padding:22px 11px 10px; border-radius:0 0 4px 4px; background:linear-gradient(to top, rgba(8,17,30,.92) 0%, rgba(8,17,30,.55) 55%, transparent 100%); opacity:0; transition:opacity .25s ease; pointer-events:none;}
.poster:hover .pcap{opacity:1;}
.poster .pcap b{display:block; font-family:var(--font-display); font-size:14px; font-weight:500; color:#fff; line-height:1.15;}
.poster .pcap span{display:block; font-family:var(--font-mono); font-size:10px; color:var(--orange-soft); margin-top:3px; letter-spacing:.02em;}
@media(max-width:1000px){.pwall{height:560px;} .pcol:nth-child(5){display:none;}}
@media(max-width:680px){.pcol:nth-child(4){display:none;}}
@media(max-width:480px){.pcol:nth-child(3){display:none;}}

/* grille statique de posters (références événement) */
.wall{display:grid; grid-template-columns:repeat(6,1fr); gap:clamp(14px,1.6vw,22px); padding:0 var(--gutter);}
@media(max-width:1100px){.wall{grid-template-columns:repeat(4,1fr);}}
@media(max-width:680px){.wall{grid-template-columns:repeat(3,1fr);}}
@media(max-width:480px){.wall{grid-template-columns:repeat(2,1fr);}}
.wall .poster .pimg{width:100%; height:auto; aspect-ratio:2/3; border-radius:4px; position:relative; overflow:hidden; display:block; box-shadow:0 2px 10px rgba(8,17,30,.10); transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease; background:linear-gradient(150deg,#1C2B43,#0E1B2D 70%);}
.wall .poster .pimg picture{position:absolute; inset:0; display:block; width:100%; height:100%;}
.wall .poster .pimg img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block;}
.wall .poster:hover .pimg{transform:translateY(-5px); box-shadow:0 16px 32px rgba(8,17,30,.22);}
.wall .poster .pmeta{margin-top:11px; font-family:var(--font-display); font-size:16px; color:var(--ink); line-height:1.15; letter-spacing:-.005em;}
.wall .poster .pyear{font-family:var(--font-mono); font-size:11px; color:var(--ink-muted); margin-top:3px;}

/* FAQ (details natif, sans JS) */
.faq{max-width:840px;}
.faq details{border-top:1px solid var(--line);}
.faq details:last-child{border-bottom:1px solid var(--line);}
.faq summary{list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:22px 2px; font-family:var(--font-display); font-size:clamp(18px,1.5vw,21px); font-weight:500; color:var(--ink); line-height:1.25;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary:hover{color:var(--orange-deep);}
.faq .fq-ic{flex:0 0 auto; width:20px; height:20px; position:relative;}
.faq .fq-ic::before,.faq .fq-ic::after{content:""; position:absolute; background:var(--orange); border-radius:2px;}
.faq .fq-ic::before{top:9px; left:1px; right:1px; height:2px;}
.faq .fq-ic::after{left:9px; top:1px; bottom:1px; width:2px; transition:transform .25s ease;}
.faq details[open] .fq-ic::after{transform:scaleY(0);}
.faq .fq-a{padding:0 2px 24px; max-width:70ch;}
.faq .fq-a p{margin:0 0 10px; font-size:16px; line-height:1.65; color:var(--ink-muted);}
.faq .fq-a p:last-child{margin-bottom:0;}

/* filmographie — grille filtrable */
.filmo-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:clamp(16px,1.8vw,26px);}
@media(max-width:1100px){.filmo-grid{grid-template-columns:repeat(4,1fr);}}
@media(max-width:760px){.filmo-grid{grid-template-columns:repeat(3,1fr);}}
@media(max-width:480px){.filmo-grid{grid-template-columns:repeat(2,1fr);}}
.fcard{display:block; text-decoration:none;}
.fcard .fposter{position:relative; aspect-ratio:2/3; border-radius:5px; overflow:hidden; box-shadow:0 2px 10px rgba(8,17,30,.12); transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease;}
.fcard .fposter img{width:100%; height:100%; object-fit:cover; display:block;}
.fcard:hover .fposter{transform:translateY(-5px); box-shadow:0 16px 32px rgba(8,17,30,.24);}
.fcard .fcat{position:absolute; top:9px; left:9px; z-index:2; font-family:var(--font-mono); font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:#fff; background:rgba(8,17,30,.62); border:1px solid rgba(255,255,255,.2); padding:4px 8px; border-radius:4px;}
.fcard .fmeta{margin-top:11px;}
.fcard .ftitle{font-family:var(--font-display); font-size:16px; font-weight:500; color:var(--ink); line-height:1.18; letter-spacing:-.005em;}
.fcard .fsub{font-family:var(--font-mono); font-size:11px; color:var(--ink-muted); margin-top:4px;}
.fcard .frole{font-size:12px; color:var(--ink-muted); margin-top:5px; line-height:1.45;}
.fcard.is-award .fposter{outline:2.5px solid var(--orange); outline-offset:0;}
.fcard .fmedal{position:absolute; left:9px; right:9px; bottom:9px; z-index:2; display:block; background:var(--orange); color:#fff; font-family:var(--font-mono); font-size:10px; letter-spacing:.04em; font-weight:500; padding:6px 9px; border-radius:5px; line-height:1.15; text-transform:uppercase;}
.filmo-filters{display:flex; gap:8px; flex-wrap:wrap; margin:30px 0 6px;}

/* journal */
.j-feat{display:grid; grid-template-columns:1.15fr 1fr; gap:clamp(24px,3vw,44px); align-items:center; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:var(--paper); text-decoration:none;}
@media(max-width:820px){.j-feat{grid-template-columns:1fr;}}
.j-feat .j-feat-img{position:relative; aspect-ratio:16/11; background:linear-gradient(150deg,#1C2B43,#0E1B2D 70%); display:flex; align-items:flex-end; padding:20px; min-height:100%; overflow:hidden;}
.j-feat .j-feat-img picture{position:absolute; inset:0; display:block; width:100%; height:100%;}
.j-feat .j-feat-img img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.j-feat .j-feat-img .eg-label{font-family:var(--font-display); font-size:clamp(18px,1.8vw,24px); color:rgba(255,255,255,.9); line-height:1.2; position:relative;}
.j-feat .j-feat-body{padding:clamp(22px,2.4vw,38px) clamp(22px,2.6vw,44px) clamp(22px,2.4vw,38px) 0;}
@media(max-width:820px){.j-feat .j-feat-body{padding:0 24px 28px;}}
.j-kicker{font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--orange-deep); display:flex; gap:10px; align-items:center;}
.j-feat h3{font-family:var(--font-display); font-size:clamp(24px,2.6vw,34px); font-weight:500; line-height:1.12; letter-spacing:-.01em; margin:14px 0 12px; color:var(--ink);}
.j-feat p{color:var(--ink-muted); font-size:15px; line-height:1.6; margin:0 0 20px; max-width:50ch;}
.j-read{font-family:var(--font-sans); font-size:13px; font-weight:600; color:var(--orange-deep); text-decoration:none; display:inline-flex; gap:7px; align-items:center;}
.j-read:hover{gap:11px;}
.jgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(18px,2vw,28px);}
@media(max-width:900px){.jgrid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.jgrid{grid-template-columns:1fr;}}
.jcard{display:flex; flex-direction:column; text-decoration:none; border:1px solid var(--line); border-radius:11px; overflow:hidden; background:var(--paper); transition:transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s ease;}
.jcard:hover{transform:translateY(-4px); box-shadow:0 14px 30px rgba(8,17,30,.14);}
.jcard .jc-img{aspect-ratio:16/10; background:linear-gradient(150deg,#233450,#0E1B2D 75%); position:relative; display:flex; align-items:flex-end; padding:15px; overflow:hidden;}
.jcard .jc-img picture{position:absolute; inset:0; display:block; width:100%; height:100%;}
.jcard .jc-img img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.jcard .jc-img .eg-label{font-family:var(--font-display); font-size:16px; color:rgba(255,255,255,.86); line-height:1.2; position:relative;}
.jcard .jc-cat{position:absolute; top:11px; left:11px; font-family:var(--font-mono); font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:#fff; background:rgba(8,17,30,.6); border:1px solid rgba(255,255,255,.2); padding:4px 8px; border-radius:4px; z-index:2;}
.jcard .jc-body{padding:16px 18px 18px; display:flex; flex-direction:column; flex:1;}
.jcard .jc-kw{font-family:var(--font-mono); font-size:10px; letter-spacing:.04em; color:var(--orange-deep); margin-bottom:8px;}
.jcard h4{font-family:var(--font-display); font-size:18px; font-weight:500; line-height:1.18; letter-spacing:-.005em; margin:0 0 8px; color:var(--ink);}
.jcard p{font-size:13px; line-height:1.55; color:var(--ink-muted); margin:0 0 14px;}
.jcard .jc-meta{margin-top:auto; font-family:var(--font-mono); font-size:10.5px; color:var(--stone); display:flex; gap:10px; align-items:center;}

/* gabarit article */
.art-tpl{max-width:720px; margin:0 auto; background:var(--paper); border:1px solid var(--line); border-radius:12px; padding:clamp(26px,3.2vw,52px);}
.at-crumb{font-family:var(--font-mono); font-size:11px; color:var(--stone); margin-bottom:14px;}
.at-crumb a{color:var(--orange-deep); text-decoration:none;}
.at-crumb a:hover{text-decoration:underline;}
.art-tpl .at-cat{font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--orange-deep);}
.art-tpl h1{font-family:var(--font-display); font-size:clamp(28px,3.4vw,42px); font-weight:600; line-height:1.08; letter-spacing:-.015em; margin:14px 0 16px; text-wrap:balance;}
.art-tpl .at-lede{font-size:18px; line-height:1.6; color:var(--ink-soft); margin:0 0 8px;}
.art-tpl .at-byline{font-family:var(--font-mono); font-size:11px; color:var(--stone); padding:16px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin:22px 0 26px; display:flex; gap:14px; flex-wrap:wrap;}
.art-tpl h2{font-family:var(--font-display); font-size:24px; font-weight:500; margin:30px 0 12px; line-height:1.2;}
.art-tpl p{font-size:16px; line-height:1.7; color:var(--ink-muted); margin:0 0 16px;}
.art-tpl ul{font-size:16px; line-height:1.7; color:var(--ink-muted); margin:0 0 16px; padding-left:22px; display:flex; flex-direction:column; gap:8px;}
.art-tpl .at-cta{margin-top:30px; padding:22px 24px; background:var(--ivory); border:1px solid var(--line); border-radius:10px; display:flex; justify-content:space-between; align-items:center; gap:18px; flex-wrap:wrap;}
.art-tpl .at-cta b{font-family:var(--font-display); font-size:19px; font-weight:500;}
.art-tpl .at-cta p{margin:4px 0 0; font-size:13px;}

/* blocs conversion */
.hero-lede{color:rgba(255,255,255,.92); font-size:clamp(16px,1.35vw,19px); line-height:1.5; max-width:48ch; margin:18px 0 0;}
.hero-cta{display:flex; gap:14px; flex-wrap:wrap; margin-top:26px;}
.hero-stats{display:flex; gap:clamp(22px,3vw,40px); flex-wrap:wrap; margin-top:30px; padding-top:24px; border-top:1px solid rgba(255,255,255,.2);}
.hero-stats .hs{display:flex; flex-direction:column; gap:4px;}
.hero-stats .hs b{font-family:var(--font-display); font-size:clamp(21px,1.9vw,27px); font-weight:500; color:#fff; line-height:1;}
.hero-stats .hs span{font-family:var(--font-mono); font-size:10px; letter-spacing:.05em; text-transform:uppercase; color:var(--orange-soft);}
.change-grid{display:grid; grid-template-columns:1.5fr 1fr; gap:clamp(24px,3vw,48px); align-items:start;}
@media(max-width:820px){.change-grid{grid-template-columns:1fr;}}
.change-list{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:15px;}
.change-list li{padding-left:26px; position:relative; font-size:15px; line-height:1.55; color:var(--ink-muted);}
.change-list li b{color:var(--ink); font-weight:600;}
.change-list li::before{content:""; position:absolute; left:0; top:7px; width:11px; height:11px; border-radius:3px; background:var(--orange);}
.change-not{background:var(--ivory); border:1px solid var(--line); border-radius:11px; padding:24px 26px;}
.change-not h4{font-family:var(--font-display); font-size:18px; font-weight:500; margin:0 0 14px;}
.change-not ul{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:12px;}
.change-not li{font-size:13.5px; line-height:1.5; color:var(--ink-muted); padding-left:18px; position:relative;}
.change-not li::before{content:"·"; position:absolute; left:0; color:var(--stone); font-weight:700;}
.testi-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
@media(max-width:900px){.testi-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.testi-grid{grid-template-columns:1fr;}}
.testi{background:var(--paper); border:1px solid var(--line); border-radius:11px; padding:24px 26px; display:flex; flex-direction:column;}
.testi .stars{color:var(--orange); font-size:12px; letter-spacing:2px; margin-bottom:14px;}
.testi blockquote{margin:0 0 16px; font-family:var(--font-display); font-size:16px; font-weight:400; line-height:1.5; color:var(--ink); letter-spacing:-.005em;}
.testi cite{margin-top:auto; font-family:var(--font-mono); font-size:10.5px; letter-spacing:.04em; color:var(--stone); font-style:normal; text-transform:uppercase;}
.stopanimal{background:var(--ink); color:#fff; border-radius:12px; padding:clamp(28px,3vw,44px); display:grid; grid-template-columns:auto 1fr; gap:clamp(20px,2.5vw,40px); align-items:center;}
@media(max-width:680px){.stopanimal{grid-template-columns:1fr;}}
.stopanimal .sa-badge{font-family:var(--font-mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink); background:var(--orange); padding:12px 16px; border-radius:8px; text-align:center; font-weight:600; line-height:1.4;}
.stopanimal .sa-body h3{font-family:var(--font-display); font-size:clamp(20px,2vw,26px); font-weight:500; margin:0 0 10px; color:#fff;}
.stopanimal .sa-body p{margin:0; font-size:15px; line-height:1.6; color:rgba(255,255,255,.74); max-width:62ch;}
.method5{display:grid; grid-template-columns:repeat(5,1fr); gap:0; border:1px solid var(--line); border-radius:8px; overflow:hidden;}
@media(max-width:820px){.method5{grid-template-columns:1fr 1fr;}}
@media(max-width:520px){.method5{grid-template-columns:1fr;}}
.method5 .m5{padding:26px 20px; border-right:1px solid var(--line);}
.method5 .m5:last-child{border-right:none;}
@media(max-width:820px){.method5 .m5{border-bottom:1px solid var(--line);}}
.method5 .m5 .num{font-family:var(--font-mono); font-size:11px; color:var(--orange); margin-bottom:14px;}
.method5 .m5 h4{font-family:var(--font-display); font-size:21px; font-weight:500; margin:0 0 8px;}
.method5 .m5 p{font-size:13px; color:var(--ink-muted); line-height:1.5; margin:0;}
.method5 .m5 .livrable{font-family:var(--font-mono); font-size:10.5px; line-height:1.5; color:var(--orange-deep); margin:12px 0 0; padding-top:10px; border-top:1px dashed rgba(216,88,30,.35);}
.results{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
@media(max-width:760px){.results{grid-template-columns:1fr;}}
.results.cols-2{grid-template-columns:1fr 1fr;}
@media(max-width:760px){.results.cols-2{grid-template-columns:1fr;}}
.results.cols-1{grid-template-columns:1fr;}
.result{border:1px solid var(--line); border-left:3px solid var(--orange); border-radius:10px; padding:22px 24px; background:var(--paper);}
.result .r-film{font-family:var(--font-mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--orange-deep); margin-bottom:12px;}
.result .r-quote{font-family:var(--font-display); font-size:clamp(16px,1.4vw,19px); font-weight:500; line-height:1.32; color:var(--ink); letter-spacing:-.005em;}
.result .r-body{font-family:var(--font-sans); font-size:15px; font-weight:400; line-height:1.55; color:var(--ink-muted);}
.result .r-more{font-size:13.5px; color:var(--ink-muted); line-height:1.55; margin:12px 0 0;}
.cost-note{margin-top:22px; font-family:var(--font-display); font-size:clamp(19px,1.7vw,23px); font-weight:500; color:var(--ink); line-height:1.35; max-width:56ch;}

/* bandeau contact */
.band{position:relative; background:var(--ink-deep); color:#fff; padding:clamp(56px,7vw,100px) var(--gutter); text-align:center; overflow:hidden;}
.band .band-k{color:rgba(255,255,255,.55);}
.band p{max-width:54ch; margin:18px auto 0; color:rgba(255,255,255,.7); font-size:17px; line-height:1.6;}
.band .band-cta{display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:30px;}

/* footer */
.sfoot{background:var(--paper); border-top:1px solid var(--line); padding:40px var(--gutter); display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:34px;}
@media(max-width:760px){.sfoot{grid-template-columns:1fr 1fr;}}
.sfoot .f-brand{font-family:var(--font-display); font-size:22px; font-weight:500;}
.sfoot .f-brand p{font-family:var(--font-sans); font-size:13px; color:var(--ink-muted); max-width:34ch; margin:10px 0 0; line-height:1.5;}
.sfoot .f-col h4{font-family:var(--font-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-muted); margin:0 0 14px; font-weight:500;}
.sfoot .f-col a{display:block; text-decoration:none; color:var(--ink); font-size:14px; padding:5px 0;}
.sfoot .f-col a:hover{color:var(--orange-deep);}
.flegal{grid-column:1 / -1; border-top:1px solid var(--line); margin-top:6px; padding-top:16px; display:flex; gap:20px; flex-wrap:wrap; font-size:12.5px; color:var(--ink-muted);}
.flegal a{color:var(--ink-muted); text-decoration:none;}
.flegal a:hover{color:var(--orange-deep);}
.flegal .cr{margin-left:auto;}
.flegal .cr a{text-decoration:underline; text-underline-offset:3px;}

/* titres de section */
.prose-h{font-family:var(--font-display); font-size:clamp(24px,2.6vw,34px); font-weight:500; letter-spacing:-.01em; line-height:1.12; margin:0 0 18px;}
.prose-h em{font-style:italic; color:var(--orange);}

/* étapes contact */
.steps4{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:16px;}
.steps4 li{display:grid; grid-template-columns:auto 1fr; gap:14px; align-items:start;}
.steps4 .s-n{font-family:var(--font-mono); font-size:12px; width:26px; height:26px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--orange); color:var(--ink); flex-shrink:0;}
.steps4 li p{margin:2px 0 0; font-size:15px; line-height:1.55; color:var(--ink-muted);}

/* pages légales */
.legal{max-width:840px; margin:0 auto; font-size:15px; line-height:1.7; color:var(--ink-muted);}
.legal h2{font-family:var(--font-display); font-size:22px; font-weight:500; color:var(--ink); margin:30px 0 10px;}
.legal a{color:var(--orange-deep);}
.legal table{margin-top:12px; font-size:13.5px; border-collapse:collapse; width:100%;}
.legal th{text-align:left; padding:4px 8px 6px 0; font-weight:600; color:var(--ink); border-bottom:1px solid var(--line);}
.legal td{padding:5px 8px 5px 0; color:var(--ink-muted); border-bottom:1px solid var(--line);}

/* modale vidéo (reel Science & Vie) */
.vmodal{border:0; padding:0; background:transparent; max-width:min(420px,92vw); width:100%;}
.vmodal::backdrop{background:rgba(8,17,30,.82); backdrop-filter:blur(3px);}
.vmodal video{width:100%; display:block; border-radius:12px; background:#000;}
.vmodal .vclose{position:absolute; top:-14px; right:-14px; width:36px; height:36px; border-radius:50%; border:0; background:var(--orange); color:#fff; font-size:17px; cursor:pointer; line-height:1;}

/* responsive : grilles inline des pages */
.g-2-1{display:grid; grid-template-columns:1.55fr 1fr; gap:clamp(34px,5vw,72px); align-items:start;}
@media(max-width:840px){.g-2-1{grid-template-columns:1fr;}}
.g-intro{display:grid; grid-template-columns:1.6fr 1fr; gap:clamp(34px,5vw,72px); align-items:start;}
@media(max-width:840px){.g-intro{grid-template-columns:1fr;}}
.g-contact{display:grid; grid-template-columns:1fr 1.2fr; gap:clamp(40px,5vw,80px); align-items:stretch;}
.g-contact > div{display:flex; flex-direction:column;}
.g-contact .ph.has-img{flex:1 1 auto; min-height:260px; width:100%;}
@media(max-width:900px){.g-contact .ph.has-img{flex:0 0 auto; aspect-ratio:5/4; max-width:340px;}}
@media(max-width:900px){.g-contact{grid-template-columns:1fr;}}
.aside-line{border-left:1px solid var(--line); padding-left:clamp(20px,2.5vw,34px);}
@media(max-width:840px){.aside-line{border-left:0; padding-left:0;}}

/* ============ Tarteaucitron — habillage charte (repris du site actuel, palette refonte) ============ */
#tarteaucitronRoot *{font-family:var(--font-sans) !important;}
#tarteaucitron{background:#08111E !important; color:#F4F3EE !important; border-top:1px solid #1C2B43 !important;}
#tarteaucitronAlertBig{background:#08111E !important; color:#F4F3EE !important; padding:18px 24px !important;}
#tarteaucitronDisclaimerAlert{color:#c8c5be !important; font-size:0.85rem !important; line-height:1.5 !important;}
.tarteaucitronCTAButton, #tarteaucitronAllDenied{background:#D8581E !important; color:#fff !important; border:none !important; border-radius:999px !important; padding:10px 22px !important; font-size:0.85rem !important; font-weight:600 !important; cursor:pointer !important;}
#tarteaucitronPersonalize2, .tarteaucitronCTAButton:last-child{background:transparent !important; border:1px solid #4A586E !important; color:#F4F3EE !important;}
#tarteaucitronCloseAlert{display:none !important;}