/* ==========================================================================
   pages.css : mises en page propres à chaque gabarit
   ========================================================================== */

.cover--g2::after { font-size: 44cqi; }
.masthead__title { font: inherit; letter-spacing: 0; line-height: 1; }
.page-pad { padding-top: 28px; }

/* ==================== ACCUEIL ==================== */
.hero-grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 3.1fr) minmax(0, 2.9fr); margin-top: 34px; }
.hero-grid > * { padding-inline: var(--gutter); border-left: 1px solid var(--rule); }
.hero-grid > :first-child { padding-left: 0; border-left: 0; }
.hero-grid > :last-child { padding-right: 0; }
.hero-side { display: grid; gap: 26px; align-content: start; }
.hero-side .story + .story { border-top: 1px solid var(--rule); padding-top: 24px; }
.fil .text-link { margin-top: 16px; }

.promises { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--ink); border-bottom: 1px solid var(--rule); margin-top: 52px; }
.promises li { display: flex; gap: 12px; align-items: flex-start; padding: 18px var(--gutter) 18px 0; }
.promises li + li { padding-left: var(--gutter); border-left: 1px solid var(--rule); }
.promises svg { width: 22px; height: 22px; flex: none; color: var(--signal); margin-top: 1px; }
.promises strong { display: block; font-size: 14.5px; }
.promises span { display: block; font-size: 13px; color: var(--ink-2); line-height: 1.45; margin-top: 2px; }

.band__deco { position: absolute; right: -3vw; top: -6vw; font-family: var(--serif); font-style: italic; font-weight: 500; font-size: 30vw; line-height: 1; color: rgba(245,242,235,.035); pointer-events: none; letter-spacing: -.05em; }
.band__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2.3fr); gap: clamp(32px, 5vw, 72px); position: relative; }
.band__intro h2 { font-size: clamp(38px, 4.4vw, 62px); line-height: .98; letter-spacing: -.03em; margin-top: 18px; }
.band__intro h2 i { font-weight: 400; }
.band__intro > p:not([class]) { color: var(--night-muted); font-size: 17px; margin-top: 18px; max-width: 40ch; }
.band__cta { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 28px; }
.band__method { margin-top: 36px; }
.band__method li { display: flex; justify-content: space-between; gap: 12px; padding-block: 10px; border-top: 1px solid var(--night-rule); font-size: 14px; color: var(--night-muted); }
.band__method b { color: var(--night-text); font-family: var(--mono); font-weight: 500; }
.rank-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-content: start; }

.guides .guide > a { border-top: 1px solid var(--ink); padding-top: 18px; height: 100%; align-content: start; }
.guide__desc { color: var(--ink-2); font-size: 15px; line-height: 1.5; }

/* ==================== CLASSEMENT ==================== */
.rank-hero { padding-top: 26px; }
.rank-hero__grid { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: clamp(28px, 4vw, 64px); margin-top: 26px; align-items: end; }
.rank-hero h1 { font-size: clamp(38px, 5.2vw, 72px); line-height: 1; letter-spacing: -.03em; margin-top: 16px; font-variation-settings: "opsz" 72; }
.rank-hero h1 i { font-weight: 400; }
.rank-hero .dek { margin-top: 20px; max-width: 62ch; }
.people { display: flex; flex-wrap: wrap; gap: 14px 28px; margin-top: 26px; padding-top: 18px; border-top: 1px solid var(--rule); }
.person { display: flex; align-items: center; gap: 10px; font-size: 14px; line-height: 1.3; }
.person .avatar { --av: 40px; }
.person small { display: block; color: var(--ink-3); font-size: 12.5px; }
.facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 2px solid var(--ink); border-bottom: 1px solid var(--rule); margin-top: 34px; }
.facts li { padding: 16px var(--gutter) 16px 0; }
.facts li + li { padding-left: var(--gutter); border-left: 1px solid var(--rule); }
.facts b { display: block; font-family: var(--sans); font-size: clamp(26px, 2.6vw, 34px); font-weight: 700; letter-spacing: -.03em; line-height: 1.05; }
.facts span { font-size: 13px; color: var(--ink-2); }
.rank-hero__cover { position: relative; }
.rank-hero__cover .cover::after { font-size: 58cqi; bottom: -.12em; }
.seal { position: absolute; left: -26px; bottom: 26px; width: 112px; height: 112px; border-radius: 50%; background: var(--mark); color: var(--ink); display: grid; place-items: center; text-align: center; font-family: var(--mono); font-size: 10px; line-height: 1.3; letter-spacing: .06em; text-transform: uppercase; transform: rotate(-10deg); box-shadow: 0 0 0 6px var(--paper); }
.seal b { display: block; font-family: var(--serif); font-style: italic; text-transform: none; font-size: 30px; letter-spacing: -.02em; line-height: 1; margin-bottom: 2px; }

