/* ===========================================================
   avocats-paies.fr — feuille de style
   Palette : Bleu nuit #0D2A4D · Or #D4A017 · Gris #6B7480 · Blanc cassé #F7F5F0
   =========================================================== */

:root{
  --navy: #0D2A4D;
  --navy-2: #14335c;
  --navy-tint: #F4F6F9;
  --gold: #D4A017;
  --gold-dark: #A97F0E;
  --grey: #6B7480;
  --cream: #FBFAF7;
  --white: #FFFFFF;
  --ink: #16233A;
  --line: #E3E1D9;

  --font-display: "Playfair Display", Georgia, "Times New Roman", serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --container: 1180px;
  --container-narrow: 800px;
  --shadow-sm: 0 1px 3px rgba(13,42,77,.08);
  --shadow-md: 0 16px 40px rgba(13,42,77,.14);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--white);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{margin:0;padding:0;list-style:none;}
h1,h2,h3,h4{font-family:var(--font-display);color:var(--navy);margin:0 0 .5em;font-weight:600;letter-spacing:-.01em;line-height:1.2;}
p{margin:0 0 1em;}
.container{max-width:var(--container);margin:0 auto;padding:0 24px;}
.container-narrow{max-width:var(--container-narrow);margin:0 auto;padding:0 24px;}

:focus-visible{outline:2px solid var(--gold);outline-offset:3px;}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important;}
}

.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold-dark);font-weight:600;margin-bottom:16px;
}
.eyebrow::before{content:"";width:24px;height:1px;background:var(--gold);display:inline-block;}

.section-head{max-width:700px;margin-bottom:52px;}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center;}
.section-head h2{font-size:clamp(28px,3.4vw,40px);}
.section-head .lead{color:var(--grey);font-size:17px;margin-top:14px;}

section{padding:96px 0;}
.bg-tint{background:var(--navy-tint);}
.bg-cream{background:var(--cream);}
.bg-navy{background:var(--navy);color:#C7D2E0;}
.bg-navy h2,.bg-navy h3,.bg-navy h4{color:var(--white);}
.bg-navy .lead{color:#B9C6D8;}

.divider{height:1px;background:var(--line);border:0;margin:0;}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 28px;border-radius:2px;font-weight:600;font-size:14.5px;
  cursor:pointer;border:1px solid transparent;transition:transform .15s ease,box-shadow .15s ease,background .15s ease,border-color .15s ease;
  white-space:nowrap;letter-spacing:.02em;
}
.btn:hover{transform:translateY(-1px);}
.btn-gold{background:var(--gold);color:var(--navy);border-color:var(--gold);}
.btn-gold:hover{background:var(--gold-dark);border-color:var(--gold-dark);box-shadow:var(--shadow-md);}
.btn-outline{background:transparent;color:var(--white);border-color:rgba(255,255,255,.35);}
.btn-outline:hover{border-color:var(--white);background:rgba(255,255,255,.08);}
.btn-navy-outline{background:transparent;color:var(--navy);border-color:var(--navy);}
.btn-navy-outline:hover{background:var(--navy);color:var(--white);}
.btn[disabled]{opacity:.6;cursor:not-allowed;transform:none;}

/* ---------- Header ---------- */
.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(255,255,255,.94);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.site-header .container{display:flex;align-items:center;justify-content:space-between;height:92px;}
.brand img{height:64px;width:auto;}
.main-nav{display:flex;align-items:center;gap:30px;}
.main-nav a{font-size:13.5px;font-weight:500;color:var(--navy);position:relative;padding:4px 0;letter-spacing:.01em;}
.main-nav a::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .2s ease;}
.main-nav a:hover::after{transform:scaleX(1);}
.header-cta{display:flex;align-items:center;gap:16px;}
.header-cta .phone{font-size:13.5px;font-weight:600;color:var(--navy);display:flex;align-items:center;gap:6px;}
.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:8px;}
.nav-toggle span{display:block;width:24px;height:2px;background:var(--navy);margin:5px 0;transition:.2s;}

