/* EKOKI — pages internes : complément v3.6
   Chargé après style.css (composants des pages internes) et ekoki.css (charte v3.5).
   Harmonise les anciens composants avec le design de la page d'accueil. */

/* Typographie : Bricolage largeur normale, échelle v3 */
h1,h2,h3,h4,.display,.h-giant,.h-xl,.h-l,.h-m,.h-s,.chapter-num,.quote,.stat__n,.card h3,.phero h1,.cta h2,.districts .name,.mot__word,.menu__list a,.marquee__item{font-stretch:100%!important}
h1,h2,h3,h4,.display{font-weight:700;letter-spacing:-.028em;line-height:1.02}
.h-giant{font-size:clamp(3.6rem,14vw,13rem);line-height:.86}
.h-xl{font-size:var(--fs-hero);line-height:.95}
.h-l{font-size:var(--fs-h2);line-height:1}
.h-m{font-size:var(--fs-h2s);line-height:1.04}
.h-s{font-size:var(--fs-h3);line-height:1.15;letter-spacing:-.015em}
.quote{font-weight:700;font-size:clamp(1.5rem,1rem + 1.8vw,2.6rem);line-height:1.15}
.card h3{font-size:clamp(1.25rem,1.05rem + .6vw,1.6rem);line-height:1.12}
.stat__n{font-weight:700;letter-spacing:-.03em}
.eyebrow{letter-spacing:.16em;font-size:.6875rem}

/* En-tête de page (phero) : même traitement que le héros d'accueil */
.phero{min-height:clamp(520px,78svh,820px);padding-bottom:clamp(40px,6vw,72px)}
.phero h1{font-size:var(--fs-hero);line-height:.95;letter-spacing:-.04em;font-weight:700}
.phero .lead{font-size:var(--fs-lead);color:rgba(253,240,228,.9)}
.phero__bg img{filter:grayscale(.75) contrast(1.06) brightness(.85)}
.phero__bg::after{background:
  linear-gradient(90deg,rgba(30,14,10,.88) 0%,rgba(30,14,10,.68) 40%,rgba(30,14,10,.28) 75%,rgba(30,14,10,.2) 100%),
  linear-gradient(180deg,rgba(30,14,10,.55) 0%,rgba(30,14,10,0) 30%,rgba(30,14,10,.2) 70%,var(--ink) 100%)}
.phero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;backdrop-filter:blur(7px) saturate(.9);-webkit-backdrop-filter:blur(7px) saturate(.9);-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 36%,transparent 70%);mask-image:linear-gradient(90deg,#000 0%,#000 36%,transparent 70%)}
.phero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:url("../img/grain.webp") repeat;background-size:160px;mix-blend-mode:overlay;opacity:.14}
.crumbs{font-size:.6875rem;letter-spacing:.16em}
.crumbs a{opacity:.75}

/* Sections : fonds et couleurs v3 */
.section--sand{--bg:var(--cream-2);--fg:var(--ink);--fg-2:rgba(30,14,10,.8);--fg-3:rgba(30,14,10,.58);--surface:#FFFFFF;--surface-2:#FFFFFF;--line:rgba(30,14,10,.1);--line-2:rgba(30,14,10,.2);background:var(--cream-2);color:var(--ink)}
.section--sand .accent{color:var(--orange-deep)}
.section--light .lead,.section--sand .lead{color:var(--fg-2)}
.chapter-head{gap:clamp(14px,2.4vw,36px);margin-bottom:clamp(40px,5vw,72px)}
.chapter-num{font-weight:700;font-size:clamp(2.6rem,1.6rem + 3.4vw,5rem);-webkit-text-stroke:1.2px var(--orange);opacity:.85}

/* Cartes : surfaces pleines (plus de verre) avec contraste v3.2 */
.glass{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);backdrop-filter:none;-webkit-backdrop-filter:none}
.glass::after{background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(239,119,23,.12),transparent 45%)}
.section--light .glass,.section--sand .glass{background:#fff;border-color:rgba(30,14,10,.08);box-shadow:0 1px 2px rgba(30,14,10,.04),0 18px 40px -28px rgba(122,57,17,.35)}
.card--orange,.section--light .glass.card--orange,.section--sand .glass.card--orange{background:var(--orange);color:var(--ink);border-color:transparent}
.card--ink{background:#30190F}
.media,.photo-row img{border-radius:var(--r-card)}
.tag{backdrop-filter:none;-webkit-backdrop-filter:none}

/* Bloc "statement" et CTA final */
.statement h2,.statement .h-giant{font-weight:700}
.cta h2{font-size:clamp(2.6rem,1.2rem + 6vw,7rem);line-height:.95;font-weight:700}

/* Formulaires (contact, je refuse) : panneau clair contrasté comme sur l'accueil */
.page-inner .refus-box,.page-inner .glass.form-box,.page-inner form.form.glass{background:var(--paper);color:var(--ink);border:0;box-shadow:0 0 0 1px rgba(239,119,23,.35),0 40px 90px -30px rgba(0,0,0,.6)}
.page-inner .refus-box{--fg:var(--ink);--fg-2:rgba(30,14,10,.78);--fg-3:rgba(30,14,10,.55);--surface:#fff;--line:rgba(30,14,10,.12);--line-2:rgba(30,14,10,.24)}
.page-inner .refus-box .field input,.page-inner .refus-box .field select{background-color:#fff;border-color:rgba(30,14,10,.16);color:var(--ink)}
.page-inner .refus-box .choice span{background:#fff;border-color:rgba(30,14,10,.12);color:var(--ink)}
.page-inner .refus-box .choice input:checked+span{background:var(--ink);border-color:var(--ink);color:var(--cream)}
.page-inner .refus-box .choice input:checked+span::before{border-color:var(--orange);background:var(--orange);box-shadow:inset 0 0 0 4px var(--ink)}
.page-inner .refus-box .check,.page-inner .refus-box .form-note{color:rgba(30,14,10,.75)}

/* Page 404 */
.err404 h1{font-weight:700}
.page-inner .choice,.page-inner .choice span,.page-inner .check{text-transform:none;letter-spacing:0;font-size:.875rem}
.page-inner .field label .muted,.page-inner .field legend .muted{text-transform:none;letter-spacing:0}