/* Loureiro Cyber — feuille de style unique.
   Valeurs reprises de maquette/accueil.html et maquette/identite.html. */

@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/fonts/plus-jakarta-sans.woff2) format('woff2-variations'), url(/fonts/plus-jakarta-sans.woff2) format('woff2');
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/jetbrains-mono-500.woff2) format('woff2');
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/jetbrains-mono-700.woff2) format('woff2');
}

:root {
  /* Charte */
  --encre: #0B0B0F;
  --blanc: #FFFFFF;
  --fond: #F4F4F7;
  --texte-2: #4B4B57;
  --texte-3: #6B6B78;
  --ligne: #ECECF0;
  --pastille: #F2F2F5;
  --citron: #D8F75A;
  --lilas: #D9CFFF;
  --menthe: #BDF1D6;
  --peche: #FFD6C2;
  --ciel: #CFE2FF;
  --soleil: #FFF1A6;
  --vert: #10744E;
  --vert-fond: #E6F8EF;
  --bleu: #2B47D9;
  --bleu-fond: #EAF0FF;
  /* Teintes présentes dans la maquette validée */
  --coche: #1BA672;
  --accent: #3B5BFF;
  --corail: #FF8F6B;
  --pdf: #FF5B4D;
  --gris-secteur: #A0A0AB;
  --texte-sur-noir: #C3C3CC;
  --barre: #E4E4EA;

  --sans: 'Plus Jakarta Sans', system-ui, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, monospace;
  --pilule: 999px;
  --rayon-carte: 28px;
  --rayon-bloc: 32px;
  --espace-section: clamp(64px, 8vw, 112px);
}

/* Comme la maquette : largeurs sans les marges intérieures, sauf là où elle précise border-box. */
.bouton, .entete__menu, .telephone, .telephone__ecran, .avantage, .document, .reservation, .reservation__cadre iframe { box-sizing: border-box; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  background: var(--blanc);
  color: var(--encre);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.55;
}

a { color: var(--encre); }
a:hover { color: var(--accent); }
img { max-width: 100%; }
input, textarea, select, button { font-family: inherit; font-size: 16px; }
h1, h2, h3, p { margin: 0; }

:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }

[id] { scroll-margin-top: 16px; }

.evitement {
  position: absolute; left: 16px; top: -100px; z-index: 50;
  background: var(--encre); color: var(--blanc);
  padding: 12px 20px; border-radius: var(--pilule); font-weight: 700; text-decoration: none;
}
.evitement:focus { top: 16px; color: var(--blanc); }

.conteneur { max-width: 1240px; margin: 0 auto; padding-left: 24px; padding-right: 24px; }

