/* =====================================================================
   RESTART · système graphique v2 · 23/09/2026
   Polices auto-hébergées (le site interdit les ressources externes).
   Chemins relatifs : ce fichier vit dans /css, les polices dans /polices.
   ===================================================================== */

@font-face{font-family:"Archivo";src:url("../polices/Archivo-Variable.woff2") format("woff2");font-weight:100 900;font-stretch:62% 125%;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("../polices/IBMPlexMono-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("../polices/IBMPlexMono-Medium.woff2") format("woff2");font-weight:500;font-display:swap}
/* Le / de marque : uniquement sur ⁄ (U+2044) et ∕ (U+2215). Le « / » ordinaire n'est jamais touché. */
@font-face{font-family:"Restart Slash";src:url("../police-slash/RestartSlash-Regular.woff2") format("woff2");unicode-range:U+2044,U+2215;font-display:block}

/* ---------- jetons ---------- */
:root{
  --r-red:#ff2f0e;
  --r-black:#000000;
  --r-ink-on-white:#0a0a0a;
  --r-white:#ffffff;
  --r-slant:11deg;

  --r-sans:"Restart Slash","Archivo","Helvetica Neue",Arial,sans-serif;
  --r-mono:"Restart Slash","IBM Plex Mono",ui-monospace,Menlo,monospace;

  /* espacements, base 4 */
  --r-s1:4px;--r-s2:8px;--r-s3:16px;--r-s4:24px;--r-s5:40px;--r-s6:64px;--r-s7:120px;

  /* thème blanc par défaut */
  --ink:#0a0a0a;--ink2:#4d4d4d;--ink3:#8a8a8a;--rule:#e2e2e2;--paper:#ffffff;--field:#ffffff;--hover:rgba(0,0,0,.05);
}
.r-noir{--ink:#f5f5f3;--ink2:#b5b5b2;--ink3:#7c7c7a;--rule:#262626;--paper:#000000;--field:#0b0b0b;--hover:rgba(255,255,255,.07);background:var(--paper);color:var(--ink)}
.r-blanc{--ink:#0a0a0a;--ink2:#4d4d4d;--ink3:#8a8a8a;--rule:#e2e2e2;--paper:#ffffff;--field:#ffffff;--hover:rgba(0,0,0,.05);background:var(--paper);color:var(--ink)}

/* ---------- le / de marque (élément) ---------- */
.r-sl{display:inline-block;width:.1em;height:.74em;background:var(--r-red);transform:skewX(calc(-1 * var(--r-slant)));vertical-align:baseline;flex:none}

/* ---------- typographie ---------- */
.r-display{font-family:var(--r-sans);font-weight:690;font-stretch:93%;font-size:clamp(3rem,7.5vw,6rem);line-height:.92;letter-spacing:-.01em;text-transform:uppercase;display:inline-block;transform:skewX(calc(-1 * var(--r-slant)))}
.r-h1{font-family:var(--r-sans);font-weight:690;font-stretch:93%;font-size:clamp(2.2rem,4.4vw,3.5rem);line-height:1.02;letter-spacing:-.02em;text-wrap:balance}
.r-h2{font-family:var(--r-sans);font-weight:650;font-stretch:93%;font-size:clamp(1.7rem,3vw,2.5rem);line-height:1.08;letter-spacing:-.015em;text-wrap:balance}
.r-h3{font-family:var(--r-sans);font-weight:620;font-stretch:96%;font-size:1.6rem;line-height:1.15;letter-spacing:-.01em}
.r-h4{font-family:var(--r-sans);font-weight:620;font-size:1.2rem;line-height:1.25}
.r-lead{font-family:var(--r-sans);font-weight:420;font-size:1.42rem;line-height:1.45;max-width:34em}
.r-body{font-family:var(--r-sans);font-weight:400;font-size:1.125rem;line-height:1.6;max-width:38em}
.r-body strong{font-weight:640}
.r-small{font-family:var(--r-sans);font-size:.94rem;line-height:1.5;color:var(--ink2)}
.r-caption{font-family:var(--r-mono);font-size:.8rem;line-height:1.45;color:var(--ink3)}
.r-eyebrow{font-family:var(--r-mono);font-weight:500;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink2);display:flex;align-items:center;gap:.7em}
.r-eyebrow::before{content:"";width:.1em;height:1.05em;background:var(--r-red);transform:skewX(calc(-1 * var(--r-slant)));flex:none}

/* liens */
.r-link{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em;text-decoration-color:var(--ink3)}
.r-link:hover{text-decoration-color:var(--r-red);text-decoration-thickness:2px}
.r-go{font-family:var(--r-sans);font-weight:620;color:var(--ink);text-decoration:none;display:inline-flex;align-items:baseline;gap:.42em}
.r-go::before{content:"";width:.1em;height:.74em;background:var(--r-red);transform:skewX(calc(-1 * var(--r-slant)));transition:transform .35s}
.r-go:hover::before{transform:skewX(calc(-1 * var(--r-slant))) translateX(.2em)}
.r-go span{border-bottom:1px solid var(--ink3);padding-bottom:1px}

/* citation, listes, références, chiffres */
.r-quote{display:grid;grid-template-columns:auto 1fr;gap:.2em .5em;margin:0;max-width:30em}
.r-quote::before{content:"";grid-row:1 / span 2;width:.14em;height:1.1em;background:var(--r-red);transform:skewX(calc(-1 * var(--r-slant)));margin-top:.18em}
.r-quote p{margin:0;font-family:var(--r-sans);font-weight:520;font-stretch:96%;font-size:clamp(1.5rem,2.6vw,2.1rem);line-height:1.22;letter-spacing:-.012em}
.r-quote footer{font-family:var(--r-mono);font-size:.82rem;color:var(--ink2)}
.r-list{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-family:var(--r-sans);font-size:1.125rem;line-height:1.5}
.r-list li{display:grid;grid-template-columns:1.1em 1fr;align-items:baseline}
.r-list li::before{content:"";width:.1em;height:.66em;background:var(--r-red);transform:skewX(calc(-1 * var(--r-slant)))}
.r-olist{counter-reset:o;list-style:none;margin:0;padding:0;display:grid;gap:12px;font-family:var(--r-sans);font-size:1.125rem;line-height:1.5}
.r-olist li{display:grid;grid-template-columns:2.4em 1fr;align-items:baseline}
.r-olist li::before{counter-increment:o;content:counter(o,decimal-leading-zero);font-family:var(--r-mono);font-size:.82rem;color:var(--ink2)}
.r-ref{font-family:var(--r-mono);font-size:.72em;vertical-align:super;line-height:0;color:var(--ink2);text-decoration:none}
.r-refs{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-family:var(--r-mono);font-size:.84rem;line-height:1.5;color:var(--ink2)}
.r-kpi b{display:block;font-family:var(--r-sans);font-weight:690;font-stretch:93%;font-size:clamp(2.6rem,5vw,3.8rem);line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.r-kpi span{display:block;margin-top:8px;font-family:var(--r-mono);font-size:.8rem;color:var(--ink2)}

/* ---------- boutons ---------- */
.r-btn{--h:52px;position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;height:var(--h);padding:0 26px;font-family:var(--r-sans);font-weight:620;font-stretch:96%;font-size:1.06rem;line-height:1;border:1.5px solid var(--ink);border-radius:0;cursor:pointer;text-decoration:none;white-space:nowrap;transition:background-color .15s,transform .08s}
.r-btn > span{position:relative;z-index:1}
.r-btn--lg{--h:60px;padding:0 32px;font-size:1.16rem}
.r-btn--sm{--h:44px;padding:0 18px;font-size:.98rem}
.r-btn:focus-visible{outline:2px solid var(--r-red);outline-offset:3px}
.r-btn:active{transform:translateY(1px)}
.r-btn--p{background:var(--ink);color:var(--paper)}
.r-btn--p::after{content:"";position:absolute;top:-20%;bottom:-20%;left:-24px;width:7px;background:var(--r-red);transform:skewX(calc(-1 * var(--r-slant)));transition:left .85s cubic-bezier(.65,0,.3,1);pointer-events:none}
.r-btn--p:hover::after{left:calc(100% + 16px)}
.r-btn--p[aria-busy="true"]::after{animation:r-run 1.15s cubic-bezier(.65,0,.3,1) infinite}
@keyframes r-run{from{left:-24px}to{left:calc(100% + 16px)}}
.r-btn--s{background:transparent;color:var(--ink)}
.r-btn--s:hover{background:var(--hover)}
.r-btn[disabled]{opacity:.45;cursor:not-allowed}
.r-btn--p[disabled]::after{display:none}

/* ---------- champs ---------- */
.r-field{display:grid;gap:8px}
.r-field > label{font-family:var(--r-sans);font-weight:560;font-size:1rem;display:flex;gap:10px;align-items:baseline}
.r-optional{font-family:var(--r-mono);font-size:.74rem;color:var(--ink3);letter-spacing:.04em}
.r-help{font-family:var(--r-mono);font-size:.8rem;line-height:1.45;color:var(--ink2)}
.r-input{width:100%;height:52px;padding:0 16px;background:var(--field);color:var(--ink);border:1.5px solid var(--ink3);border-radius:0;font:400 1.06rem var(--r-sans);outline:none;-webkit-appearance:none;appearance:none}
textarea.r-input{height:auto;min-height:130px;padding:14px 16px;line-height:1.5;resize:vertical}
.r-input::placeholder{color:var(--ink3)}
.r-input:hover{border-color:var(--ink)}
.r-input:focus{border-color:var(--ink);box-shadow:0 0 0 2px var(--paper),0 0 0 4px var(--r-red)}
.r-input[disabled]{opacity:.45;border-style:dashed;cursor:not-allowed}
.r-field[data-error] .r-input,.r-input[aria-invalid="true"]{border-color:var(--ink);border-width:2.5px}
.r-error{display:flex;align-items:baseline;gap:.55em;font-family:var(--r-sans);font-weight:560;font-size:.96rem;color:var(--ink)}
.r-error::before{content:"";width:.1em;height:.74em;background:var(--r-red);transform:skewX(calc(-1 * var(--r-slant)));flex:none}

/* ---------- logo (fichiers SVG du kit) ---------- */
.r-logo{display:block;height:28px;width:auto}
.r-logo--l{height:48px}

/* ---------- mouvement ---------- */
@media (prefers-reduced-motion:reduce){.r-btn--p::after{transition:none}.r-btn--p[aria-busy="true"]::after{animation:none}.r-go::before{transition:none}}