/* ---------- Hero ---------- */
.hero{
  position:relative;
  background:
    radial-gradient(1100px 500px at 88% -10%, rgba(212,160,23,.16), transparent 60%),
    linear-gradient(180deg,var(--navy) 0%,var(--navy-2) 100%);
  color:#C7D2E0;
  padding:100px 0 0;
  overflow:hidden;
}
.hero-inner{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center;padding-bottom:76px;}
.hero .eyebrow{color:var(--gold);}
.hero .eyebrow::before{background:var(--gold);}
.hero h1{
  color:var(--white);font-size:clamp(32px,4vw,48px);line-height:1.15;letter-spacing:-.01em;
  margin-bottom:22px;
}
.hero h1 em{color:var(--gold);font-style:italic;}
.hero .lead{font-size:18px;color:#C7D2E0;max-width:560px;margin-bottom:16px;}
.hero p.sub{color:#9FB0C6;max-width:560px;}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin:28px 0;}
.hero-note{font-size:13px;color:#8FA0B8;display:flex;align-items:center;gap:8px;}

.hero-panel{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  border-radius:4px;padding:32px;backdrop-filter:blur(6px);
}
.hero-panel h3{color:var(--white);font-size:16px;margin-bottom:18px;letter-spacing:.02em;}
.hero-check{display:grid;gap:14px;}
.hero-check li{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:#DDE6F0;}
.hero-check svg{flex:none;margin-top:2px;color:var(--gold);}

.hero-strip{border-top:1px solid rgba(255,255,255,.12);padding:22px 0;}
.hero-strip .container{display:flex;flex-wrap:wrap;gap:14px 34px;justify-content:space-between;align-items:center;}
.hero-strip span{font-size:12.5px;color:#8FA0B8;letter-spacing:.03em;}
.hero-strip strong{color:var(--white);font-weight:600;}

/* ---------- Checklist grid ---------- */
.check-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);overflow:hidden;}
.check-grid li{background:var(--white);padding:22px 24px;display:flex;gap:12px;align-items:flex-start;font-size:14.5px;font-weight:500;color:var(--ink);}
.check-grid svg{flex:none;color:var(--gold-dark);margin-top:3px;}

/* ---------- Cards ---------- */
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.value-card{
  background:var(--white);border:1px solid var(--line);padding:34px 30px;
  transition:box-shadow .2s ease,transform .2s ease,border-color .2s ease;
}
.value-card:hover{box-shadow:var(--shadow-md);transform:translateY(-3px);border-color:transparent;}
.value-icon{
  width:46px;height:46px;border-radius:50%;background:var(--navy-tint);
  display:flex;align-items:center;justify-content:center;color:var(--navy);margin-bottom:18px;
}
.value-card h3{font-size:18px;margin-bottom:10px;}
.value-card p{color:var(--grey);font-size:14.5px;margin:0;}

/* ---------- Prestations (accordion-like list) ---------- */
.service-list{display:flex;flex-direction:column;}
.service-row{display:grid;grid-template-columns:260px 1fr;gap:32px;padding:36px 0;border-top:1px solid var(--line);}
.service-list .service-row:last-child{border-bottom:1px solid var(--line);}
.service-row .tag{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-dark);font-weight:700;}
.service-row h3{font-size:20px;margin:6px 0 0;}
.service-row .desc ul{margin-top:12px;display:grid;grid-template-columns:1fr 1fr;gap:6px 24px;}
.service-row .desc li{position:relative;padding-left:16px;font-size:13.5px;color:var(--ink);}
.service-row .desc li::before{content:"";position:absolute;left:0;top:8px;width:5px;height:5px;background:var(--gold);border-radius:50%;}
.service-row .desc p{color:var(--grey);font-size:15px;}

/* ---------- Méthode / étapes ---------- */
.steps{display:grid;gap:0;}
.step-row{display:grid;grid-template-columns:70px 1fr;gap:26px;padding:30px 0;border-top:1px solid var(--line);}
.steps .step-row:last-child{border-bottom:1px solid var(--line);}
.step-row .idx{font-family:var(--font-display);font-size:28px;color:var(--gold-dark);font-weight:600;font-style:italic;}
.step-row h3{font-size:18px;margin-bottom:6px;}
.step-row p{color:var(--grey);font-size:14.5px;margin:0;}

/* ---------- Conventions collectives ---------- */
.topic-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;}
.topic-card{background:var(--white);border:1px solid var(--line);padding:26px 28px;}
.topic-card h4{font-size:15.5px;margin-bottom:8px;color:var(--navy);}
.topic-card p{font-size:13.5px;color:var(--grey);margin:0;}

/* ---------- Audit / URSSAF timeline ---------- */
.audit-phases{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.audit-phase{background:var(--white);border:1px solid var(--line);padding:28px;}
.audit-phase .ph-label{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-dark);font-weight:700;margin-bottom:12px;}
.audit-phase ul{display:grid;gap:8px;}
.audit-phase li{font-size:13.5px;color:var(--ink);position:relative;padding-left:16px;}
.audit-phase li::before{content:"";position:absolute;left:0;top:8px;width:5px;height:5px;background:var(--gold);border-radius:50%;}

/* ---------- FAQ Accordion ---------- */
.faq-list{max-width:820px;margin:0 auto;}
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{
  width:100%;text-align:left;background:none;border:0;padding:22px 4px;cursor:pointer;
  display:flex;justify-content:space-between;align-items:center;gap:20px;
  font-family:var(--font-display);font-size:17px;color:var(--navy);font-weight:600;
}
.faq-q .plus{flex:none;width:22px;height:22px;position:relative;}
.faq-q .plus::before,.faq-q .plus::after{content:"";position:absolute;background:var(--gold-dark);transition:transform .2s ease;}
.faq-q .plus::before{left:0;top:50%;width:100%;height:2px;transform:translateY(-50%);}
.faq-q .plus::after{top:0;left:50%;width:2px;height:100%;transform:translateX(-50%);}
.faq-item.open .plus::after{transform:translateX(-50%) rotate(90deg);opacity:0;}
.faq-a{max-height:0;overflow:hidden;transition:max-height .25s ease;}
.faq-a p{padding:0 4px 22px;color:var(--grey);font-size:15px;max-width:700px;}
.faq-item.open .faq-a{max-height:400px;}

/* ---------- Articles grid ---------- */
.article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.article-card{background:var(--white);border:1px solid var(--line);display:flex;flex-direction:column;transition:box-shadow .2s ease,transform .2s ease;}
.article-card:hover{box-shadow:var(--shadow-md);transform:translateY(-3px);}
.article-card .art-num{font-family:var(--font-display);font-style:italic;color:var(--gold-dark);font-size:22px;padding:24px 26px 0;}
.article-card h3{font-size:16.5px;padding:10px 26px 0;margin-bottom:10px;line-height:1.35;}
.article-card p{font-size:13.5px;color:var(--grey);padding:0 26px;flex:1;}
.article-card .art-link{padding:18px 26px 26px;font-size:13px;font-weight:600;color:var(--navy);display:flex;align-items:center;gap:6px;}
.article-card .art-link svg{transition:transform .15s ease;}
.article-card:hover .art-link svg{transform:translateX(3px);}
.articles-cta{margin-top:48px;text-align:center;}

/* ---------- Ils nous font confiance / chiffres ---------- */
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.14);border-radius:4px;overflow:hidden;}
.stat-card{background:var(--navy-2);padding:36px 24px;text-align:center;}
.stat-card .num{font-family:var(--font-display);font-size:40px;color:var(--gold);font-weight:600;}
.stat-card .label{font-size:12.5px;color:#B9C6D8;margin-top:8px;letter-spacing:.02em;}
.trust-check{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 32px;margin-top:44px;max-width:760px;margin-left:auto;margin-right:auto;}
.trust-check li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;color:#DDE6F0;}
.trust-check svg{flex:none;color:var(--gold);margin-top:3px;}

/* ---------- Contact ---------- */
.contact-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;}
.coord-card{background:var(--navy);color:#C7D2E0;padding:36px;margin-top:28px;}
.coord-card h3{color:var(--white);font-size:16px;margin-bottom:20px;}
.coord-row{display:flex;gap:14px;padding:13px 0;border-top:1px solid rgba(255,255,255,.12);}
.coord-card .coord-row:first-of-type{border-top:none;}
.coord-row svg{flex:none;color:var(--gold);margin-top:2px;}
.coord-row .label{font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;color:#8FA0B8;margin-bottom:2px;}
.coord-row a, .coord-row div.val{font-size:14.5px;color:var(--white);font-weight:500;}

.contact-card{background:var(--white);border:1px solid var(--line);padding:40px;box-shadow:var(--shadow-sm);}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.form-grid .full{grid-column:1 / -1;}
.field{display:flex;flex-direction:column;gap:6px;}
.field label{font-size:12.5px;font-weight:600;color:var(--navy);letter-spacing:.02em;}
.field input,.field select,.field textarea{
  border:1px solid var(--line);border-radius:2px;padding:12px 14px;font-size:14.5px;font-family:inherit;
  color:var(--ink);background:var(--white);transition:border-color .15s ease,box-shadow .15s ease;
}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(212,160,23,.15);
}
.field textarea{resize:vertical;min-height:110px;}
.radio-group,.checkbox-group{display:flex;flex-wrap:wrap;gap:10px;}
.radio-group label,.checkbox-group label{
  display:flex;align-items:center;gap:7px;font-size:13px;font-weight:500;color:var(--ink);
  border:1px solid var(--line);padding:9px 14px;border-radius:20px;cursor:pointer;transition:border-color .15s ease,background .15s ease;
}
.radio-group input:checked + span, .checkbox-group input:checked + span{color:var(--navy);font-weight:600;}
.radio-group label:has(input:checked), .checkbox-group label:has(input:checked){border-color:var(--gold);background:rgba(212,160,23,.08);}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;color:var(--grey);margin:8px 0 4px;}
.consent input{margin-top:3px;}
.hp-field{position:absolute;left:-9999px;top:-9999px;}
.form-msg{margin-top:16px;padding:14px 16px;border-radius:2px;font-size:14px;display:none;}
.form-msg.show{display:block;}
.form-msg.ok{background:#EAF6EC;color:#1E5C2A;border:1px solid #BFE3C6;}
.form-msg.err{background:#FBEAEA;color:#8A2323;border:1px solid #F2C6C6;}
.form-actions{margin-top:22px;display:flex;align-items:center;gap:16px;}
.spinner{width:16px;height:16px;border:2px solid rgba(13,42,77,.25);border-top-color:var(--navy);border-radius:50%;animation:spin .7s linear infinite;display:none;}
.spinner.show{display:inline-block;}
@keyframes spin{to{transform:rotate(360deg);}}
.after-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:44px;}
.after-step{text-align:center;}
.after-step .idx{font-family:var(--font-display);font-style:italic;color:var(--gold-dark);font-size:24px;margin-bottom:8px;}
.after-step p{font-size:13px;color:var(--grey);margin:0;}

/* ---------- CTA bands ---------- */
.cta-band{background:var(--navy);color:var(--white);text-align:center;}
.cta-band h2{color:var(--white);}
.cta-band .lead{color:#B9C6D8;max-width:600px;margin:0 auto 32px;}
.cta-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;}

/* ---------- Footer (3 niveaux) ---------- */
.footer-cta{background:var(--navy-2);padding:56px 0;text-align:center;border-top:1px solid rgba(255,255,255,.08);}
.footer-cta h3{color:var(--white);font-size:24px;margin-bottom:20px;}
.site-footer{background:#081A30;color:#9FB0C6;padding:64px 0 0;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;padding-bottom:44px;}
.footer-brand{display:flex;align-items:center;gap:12px;margin-bottom:16px;}
.footer-brand img{height:52px;}
.footer-grid p{font-size:13.5px;color:#7E93AC;max-width:280px;}
.footer-col h4{color:var(--white);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:16px;}
.footer-col li{margin-bottom:10px;font-size:13.5px;}
.footer-col a:hover{color:var(--gold);}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1);padding:22px 0;
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:12px;color:#7E93AC;
}
.footer-bottom-links{display:flex;flex-wrap:wrap;gap:6px 16px;}
.footer-bottom a:hover{color:var(--gold);}

/* ---------- Article page ---------- */
.article-hero{background:var(--navy-tint);padding:56px 0 40px;}
.article-hero .kicker{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-dark);font-weight:700;margin-bottom:14px;}
.article-hero h1{font-size:clamp(26px,3.6vw,38px);max-width:820px;}
.article-hero .meta{color:var(--grey);font-size:13.5px;margin-top:14px;}
.article-body{max-width:760px;margin:0 auto;padding:56px 24px 40px;}
.article-body h1{font-size:24px;margin-top:2.2em;}
.article-body h1:first-child{margin-top:0;}
.article-body h2{font-size:19px;margin-top:1.6em;color:var(--navy);}
.article-body h3{font-size:16.5px;margin-top:1.4em;}
.article-body p{color:var(--ink);font-size:16px;line-height:1.75;}
.article-body ul{margin:0 0 1.2em;padding-left:0;}
.article-body li{position:relative;padding-left:20px;font-size:16px;line-height:1.7;margin-bottom:8px;color:var(--ink);}
.article-body li::before{content:"";position:absolute;left:0;top:11px;width:6px;height:6px;background:var(--gold);border-radius:50%;}
.article-body blockquote{border-left:3px solid var(--gold);padding:4px 0 4px 20px;margin:24px 0;color:var(--grey);font-style:italic;}
.article-body table{width:100%;border-collapse:collapse;margin:20px 0;font-size:14.5px;}
.article-body table th,.article-body table td{border:1px solid var(--line);padding:9px 12px;text-align:left;}
.article-body table th{background:var(--navy-tint);}
.legal-updated{color:var(--grey);font-size:13.5px;margin-bottom:6px;}
.form-consent{display:flex;align-items:flex-start;gap:10px;margin:16px 0;font-size:13.5px;color:var(--ink);}
.form-consent input[type="checkbox"]{margin-top:4px;flex-shrink:0;width:16px;height:16px;}
.form-consent label a{text-decoration:underline;}
.article-body hr{border:0;border-top:1px solid var(--line);margin:40px 0;}
.article-body strong{color:var(--navy);}
.article-cta{background:var(--navy);color:var(--white);padding:44px;text-align:center;margin-top:40px;}
.article-cta h3{color:var(--white);font-size:20px;}
.article-cta p{color:#C7D2E0;max-width:560px;margin:0 auto 24px;}
.article-nav{max-width:760px;margin:0 auto;padding:0 24px 60px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;}
.article-nav a{font-size:13.5px;font-weight:600;color:var(--navy);display:flex;align-items:center;gap:8px;}
.back-home{max-width:760px;margin:0 auto;padding:28px 24px 0;}
.back-home a{font-size:13px;color:var(--grey);display:inline-flex;align-items:center;gap:6px;}
.back-home a:hover{color:var(--navy);}

/* ---------- Responsive ---------- */
@media (max-width:960px){
  .hero-inner{grid-template-columns:1fr;}
  .check-grid{grid-template-columns:repeat(2,1fr);}
  .card-grid{grid-template-columns:repeat(2,1fr);}
  .contact-wrap{grid-template-columns:1fr;}
  .article-grid{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .stats-row{grid-template-columns:repeat(2,1fr);}
  .audit-phases{grid-template-columns:1fr;}
  .topic-grid{grid-template-columns:1fr;}
  .after-steps{grid-template-columns:repeat(2,1fr);}
  .service-row{grid-template-columns:1fr;gap:10px;}
}
@media (max-width:720px){
  .main-nav,.header-cta .phone{display:none;}
  .nav-toggle{display:block;}
  .site-header .container{height:78px;}
  .brand img{height:50px;}
  .check-grid{grid-template-columns:1fr;}
  .card-grid{grid-template-columns:1fr;}
  .article-grid{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;}
  .stats-row{grid-template-columns:1fr 1fr;}
  .form-grid{grid-template-columns:1fr;}
  .trust-check{grid-template-columns:1fr;}
  .service-row .desc ul{grid-template-columns:1fr;}
  .after-steps{grid-template-columns:1fr;}
  section{padding:64px 0;}
  .cta-actions{flex-direction:column;align-items:stretch;}
}

.mobile-nav{
  position:fixed;inset:78px 0 0 0;background:var(--white);z-index:99;
  transform:translateX(100%);transition:transform .25s ease;padding:28px 24px;overflow-y:auto;
}
.mobile-nav.open{transform:translateX(0);}
.mobile-nav a{display:block;padding:16px 0;font-size:17px;font-weight:600;color:var(--navy);border-bottom:1px solid var(--line);}
.mobile-nav .btn{margin-top:24px;width:100%;}

/* =========================================================================
   BLOCS DES PAGES GÉNÉRÉES (inc/page.php)
   Ajouté après audit : ces classes étaient utilisées par le gabarit sans
   jamais avoir été définies ici. Le bloc d'appel sortait sans mise en forme
   et les montants n'étaient pas distingués du texte courant.
   ========================================================================= */

/* ---------- Valeurs chiffrées : lien vers la fiche des barèmes ---------- */
.valeur{
  font-weight:600;color:var(--navy);text-decoration:none;
  border-bottom:1px dashed var(--gold-dark);padding-bottom:1px;
  white-space:nowrap;
}
.valeur:hover{color:var(--gold-dark);border-bottom-style:solid;}
.valeur-date{color:var(--grey);font-size:.9em;white-space:nowrap;}

/* ---------- Bloc d'appel en fin de page ---------- */
.cta-block{
  background:var(--navy-tint);border-left:3px solid var(--gold);
  padding:32px 34px;margin:48px 0 36px;
}
.cta-block h2{margin-top:0;font-size:clamp(21px,2.4vw,26px);}
.cta-block p{color:var(--grey);max-width:700px;}
.cta-block .cta-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:0;margin-top:22px;}
.cta-block .cta-actions .btn{margin:0;}

/* ---------- Mention de bas de page ---------- */
.small{font-size:13.5px;line-height:1.6;}
.muted{color:var(--grey);}
.article-body .small.muted{border-top:1px solid var(--line);padding-top:18px;margin-top:36px;}

/* ---------- Liste « À lire aussi » ---------- */
.liste-voisines{list-style:none;padding:0;margin:0 0 8px;}
.liste-voisines li{border-bottom:1px solid var(--line);}
.liste-voisines li:last-child{border-bottom:0;}
.liste-voisines a{display:block;padding:13px 0;font-weight:500;color:var(--navy);}
.liste-voisines a:hover{color:var(--gold-dark);}

/* ---------- Bouton compact, utilisé dans l'en-tête ---------- */
.btn-sm{padding:9px 16px;font-size:13px;}

/* Les réponses des pages générées sont plus longues que celles de l'accueil :
   400 px tronquaient la fin de plusieurs d'entre elles. */
.faq-item.open .faq-a{max-height:900px;}

@media (max-width:700px){
  .cta-block{padding:26px 22px;}
  .cta-block .cta-actions .btn{width:100%;justify-content:center;}
}

/* ---------- Fiche des barèmes ---------- */
.table-baremes-enveloppe{overflow-x:auto;margin:0 0 38px;}
.table-baremes{width:100%;border-collapse:collapse;font-size:14.5px;min-width:640px;}
.table-baremes th,.table-baremes td{
  text-align:left;padding:13px 16px;border-bottom:1px solid var(--line);vertical-align:top;
}
.table-baremes thead th{
  background:var(--navy-tint);font-family:var(--font-body);font-size:12px;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;color:var(--navy);white-space:nowrap;
}
.table-baremes tbody th{font-weight:600;color:var(--navy);font-family:var(--font-body);}
.table-baremes tbody tr:target{background:#FDF7E6;}
.table-baremes .bareme-valeur{
  font-family:var(--font-display);font-size:20px;font-weight:600;
  color:var(--gold-dark);white-space:nowrap;
}
.table-baremes .bareme-date{color:var(--grey);white-space:nowrap;font-size:13.5px;}
.bareme-calcul,.bareme-source{display:block;color:var(--grey);font-size:13px;margin-top:5px;}
.bareme-source a{color:var(--grey);text-decoration:underline;}
.bareme-source a:hover{color:var(--gold-dark);}

/* ---------- Lien vers une page pas encore publiée ---------- */
.lien-a-venir{color:var(--grey);font-style:italic;}
.lien-a-venir::after{content:" (page en préparation)";font-size:.9em;}
.lien-suite{font-weight:600;}

/* ---------- Titre visible des seuls lecteurs d'écran ---------- */
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

/* =========================================================================
   CORRECTIFS D'AFFICHAGE
   ========================================================================= */

/* ---------- Le panneau mobile debordait sur grand ecran ----------
   Il est en position:fixed et decale de 100 % vers la droite pour rester hors
   champ. Sur un ecran large, ce decalage cree une zone hors cadre : la page
   defilait lateralement et une partie du menu apparaissait a droite. Le
   panneau ne doit tout simplement pas exister au-dessus du point de rupture,
   puisque la barre de navigation complete y est affichee. */
.mobile-nav{display:none;}
.nav-toggle{display:none;}
@media (max-width:720px){
  .mobile-nav{display:block;}
  .nav-toggle{display:block;}
}
/* Ceinture et bretelles : plus aucun defilement lateral, quel que soit
   l'element qui deborderait un jour. */
html,body{overflow-x:hidden;}

/* ---------- Les listes sans puce en avaient quand meme une ----------
   .article-body li pose une pastille doree en ::before sur TOUTE puce du
   corps de page. Les listes de navigation, elles, n'en veulent pas. */
.article-body .liste-voisines li{padding-left:0;}
.article-body .liste-voisines li::before{display:none;content:none;}

/* ---------- Tableau des baremes ----------
   .article-body table th l'emportait en specificite et remettait un cadre
   complet autour de chaque cellule. On repasse devant explicitement. */
.article-body .table-baremes th,
.article-body .table-baremes td{
  border:0;border-bottom:1px solid var(--line);padding:13px 16px;vertical-align:top;
}
.article-body .table-baremes thead th{background:var(--navy-tint);}
.article-body .table-baremes{margin:0;}

/* ---------- En-tete mobile : le logo etait chasse hors de l'ecran ----------
   L'ajout du bouton « Espace client » a fait deborder la barre sur telephone :
   deux boutons plus le bouton de menu ne laissaient plus la place au logo.
   L'entree figure de toute facon dans le menu deroulant, elle n'a rien a
   faire dans la barre a cette largeur. */
@media (max-width:720px){
  .site-header .header-cta .btn-navy-outline{display:none;}
  .site-header .header-cta{gap:10px;}
  .site-header .header-cta .btn-gold{padding:10px 14px;font-size:12.5px;white-space:nowrap;}
}
/* En dessous de 340 px il ne reste plus la place que pour le logo et le menu. */
@media (max-width:340px){
  .site-header .header-cta .btn-gold{display:none;}
}

/* ---------- Encadré d'alerte dans le corps d'une page ----------
   Sert à signaler qu'une règle exposée ne vaut pas dans un cas précis.
   Volontairement distinct du bloc d'appel : c'est de l'information, pas de
   la vente. */
.encadre-alerte{
  border:1px solid var(--gold);border-left:4px solid var(--gold);
  background:#FDFAF2;padding:24px 26px;margin:32px 0;
}
.encadre-alerte h3{margin-top:0;font-size:17px;color:var(--navy);}
.encadre-alerte p{font-size:15px;line-height:1.7;}
.encadre-alerte p:last-child{margin-bottom:0;}
@media (max-width:700px){ .encadre-alerte{padding:20px 18px;} }

/* ---------- Tableaux larges : sortir de la colonne de texte ----------
   Le corps de page est limité à 760 px, largeur confortable à lire. Un
   tableau de comparaison à quatre colonnes n'y tient pas : il partait en
   défilement horizontal et sa dernière colonne se trouvait coupée à
   l'affichage, ce qui donne un tableau qui a l'air cassé.

   Sur grand écran, ces tableaux débordent volontairement de la colonne de
   texte, centrés. Sous 1100 px ils reviennent dans le flux et retrouvent le
   défilement horizontal, qui est alors le bon comportement. */
@media (min-width:1100px){
  .article-body .table-large{
    width:min(1080px, calc(100vw - 48px));
    margin-left:50%;transform:translateX(-50%);
  }
}
.table-large table{min-width:0;}
.table-large .table-baremes{font-size:14px;}
.article-body .table-large th,
.article-body .table-large td{padding:12px 14px;}

/* ---------- Lexique ---------- */
.lexique-sommaire{
  display:flex;flex-wrap:wrap;gap:8px;margin:24px 0 36px;
  padding:20px;background:var(--navy-tint);border-left:3px solid var(--gold);
}
.lexique-sommaire a{
  font-size:13.5px;font-weight:500;color:var(--navy);
  padding:4px 10px;background:var(--white);border:1px solid var(--line);
}
.lexique-sommaire a:hover{border-color:var(--gold);color:var(--gold-dark);}
.article-body .lexique{margin:0;}
.article-body .lexique dt{
  font-family:var(--font-display);font-size:18px;font-weight:600;color:var(--navy);
  margin-top:30px;padding-top:18px;border-top:1px solid var(--line);scroll-margin-top:100px;
}
.article-body .lexique dt:first-child{margin-top:0;border-top:0;padding-top:0;}
.article-body .lexique dt:target{color:var(--gold-dark);}
.article-body .lexique dd{margin:8px 0 0;color:var(--ink);font-size:16px;line-height:1.75;}

/* ---------- Renvoi vers la page d'origine, sous une réponse de la FAQ ---------- */
.faq-a .faq-source{padding:0 4px 20px;margin:0;font-size:13.5px;font-weight:600;}
.faq-a .faq-source a{color:var(--gold-dark);}
.article-body .faq-list + h3{margin-top:2em;}