.layout-aside { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 3.6fr); gap: clamp(32px, 5vw, 80px); margin-top: 44px; align-items: start; }
.aside-sticky { position: sticky; top: 92px; display: grid; gap: 28px; }
.aside-card { border: 1px solid var(--ink); padding: 22px; background: #FBF9F4; }
.aside-card h2, .aside-card h3 { font-size: 21px; }
.aside-card p:not([class]) { font-size: 14.5px; color: var(--ink-2); margin-top: 8px; }
.aside-card .btn { margin-top: 16px; width: 100%; }
.aside-card--dark { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.aside-card--dark p:not([class]) { color: var(--night-muted); }
.aside-card--dark .kicker { color: var(--signal-on-dark); }
.aside-card--dark .kicker::before { background: var(--signal-on-dark); }
.aside-sticky .toc { position: static; }
.aside-list li { border-top: 1px solid var(--rule); }
.aside-list a { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-block: 11px; font-size: 14.5px; font-weight: 600; }
.aside-list a:hover { color: var(--signal-ink); }
.aside-list .meta { font-size: 11px; }

.block { margin-top: 64px; }
.block__title { font-size: clamp(28px, 3vw, 38px); letter-spacing: -.02em; }
.block__intro { color: var(--ink-2); font-size: 17px; margin-top: 10px; max-width: 64ch; }
.block__head { border-top: 3px solid var(--ink); padding-top: 14px; margin-bottom: 26px; }

.podium { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 44px; }
.podium__item { border: 1px solid var(--rule); background: #FBF9F4; padding: 20px; position: relative; display: grid; gap: 6px; align-content: start; transition: border-color .2s, transform .2s; }
.podium__item:hover { border-color: var(--ink); transform: translateY(-3px); }
.podium__item--1 { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.podium__rank { font-family: var(--serif); font-style: italic; font-size: 56px; line-height: .8; color: var(--signal); font-variation-settings: "opsz" 72; }
.podium__item--1 .podium__rank { color: var(--signal-on-dark); }
.podium__name { font-family: var(--serif); font-size: 24px; font-weight: 600; margin-top: 10px; }
.podium__for { font-size: 13.5px; color: var(--ink-2); }
.podium__item--1 .podium__for { color: var(--night-muted); }
.podium__score { position: absolute; top: 18px; right: 18px; font-weight: 800; font-size: 20px; }
.podium__score small { font-size: 12px; font-weight: 500; opacity: .65; }

.filters { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 18px; }
.filters__count { margin-left: auto; font-family: var(--mono); font-size: 12px; color: var(--ink-3); }

.agencies { counter-reset: agency; }
.agency { border-top: 2px solid var(--ink); padding-top: 26px; margin-top: 40px; display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 0 26px; }
.agency__rank { font-family: var(--serif); font-style: italic; font-weight: 500; font-size: 92px; line-height: .78; color: var(--signal); letter-spacing: -.05em; font-variation-settings: "opsz" 72; }
.agency__head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; flex-wrap: wrap; }
.agency__name { font-size: clamp(28px, 3vw, 36px); letter-spacing: -.02em; }
.agency__meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.agency__score { text-align: right; }
.agency__score b { display: block; font-family: var(--sans); font-size: 44px; font-weight: 700; letter-spacing: -.04em; line-height: 1; }
.agency__score b small { font-size: 16px; font-weight: 500; color: var(--ink-3); letter-spacing: 0; }
.agency__score span { font-family: var(--mono); font-size: 11px; color: var(--ink-3); text-transform: uppercase; letter-spacing: .08em; }
.agency__summary { font-family: var(--serif); font-size: 19px; line-height: 1.55; margin-top: 18px; max-width: 68ch; }
.agency__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; margin-top: 22px; }
.proscons h4 { font-family: var(--mono); font-weight: 500; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-2); margin-bottom: 8px; }
.proscons ul + h4 { margin-top: 16px; }
.proscons li { position: relative; padding-left: 22px; font-size: 15px; line-height: 1.5; }
.proscons li + li { margin-top: 6px; }
.proscons .pro li::before { content: "+"; position: absolute; left: 0; font-weight: 800; color: var(--sage); }
.proscons .con li::before { content: "−"; position: absolute; left: 0; font-weight: 800; color: var(--signal-ink); }
.agency__foot { grid-column: 2; display: flex; flex-wrap: wrap; gap: 10px 28px; margin-top: 22px; padding-top: 14px; border-top: 1px solid var(--rule); font-size: 14px; }
.agency__foot dt { font-family: var(--mono); font-size: 11px; color: var(--ink-3); text-transform: uppercase; letter-spacing: .08em; }
.agency__foot dd { font-weight: 600; }
.agency__foot .text-link { margin-left: auto; align-self: center; }
.agency > :not(.agency__rank) { grid-column: 2; }
.agency__rank { grid-row: 1 / span 5; }

.weights li { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) 52px; gap: 18px; align-items: center; padding-block: 14px; border-bottom: 1px solid var(--rule); }
.weights strong { display: block; font-size: 15.5px; }
.weights span { font-size: 13.5px; color: var(--ink-2); }
.weights .score__track { height: 12px; }
.weights .score__val { font-size: 15px; }

