/* Empan — feuille commune aux 6 pages publiques (empan.remyvdm.com)
   S'appuie sur /charte/tokens.css (version du 9/10/2026, identité A : la main cotée),
   déposé par Rémy — fonts + jetons de couleur viennent de là. Thème clair seul cette
   nuit : le bloc sombre de tokens.css n'est pas sollicité ici (pas de data-theme).
   Aucun traceur, aucune ressource tierce. */

:root{
  --empan-promptcraft:#8A6A1E; /* 4e outil : pas encore dans tokens.css officiel (3 couleurs) */
  --empan-rayon-xl:16px;
  --largeur:1080px; --largeur-juridique:760px; --largeur-etroite:640px;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0;background:var(--empan-papier);color:var(--empan-encre);
  font-family:var(--empan-police-texte);line-height:var(--empan-interligne);
  font-size:var(--empan-taille-texte);}
.mono{font-family:var(--empan-police-cote);}
img{max-width:100%;}
a{color:inherit;}

/* clavier : jamais de focus invisible */
a:focus-visible, button:focus-visible, .btn:focus-visible{
  outline:var(--empan-focus); outline-offset:2px; border-radius:6px;
}

/* lien d'évitement : caché hors focus, visible au clavier (v3.1, accessibilité) */
.evitement{position:absolute;left:-9999px;top:0;z-index:1000;
  background:var(--empan-encre);color:var(--empan-papier);
  padding:10px 18px;border-radius:0 0 var(--empan-rayon-m) 0;
  font-family:var(--empan-police-cote);font-size:14px;text-decoration:none;}
.evitement:focus{left:0;}

