/* Club Internet — feuille de style du site public (v2, design « attirant ») */
:root {
  --marine: #0a1f44; --marine-fonce: #061334; --marine-clair: #12305f;
  --bleu: #2f6df6; --bleu-clair: #e9f0ff; --bleu-doux: #5b8cff;
  --rouge: #e2231a; --rouge-fonce: #b91b13; --orange: #ff7a1a; --jaune: #f5c400; --vert: #22c55e;
  --texte: #0f1a2e; --texte-doux: #55627a; --fond: #ffffff; --fond-doux: #f5f7fb; --bord: #e3e8f1;
  --rayon: 18px; --rayon-petit: 12px;
  --ombre: 0 10px 40px rgba(10, 31, 68, .10); --ombre-forte: 0 30px 80px rgba(10, 31, 68, .22);
  --police: "Inter", "Segoe UI", Helvetica, Arial, sans-serif; --titres: "Sora", "Inter", "Segoe UI", sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
/* L'attribut hidden l'emporte sur toute règle display (sinon un bloc en display:grid resterait visible). */
[hidden] { display: none !important; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--police); color: var(--texte); background: var(--fond); line-height: 1.6; font-size: 17px; }
img, svg { max-width: 100%; height: auto; }
a { color: var(--bleu); }
h1, h2, h3 { font-family: var(--titres); line-height: 1.12; margin: 0 0 .5em; font-weight: 800; letter-spacing: -.02em; }
h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); }
h2 { font-size: clamp(1.7rem, 3.2vw, 2.5rem); }
h3 { font-size: 1.2rem; font-weight: 700; }
p { margin: 0 0 1em; }
code { background: var(--bleu-clair); padding: 2px 6px; border-radius: 6px; font-size: .9em; }
.conteneur { width: min(1180px, 100% - 32px); margin-inline: auto; }
.saut { position: absolute; left: -999px; top: 0; background: var(--marine); color: #fff; padding: 8px 12px; z-index: 100; }
.saut:focus { left: 8px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* Apparition au défilement */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s ease, transform .7s ease; }
.reveal.est-visible { opacity: 1; transform: none; }
.reveal--2 { transition-delay: .12s; } .reveal--3 { transition-delay: .24s; } .reveal--4 { transition-delay: .36s; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; transition: none; } * { animation: none !important; } }