.process { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-top: 28px; counter-reset: step; }
.process li { counter-increment: step; border-top: 2px solid var(--ink); padding-top: 12px; font-size: 14px; color: var(--ink-2); line-height: 1.45; }
.process li::before { content: counter(step, decimal-leading-zero); display: block; font-family: var(--mono); font-size: 12px; color: var(--signal-ink); margin-bottom: 6px; }
.process strong { display: block; color: var(--ink); font-size: 15px; margin-bottom: 4px; }

.checklist li { display: grid; grid-template-columns: 30px 1fr; gap: 12px; padding-block: 14px; border-bottom: 1px solid var(--rule); }
.checklist li::before { content: ""; width: 22px; height: 22px; border: 1.5px solid var(--ink); background: linear-gradient(var(--ink), var(--ink)) 50% 55% / 0 0 no-repeat; margin-top: 3px; position: relative; }
.checklist strong { display: block; font-family: var(--serif); font-size: 19px; }
.checklist span { font-size: 15px; color: var(--ink-2); }

.changelog li { display: grid; grid-template-columns: 110px 1fr; gap: 16px; padding-block: 12px; border-bottom: 1px solid var(--rule); font-size: 15px; }
.changelog time { font-family: var(--mono); font-size: 12.5px; color: var(--ink-3); padding-top: 2px; }

/* ==================== ARTICLE ==================== */
.article-head { max-width: 1040px; margin-inline: auto; padding-top: 26px; text-align: left; }
.article-head h1 { font-size: clamp(38px, 5.4vw, 74px); line-height: 1; letter-spacing: -.03em; margin-top: 18px; font-variation-settings: "opsz" 72; }
.article-head h1 i { font-weight: 400; }
.article-head .dek { margin-top: 20px; max-width: 66ch; font-size: clamp(19px, 1.8vw, 23px); }
.article-byline { display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; margin-top: 28px; padding-block: 16px; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--rule); }
.article-byline .people { margin: 0; padding: 0; border: 0; }
.article-cover { margin-top: 36px; }
.article-cover figcaption { margin-top: 10px; }
.article-layout { display: grid; grid-template-columns: minmax(0, 2.6fr) minmax(0, 6.4fr) minmax(0, 3fr); gap: clamp(24px, 3.5vw, 56px); margin-top: 48px; align-items: start; }

