/* Pages de contenu de primoweb.fr (ville, guide) : HTML statique, lisible sans JavaScript. Mêmes jetons que l'accueil. */
:root{--nuit:#05070F;--carte:#0C1020;--trait:rgba(255,255,255,.09);--texte:#EEF1F8;--doux:rgba(238,241,248,.66);--pale:rgba(238,241,248,.45);--bleu:#2C3EFF;--bleu-clair:#8FA6FF}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--nuit);color:var(--texte);font:400 17px/1.65 Manrope,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--bleu-clair)}
a:hover{color:#B9C6FF}
img{max-width:100%;height:auto;display:block}
.entete{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px clamp(16px,4vw,44px);border-bottom:1px solid var(--trait)}
.entete .logo img{height:26px;width:auto}
.entete nav{display:flex;flex-wrap:wrap;gap:4px 22px;font:500 14.5px/1 Manrope,sans-serif}
.entete nav a{color:var(--doux);text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.entete nav a:hover{color:var(--texte)}
.entete .appel{color:#fff;background:var(--bleu);padding:0 18px;border-radius:999px;font-weight:600}
.entete .appel:hover{color:#fff;background:#3D50FF}
main{max-width:860px;margin:0 auto;padding:clamp(36px,7vw,84px) clamp(16px,4vw,40px) 72px}
.fil{font:500 13px/1.4 Manrope,sans-serif;color:var(--pale);margin:0 0 22px}
.fil a{color:var(--pale);text-decoration:none}
.fil a:hover{color:var(--texte)}
.surtitre{font:600 12px/1.4 ui-monospace,Menlo,monospace;letter-spacing:.16em;text-transform:uppercase;color:rgba(143,166,255,.9);margin:0 0 14px}
h1{margin:0 0 20px;font:700 clamp(34px,5.4vw,58px)/1.06 'Space Grotesk',sans-serif;letter-spacing:-.03em;text-wrap:balance}
h2{margin:64px 0 16px;font:700 clamp(25px,3.4vw,34px)/1.15 'Space Grotesk',sans-serif;letter-spacing:-.02em;text-wrap:balance}
h3{margin:28px 0 8px;font:700 19px/1.3 'Space Grotesk',sans-serif}
p{margin:0 0 16px;color:var(--doux)}
p strong,li strong{color:var(--texte);font-weight:600}
.chapo{font-size:19.5px;line-height:1.6;color:rgba(238,241,248,.8)}
ul.liste{margin:0 0 16px;padding-left:1.2em;color:var(--doux)}
ul.liste li{margin:6px 0}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0 0}
.bouton{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;border-radius:14px;background:var(--bleu);color:#fff;font:600 16.5px/1 Manrope,sans-serif;text-decoration:none;white-space:nowrap}
.bouton:hover{background:#3D50FF;color:#fff}
.bouton.second{background:transparent;border:1px solid rgba(255,255,255,.16);color:var(--texte)}
.bouton.second:hover{border-color:rgba(255,255,255,.32);color:var(--texte)}
/* Tableau des formules : colonne Pro mise en avant */
.tableau{width:100%;overflow-x:auto;margin:22px 0 10px;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;font-size:15px}
.tableau.large table{min-width:600px}
th,td{padding:13px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--trait)}
thead th{font:700 17px/1.25 'Space Grotesk',sans-serif;color:var(--texte);border-bottom-color:rgba(255,255,255,.16)}
thead th small{display:block;margin-top:5px;font:600 15px/1.2 Manrope,sans-serif;color:var(--bleu-clair)}
tbody th{font-weight:500;color:var(--pale);width:26%}
td{color:rgba(238,241,248,.82)}
.mis-en-avant{background:rgba(44,62,255,.10)}
thead .mis-en-avant{border-top:2px solid var(--bleu)}
.note{font-size:14px;color:var(--pale)}
/* Étapes */
ol.etapes{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:12px}
ol.etapes li{display:grid;grid-template-columns:44px 1fr;gap:4px 16px;padding:18px;border:1px solid var(--trait);border-radius:16px;background:var(--carte)}
ol.etapes .n{grid-row:span 2;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:rgba(44,62,255,.18);color:var(--bleu-clair);font:700 18px/1 'Space Grotesk',sans-serif}
ol.etapes strong{color:var(--texte);font:700 17px/1.3 'Space Grotesk',sans-serif}
ol.etapes span.t{color:var(--pale);font-size:14px;margin-left:8px;font-family:Manrope,sans-serif;font-weight:500}
ol.etapes p{margin:0}
/* Communes */
ul.communes{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px}
ul.communes li{padding:12px 14px;border:1px solid var(--trait);border-radius:12px;color:rgba(238,241,248,.82);font-size:15.5px}
/* Encadré */
.encadre{margin:26px 0;padding:22px;border:1px solid rgba(143,166,255,.22);border-radius:18px;background:linear-gradient(160deg,rgba(44,62,255,.12),rgba(12,16,32,.6))}
.encadre p:last-child{margin-bottom:0}
/* FAQ */
.faq details{border-bottom:1px solid var(--trait)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:60px;padding:14px 0;font:600 17px/1.4 Manrope,sans-serif;color:var(--texte)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;width:30px;height:30px;border-radius:50%;border:1px solid rgba(255,255,255,.18);display:grid;place-items:center;color:var(--doux);font-weight:400}
.faq details[open] summary::after{content:"−"}
.faq details p{padding:0 0 18px}
/* Pied */
.pied{border-top:1px solid var(--trait);padding:24px clamp(16px,4vw,44px) calc(20px + env(safe-area-inset-bottom));display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;font-size:13.5px;color:var(--pale)}
.pied nav{display:flex;flex-wrap:wrap;gap:0 18px}
.pied a{color:var(--pale);text-decoration:none;display:inline-flex;align-items:center;min-height:36px}
.pied a:hover{color:var(--texte)}
:focus-visible{outline:2px solid var(--bleu-clair);outline-offset:3px;border-radius:6px}
@media (max-width:720px){
  body{font-size:16.5px}
  .entete nav a:not(.appel){display:none}
  h2{margin-top:48px}
  th,td{padding:11px 8px;font-size:14px}
  tbody th{width:auto}
  .pied{justify-content:center;text-align:center;font-size:12px}
  .pied nav{justify-content:center;gap:0 14px}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