/* ---------- Boutons ---------- */
.bouton {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px; padding: 15px 24px;
  border-radius: var(--pilule); border: none;
  background: var(--encre); color: var(--blanc);
  font-weight: 700; font-size: 17px; text-decoration: none; cursor: pointer;
}
.bouton:hover { color: var(--blanc); background: #26262E; }
.bouton--petit { padding: 12px 22px; font-size: 15px; }
.bouton--grand { padding: 17px 28px; }
.bouton--blanc { background: var(--blanc); color: var(--encre); }
.bouton--blanc:hover { background: var(--fond); color: var(--encre); }
.bouton--gauche { align-self: flex-start; }

.lien-fleche { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; font-size: 16px; text-decoration: none; }
.lien-fleche svg { stroke: currentColor; }

/* ---------- Titres ---------- */
.titre-2 { font-weight: 800; font-size: clamp(34px, 4.2vw, 56px); line-height: 1.02; letter-spacing: -0.045em; }
.titre-2--moyen { font-size: clamp(32px, 3.8vw, 50px); line-height: 1.04; }
.titre-2--petit { font-size: clamp(30px, 3.4vw, 44px); line-height: 1.04; }

/* ---------- En-tête ---------- */
.entete { position: relative; z-index: 10; }
.entete__barre {
  max-width: 1240px; margin: 0 auto; padding: 20px 24px;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 32px;
}
.entete__logo { display: inline-flex; align-items: center; text-decoration: none; }
.entete__logo img { height: 34px; width: auto; display: block; }
.entete__nav { display: flex; flex-wrap: wrap; gap: 28px; font-size: 15px; font-weight: 600; }
.entete__nav a { text-decoration: none; }
.entete__menu { display: none; }
.entete__nav .bouton { display: none; }

@media (max-width: 959px) {
  .js .entete__barre { flex-wrap: nowrap; }
  .js .entete__menu {
    display: inline-flex; align-items: center; gap: 10px;
    min-height: 44px; padding: 10px 18px; border: none; border-radius: var(--pilule);
    background: var(--pastille); color: var(--encre); font-weight: 700; font-size: 15px; cursor: pointer;
  }
  .js .entete__menu svg { stroke: currentColor; }
  .js .entete__menu .icone-fermer { display: none; }
  .js .entete__menu[aria-expanded="true"] .icone-ouvrir { display: none; }
  .js .entete__menu[aria-expanded="true"] .icone-fermer { display: block; }
  .js .entete__action { display: none; }
  .js .entete__nav {
    display: none;
    position: absolute; left: 12px; right: 12px; top: calc(100% - 4px);
    flex-direction: column; gap: 4px;
    background: var(--blanc); border-radius: 24px; padding: 12px;
    box-shadow: 0 18px 40px rgba(11, 11, 15, 0.14);
    font-size: 18px;
  }
  .js .entete__nav.est-ouvert { display: flex; }
  .js .entete__nav a:not(.bouton) { padding: 12px 14px; border-radius: 14px; min-height: 44px; }
  .js .entete__nav a:not(.bouton):hover { background: var(--fond); color: var(--encre); }
  .js .entete__nav .bouton { display: inline-flex; margin-top: 8px; }
}

/* ---------- Haut de page ---------- */
.hero {
  padding-top: clamp(32px, 5vw, 72px); padding-bottom: clamp(48px, 6vw, 88px);
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 480px), 1fr));
  gap: clamp(40px, 5vw, 72px); align-items: center;
}
.hero__texte { display: flex; flex-direction: column; gap: 26px; }
.etiquette-nouveau {
  align-self: flex-start; display: inline-flex; align-items: center; gap: 8px;
  background: var(--pastille); border-radius: var(--pilule); padding: 7px 14px 7px 8px;
  font-size: 14px; font-weight: 600;
}
.etiquette-nouveau span { background: var(--citron); border-radius: var(--pilule); padding: 2px 9px; font-size: 12px; font-weight: 800; }
.hero h1 { font-weight: 800; font-size: clamp(42px, 5.6vw, 76px); line-height: 1; letter-spacing: -0.05em; }
.hero__sous-titre { font-size: 20px; color: var(--texte-2); max-width: 28em; }
.hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; }
.hero__garanties { display: flex; flex-wrap: wrap; gap: 8px 22px; font-size: 14px; font-weight: 600; color: var(--texte-2); margin: 0; padding: 0; list-style: none; }
.hero__garanties li { display: inline-flex; align-items: center; gap: 6px; }
.hero__garanties svg { stroke: var(--coche); }

.hero__visuel {
  position: relative; border-radius: var(--rayon-bloc); background: var(--lilas);
  min-height: 560px; overflow: hidden;
  display: flex; align-items: flex-end; justify-content: center;
}
.rond { position: absolute; border-radius: 50%; }
.hero__visuel .rond--1 { right: -60px; top: -60px; width: 260px; height: 260px; background: var(--citron); }
.hero__visuel .rond--2 { left: -40px; bottom: 120px; width: 140px; height: 140px; background: var(--corail); }

.telephone {
  position: relative; width: 290px; height: 500px; background: var(--encre);
  border-radius: 44px 44px 0 0; padding: 12px 12px 0;
}
.telephone__ecran {
  height: 100%; background: var(--blanc); border-radius: 34px 34px 0 0; padding: 26px 18px 0;
  display: flex; flex-direction: column; gap: 14px; line-height: 1.55;
}
.telephone__barre { display: flex; justify-content: space-between; font-size: 12px; font-weight: 700; color: var(--texte-2); }
.telephone__expediteur { display: flex; align-items: center; gap: 10px; }
.telephone__expediteur img { width: 38px; height: 38px; }
.telephone__nom { font-weight: 800; font-size: 14px; }
.telephone__petit { font-size: 12px; color: var(--texte-3); }
.telephone__objet { font-weight: 800; font-size: 20px; line-height: 1.15; letter-spacing: -0.03em; }
.telephone__message { font-size: 13px; line-height: 1.5; color: var(--texte-2); }
.piece-jointe { display: flex; align-items: center; gap: 10px; background: var(--pastille); border-radius: 14px; padding: 10px 12px; }
.piece-jointe__icone {
  width: 34px; height: 40px; border-radius: 6px; background: var(--pdf); color: var(--blanc);
  display: inline-flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 800;
}
.piece-jointe__nom { font-size: 13px; font-weight: 700; }
.piece-jointe__pages { font-size: 11px; color: var(--texte-3); }
.statut-assurable {
  background: var(--vert-fond); color: var(--vert); border-radius: 14px; padding: 12px;
  font-size: 13px; font-weight: 700; display: flex; align-items: center; gap: 8px;
}
.statut-assurable svg { stroke: var(--vert); }