.prose { font-family: var(--serif); font-size: 20px; line-height: 1.65; color: var(--ink); max-width: 700px; }
.prose > * + * { margin-top: 1.05em; }
.prose h2 { font-size: clamp(28px, 2.8vw, 36px); line-height: 1.1; letter-spacing: -.02em; margin-top: 2.2em; padding-top: .6em; border-top: 1px solid var(--rule); scroll-margin-top: 90px; }
.prose h3 { font-size: 24px; margin-top: 1.6em; }
.prose a:not(.btn):not(.text-link) { text-decoration: underline; text-decoration-color: var(--signal); text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.prose a:not(.btn):not(.text-link):hover { background: var(--mark); }
.prose ul:not([class]) li { position: relative; padding-left: 24px; }
.prose ul:not([class]) li + li { margin-top: .45em; }
.prose ul:not([class]) li::before { content: ""; position: absolute; left: 3px; top: .7em; width: 7px; height: 7px; background: var(--ink); }
.prose sup a { font-family: var(--mono); font-size: 12px; text-decoration: none !important; color: var(--signal-ink); padding-inline: 1px; }
.prose .dropcap::first-letter { float: left; font-size: 4.6em; line-height: .8; font-weight: 600; padding: .06em .1em 0 0; color: var(--ink); font-variation-settings: "opsz" 72; }
.prose .table-wrap, .prose .table { font-family: var(--sans); }
.prose .table td { font-size: 15px; line-height: 1.45; vertical-align: top; }
.prose .essentiel, .prose .note, .prose .stat-callout, .prose .cite-box { font-family: var(--sans); }
.prose .essentiel__label { font-family: var(--mono); }
.prose .faq { margin-top: 24px; }

.steps { counter-reset: steps; }
.steps > li { counter-increment: steps; display: grid; grid-template-columns: 58px 1fr; gap: 16px; padding-block: 20px; border-top: 1px solid var(--rule); }
.steps > li::before { content: counter(steps); font-family: var(--serif); font-style: italic; font-size: 48px; line-height: .85; color: var(--signal); font-variation-settings: "opsz" 72; }
.steps h3 { font-size: 23px; margin: 0; }
.steps p { font-size: 18px; line-height: 1.6; color: var(--ink-2); margin-top: 6px; }

.sources { font-family: var(--sans); font-size: 14px; line-height: 1.55; color: var(--ink-2); counter-reset: src; border-top: 2px solid var(--ink); padding-top: 14px; }
.sources li { counter-increment: src; display: grid; grid-template-columns: 34px 1fr; padding-block: 7px; }
.sources li::before { content: "[" counter(src) "]"; font-family: var(--mono); font-size: 12px; color: var(--signal-ink); padding-top: 2px; }
.sources li:target { background: var(--mark); }

.article-aside .aside-sticky { top: 92px; }
.mini-rank li { display: grid; grid-template-columns: 22px 1fr auto; gap: 10px; align-items: baseline; padding-block: 9px; border-top: 1px solid var(--rule); font-size: 14.5px; }
.mini-rank .pos { font-family: var(--serif); font-style: italic; font-size: 19px; color: var(--signal-ink); line-height: 1; }
.mini-rank .mini-rank__score { font-family: var(--mono); font-size: 12px; color: var(--ink-3); }
.aside-card .mini-rank { margin-top: 14px; }

.article-foot { max-width: 1040px; margin-inline: auto; margin-top: 64px; display: grid; gap: 22px; }
.related { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gutter); }

