.brand-problem{background:#fff;padding:88px 0}.brand-problem-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:72px;align-items:start}.brand-kicker{display:block;color:#c35d15;font-size:11px;font-weight:850;letter-spacing:.14em;text-transform:uppercase}.brand-problem h2,.brand-moment h2,.brand-faq h2{font:750 clamp(31px,4vw,47px)/1.12 Outfit,sans-serif;letter-spacing:-.035em;color:#112b49;margin:14px 0}.brand-problem-copy{font-size:15px;line-height:1.8;color:#62738a;max-width:430px}.brand-pains{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.brand-pain{border:1px solid #dce5ee;padding:22px;background:#fbfdff}.brand-pain b{display:block;color:#ee741a;font:800 12px Outfit,sans-serif;letter-spacing:.08em}.brand-pain h3{margin:13px 0 7px;font:700 18px Outfit,sans-serif;color:#183754}.brand-pain p{margin:0;color:#687a90;font-size:13px;line-height:1.6}.brand-moment{padding:88px 0;background:linear-gradient(125deg,#082b4c,#124c78);color:#fff}.brand-moment-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.brand-moment h2{color:#fff}.brand-moment p{font-size:15px;line-height:1.8;color:#b8cde0}.brand-moment-list{list-style:none;padding:0;margin:28px 0 0}.brand-moment-list li{padding:14px 0;border-top:1px solid rgba(255,255,255,.14);font-size:14px;font-weight:650}.brand-moment-list li:before{content:'✓';display:inline-grid;place-items:center;width:21px;height:21px;margin-right:11px;border-radius:50%;background:rgba(245,130,32,.19);color:#ffae65}.brand-signature{padding:30px;border:1px solid rgba(255,255,255,.17);background:rgba(255,255,255,.06)}.brand-signature small{display:block;color:#ffad65;font-size:10px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.brand-signature strong{display:block;margin-top:11px;font:700 27px/1.2 Outfit,sans-serif}.brand-signature p{font-size:13px;margin:14px 0 0}.brand-faq{padding:86px 0;background:#f7f9fc}.brand-faq-head{max-width:690px}.brand-faq-head p{color:#64768d;font-size:15px;line-height:1.7}.brand-faq-list{margin-top:30px;border-top:1px solid #dce5ee}@media(min-width:900px){.brand-faq-list{display:grid;grid-template-columns:1fr 1fr;column-gap:48px;border-top:0}.brand-faq-list>details{border-top:1px solid #dce5ee}}.brand-faq-list details{border-bottom:1px solid #dce5ee;background:#fff;padding:0 20px}.brand-faq-list summary{cursor:pointer;padding:20px 30px 20px 0;font:700 15px Outfit,sans-serif;color:#1b3854;position:relative;list-style:none}.brand-faq-list summary:after{content:'+';position:absolute;right:0;color:#ec741b;font-size:23px;font-weight:400;top:15px}.brand-faq-list details[open] summary:after{content:'−'}.brand-faq-list p{margin:0 0 20px;color:#62748a;font-size:14px;line-height:1.75;max-width:860px}.landing-source{display:flex;align-items:center;gap:10px;margin-top:24px;color:#6b7d91;font-size:11px;font-weight:700}.landing-source i{width:28px;height:1px;background:#d8e2ec}@media(max-width:800px){.brand-problem,.brand-moment,.brand-faq{padding:62px 0}.brand-problem-grid,.brand-moment-grid{grid-template-columns:1fr;gap:36px}.brand-pains{grid-template-columns:1fr}.brand-signature{padding:23px}.brand-signature strong{font-size:23px}}

/* Comparatif avant / apres.
   Le visiteur doit se reconnaitre dans la colonne de gauche avant de lire la
   droite : sur mobile les deux colonnes s'empilent dans cet ordre. */
.bascule-section{background:#f7f9fc}
.bascule-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.bascule-colonne{background:#fff;border:1px solid #dfe7ef;padding:28px 26px}
.bascule-colonne h3{display:flex;flex-direction:column;gap:6px;margin:0 0 20px;font:700 19px Outfit,sans-serif;color:#122944}
.bascule-colonne h3 span{font-size:10px;font-weight:850;letter-spacing:.14em;text-transform:uppercase}
.bascule-colonne ul{list-style:none;margin:0;padding:0}
.bascule-colonne li{position:relative;padding:14px 0 14px 30px;border-top:1px solid #eef2f7;font-size:13.5px;line-height:1.65;color:#5b6b80}
.bascule-colonne li:first-child{border-top:0}
.bascule-colonne li:before{position:absolute;left:0;top:13px;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:800}
.bascule-colonne.avant h3 span{color:#93a2b5}
.bascule-colonne.avant li:before{content:"×";background:#f1f4f8;color:#8494a8}
.bascule-colonne.apres{border-color:#f7d4b3;background:#fffdfa;box-shadow:0 16px 40px rgba(224,99,15,.08)}
.bascule-colonne.apres h3 span{color:var(--orange,#f58220)}
.bascule-colonne.apres li{color:#3d5068}
.bascule-colonne.apres li:before{content:"✓";background:#e7f6ef;color:#15936a}

/* Apercu des tarifs sur l'accueil. Le detail reste sur /tarifs. */
.tarifs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tarif-carte{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid #dfe7ef;padding:30px 26px}
.tarif-carte.en-avant{border:2px solid var(--orange,#f58220);box-shadow:0 20px 44px rgba(221,102,14,.13)}
.tarif-carte>b{position:absolute;right:20px;top:-11px;background:var(--orange,#f58220);color:#fff;font-size:10px;font-weight:800;padding:5px 10px;letter-spacing:.04em}
.tarif-carte h3{font:700 21px Outfit,sans-serif;margin:0;color:#122944}
.tarif-prix{font:800 34px Outfit,sans-serif;margin:14px 0 0;color:#10243f}
.tarif-prix small{font:400 13px Inter,sans-serif;color:#6b7c92}
.tarif-audience{margin:10px 0 0;font-size:13px;line-height:1.65;color:#66768b}
.tarif-carte ul{list-style:none;margin:20px 0 26px;padding:0;flex:1}
.tarif-carte li{padding:9px 0;border-bottom:1px solid #eef2f7;font-size:12.5px;color:#54657c}
.tarif-carte li:before{content:"✓";color:#15936a;font-weight:900;margin-right:8px}
.tarifs-lien{text-align:center;margin:34px 0 0}
.tarifs-lien a{display:inline-flex;align-items:center;gap:9px;font-size:13px;font-weight:750;color:#1168b2}
.tarifs-lien svg{width:17px}

@media(max-width:680px){
  .bascule-grid,.tarifs-grid{grid-template-columns:1fr}
  .bascule-colonne,.tarif-carte{padding:24px 20px}
  .tarif-carte>b{right:16px}
}

/* Liens juridiques des pieds de page. Ils pointent vers des pages servies par
   Django : ce sont de vraies balises <a>, pas des liens du routeur React. */
.landing-footer-legal,.marketing-footer-legal{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 20px;margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.12)}
.landing-footer-legal a,.marketing-footer-legal a{font-size:11px;font-weight:600;color:#93a8bd}
.landing-footer-legal a:hover,.marketing-footer-legal a:hover{color:#fff;text-decoration:underline}

/* Coordonnées du pied de page. Un gérant appelle ou écrit sur WhatsApp avant
   de remplir un formulaire : les numéros doivent se lire et se toucher. */
.landing-footer-contact{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:26px 32px;margin-top:30px;padding-top:28px;border-top:1px solid rgba(255,255,255,.14)}
.landing-footer-contact>div{display:flex;flex-direction:column;gap:9px}
.landing-footer-contact span{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.14em;color:#8aa0b6}
.landing-footer-contact small{font-size:11px;color:#7d93a9;line-height:1.5}
.landing-footer-contact a{display:inline-flex;align-items:center;gap:9px;min-height:26px;
  font-size:14px;font-weight:650;color:#e8eff6;letter-spacing:-.01em}
.landing-footer-contact a:hover{color:#fff}
.landing-footer-contact svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;
  stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;color:#f0a35c}
.landing-footer-contact .footer-whatsapp{color:#7ee2a8}
.landing-footer-contact .footer-whatsapp svg{color:#7ee2a8}
.landing-footer-contact .footer-whatsapp:hover{color:#a8f0c4}
@media(max-width:680px){
  .landing-footer-contact{grid-template-columns:1fr;gap:22px;text-align:left}
  .landing-footer-contact a{min-height:44px;font-size:15px}
}