/* ==========================================================
   Amarity — thème des brochures
   Chargé après le style d'origine de chaque brochure : il remplace
   couleurs et typographies par celles du site, sans toucher au contenu.
   ========================================================== */
:root {
  --paper: #ede8df;
  --ink: #0b0b0a;
  --muted: #5d584f;
  --line: rgba(11, 11, 10, .16);
  --night: #0b0b0a;
  --cream: #ede8df;
  --sand: #c8a96a;
  --clay: #7a5c2a;
  --display: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --body: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --label: "Space Mono", ui-monospace, monospace;
}
/* la page d'entrée des brochures est sombre */
.b-hub { --muted: #8a857c; --line: rgba(237, 232, 223, .2); }

body { font-size: 17px; line-height: 1.6; }
::selection { background: var(--sand); color: var(--ink); }

/* titres : grotesque large en capitales, comme le site */
h1, h2, .card h2, .film h3, .rights h3, .offer h3, .n {
  font-family: var(--display);
  font-weight: 850;
  font-variation-settings: "wdth" 125;
  text-transform: uppercase;
  letter-spacing: -.02em;
  line-height: .95;
}
h1 em, h2 em, h3 em {
  font-family: "Instrument Serif", Georgia, serif;
  font-style: italic; font-weight: 400;
  font-variation-settings: normal;
  text-transform: none; letter-spacing: 0;
}
h1, .cover h1 { font-size: clamp(34px, 4.4vw, 72px); }
h2, .about h2, .head h2 { font-size: clamp(28px, 3vw, 46px); }
.case h2, .casehead { font-size: clamp(32px, 3.6vw, 58px); }
.contact h2 { font-size: clamp(32px, 3.8vw, 60px); }
/* certains titres ont une taille écrite dans la page : on la ramène à l'échelle du thème */
h2[style*="font-size"] { font-size: clamp(28px, 3vw, 46px) !important; }
.card h2 { font-size: clamp(26px, 2.6vw, 40px); }
.film h3 { font-size: clamp(17px, 1.4vw, 21px); line-height: 1.1; }
.rights h3 { font-size: 22px; line-height: 1.05; }
.offer h3 { font-size: 24px; line-height: 1; }

/* texte courant */
.intro p, .card p.txt, .rights p, .faq p { font-size: 16px; }

/* étiquettes : mono, comme le site */
.label, .cap, .btn, .steps h3, .film .spec, .row span:last-child, .offer .price,
.note, .copybtn, .links a, .close {
  font-family: var(--label);
  letter-spacing: .1em;
}

/* logo */
.brand {
  font-family: var(--display);
  font-weight: 300; font-variation-settings: normal;
  text-transform: lowercase; letter-spacing: -.02em; font-size: 22px;
}

/* boutons en pilule */
.btn, .copybtn { border-radius: 999px; }

/* téléphone : titres ramenés à la largeur de l'écran */
@media (max-width: 600px) {
  h1, .cover h1 { font-size: clamp(26px, 8vw, 40px); }
  h2, .about h2, .head h2, .case h2, .casehead, .contact h2 { font-size: clamp(24px, 7vw, 34px); }
  h2[style*="font-size"] { font-size: clamp(24px, 7vw, 34px) !important; }
}