/* ==================== RUBRIQUE ==================== */
.rub-hero { padding-top: 26px; }
.rub-hero__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(28px, 5vw, 72px); margin-top: 22px; padding-bottom: 36px; border-bottom: 1px solid var(--ink); align-items: end; }
.rub-hero h1 { font-size: clamp(64px, 11vw, 168px); line-height: .85; letter-spacing: -.045em; font-weight: 600; margin-top: 14px; font-variation-settings: "opsz" 72; }
.rub-hero h1 i { font-weight: 400; color: var(--signal); }
.rub-hero__def { font-family: var(--serif); font-size: 19px; line-height: 1.55; color: var(--ink-2); }
.rub-hero__def strong { color: var(--ink); }
.rub-hero__stats { display: flex; gap: 28px; margin-top: 22px; flex-wrap: wrap; }
.rub-hero__stats b { display: block; font-size: 30px; font-weight: 700; letter-spacing: -.03em; line-height: 1; }
.rub-hero__stats span { font-size: 13px; color: var(--ink-3); }
.rub-hero__actions { display: flex; gap: 10px; margin-top: 24px; flex-wrap: wrap; }
.subnav { display: flex; gap: 8px; overflow-x: auto; padding-block: 16px; scrollbar-width: none; }
.subnav::-webkit-scrollbar { display: none; }

.featured { display: grid; grid-template-columns: minmax(0, 7.4fr) minmax(0, 4.6fr); gap: 0; margin-top: 28px; }
.featured > * + * { padding-left: var(--gutter); margin-left: var(--gutter); border-left: 1px solid var(--rule); }
.featured__side { display: grid; gap: 22px; align-content: start; }
.featured__side .story + .story { border-top: 1px solid var(--rule); padding-top: 22px; }

.start-here { background: var(--paper-2); padding-block: 56px; margin-top: 72px; }
.start-grid { display: grid; grid-template-columns: minmax(0, 1fr) repeat(3, minmax(0, 1fr)); gap: var(--gutter); align-items: stretch; }
.start-grid__intro h2 { font-size: clamp(30px, 3.2vw, 44px); line-height: 1; letter-spacing: -.02em; margin-top: 12px; }
.start-grid__intro p:not([class]) { color: var(--ink-2); margin-top: 12px; font-size: 15.5px; }
.start-card > a { display: flex; flex-direction: column; gap: 10px; height: 100%; background: var(--paper); padding: 22px; border: 1px solid transparent; transition: border-color .2s, transform .2s; }
.start-card > a:hover { border-color: var(--ink); transform: translateY(-3px); }
.start-card__level { font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--signal-ink); }
.start-card h3 { font-size: 23px; line-height: 1.12; }
.start-card p { font-size: 14.5px; color: var(--ink-2); flex: 1; }

.glossary-mini { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.glossary-mini a { font-size: 13px; font-weight: 600; padding: 5px 10px; border: 1px solid var(--rule); background: var(--paper); }
.glossary-mini a:hover { border-color: var(--ink); }

/* ==================== À PROPOS ==================== */
.about-hero { padding-top: 26px; }
.about-hero h1 { font-size: clamp(40px, 6.2vw, 92px); line-height: .98; letter-spacing: -.035em; margin-top: 22px; max-width: 15ch; font-variation-settings: "opsz" 72; }
.about-hero h1 i { font-weight: 400; }
.about-hero__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(28px, 5vw, 72px); align-items: end; }
.about-hero__text { font-family: var(--serif); font-size: 20px; line-height: 1.6; color: var(--ink-2); }
.about-hero__text p + p { margin-top: 14px; }

.charter { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 3px solid var(--ink); }
.charter li { padding: 22px var(--gutter) 10px 0; }
.charter li + li { padding-left: var(--gutter); border-left: 1px solid var(--rule); }
.charter__num { font-family: var(--serif); font-style: italic; font-size: 44px; line-height: .9; color: var(--signal); }
.charter h3 { font-size: 22px; margin-top: 12px; }
.charter p { font-size: 14.5px; color: var(--ink-2); margin-top: 8px; line-height: 1.55; }

