/* ============================================================================ Platicadero v2 — base.css : @font-face Inter (self-host), reset, éléments ============================================================================ */ @font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap; /* woff2 uniquement : tous les navigateurs qui savent lire une police variable savent lire le woff2 — le .ttf (856 Ko) n'a pas besoin d'être déployé. */ src: url("../fonts/Inter-Variable.woff2") format("woff2-variations"); } *, *::before, *::after { box-sizing: border-box; } * { margin: 0; } html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; /* décale les sauts d'ancre sous l'îlot de nav fixe */ scroll-padding-top: clamp(5rem, 4rem + 2vw, 7rem); } @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } } body { font-family: var(--font); font-weight: var(--fw-med); font-size: var(--fs-body); line-height: var(--lh-body); letter-spacing: var(--track-body); color: var(--ink); background-color: var(--page); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: clip; } img { display: block; max-width: 100%; height: auto; } button { font: inherit; color: inherit; } a { color: inherit; text-decoration: none; } input, textarea, select, button { font: inherit; letter-spacing: inherit; } button, a, label, summary { touch-action: manipulation; } ul[class], ol[class] { list-style: none; padding: 0; } h1, h2, h3, h4 { font-weight: var(--fw-med); /* signature MindMarket : display en 500 */ letter-spacing: var(--track-head); line-height: var(--lh-tight); text-wrap: balance; } p { text-wrap: pretty; } /* Anneau double : le halo warm-white isole l'anneau bleu de n'importe quel fond (vert du héro, charbon des sections) → toujours ≥ 3:1 (WCAG 1.4.11). */ :focus-visible { outline: 3px solid var(--mm-blue-deep); outline-offset: 3px; box-shadow: 0 0 0 3px var(--mm-warm-white); border-radius: 4px; } [tabindex="-1"]:focus { outline: none; } ::selection { background: var(--mm-charcoal); color: var(--mm-green); } /* Le marqueur .js (posé inline dans ) permet de masquer les états d'entrée UNIQUEMENT si JS est actif — sans JS, tout reste visible. */