/* La vignette : seul élément incliné du site */
.vignette {
  width: 170px; background: var(--citron); border-radius: 16px; padding: 6px;
  transform: rotate(-9deg); box-shadow: 0 18px 36px rgba(11, 11, 15, 0.2);
}
.vignette__cadre {
  border: 2px dashed rgba(11, 11, 15, 0.4); border-radius: 11px; padding: 12px;
  display: flex; flex-direction: column; gap: 4px; line-height: 1.55;
}
.vignette__mono { font-family: var(--mono); font-size: 9px; font-weight: 700; letter-spacing: 0.08em; }
.vignette__annee { font-weight: 800; font-size: 46px; line-height: 1; letter-spacing: -0.05em; }
.hero__visuel .vignette { position: absolute; left: 6%; top: 70px; }

.bulle-controle {
  position: absolute; right: 5%; top: 46%;
  background: var(--blanc); border-radius: 18px; padding: 12px 14px;
  display: flex; align-items: center; gap: 10px; box-shadow: 0 16px 36px rgba(11, 11, 15, 0.16);
}
.bulle-controle__coche {
  width: 34px; height: 34px; border-radius: 50%; background: var(--menthe);
  display: inline-flex; align-items: center; justify-content: center;
}
.bulle-controle__coche svg { stroke: var(--encre); }
.bulle-controle__texte { font-size: 13px; font-weight: 700; line-height: 1.3; }
.bulle-controle__texte span { font-weight: 500; color: var(--texte-3); }

/* ---------- Bande expérience ---------- */
.experience__bande {
  border-top: 1px solid var(--ligne); border-bottom: 1px solid var(--ligne); padding: 26px 0;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 32px;
}
.experience__intro { font-size: 15px; font-weight: 600; color: var(--texte-2); max-width: 26em; }
.experience__secteur { font-weight: 800; font-size: 22px; letter-spacing: -0.04em; color: var(--gris-secteur); }