.team { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gutter); }
.member { border-top: 1px solid var(--ink); padding-top: 20px; display: grid; grid-template-columns: 64px 1fr; gap: 16px; }
.member .avatar { --av: 64px; }
.member h3 { font-size: 22px; }
.member__role { font-size: 13.5px; font-weight: 700; color: var(--signal-ink); margin-top: 2px; }
.member p:not([class]) { font-size: 14.5px; color: var(--ink-2); margin-top: 8px; line-height: 1.55; }
.member__tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 10px; }
.member__links { display: flex; gap: 14px; margin-top: 12px; font-size: 13px; font-weight: 700; }
.member__links a { border-bottom: 1px solid var(--ink); }

.two-col { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); }
.legal-list { font-size: 15px; }
.legal-list div { display: grid; grid-template-columns: 180px 1fr; gap: 16px; padding-block: 12px; border-bottom: 1px solid var(--rule); }
.legal-list dt { font-family: var(--mono); font-size: 11.5px; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-3); padding-top: 2px; }
.todo { background: var(--mark); padding: 1px 5px; font-family: var(--mono); font-size: 13px; }

/* ==================== RESPONSIVE PAGES ==================== */
@media (max-width: 1180px) {
  .article-layout { grid-template-columns: minmax(0, 2.4fr) minmax(0, 7fr); }
  .article-aside { grid-column: 2; }
  .article-aside .aside-sticky { position: static; grid-template-columns: 1fr 1fr; }
  .rank-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .charter { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 20px; }
  .charter li:nth-child(4) { padding-left: 0; border-left: 0; }
  .process { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 22px; }
  .start-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .start-grid__intro { grid-column: 1 / -1; }
}
@media (max-width: 1024px) {
  .hero-grid { grid-template-columns: minmax(0, 1.9fr) minmax(0, 1fr); }
  .hero-grid > .fil { grid-column: 1 / -1; padding-left: 0; border-left: 0; margin-top: 36px; }
  .hero-grid > .hero-side { padding-right: 0; }
  .band__grid { grid-template-columns: minmax(0, 1fr); }
  .layout-aside { grid-template-columns: minmax(0, 1fr); }
  .aside-sticky { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rank-hero__grid, .rub-hero__grid, .about-hero__grid { grid-template-columns: minmax(0, 1fr); }
  .rank-hero__cover { max-width: 420px; margin-left: 26px; }
  .featured { grid-template-columns: minmax(0, 1fr); }
  .featured > * + * { padding-left: 0; margin-left: 0; border-left: 0; margin-top: 28px; padding-top: 28px; border-top: 1px solid var(--rule); }
  .featured__side { grid-template-columns: 1fr 1fr; gap: var(--gutter); }
  .featured__side .story + .story { border-top: 0; padding-top: 0; }
  .team { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  .hero-grid { grid-template-columns: minmax(0, 1fr); margin-top: 20px; }
  .hero-grid > * { padding-inline: 0; border-left: 0; }
  .hero-side { margin-top: 30px; padding-top: 26px; border-top: 1px solid var(--ink); grid-template-columns: 1fr 1fr; gap: 16px; }
  .hero-side .story + .story { border-top: 0; padding-top: 0; }
  .hero-side .story__title { font-size: 17px; }
  .promises { grid-template-columns: 1fr 1fr; }
  .promises li:nth-child(3) { padding-left: 0; border-left: 0; }
  .promises li:nth-child(n+3) { border-top: 1px solid var(--rule); }
  .rank-grid { grid-template-columns: minmax(0, 1fr); }
  .article-layout { grid-template-columns: minmax(0, 1fr); margin-top: 32px; }
  .article-layout .toc { position: static; border: 1px solid var(--rule); padding: 16px 18px 8px; background: #FBF9F4; }
  .article-aside { grid-column: auto; }
  .article-aside .aside-sticky, .aside-sticky { grid-template-columns: minmax(0, 1fr); }
  .prose { font-size: 18.5px; }
  .related { grid-template-columns: minmax(0, 1fr); }
  .facts { grid-template-columns: 1fr 1fr; }
  .facts li:nth-child(3) { padding-left: 0; border-left: 0; }
  .facts li:nth-child(n+3) { border-top: 1px solid var(--rule); }
  .podium { grid-template-columns: minmax(0, 1fr); }
  .agency { grid-template-columns: 52px minmax(0, 1fr); gap: 0 14px; }
  .agency__rank { font-size: 58px; }
  .agency__grid { grid-template-columns: minmax(0, 1fr); }
  .agency__score { text-align: left; }
  .weights li { grid-template-columns: 1fr 44px; gap: 8px 14px; }
  .weights li > div:first-child { grid-column: 1 / -1; }
  .process { grid-template-columns: 1fr 1fr; }
  .start-grid { grid-template-columns: minmax(0, 1fr); }
  .charter { grid-template-columns: minmax(0, 1fr); }
  .charter li, .charter li + li { padding-left: 0; border-left: 0; border-top: 1px solid var(--rule); }
  .team { grid-template-columns: minmax(0, 1fr); }
  .two-col { grid-template-columns: minmax(0, 1fr); }
  .legal-list div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .changelog li { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .seal { width: 92px; height: 92px; left: -18px; font-size: 9px; }
  .seal b { font-size: 24px; }
  .featured__side { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 520px) {
  .hero-side { grid-template-columns: minmax(0, 1fr); }
  .promises { grid-template-columns: minmax(0, 1fr); }
  .promises li, .promises li + li { padding-left: 0; border-left: 0; }
  .promises li + li { border-top: 1px solid var(--rule); }
  .process { grid-template-columns: minmax(0, 1fr); }
}

/* ==================== ACCUEIL : présentation du média ==================== */
.intro { padding-block: 48px 8px; }
.intro__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(28px, 5vw, 80px); align-items: end; }
.intro__title { max-width: 16ch; margin-top: 18px; font-size: clamp(40px, 5.4vw, 80px); line-height: .98; letter-spacing: -.032em; font-variation-settings: "opsz" 72; }
.intro__title i { font-weight: 400; }
.intro__text p:not([class]) { font-family: var(--serif); font-size: 19px; line-height: 1.6; color: var(--ink-2); }
.intro__text p:not([class]) + p:not([class]) { margin-top: 14px; }
.intro__text .meta { margin-top: 20px; }
.intro__text .btn { margin-top: 22px; }

/* Rubrique : point vermillon après le titre, comme le logotype */
.rub-hero h1::after { content: ""; display: inline-block; width: .13em; height: .13em; margin-left: .04em; background: var(--signal); }

@media (max-width: 1024px) { .intro__grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 860px) { .intro { padding-top: 32px; } }

/* Rubrique : titre sur une ligne, taille adaptée aux noms longs (E-commerce, Marketing…) */
.rub-hero h1 { font-size: clamp(52px, 8vw, 128px); white-space: nowrap; }

/* Article : listes numérotées simples, lien sous le nom de l'auteur */
.prose ol:not([class]) { counter-reset: item; }
.prose ol:not([class]) > li { position: relative; padding-left: 34px; counter-increment: item; }
.prose ol:not([class]) > li + li { margin-top: .7em; }
.prose ol:not([class]) > li::before { content: counter(item) "."; position: absolute; left: 0; top: 0; font-style: italic; font-weight: 600; color: var(--signal-ink); }
.person small a { text-decoration: underline; text-underline-offset: 3px; }
.person small a:hover { color: var(--ink); }

/* Classement intégré à un article (fiches .agency dans .prose) */
.prose .agencies { font-family: var(--sans); margin-top: 8px; }
.prose .agency { margin-top: 44px; }
.prose .agency__name { font-size: clamp(24px, 2.4vw, 30px); margin-top: 0; font-family: var(--serif); }
.prose .agency__summary { font-size: 18px; }
.agency__verdict { grid-column: 2; margin-top: 16px; padding: 12px 16px; background: var(--paper-2); border-left: 3px solid var(--signal); font-size: 15px; line-height: 1.5; }
.agency__verdict strong { display: block; margin-bottom: 4px; font-family: var(--mono); font-weight: 500; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--signal-ink); }