/* Vecteur — socle de la marque, partagé par le site, les posts et les publicités.
   Direction « la copie double » : papier Seyès, encre outremer, marge rouge, vecteur tracé à la règle. */

@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url(fonts/archivo-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url(fonts/archivo-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Archivo";
  font-style: italic;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url(fonts/archivo-italic-latin.woff2) format("woff2");
}
@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 100 800;
  font-display: swap;
  src: url(fonts/jbmono.woff2) format("woff2");
}

:root {
  --papier: #F4F2EC;
  --papier-2: #EAE7DE;
  --encre: #0E0E14;
  --encre-2: #3B3B46;
  --gris: #6A6974;
  --bleu: #2A2BE6;          /* encre outremer : la couleur de la marque */
  --bleu-fonce: #1A1AA8;
  --bleu-voile: #E3E3FA;
  --rouge: #F0462A;         /* la marge du cahier : réservée aux accents */
  --seyes-fin: rgba(84, 92, 205, .12);
  --seyes-fort: rgba(84, 92, 205, .27);
  --marge: rgba(240, 70, 42, .55);
  --filet: #D6D2C6;
  /* Le studio (site et films) : fond de prise de vue, surfaces blanches, lavande des cartes cloud */
  --fond: #ECEDF5;
  --fond-2: #E2E3F0;
  --surface: #FFFFFF;
  --lavande: #D9DAF8;
  --trait: #D7D8E6;
  --ombre: 0 1px 0 rgba(14, 14, 20, .04), 0 22px 44px -26px rgba(14, 14, 20, .28);
  --ombre-forte: 0 2px 0 rgba(14, 14, 20, .05), 0 34px 64px -30px rgba(14, 14, 20, .38);
  --large: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --code: "JetBrains Mono", ui-monospace, Menlo, monospace;
}

/* Papier Seyès : grands carreaux de 4 interlignes, l'unité suit --carreau */
.seyes {
  --carreau: 32px;
  background-color: var(--papier);
  background-image:
    linear-gradient(var(--seyes-fort) 1px, transparent 1px),
    linear-gradient(90deg, var(--seyes-fort) 1px, transparent 1px),
    linear-gradient(var(--seyes-fin) 1px, transparent 1px);
  background-size: var(--carreau) var(--carreau), var(--carreau) var(--carreau), 100% calc(var(--carreau) / 4);
}
.seyes.marge { position: relative; }
.seyes.marge::before {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  left: var(--marge-x, 56px);
  width: 2px;
  background: var(--marge);
  pointer-events: none;
}

/* Titres larges : Archivo étiré, serré, très gras */
.titre-large {
  font-family: var(--large);
  font-stretch: 112%;
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: .92;
}
.etroit { font-stretch: 75%; }