/* ---------- Vous vous reconnaissez ? ---------- */
.douleurs { padding-top: var(--espace-section); display: flex; flex-direction: column; gap: 40px; }
.entete-section {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
  gap: 20px 64px; align-items: end;
}
.entete-section p { font-size: 18px; color: var(--texte-2); }
.grille-douleurs { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.douleur {
  border: 1px solid var(--ligne); border-radius: var(--rayon-carte); padding: 26px;
  display: flex; flex-direction: column; gap: 18px;
}
.douleur__phrase { font-size: 19px; font-weight: 600; line-height: 1.4; color: var(--texte-2); }
.douleur__reponse { display: flex; gap: 12px; align-items: flex-start; border-radius: 18px; padding: 14px 16px; }
.douleur__reponse svg { flex: 0 0 auto; margin-top: 2px; stroke: var(--encre); }
.douleur__reponse span { font-weight: 700; font-size: 16px; line-height: 1.4; }

.fond-menthe { background: var(--menthe); }
.fond-lilas { background: var(--lilas); }
.fond-ciel { background: var(--ciel); }
.fond-soleil { background: var(--soleil); }
.fond-peche { background: var(--peche); }
.fond-citron { background: var(--citron); }

/* ---------- Avantages ---------- */
.avantages { padding-top: var(--espace-section); padding-bottom: var(--espace-section); display: flex; flex-direction: column; gap: 40px; }
.avantages .titre-2 { max-width: 13em; }
.grille-avantages { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.avantage {
  border-radius: var(--rayon-carte); padding: 30px; min-height: 340px;
  display: flex; flex-direction: column; justify-content: space-between; gap: 24px;
  position: relative; overflow: hidden;
}
.avantage--bas { min-height: 300px; }
.avantage__texte { display: flex; flex-direction: column; gap: 10px; }
.avantage h3 { font-weight: 800; font-size: 28px; letter-spacing: -0.04em; line-height: 1.05; }
.avantage p { font-size: 16px; }
.avantage--menthe p { color: #1E3B2E; }
.avantage--peche p { color: #4A2A1C; }
.avantage--ciel p { color: #1C2B4A; }
.avantage--noir { background: var(--encre); color: var(--blanc); }
.avantage--noir p { color: var(--texte-sur-noir); }
.avantage--soleil p { color: #3E3A12; }
.avantage--lilas p { color: #2E2552; }

.mini-dossier {
  align-self: flex-start; background: var(--blanc); border-radius: 18px; padding: 14px 16px;
  display: flex; flex-direction: column; gap: 8px; width: 240px; max-width: 100%;
  box-shadow: 0 10px 24px rgba(11, 11, 15, 0.08);
}
.mini-dossier__ligne { display: flex; justify-content: space-between; font-size: 13px; font-weight: 700; }
.mini-dossier__ligne span:last-child { color: var(--vert); }
.mini-dossier__jauge { height: 8px; border-radius: 4px; background: var(--vert-fond); }
.mini-dossier__jauge span { display: block; width: 100%; height: 8px; border-radius: 4px; background: var(--coche); }

.conversation { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.conversation span { border-radius: 18px 18px 18px 4px; padding: 10px 14px; font-size: 14px; font-weight: 600; line-height: 1.55; }
.conversation__question { background: var(--blanc); box-shadow: 0 8px 18px rgba(11, 11, 15, 0.06); }
.conversation .conversation__reponse { align-self: flex-end; background: var(--encre); color: var(--blanc); border-radius: 18px 18px 4px 18px; }

.semaine { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.semaine span { height: 34px; border-radius: 8px; background: rgba(255, 255, 255, 0.7); }
.semaine .semaine__jour-controle { background: var(--encre); }
.semaine .semaine__week-end { background: rgba(255, 255, 255, 0.35); }

.avantage--noir svg { stroke: var(--citron); }

.personne { display: flex; align-items: center; gap: 12px; }
.personne__initiales {
  width: 52px; height: 52px; border-radius: 50%; background: var(--blanc);
  display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 16px;
}
.personne__nom { font-size: 15px; font-weight: 700; line-height: 1.3; }
.personne__nom span { font-weight: 500; color: #57521E; }

.annees { display: flex; gap: 8px; }
.annees span { background: rgba(255, 255, 255, 0.55); border-radius: 10px; padding: 6px 10px; font-weight: 800; font-size: 15px; color: #6E64A8; line-height: 1.55; }
.annees .annees__courante { background: var(--blanc); color: var(--encre); }

/* ---------- Trois étapes ---------- */
.section-bas { padding-bottom: var(--espace-section); }
.bloc-gris {
  background: var(--fond); border-radius: var(--rayon-bloc); padding: clamp(36px, 5vw, 64px);
  display: flex; flex-direction: column; gap: 40px;
}
.etapes { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 16px; }
.etape { background: var(--blanc); border-radius: 24px; padding: 26px; display: flex; flex-direction: column; gap: 12px; }
.etape__numero {
  width: 44px; height: 44px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 18px;
}
.etape h3 { font-weight: 800; font-size: 22px; letter-spacing: -0.03em; line-height: 1.55; }
.etape p { font-size: 16px; color: var(--texte-2); }

/* ---------- Le rapport ---------- */
.bloc-noir {
  background: var(--encre); color: var(--blanc); border-radius: var(--rayon-bloc);
  padding: clamp(36px, 5vw, 64px); position: relative; overflow: hidden;
  display: grid; align-items: center;
}
.rapport { grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: clamp(36px, 5vw, 64px); }
.rapport .rond { right: -80px; bottom: -120px; width: 380px; height: 380px; background: var(--accent); opacity: 0.55; }
.bloc-noir__texte { position: relative; display: flex; flex-direction: column; gap: 18px; }
.bloc-noir__texte p { font-size: 18px; color: var(--texte-sur-noir); max-width: 28em; }

.document {
  position: relative; background: var(--blanc); color: var(--encre); border-radius: 24px; padding: 24px;
  max-width: 460px; width: 100%; justify-self: end;
}
.document__entete { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid var(--ligne); }
.document__numero { font-family: var(--mono); font-size: 11px; color: var(--texte-3); }
.document__client { font-weight: 800; font-size: 20px; letter-spacing: -0.03em; padding-top: 4px; }
.document__lignes { margin: 0; padding: 0; list-style: none; }
.document__lignes li { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 13px 0; border-bottom: 1px solid var(--pastille); }
.document__lignes li:last-child { border-bottom: none; }
.document__floute { height: 12px; border-radius: 6px; background: var(--barre); }
.document__mention { font-size: 12px; color: var(--texte-3); padding-top: 10px; border-top: 1px solid var(--ligne); }

.statut { border-radius: var(--pilule); font-weight: 700; line-height: 1.55; white-space: nowrap; }
.statut--grand { padding: 5px 12px; font-size: 13px; }
.statut--petit { padding: 3px 10px; font-size: 12px; }
.statut--ok { background: var(--vert-fond); color: var(--vert); }
.statut--corrige { background: var(--bleu-fond); color: var(--bleu); }

.l-58 { width: 58%; } .l-44 { width: 44%; } .l-66 { width: 66%; } .l-50 { width: 50%; } .l-38 { width: 38%; }

/* ---------- Forfait et courtiers ---------- */
.deux-cartes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 16px; }
.grande-carte { border-radius: var(--rayon-bloc); padding: clamp(32px, 4vw, 52px); display: flex; flex-direction: column; gap: 16px; }
.grande-carte p { font-size: 17px; }
.grande-carte .bouton { margin-top: 8px; }
.grande-carte--soleil p { color: #3E3A12; }
.grande-carte--peche p { color: #4A2A1C; }
.grande-carte .etiquette-blanche { align-self: flex-start; background: var(--blanc); border-radius: var(--pilule); padding: 6px 14px; font-size: 13px; font-weight: 700; line-height: 1.55; }

/* ---------- À propos ---------- */
.apropos {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr));
  gap: clamp(36px, 5vw, 72px); align-items: center;
}
.portrait {
  position: relative; border-radius: var(--rayon-bloc); background: var(--ciel);
  aspect-ratio: 1 / 1; max-width: 520px; width: 100%; overflow: hidden;
  display: flex; align-items: center; justify-content: center; text-align: center;
  color: #1C2B4A; font-weight: 700; font-size: 14px; line-height: 1.5;
}
.portrait .rond { left: -50px; bottom: -50px; width: 200px; height: 200px; background: var(--citron); }
.portrait span { position: relative; }
.portrait img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.apropos__texte { display: flex; flex-direction: column; gap: 18px; }
.apropos__texte p { font-size: 18px; color: var(--texte-2); }
.puces { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.puces li { background: var(--fond); border-radius: var(--pilule); padding: 8px 14px; font-size: 14px; font-weight: 600; line-height: 1.55; }

/* ---------- Questions fréquentes ---------- */
.faq { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 32px 64px; }
.faq__liste { display: flex; flex-direction: column; gap: 10px; }
.faq details { background: var(--fond); border-radius: 20px; padding: 20px 24px; }
.faq summary {
  cursor: pointer; list-style: none;
  font-weight: 700; font-size: 17px; display: flex; justify-content: space-between; gap: 16px;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: '+'; font-size: 22px; line-height: 1; flex: 0 0 auto; }
.faq details[open] summary::after { content: '−'; }
.faq details p { margin-top: 12px; color: var(--texte-2); font-size: 16px; }

/* ---------- Contact ---------- */
.contact { padding-bottom: 24px; }
.contact .bloc-noir { grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr)); gap: 40px; }
.contact .rond { left: -90px; top: -90px; width: 260px; height: 260px; background: var(--lilas); opacity: 0.9; }
/* Écart volontaire avec la maquette : sur téléphone, le cercle recouvrait le texte blanc. */
@media (max-width: 640px) { .contact .rond { width: 140px; height: 140px; } }
.contact h2 { font-weight: 800; font-size: clamp(36px, 4.6vw, 62px); line-height: 1; letter-spacing: -0.05em; }
.contact .bloc-noir__texte p { max-width: 24em; }
.coordonnees { display: flex; flex-direction: column; gap: 4px; padding-top: 6px; }
.coordonnees__tel { font-weight: 800; font-size: 24px; letter-spacing: -0.03em; color: var(--blanc); text-decoration: none; }
.coordonnees__email { font-size: 17px; color: var(--texte-sur-noir); }
.coordonnees a:hover { color: var(--citron); }

.reservation {
  position: relative; background: var(--blanc); color: var(--encre); border-radius: 24px; padding: 30px 26px;
}
.reservation__accueil { display: flex; flex-direction: column; gap: 16px; align-items: flex-start; }
.reservation__surtitre { font-family: var(--mono); font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--texte-3); }
.reservation h3 { font-weight: 800; font-size: 28px; letter-spacing: -0.04em; line-height: 1.05; }
.reservation__points { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; font-size: 16px; font-weight: 600; color: var(--texte-2); }
.reservation__points li { display: flex; align-items: center; gap: 8px; }
.reservation__points svg { stroke: var(--coche); flex: 0 0 auto; }
.reservation .bouton { margin-top: 6px; width: 100%; }
.reservation__cadre { display: flex; flex-direction: column; gap: 10px; }
.reservation__cadre iframe { width: 100%; height: 680px; border: none; border-radius: 16px; background: var(--fond); }
.reservation__cadre a { font-size: 14px; color: var(--texte-3); }
.reservation .a-fournir { display: block; margin-top: 6px; padding: 14px; text-align: center; }

/* ---------- Pied de page ---------- */
.pied {
  max-width: 1240px; margin: 0 auto; padding: 32px 24px 40px;
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px;
  font-size: 14px; color: var(--texte-3);
}
.pied__marque { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 4px 12px; }
.pied__marque img { height: 24px; width: auto; display: block; }
.pied__liens { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.pied__liens a { color: var(--texte-3); }
.pied__liens a:hover { color: var(--accent); }

/* ---------- Pages légales ---------- */
.legal { padding-top: clamp(32px, 5vw, 64px); padding-bottom: var(--espace-section); max-width: 820px; }
.legal h1 { font-weight: 800; font-size: clamp(38px, 5vw, 60px); line-height: 1; letter-spacing: -0.05em; margin-bottom: 16px; }
.legal__date { font-size: 15px; color: var(--texte-3); margin-bottom: 40px; }
.legal h2 { font-weight: 800; font-size: 26px; letter-spacing: -0.03em; line-height: 1.15; margin: 40px 0 12px; }
.legal p, .legal li { color: var(--texte-2); font-size: 17px; }
.legal p + p { margin-top: 12px; }
.legal ul { padding-left: 22px; margin: 12px 0 0; }
.legal li + li { margin-top: 6px; }
.legal strong { color: var(--encre); }
.legal__fiche { background: var(--fond); border-radius: var(--rayon-carte); padding: 26px 28px; margin: 0; display: grid; grid-template-columns: minmax(0, 12em) minmax(0, 1fr); gap: 10px 20px; }
.legal__fiche dt { font-weight: 700; font-size: 15px; }
.legal__fiche dd { margin: 0; color: var(--texte-2); overflow-wrap: anywhere; }
@media (max-width: 560px) { .legal__fiche { grid-template-columns: 1fr; gap: 2px; } .legal__fiche dd { margin-bottom: 10px; } }
.encadre-provisoire { background: var(--soleil); border-radius: var(--rayon-carte); padding: 26px 28px; }
.encadre-provisoire p { color: #3E3A12; }

/* Valeurs pas encore fournies : visibles exprès */
.a-fournir { background: #FFECEA; color: #A3261B; border-radius: 6px; padding: 0 6px; font-weight: 700; }

/* ---------- Page 404 / merci ---------- */
.page-simple { padding-top: clamp(48px, 8vw, 112px); padding-bottom: var(--espace-section); display: flex; flex-direction: column; gap: 22px; align-items: flex-start; max-width: 760px; }
.page-simple h1 { font-weight: 800; font-size: clamp(42px, 5.6vw, 76px); line-height: 1; letter-spacing: -0.05em; }
.page-simple p { font-size: 20px; color: var(--texte-2); }