/* Boutons */
.bouton { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 13px 24px; border-radius: 999px; font-weight: 700; text-decoration: none; border: 2px solid transparent; cursor: pointer; font-family: inherit; font-size: 1rem; transition: transform .15s, box-shadow .15s, background .15s, color .15s; }
.bouton:hover { transform: translateY(-2px); }
.bouton--plein { background: var(--rouge); color: #fff; box-shadow: 0 8px 24px rgba(226, 35, 26, .35); }
.bouton--plein:hover { background: var(--rouge-fonce); }
.bouton--bleu { background: var(--bleu); color: #fff; box-shadow: 0 8px 24px rgba(47, 109, 246, .35); }
.bouton--bleu:hover { background: #2358d0; }
.bouton--contour { border-color: var(--marine); color: var(--marine); background: transparent; }
.bouton--contour:hover { background: var(--bleu-clair); }
.bouton--blanc { border-color: rgba(255,255,255,.7); color: #fff; background: rgba(255,255,255,.06); backdrop-filter: blur(6px); }
.bouton--blanc:hover { background: rgba(255,255,255,.16); }
.bouton--grand { padding: 16px 32px; font-size: 1.05rem; }

/* En-tête */
.entete { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.92); backdrop-filter: blur(12px); box-shadow: 0 1px 0 var(--bord); }
.entete__bandeau { background: var(--marine); color: #fff; font-size: .86rem; }
.entete__bandeau a { color: #fff; text-decoration: none; font-weight: 600; }
.entete__bandeau a:hover { text-decoration: underline; }
.entete__bandeau-int { display: flex; justify-content: space-between; gap: 16px; padding: 6px 0; flex-wrap: wrap; }
.entete__int { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 12px 0; }
.entete__logo { color: var(--texte); display: inline-flex; }
.entete__menu { display: none; background: none; border: 2px solid var(--bord); border-radius: 10px; padding: 8px 12px; font: inherit; font-weight: 600; align-items: center; gap: 8px; cursor: pointer; }
.entete__menu-barres { width: 20px; height: 2px; background: var(--texte); position: relative; display: block; }
.entete__menu-barres::before, .entete__menu-barres::after { content: ""; position: absolute; left: 0; width: 20px; height: 2px; background: var(--texte); }
.entete__menu-barres::before { top: -6px; } .entete__menu-barres::after { top: 6px; }
.nav ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 2px; }
.nav a:not(.bouton) { display: block; white-space: nowrap; padding: 10px 13px; text-decoration: none; color: var(--texte); font-weight: 600; border-radius: 8px; position: relative; }
.nav a:not(.bouton):hover { background: var(--fond-doux); }
.nav a[aria-current="page"] { color: var(--bleu); }
.nav a[aria-current="page"]::after { content: ""; position: absolute; left: 13px; right: 13px; bottom: 5px; height: 2px; background: var(--bleu); border-radius: 2px; }
.nav__cta { margin-left: 10px; }
.nav__cta .bouton { padding: 10px 20px; }
@media (max-width: 960px) {
  .entete__bandeau-int span { display: none; }
  .entete__bandeau-int { justify-content: flex-end; }
  .entete__menu { display: inline-flex; }
  .nav { display: none; position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-top: 1px solid var(--bord); box-shadow: var(--ombre); }
  .nav.est-ouvert { display: block; }
  .nav ul { flex-direction: column; align-items: stretch; padding: 8px 16px 16px; }
  .nav a[aria-current="page"]::after { display: none; }
  .nav__cta { margin: 8px 0 0; }
  .nav__cta .bouton { display: flex; }
}

/* Héros */
.heros { position: relative; overflow: hidden; color: #fff; padding: 84px 0 96px; background: radial-gradient(1200px 600px at 85% 10%, rgba(47,109,246,.45), transparent 60%), radial-gradient(800px 500px at 10% 90%, rgba(226,35,26,.28), transparent 60%), linear-gradient(160deg, var(--marine-fonce), var(--marine) 55%, var(--marine-clair)); }
.heros::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px); background-size: 48px 48px; mask-image: radial-gradient(ellipse at center, #000 30%, transparent 75%); pointer-events: none; }
.heros__int { display: grid; grid-template-columns: 1.1fr .9fr; gap: 56px; align-items: center; position: relative; }
.heros__sur { display: inline-flex; align-items: center; gap: 10px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.18); border-radius: 999px; padding: 6px 14px 6px 8px; font-size: .88rem; font-weight: 600; margin-bottom: 22px; }
.heros__sur i { width: 10px; height: 10px; border-radius: 50%; background: var(--vert); box-shadow: 0 0 0 4px rgba(34,197,94,.25); animation: pouls 2s infinite; }
@keyframes pouls { 0%,100% { box-shadow: 0 0 0 4px rgba(34,197,94,.25);} 50% { box-shadow: 0 0 0 9px rgba(34,197,94,.08);} }
.heros h1 { color: #fff; }
.heros h1 em { font-style: normal; background: linear-gradient(90deg, #ffd166, #ff7a1a 60%, #ff4d3d); -webkit-background-clip: text; background-clip: text; color: transparent; }
.heros p { font-size: 1.18rem; color: #c9d6ee; max-width: 560px; }
.heros__actions { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 28px; }
.heros__points { list-style: none; margin: 30px 0 0; padding: 0; display: flex; gap: 10px 22px; flex-wrap: wrap; color: #fff; font-weight: 600; font-size: .95rem; }
.heros__points li { display: inline-flex; align-items: center; gap: 8px; }
.heros__points svg { width: 20px; height: 20px; color: var(--vert); }
.heros__visuel { position: relative; }
.compteur { position: relative; background: linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.05)); border: 1px solid rgba(255,255,255,.16); border-radius: 28px; padding: 30px 26px 26px; box-shadow: var(--ombre-forte); backdrop-filter: blur(10px); }
.compteur svg { width: min(100%, 300px); display: block; margin: 0 auto; }
.compteur__aiguille { transition: transform 1.8s cubic-bezier(.2,.8,.2,1); }
.compteur__arc { transition: stroke-dashoffset 1.8s cubic-bezier(.2,.8,.2,1); }
.compteur.est-lance .compteur__aiguille { transform: rotate(104deg) !important; }
.compteur__depasse { font-family: var(--titres); font-weight: 700; font-size: 1.15rem; text-align: center; margin: 14px 0 0; color: #fff; opacity: 0; transform: translateY(6px); transition: opacity .6s ease 1.6s, transform .6s ease 1.6s; }
.compteur__depasse em { font-style: normal; background: linear-gradient(90deg, #ffd166, #ff7a1a 60%, #ff4d3d); -webkit-background-clip: text; background-clip: text; color: transparent; }
.compteur.est-lance .compteur__depasse { opacity: 1; transform: none; }
.compteur.est-lance .compteur__arc { stroke-dashoffset: 0; }
.compteur__valeur { font-family: var(--titres); font-weight: 800; font-size: 3.4rem; line-height: 1; text-align: center; margin: 10px 0 0; letter-spacing: -.03em; }
.compteur__valeur small { display: block; font-size: 1rem; font-weight: 600; color: #b9c8e6; letter-spacing: .1em; text-transform: uppercase; margin-top: 6px; }
.compteur__legende { text-align: center; color: #c9d6ee; margin: 16px 0 0; font-size: .95rem; }
.puce { position: absolute; background: #fff; color: var(--texte); border-radius: 14px; padding: 10px 14px; font-size: .88rem; font-weight: 600; box-shadow: var(--ombre-forte); display: flex; align-items: center; gap: 10px; animation: flotte 6s ease-in-out infinite; }
.puce svg { width: 22px; height: 22px; color: var(--bleu); flex: none; }
.puce--1 { top: 6%; left: -8%; } .puce--2 { bottom: 4%; right: -7%; animation-delay: -2s; } .puce--3 { bottom: -6%; left: 8%; animation-delay: -4s; }
@keyframes flotte { 0%,100% { transform: translateY(0);} 50% { transform: translateY(-10px);} }
@media (max-width: 900px) { .heros__int { grid-template-columns: 1fr; } .heros { padding: 52px 0 64px; } .heros__visuel { margin-top: 12px; } .puce--1 { left: 0; top: -18px; } .puce--2 { right: 0; bottom: 30%; } .puce--3 { display: none; } }
@media (max-width: 600px) { .puce--1 { display: none; } .puce--2 { top: -18px; bottom: auto; right: 0; } }

/* Bande de confiance */
.confiance { background: #fff; border-bottom: 1px solid var(--bord); }
.confiance__int { display: flex; justify-content: space-between; gap: 20px; padding: 20px 0; flex-wrap: wrap; }
.confiance__item { display: flex; align-items: center; gap: 12px; font-weight: 600; font-size: .95rem; color: var(--texte); }
.confiance__item svg { width: 26px; height: 26px; color: var(--bleu); }

/* Sections */
.section { padding: 84px 0; }
.section--douce { background: var(--fond-doux); }
.section--bleue { background: radial-gradient(900px 500px at 90% 0%, rgba(47,109,246,.35), transparent 60%), var(--marine); color: #fff; }
.section--bleue h2 { color: #fff; }
.section__tete { max-width: 720px; margin-bottom: 40px; }
.section__tete p { color: var(--texte-doux); font-size: 1.1rem; }
.section--bleue .section__tete p { color: #c9d6ee; }
.section__tete--centre { margin-inline: auto; text-align: center; }
.surtitre { display: inline-block; color: var(--rouge); font-weight: 700; text-transform: uppercase; letter-spacing: .12em; font-size: .78rem; margin-bottom: 10px; }
.section--bleue .surtitre { color: var(--jaune); }

/* Bascule mensuel / annuel */
.bascule { display: inline-flex; background: #fff; border: 1px solid var(--bord); border-radius: 999px; padding: 4px; gap: 4px; margin-bottom: 30px; box-shadow: 0 2px 8px rgba(10,31,68,.05); }
.bascule button { border: 0; background: transparent; padding: 10px 20px; border-radius: 999px; font: inherit; font-weight: 700; color: var(--marine); cursor: pointer; transition: background .15s, color .15s; }
.bascule button[aria-pressed="true"] { background: var(--marine); color: #fff; }
.bascule button .eco { display: inline-block; margin-left: 8px; background: var(--vert); color: #fff; font-size: .72rem; padding: 2px 8px; border-radius: 999px; }
.bascule__note { font-size: .92rem; color: var(--texte-doux); margin: -18px 0 26px; }

/* Cartes de forfaits */
.grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(255px, 1fr)); gap: 22px; }
.grille--3 { grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); }
.carte { position: relative; background: #fff; border: 1px solid var(--bord); border-radius: var(--rayon); padding: 28px 24px 24px; display: flex; flex-direction: column; transition: transform .2s, box-shadow .2s, border-color .2s; }
.carte:hover { transform: translateY(-6px); box-shadow: var(--ombre); border-color: #c9d6ee; }
.carte--populaire { border-color: var(--bleu); background: linear-gradient(180deg, #f6f9ff, #fff 40%); box-shadow: 0 0 0 2px var(--bleu) inset, var(--ombre); }
.carte--recommande { border-color: var(--vert); box-shadow: 0 0 0 3px var(--vert) inset, var(--ombre); }
.carte__badge { position: absolute; top: -13px; left: 22px; background: linear-gradient(90deg, var(--bleu), var(--bleu-doux)); color: #fff; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; padding: 5px 12px; border-radius: 999px; }
.carte--recommande .carte__badge { background: var(--vert); }
.carte__titre { font-family: var(--police); font-size: .88rem; color: var(--texte-doux); font-weight: 600; margin-bottom: 8px; text-transform: uppercase; letter-spacing: .06em; }
.carte__vitesse { font-family: var(--titres); font-size: 2.9rem; font-weight: 800; color: var(--marine); margin: 0; line-height: 1; letter-spacing: -.03em; }
.carte__vitesse span { font-size: 1.05rem; font-weight: 600; color: var(--texte-doux); margin-left: 4px; letter-spacing: 0; }
.carte__vitesse--texte { font-size: 1.7rem; letter-spacing: -.01em; }
.carte__detail { font-size: .9rem; color: var(--texte-doux); margin: 10px 0 6px; }
.carte__usage { font-size: .95rem; margin: 0 0 14px; }
.carte__prix { font-family: var(--titres); font-size: 2rem; font-weight: 800; margin: auto 0 4px; padding-top: 14px; border-top: 1px dashed var(--bord); letter-spacing: -.02em; }
.carte__periode { font-family: var(--police); font-size: 1rem; font-weight: 500; color: var(--texte-doux); }
.carte__note { font-size: .82rem; color: var(--texte-doux); margin-bottom: 18px; min-height: 2.4em; }
.carte .bouton { text-align: center; }
.mention { font-size: .9rem; color: var(--texte-doux); margin-top: 26px; }

/* Assistant « quelle vitesse » */
.assistant { background: #fff; border: 1px solid var(--bord); border-radius: var(--rayon); padding: 28px; box-shadow: var(--ombre); display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: start; margin-bottom: 40px; }
.assistant h3 { margin-bottom: 14px; }
.choix { display: flex; flex-wrap: wrap; gap: 8px; }
.choix button { border: 1.5px solid var(--bord); background: #fff; border-radius: 999px; padding: 9px 16px; font: inherit; font-weight: 600; cursor: pointer; color: var(--texte); transition: all .15s; }
.choix button:hover { border-color: var(--bleu); color: var(--bleu); }
.choix button[aria-pressed="true"] { background: var(--marine); border-color: var(--marine); color: #fff; }
.assistant__resultat { background: var(--bleu-clair); border-radius: var(--rayon-petit); padding: 20px 22px; min-height: 100%; }
.assistant__resultat strong { font-family: var(--titres); font-size: 1.5rem; color: var(--marine); display: block; margin-bottom: 4px; }
.assistant__resultat p { margin: 0 0 12px; color: var(--texte-doux); font-size: .95rem; }
@media (max-width: 760px) { .assistant { grid-template-columns: 1fr; } }

/* Ce que la vitesse permet */
.usages { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 18px; }
.usage { background: #fff; border-radius: var(--rayon); padding: 22px; border: 1px solid var(--bord); text-align: center; }
.usage svg { width: 44px; height: 44px; color: var(--bleu); margin-bottom: 10px; }
.usage strong { display: block; font-family: var(--titres); font-size: 1.05rem; margin-bottom: 4px; }
.usage span { color: var(--texte-doux); font-size: .9rem; }

/* Avantages */
.avantages { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 22px; }
.avantage { background: #fff; border-radius: var(--rayon); padding: 28px; border: 1px solid var(--bord); transition: transform .2s, box-shadow .2s; }
.avantage:hover { transform: translateY(-4px); box-shadow: var(--ombre); }
.avantage__icone { width: 52px; height: 52px; border-radius: 14px; background: linear-gradient(135deg, var(--bleu-clair), #fff); border: 1px solid var(--bord); color: var(--bleu); display: grid; place-items: center; margin-bottom: 16px; }
.avantage__icone svg { width: 26px; height: 26px; }
.avantage h3 { font-size: 1.1rem; }
.avantage p { color: var(--texte-doux); font-size: .95rem; margin: 0; }
.avantage p a { font-weight: 600; }

/* Étapes */
.etapes { counter-reset: etape; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 28px; position: relative; }
.etape { position: relative; padding-top: 64px; }
.etape::before { counter-increment: etape; content: counter(etape); position: absolute; top: 0; left: 0; width: 46px; height: 46px; border-radius: 14px; background: linear-gradient(135deg, var(--rouge), var(--orange)); color: #fff; font-family: var(--titres); font-weight: 800; display: grid; place-items: center; box-shadow: 0 8px 20px rgba(226,35,26,.35); }
.etape h3 { font-size: 1.05rem; }
.etape p { color: var(--texte-doux); font-size: .95rem; margin: 0; }
.section--bleue .etape p { color: #c9d6ee; }

/* Téléphonie (accueil) */
.tel-visuel { position: relative; display: grid; place-items: center; }
.tel-visuel svg { width: min(100%, 420px); }

/* Bandeau d'appel */
.appel { position: relative; overflow: hidden; background: linear-gradient(120deg, var(--rouge), var(--orange)); color: #fff; border-radius: 26px; padding: 48px; display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; box-shadow: 0 20px 60px rgba(226,35,26,.3); }
.appel::after { content: ""; position: absolute; right: -80px; top: -80px; width: 320px; height: 320px; border-radius: 50%; background: rgba(255,255,255,.12); }
.appel > * { position: relative; }
.appel h2 { color: #fff; margin: 0 0 6px; font-size: 1.7rem; }
.appel p { margin: 0; opacity: .95; }
.appel .bouton--blanc { border-color: #fff; }

/* Pages intérieures */
.bandeau-page { position: relative; overflow: hidden; background: radial-gradient(900px 400px at 90% 0%, rgba(47,109,246,.4), transparent 60%), linear-gradient(160deg, var(--marine-fonce), var(--marine)); color: #fff; padding: 64px 0; }
.bandeau-page::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px); background-size: 48px 48px; mask-image: radial-gradient(ellipse at 70% 50%, #000 20%, transparent 70%); }
.bandeau-page .conteneur { position: relative; }
.bandeau-page h1 { color: #fff; margin-bottom: 10px; }
.bandeau-page p { color: #c9d6ee; font-size: 1.12rem; max-width: 720px; margin: 0; }
.prose { max-width: 760px; }
.prose h2 { font-size: 1.5rem; margin-top: 2em; }
.prose h3 { font-size: 1.15rem; margin-top: 1.5em; }
.prose ul, .prose ol { padding-left: 1.3em; }
.prose li { margin-bottom: .45em; }
.encadre { background: var(--bleu-clair); border-left: 4px solid var(--bleu); border-radius: 10px; padding: 18px 22px; margin: 22px 0; }
.deux-colonnes { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; }
@media (max-width: 800px) { .deux-colonnes { grid-template-columns: 1fr; } }

/* FAQ */
.faq details { border: 1px solid var(--bord); border-radius: 14px; padding: 0 22px; margin-bottom: 10px; background: #fff; transition: box-shadow .2s; }
.faq details[open] { box-shadow: var(--ombre); border-color: #c9d6ee; }
.faq summary { cursor: pointer; font-weight: 600; padding: 18px 0; list-style: none; display: flex; justify-content: space-between; gap: 16px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; color: var(--bleu); font-weight: 800; font-size: 1.4rem; line-height: 1; flex: none; }
.faq details[open] summary::after { content: "–"; }
.faq details > *:not(summary) { color: var(--texte-doux); }
.faq details > p:last-child, .faq details > ul:last-child, .faq details > ol:last-child { padding-bottom: 18px; }
.faq h2 { margin-top: 2em; font-size: 1.4rem; }
.faq h2:first-of-type { margin-top: 0; }

/* Formulaires */
.formulaire { background: #fff; border: 1px solid var(--bord); border-radius: var(--rayon); padding: 30px; box-shadow: var(--ombre); }
.champ { margin-bottom: 16px; }
.champ label { display: block; font-weight: 600; margin-bottom: 6px; font-size: .95rem; }
.champ input, .champ select, .champ textarea { width: 100%; padding: 13px 15px; border: 1.5px solid var(--bord); border-radius: 12px; font: inherit; color: var(--texte); background: #fff; }
.champ input:focus, .champ select:focus, .champ textarea:focus { outline: 3px solid rgba(47,109,246,.2); border-color: var(--bleu); }
.champ__aide { font-size: .85rem; color: var(--texte-doux); margin: 6px 0 0; }
.champs-ligne { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 560px) { .champs-ligne { grid-template-columns: 1fr; } }
.formulaire__etat { margin-top: 16px; font-weight: 600; }
.formulaire__etat--ok { color: #15803d; }
.formulaire__etat--erreur { color: var(--rouge); }
fieldset { border: 0; padding: 0; margin: 0 0 16px; }
legend { font-weight: 600; margin-bottom: 8px; font-size: .95rem; }
.radios { display: flex; gap: 10px; flex-wrap: wrap; }
.radios label { display: inline-flex; gap: 8px; align-items: center; border: 1.5px solid var(--bord); border-radius: 12px; padding: 10px 14px; cursor: pointer; font-weight: 500; }
.radios input { accent-color: var(--bleu); }

/* Bureaux */
.bureaux { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.bureau { background: #fff; border: 1px solid var(--bord); border-radius: var(--rayon); padding: 26px; }
.bureau h3 { margin-bottom: 8px; }
.bureau p { margin: 0 0 8px; color: var(--texte-doux); }
.bureau a { font-weight: 600; }
@media (max-width: 640px) { .bureaux { grid-template-columns: 1fr; } }

/* Listes */
.options { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.option { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; background: #fff; border: 1px solid var(--bord); border-radius: 14px; padding: 16px 20px; }
.option p { margin: 4px 0 0; font-size: .92rem; color: var(--texte-doux); }
.option__prix { white-space: nowrap; font-family: var(--titres); font-weight: 800; color: var(--marine); font-size: 1.15rem; }
.option__prix small { font-family: var(--police); font-weight: 500; color: var(--texte-doux); font-size: .8rem; }
.coches { list-style: none; padding: 0; margin: 0; columns: 2; gap: 24px; }
.coches li { break-inside: avoid; padding: 7px 0 7px 30px; position: relative; }
.coches li::before { content: ""; position: absolute; left: 0; top: 9px; width: 20px; height: 20px; border-radius: 50%; background: var(--vert); mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='12'/%3E%3C/svg%3E"); }
.coches li::after { content: ""; position: absolute; left: 6px; top: 14px; width: 8px; height: 5px; border-left: 2.5px solid #fff; border-bottom: 2.5px solid #fff; transform: rotate(-45deg); }
@media (max-width: 600px) { .coches { columns: 1; } .option { flex-direction: column; gap: 8px; } }

/* Pied de page */
.pied { background: var(--marine-fonce); color: #b9c8e6; padding: 64px 0 24px; }
.pied__grille { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.3fr; gap: 36px; }
.pied__logo { color: #fff; display: inline-flex; margin-bottom: 12px; }
.pied__titre { font-family: var(--police); color: #fff; font-size: .9rem; margin-bottom: 14px; text-transform: uppercase; letter-spacing: .1em; }
.pied ul { list-style: none; padding: 0; margin: 0; }
.pied li { margin-bottom: 9px; }
.pied a { color: #fff; text-decoration: none; }
.pied a:hover { text-decoration: underline; }
.pied address { font-style: normal; }
.pied address p { margin-bottom: 12px; }
.pied__bas { border-top: 1px solid rgba(255,255,255,.1); margin-top: 44px; padding-top: 20px; font-size: .88rem; }
@media (max-width: 900px) { .pied__grille { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .pied__grille { grid-template-columns: 1fr; } }

/* Résultat de la vérification d'adresse */
.resultat { margin-top: 18px; border-radius: var(--rayon-petit); padding: 20px 22px; }
.resultat__oui, .resultat__non, .resultat__doute { display: grid; gap: 8px; }
.resultat__oui { color: #14532d; } .resultat__non { color: #7c2d12; } .resultat__doute { color: var(--marine); }
.resultat[data-etat="oui"] { background: #ecfdf3; border: 1px solid #a7f3c8; }
.resultat[data-etat="non"] { background: #fff4ec; border: 1px solid #fed7aa; }
.resultat[data-etat="doute"] { background: var(--bleu-clair); border: 1px solid #c7d7fb; }
.resultat strong { font-family: var(--titres); font-size: 1.1rem; }
.resultat p { margin: 0; }
.resultat .bouton { justify-self: start; margin-top: 6px; }

/* Bandeau de l'offre annuelle */
.promo { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; margin-top: 28px; padding: 22px 26px; border-radius: var(--rayon); background: linear-gradient(120deg, #fff7e6, #ffefd5); border: 1px solid #ffd9a3; }
.promo__icone { width: 52px; height: 52px; border-radius: 14px; background: #fff; color: var(--orange); display: grid; place-items: center; flex: none; box-shadow: 0 6px 16px rgba(255,122,26,.2); }
.promo__icone svg { width: 26px; height: 26px; }
.promo > div:not(.promo__icone) { flex: 1; min-width: 240px; }
.promo strong { font-family: var(--titres); font-size: 1.15rem; display: block; margin-bottom: 4px; color: var(--marine); }
.promo p { margin: 0; color: var(--texte-doux); font-size: .95rem; }