/* dedoublonnage v2 */

/* ===== Modernisation « standards IOC » — gravitas typo, air, sobriété (navy conservé) ===== */
:root{--sy:clamp(46px,5vw,74px);--rl:22px}
/* Hero éditorial : titre plus grand, plus serré, affirmé */
.hero h1{font-size:var(--ts-0,clamp(3rem,7.4vw,5.6rem))!important;letter-spacing:-.04em!important;line-height:1.0!important;font-weight:700}
.svc-head p{font-size:var(--ts-9,1.05rem);line-height:1.72}
.kick{letter-spacing:.2em;font-weight:600}.divc,.card-m,.site,.esg-card,.hstat,.app-card{border-color:var(--hair)!important}.divc:hover,.site:hover,.card-m:hover{transform:translateY(-4px)!important;transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s,border-color .4s}
/* Boutons : sobres, assurés */
.btn{font-weight:600;letter-spacing:.005em}
.btn-p,.btn-g,.fl-cta{border-radius:12px}
/* Calmer les décors (sobriété) */
.field{opacity:.6}
/* Lisibilité corps */
body{font-size:16.5px}
@media (prefers-reduced-motion:reduce){.divc:hover,.site:hover,.card-m:hover{transform:none!important}}


/* Modernisation CSS 2026 — progressive, repli automatique */
:where(p,li,figcaption,dd,blockquote){text-wrap:pretty}
html{text-rendering:optimizeLegibility}
/* Barre de progression de lecture — 100% CSS (scroll-driven), zéro JS */
.rdprog{position:fixed;inset:0 0 auto 0;height:3px;z-index:9999;transform-origin:0 50%;transform:scaleX(0);
  background:linear-gradient(90deg,var(--gold-l),var(--blue-l) 55%,var(--gold-l));box-shadow:0 0 10px rgba(217,168,79,.35);pointer-events:none}
@supports (animation-timeline:scroll()){
  .rdprog{animation:rdgrow linear both;animation-timeline:scroll(root);animation-range:0 100%}
  @keyframes rdgrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
}
@supports not (animation-timeline:scroll()){.rdprog{display:none}}
@media(prefers-reduced-motion:reduce){.rdprog{display:none}}


/* Hero accueil — optimisation espace + lisibilité premium multi-écrans (sans débordement) */
.hero{contain:layout paint}
.hx-sub{margin:16px 0 20px}
.hx-strip{margin-top:20px}
/* Tablette & mobile : scrim vertical pour garantir un H1 et un texte toujours nets sur le montage */
@media(max-width:900px){
  .hero{padding:86px 0 30px}
  .hero-photo{background:linear-gradient(180deg,rgba(6,11,20,.84),rgba(6,11,20,.60) 46%,rgba(6,11,20,.90))!important;opacity:1!important}
  .hx-grid{gap:20px!important}
  .hx-sub{margin:13px 0 18px;max-width:60ch}
}
@media(max-width:560px){
  .hero{padding:78px 0 26px}
  .hx-sub{font-size:.92rem;line-height:1.55;margin:11px 0 16px}
  .hx-strip{margin-top:16px;padding-top:14px;gap:8px}
  .hx-stat{padding:10px 12px 10px 15px}
}
/* Cotations : éviter tout débordement visuel en petit écran */
@media(max-width:560px){[class*=cotation]{max-width:100%;overflow:hidden}}

.apps-creed{font-family:var(--fd);font-size:clamp(1.05rem,2vw,1.32rem);line-height:1.4;color:#fff;font-weight:600;letter-spacing:-.01em;margin:6px 0 14px;max-width:60ch;background:linear-gradient(100deg,var(--inter-l),var(--gold-l));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.pt-track{display:inline-flex;gap:26px;white-space:nowrap;will-change:transform;animation:ptMarquee 42s linear infinite}#oilticker:hover .pt-track{animation-play-state:paused}.pt-chip{display:inline-flex;align-items:center;gap:7px;color:var(--cream)}.pt-dot{width:6px;height:6px;border-radius:50%;flex:none;box-shadow:0 0 6px -1px currentColor}.pt-tag{color:var(--muted);font-size:0.6875rem;letter-spacing:.04em;text-transform:uppercase}@keyframes ptMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}@media(prefers-reduced-motion:reduce){.pt-track{animation:none}}
@media(max-width:360px){.nav-cta .nav-search{display:none!important}.nav-cta{gap:8px!important}.brand small{display:none!important}.wrap{padding-left:14px!important;padding-right:14px!important}img,svg,table{max-width:100%}}.hpcard,.sc-card{transition:transform .42s var(--ease-ultra,cubic-bezier(.22,.61,.36,1)),box-shadow .42s var(--ease-ultra,cubic-bezier(.22,.61,.36,1)),border-color .3s,background .3s!important}.hpcard:hover,.sc-card:hover{transform:translateY(-7px)}.hpcard:hover{box-shadow:0 28px 56px -30px rgba(2,6,14,.85),0 0 0 1px color-mix(in srgb,var(--pac,#F0CE82) 26%,transparent)}.sc-card:hover{box-shadow:0 26px 52px -30px rgba(2,6,14,.82),0 0 0 1px color-mix(in srgb,#F0CE82 20%,transparent)}@media(prefers-reduced-motion:reduce){.hpcard,.sc-card{transition:none!important}.hpcard:hover,.sc-card:hover{transform:none!important}}
.btn-shop{display:inline-flex;align-items:center;gap:8px;background:rgba(232,195,106,.10);border:1px solid rgba(232,195,106,.42);color:var(--gold-l,#F0CE82);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.btn-shop:hover{background:rgba(232,195,106,.18);border-color:var(--gold-l,#F0CE82);transform:translateY(-1px)}.btn-shop svg{flex:none}@media (prefers-reduced-transparency:reduce){.btn-shop{background:#221a09!important}}
@media (prefers-reduced-transparency:reduce){*{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}.ppj-card,.biz-card,.ppt-card,.pmore-card,.oeco-card,.hxi-card,.sb-card,.hpcard,.fx2-f{background:#0D1626!important}}

/* iOS safe-area : la jauge de lecture reste visible sous l'encoche. */
@supports(top:env(safe-area-inset-top)){.rdprog:not(#_){top:env(safe-area-inset-top)}}