/* titre masqué à l'écran, lu par les lecteurs d'écran (v3.1, accessibilité) */
.visuellement-cache{position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* bannière d'état, en tête de page */
.banniere{background:#2a2a24;color:#F1EADC;text-align:center;font-size:13px;
  padding:8px 16px;font-family:var(--empan-police-cote);letter-spacing:.02em;}

/* en-tête, commun aux 6 pages */
.site-header{display:flex;align-items:center;justify-content:space-between;
  padding:22px 32px;max-width:var(--largeur);margin:0 auto;}
.logo{display:block;line-height:0;}
.logo img{height:36px;display:block;}
.site-nav{display:flex;gap:28px;font-family:var(--empan-police-cote);font-size:14px;}
.site-nav a{text-decoration:none;border-bottom:1px solid transparent;}
.site-nav a:hover{border-bottom-color:var(--empan-encre);}

/* hero */
.hero{max-width:var(--largeur);margin:0 auto;padding:40px 32px 60px;text-align:center;}
.hero h1{font-weight:var(--empan-graisse-mot);font-size:40px;margin:0 0 14px;}
.hero p{font-size:18px;color:var(--empan-encre-douce);max-width:560px;margin:0 auto;}

section{max-width:var(--largeur);margin:0 auto;padding:40px 32px;}
.tag{font-family:var(--empan-police-cote);font-size:13px;color:var(--empan-encre-douce);
  letter-spacing:.06em;text-transform:uppercase;}
h2{font-size:26px;font-weight:var(--empan-graisse-mot);margin:6px 0 28px;}

/* cartes outils (page d'accueil et page des offres) */
.outils{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.grille{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
.carte-outil{background:var(--empan-surface);border:1px solid var(--empan-ligne);
  border-radius:var(--empan-rayon-l);padding:22px;}
.carte{background:var(--empan-surface);border:1px solid var(--empan-ligne);
  border-radius:var(--empan-rayon-xl);overflow:hidden;display:flex;flex-direction:column;}
.capture{aspect-ratio:16/9;background:var(--empan-ligne);overflow:hidden;}
.capture img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;}
/* Curseurs : le titre et la première colonne sont en haut à gauche de la capture */
.carte.curseurs .capture img{object-position:left top;}
.carte .corps{padding:22px 24px;display:flex;flex-direction:column;flex:1;gap:10px;}
.carte .corps .btn{margin-top:auto;}
.cote{display:inline-block;width:28px;height:var(--empan-trait);border-radius:2px;margin-bottom:10px;}
.carte-outil h3,.carte h3{margin:0 0 8px;font-size:19px;font-weight:var(--empan-graisse-mot);}
.carte-outil p,.carte p.desc{margin:0;color:var(--empan-encre-douce);font-size:14px;line-height:1.5;}
.plongee .cote{background:var(--empan-plongee);} .plongee h3{color:var(--empan-plongee);}
.curseurs .cote{background:var(--empan-curseurs);} .curseurs h3{color:var(--empan-curseurs);}
.voile .cote{background:var(--empan-voile);} .voile h3{color:var(--empan-voile);}
.promptcraft .cote{background:var(--empan-promptcraft);} .promptcraft h3{color:var(--empan-promptcraft);}

/* offres / paliers */
.offres{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch;}
.palier{background:var(--empan-surface);border:1px solid var(--empan-ligne);
  border-radius:var(--empan-rayon-xl);padding:28px 24px;display:flex;flex-direction:column;}
.palier.vedette{border-color:var(--empan-encre);box-shadow:0 0 0 1px var(--empan-encre);}
.palier .nom{font-size:21px;font-weight:var(--empan-graisse-mot);margin:0 0 6px;}
.badge{display:inline-block;font-family:var(--empan-police-cote);font-size:11px;
  background:var(--empan-crayon);color:#fff;border-radius:var(--empan-rayon-pilule);
  padding:3px 10px;margin-bottom:12px;}
.palier .prix,.prix{font-family:var(--empan-police-cote);font-size:14px;color:var(--empan-encre-douce);
  margin:0 0 18px;}
.prix .ttc{display:block;font-size:11px;margin-top:2px;}
.carte .prix{font-size:22px;color:var(--empan-encre);}
.palier ul,.carte ul{list-style:none;margin:0 0 24px;padding:0;flex:1;}
.palier li,.carte li{font-size:14px;color:var(--empan-encre-douce);padding:6px 0;
  border-top:1px solid var(--empan-ligne);}
.palier li:first-child,.carte li:first-child{border-top:none;}

/* boutons */
.btn{display:block;text-align:center;text-decoration:none;font-family:var(--empan-police-cote);
  font-size:14px;padding:12px 18px;border-radius:var(--empan-rayon-m);font-weight:500;}
.btn-plein{background:var(--empan-encre);color:var(--empan-papier);}
.btn-contour{background:transparent;border:1px solid var(--empan-encre);color:var(--empan-encre);}

/* notes et explications */
.note-pro{font-family:var(--empan-police-cote);font-size:12.5px;color:var(--empan-encre-douce);
  background:var(--empan-surface);border:1px solid var(--empan-ligne);
  border-left:3px solid var(--empan-crayon);border-radius:var(--empan-rayon-s);
  padding:10px 14px;margin:0 0 22px;max-width:620px;}
.explication{font-family:var(--empan-police-cote);font-size:12.5px;color:var(--empan-encre-douce);
  text-align:center;margin:28px auto 4px;line-height:1.5;max-width:640px;}
.lien-devis{font-family:var(--empan-police-cote);font-size:12.5px;text-align:center;margin:0 0 10px;}
.lien-devis a{text-decoration:underline;}
.a-venir{font-family:var(--empan-police-cote);font-size:13px;color:var(--empan-encre-douce);
  text-align:center;margin:0;padding:12px 6px;border:1px dashed var(--empan-ligne);
  border-radius:var(--empan-rayon-m);}

/* galerie (captures Plongée) */
.galerie{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:0 0 30px;}
.galerie figure{margin:0;background:var(--empan-surface);border:1px solid var(--empan-ligne);
  border-radius:var(--empan-rayon-m);overflow:hidden;}
.galerie img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;object-position:left top;}
.galerie figcaption{font-family:var(--empan-police-cote);font-size:11px;color:var(--empan-encre-douce);
  padding:8px 10px;line-height:1.4;}

/* pied de page, identique sur les 6 pages */
.site-footer{border-top:1px solid var(--empan-ligne);margin-top:40px;}
.pied{max-width:var(--largeur);margin:0 auto;padding:32px 32px 48px;display:flex;
  justify-content:space-between;flex-wrap:wrap;gap:16px;font-size:13px;color:var(--empan-encre-douce);}
.pied a{text-decoration:underline;}

/* pages juridiques : largeur de lecture, sommaire, titres ancrés, impression */
.page-juridique{max-width:var(--largeur-juridique);margin:0 auto;padding:0 32px 60px;line-height:1.6;}
.page-juridique .intro,.page-juridique .maj{color:var(--empan-encre-douce);font-size:15px;margin:0 0 10px;}
.page-juridique h1{font-size:28px;margin:0 0 6px;font-weight:var(--empan-graisse-mot);}
.page-juridique h2{font-size:21px;margin:36px 0 10px;border-top:1px solid var(--empan-ligne);
  padding-top:24px;scroll-margin-top:24px;font-weight:var(--empan-graisse-mot);}
.page-juridique h2:first-of-type{border-top:none;padding-top:0;}
.page-juridique h3{font-size:16px;margin:22px 0 6px;font-weight:var(--empan-graisse-mot);}
.page-juridique p,.page-juridique li{color:var(--empan-encre-douce);font-size:14.5px;}
.page-juridique ol,.page-juridique ul{padding-left:20px;margin:0 0 8px;}
.page-juridique li{margin:0 0 6px;}
.page-juridique table{width:100%;border-collapse:collapse;font-size:13px;margin:12px 0 10px;}
.page-juridique th,.page-juridique td{border:1px solid var(--empan-ligne);padding:8px 10px;
  text-align:left;vertical-align:top;}
.page-juridique th{background:var(--empan-surface);font-family:var(--empan-police-cote);font-size:12px;}
.page-juridique .grp{background:var(--empan-surface);font-weight:600;}
.sommaire{background:var(--empan-surface);border:1px solid var(--empan-ligne);
  border-radius:var(--empan-rayon-l);padding:20px 24px;margin:0 0 32px;
  font-family:var(--empan-police-cote);font-size:13px;}
.sommaire-titre{color:var(--empan-encre-douce);margin:0 0 10px;font-size:12.5px;
  text-transform:uppercase;letter-spacing:.06em;}
.sommaire ol{margin:0;padding-left:20px;}
.sommaire li{margin:4px 0;font-size:14.5px;}
.sommaire ol ol{margin:4px 0 10px;padding-left:18px;}
.sommaire ol ol li{font-size:13px;}
.sommaire a{text-decoration:none;}

@media print{
  .site-header .site-nav,.site-footer,.no-print{display:none;}
  body{background:#fff;color:#000;}
  .page-juridique a{color:#000;}
  .sommaire{border-color:#ccc;}
}

@media (max-width:760px){
  .outils,.grille,.offres{grid-template-columns:1fr;}
  .site-header{flex-direction:column;gap:14px;}
}
@media (max-width:600px){
  .galerie{grid-template-columns:1fr;}
}
@media (max-width:420px){
  .hero h1{font-size:28px;}
  .hero p{font-size:16px;}
  h2{font-size:22px;}
  .site-header,.hero,section{padding-left:20px;padding-right:20px;}
}