/* =========================================================
   CreditBlog.fr — Direction artistique BLEU / ORANGE
   Refonte septembre 2026
   Couche de thème non destructive chargée après creditblog.css
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

:root{
  --papier:#F5F8FE;
  --papier-2:#ECF3FF;
  --carte:#FFFFFF;
  --marine:#08265F;
  --marine-2:#125BDB;
  --encre:#10264A;
  --gris:#5F708F;
  --gris-clair:#8FA1BE;
  --rouge:#FF7A1A;
  --rouge-fonce:#E65D00;
  --or:#E6A51C;
  --or-fond:#FFF4DE;
  --vert:#087F68;
  --vert-fond:#E8F7F3;
  --risque:#C64646;
  --risque-fond:#FDEEEE;
  --trait:#E1EAF7;
  --trait-fort:#C9D8EF;
  --r-s:10px;
  --r-m:16px;
  --r-l:26px;
  --serif:"Plus Jakarta Sans","Inter",system-ui,-apple-system,sans-serif;
  --sans:"Plus Jakarta Sans","Inter",system-ui,-apple-system,sans-serif;
  --mono:"Plus Jakarta Sans","Inter",system-ui,-apple-system,sans-serif;
  --large:min(1320px,100%);
  --texte:min(760px,100%);
  --ombre:0 20px 60px -34px rgba(8,38,95,.32);
  --ombre-carte:0 16px 42px -30px rgba(8,38,95,.34);
}

body{
  background:linear-gradient(180deg,#F9FBFF 0,#F4F8FF 38%,#F7FAFF 100%);
  color:var(--encre);
  font-size:16px;
  line-height:1.68;
}

::selection{background:#DCE9FF;color:var(--marine)}
a{color:var(--marine-2);text-decoration-color:rgba(18,91,219,.25)}
a:hover{color:#0D4EBD;text-decoration-color:currentColor}
:focus-visible{outline:3px solid rgba(18,91,219,.34);outline-offset:3px;border-radius:8px}

h1,h2,h3,h4{font-family:var(--sans);color:var(--marine);letter-spacing:-.035em}
h1{font-weight:800;line-height:1.04;font-size:clamp(2.35rem,5vw,4rem)}
h2{font-weight:800;font-size:clamp(1.55rem,3vw,2.05rem);border:0;padding:0 0 0 1.45rem;position:relative;display:block}
h2::before{content:"";position:absolute;left:0;top:.72em;width:.8rem;height:3px;border-radius:999px;background:var(--marine-2)}
h3{font-style:normal;font-weight:700;letter-spacing:-.025em}
h4{font-weight:700}
strong{color:var(--marine)}
.chapo{font-family:var(--sans);font-size:clamp(1rem,2vw,1.16rem);line-height:1.7;color:var(--gris)}
.eyebrow{font-family:var(--sans);font-size:.71rem;letter-spacing:.09em;color:var(--marine);font-weight:800;background:#EAF2FF;border:1px solid #D8E6FB;padding:.42rem .72rem;border-radius:999px}
.eyebrow .pastille,.pastille{width:6px;height:6px;border-radius:50%;background:var(--marine-2)}
.mono{font-family:var(--sans)}

/* Top bar / header */
.barre-date{display:none}
.site-entete{background:rgba(255,255,255,.95);border-bottom:1px solid rgba(201,216,239,.7);box-shadow:0 10px 40px -32px rgba(8,38,95,.55);backdrop-filter:blur(12px)}
.site-entete::before{display:none}
.entete-flex{min-height:76px;gap:1rem;padding-block:.72rem}
.site-entete .logo,.site-pied .logo{font-family:var(--sans);font-weight:800;font-size:1.52rem;letter-spacing:-.05em;color:var(--marine);align-items:center;gap:.58rem;line-height:1;text-decoration:none}
.brand-mark{width:34px;height:34px;display:inline-block;flex:none;border-radius:50%;background:conic-gradient(from 28deg,var(--marine-2) 0 61%,var(--rouge) 61% 78%,#DDE8F8 78% 100%);position:relative;box-shadow:inset 0 0 0 1px rgba(8,38,95,.04)}
.brand-mark::after{content:"";position:absolute;inset:9px;border-radius:50%;background:#fff}
.brand-stack{display:flex;flex-direction:column;gap:.14rem}
.brand-name{display:block;white-space:nowrap}
.brand-name .brand-blue{color:var(--marine-2)}
.brand-tagline{font-size:.48rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gris);font-weight:700;white-space:nowrap}
.logo .point{display:none}

.nav-principale{display:flex;justify-content:center}
.menu{gap:.35rem;flex-wrap:nowrap}
.menu>li>a,.menu-declencheur{font-weight:700;color:var(--marine);font-size:.79rem;border:0;padding:.65rem .46rem;border-radius:9px}
.menu>li>a:hover,.menu>li>a[aria-current="page"],.menu-declencheur:hover,.menu-declencheur:focus-visible,.menu-declencheur[aria-expanded="true"],.menu-item.actif>.menu-declencheur{background:#EFF5FF;color:var(--marine-2);border:0}
.sous-menu{border:1px solid var(--trait);border-radius:16px;box-shadow:0 22px 60px -28px rgba(8,38,95,.45);padding:.65rem;min-width:310px}
.sous-menu a{border-radius:11px;color:var(--marine);font-weight:700}
.sous-menu a:hover,.sous-menu a:focus-visible{background:#EFF5FF;color:var(--marine-2)}
.sous-menu a .rubrique{font-family:var(--sans);color:var(--marine-2);letter-spacing:.06em}

.recherche-entete{max-width:190px;flex:0 1 190px;border:1px solid var(--trait);background:#F7FAFF;border-radius:999px;padding:.26rem .26rem .26rem .8rem}
.recherche-entete:focus-within{border-color:#9FBEF5;box-shadow:0 0 0 4px rgba(18,91,219,.08)}
.recherche-entete button{border-radius:50%;background:var(--marine-2)}
.recherche-entete button:hover,.recherche-entete button:focus-visible{background:#0D4EBD}
.cta-header{display:inline-flex!important;animation:none!important;white-space:nowrap;font-size:.79rem!important;padding:.7rem 1rem!important}
.bouton-burger{display:none;border-radius:11px;border-color:var(--trait);background:#F7FAFF}

/* Buttons */
.cta{background:linear-gradient(135deg,#FF8A25,#FF7412);border-radius:999px;font-weight:800;padding:.92rem 1.45rem;box-shadow:0 12px 28px -18px rgba(255,122,26,.8);transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.cta:hover,.cta:focus-visible{background:linear-gradient(135deg,#F27610,#E65D00);transform:translateY(-2px);box-shadow:0 16px 30px -18px rgba(230,93,0,.8);color:#fff}
.cta.secondaire{background:#fff;color:var(--marine-2);border:1.5px solid #B9CEF4;box-shadow:none}
.cta.secondaire:hover{background:#EEF5FF;color:var(--marine-2);border-color:#8DAFEB}

/* Home hero */
.hero{padding-block:2rem 0;grid-template-columns:minmax(0,1.14fr) minmax(330px,.86fr);gap:0;align-items:stretch;background:linear-gradient(120deg,#F7FBFF 0%,#EEF5FF 50%,#E7F1FF 100%);border:1px solid #DEE9F7;border-radius:28px;overflow:hidden;box-shadow:var(--ombre);margin-top:1.2rem}
.hero>div:first-child{padding:clamp(2rem,4.5vw,4.3rem);display:flex;flex-direction:column;justify-content:center;position:relative;z-index:2}
.hero h1{margin:.85rem 0 1.15rem;max-width:12ch;font-size:clamp(2.65rem,5.4vw,4.5rem);line-height:.98}
.hero h1 .point{display:none}
.hero-accent{display:block;color:var(--marine-2)}
.hero .chapo{max-width:58ch;margin-bottom:1.3rem}
.hero .actions{margin-top:.7rem}
.hero .sujets{margin-top:1.6rem;gap:.45rem}
.hero .sujets li{border:1px solid #D8E5F8;background:rgba(255,255,255,.72);border-radius:999px;color:#38557E;padding:.38rem .72rem;font-size:.72rem;font-weight:700}
.hero-visual{position:relative;min-height:520px;background:#DCEAFF;overflow:hidden;border:0;border-radius:0;padding:0;margin:0}
.hero-visual>img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;filter:saturate(.96) contrast(1.02)}
.hero-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(238,245,255,.95) 0,rgba(238,245,255,.36) 17%,rgba(8,38,95,0) 48%)}
.hero-float{position:absolute;z-index:2;left:1.2rem;right:1.2rem;bottom:1.2rem;display:grid;grid-template-columns:repeat(3,1fr);gap:.55rem;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.7);border-radius:16px;padding:.7rem;box-shadow:0 18px 45px -26px rgba(8,38,95,.55)}
.hero-float div{padding:.6rem .55rem;border-right:1px solid var(--trait)}
.hero-float div:last-child{border-right:0}
.hero-float b{display:block;color:var(--marine);font-size:.75rem;line-height:1.25}
.hero-float span{display:block;color:var(--gris);font-size:.62rem;line-height:1.35;margin-top:.12rem}

.home-trust{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid var(--trait);border-radius:18px;margin:1rem 1rem 0;box-shadow:var(--ombre-carte);overflow:hidden}
.home-trust__item{display:flex;gap:.75rem;align-items:center;padding:1rem 1.15rem;border-right:1px solid var(--trait)}
.home-trust__item:last-child{border-right:0}
.home-trust__icon{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#EAF2FF;color:var(--marine-2);font-weight:800;flex:none}
.home-trust__item b{display:block;color:var(--marine);font-size:.8rem;line-height:1.25}
.home-trust__item span{display:block;color:var(--gris);font-size:.7rem;line-height:1.35;margin-top:.1rem}

/* Homepage/content sections */
main.enveloppe>section.colonne{background:#fff;border:1px solid var(--trait);border-radius:24px;padding:clamp(1.35rem,3vw,2.2rem);box-shadow:var(--ombre-carte);margin-top:2.2rem;max-width:1000px}
.a-la-une{gap:2rem}
.vedette{background:#F8FBFF;border:1px solid var(--trait);border-radius:18px;padding:1rem;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.vedette:hover{transform:translateY(-3px);box-shadow:var(--ombre-carte);border-color:#BDD0EF}
.vedette img{border-radius:14px;margin-bottom:1rem}
.vedette .rubrique,.classement .rubrique{display:inline-flex;background:#EAF2FF;color:var(--marine-2);border-radius:999px;padding:.28rem .55rem;font-size:.64rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.vedette:hover h3{color:var(--marine-2)}
.classement li::before{font-family:var(--sans);color:#C9D9F1;font-weight:800}
.classement a:hover{color:var(--marine-2)}

.carrousel{border-radius:22px;box-shadow:var(--ombre)}
.c-diapo::after{background:linear-gradient(0deg,rgba(4,25,65,.94) 0%,rgba(4,25,65,.62) 46%,rgba(4,25,65,.08) 76%)}
.c-diapo .rang{font-family:var(--sans)}
.c-diapo .lire{border-bottom-color:var(--rouge)}
.c-fleche{border-color:var(--trait);box-shadow:0 6px 16px -12px rgba(8,38,95,.45)}
.c-fleche:hover,.c-fleche:focus-visible{background:var(--marine-2);border-color:var(--marine-2)}

.grille-articles{gap:1.15rem}
.carte{border:1px solid var(--trait);border-radius:18px;padding:1rem;gap:.62rem;box-shadow:0 8px 30px -28px rgba(8,38,95,.5)}
.carte:hover{border-color:#BDD0EF;transform:translateY(-4px);box-shadow:0 20px 42px -28px rgba(8,38,95,.48)}
.carte img{width:calc(100% + 2rem);margin:-1rem -1rem .25rem;border-radius:17px 17px 0 0;aspect-ratio:16/9}
.carte .rubrique{align-self:flex-start;font-family:var(--sans);font-size:.61rem;letter-spacing:.05em;background:#EAF2FF;color:var(--marine-2);border-radius:999px;padding:.3rem .55rem;font-weight:800}
.carte h3{font-weight:800;letter-spacing:-.025em}
.carte .lire{color:var(--marine-2);font-weight:800}

/* Article pages */
.ariane{font-family:var(--sans);font-size:.67rem;letter-spacing:.03em;text-transform:none;margin-top:1.4rem}
.meta{font-family:var(--sans);font-size:.7rem;letter-spacing:0;border-bottom-color:var(--trait)}
.media-article{border-color:var(--trait);border-radius:20px;box-shadow:var(--ombre-carte)}
.media-article img{border-radius:0}
.media-article figcaption{font-family:var(--sans);background:#F7FAFF;border-color:var(--trait)}
.sommaire{background:#F3F7FE;border:1px solid #D9E6F7;border-left:4px solid var(--marine-2);border-radius:0 16px 16px 0}
.sommaire p{font-family:var(--sans);color:var(--marine-2);letter-spacing:.06em}
.encadre{border-radius:14px;border-color:var(--trait)}
.tableau{border-color:var(--trait);border-radius:16px;box-shadow:var(--ombre-carte)}
th{font-family:var(--sans);background:linear-gradient(135deg,var(--marine),#0E3A83);letter-spacing:.04em}
.faq details{border-color:var(--trait);border-radius:14px;box-shadow:0 10px 28px -28px rgba(8,38,95,.45)}
.faq summary::after{color:var(--marine-2)}

/* CTA inline / panels */
.cta-bandeau{background:linear-gradient(135deg,#ECF4FF,#F8FBFF);border:1px solid #D8E5F7;border-left:0;border-radius:18px;padding:1.45rem 1.55rem;box-shadow:var(--ombre-carte)}
.cta-bandeau h3{color:var(--marine)}
.recherche-inline{background:#F2F7FF;border-color:#D9E6F7;border-radius:18px}
.recherche-large input{border-color:var(--trait-fort);border-radius:12px}
.recherche-large button{background:var(--marine-2);border-radius:12px}
.recherche-large button:hover{background:#0D4EBD}
.puces a{border-color:#D6E3F6;border-radius:999px;background:#fff;color:var(--marine-2)}
.puces a:hover{border-color:#9DBAF0;color:#0D4EBD}

/* Native credit form */
.bloc-form{margin-top:2.6rem;padding-top:0;border-top:0}
.form-cadre{border:1px solid #D8E5F7;border-radius:24px;box-shadow:0 28px 70px -36px rgba(8,38,95,.42);overflow:hidden}
.cb-credit-form{background:#fff}
.cb-form-head{padding:1.6rem 1.7rem 1.35rem;background:linear-gradient(135deg,#F7FAFF,#EEF5FF);border-bottom:1px solid #DFE8F5}
.cb-form-kicker{font-family:var(--sans);font-size:.68rem;letter-spacing:.07em;color:var(--marine-2);font-weight:800}
.cb-form-head h3{font-size:clamp(1.4rem,3vw,1.8rem);font-weight:800;letter-spacing:-.035em}
.cb-form-head p{font-size:.86rem}
.cb-form-progress{height:5px;background:#DDE8F8;border-radius:999px;margin-top:1rem}
.cb-form-progress-bar{background:linear-gradient(90deg,#125BDB,#4381EA);border-radius:999px}
.cb-stepper{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;margin-top:1rem}
.cb-stepper-item{display:flex;align-items:center;gap:.4rem;color:#8293AF;font-size:.68rem;font-weight:700;min-width:0}
.cb-stepper-dot{width:24px;height:24px;display:grid;place-items:center;flex:none;border:1px solid #C8D8EF;background:#fff;border-radius:50%;font-size:.65rem;color:#6F83A4;transition:.2s ease}
.cb-stepper-item.is-active{color:var(--marine)}
.cb-stepper-item.is-active .cb-stepper-dot,.cb-stepper-item.is-done .cb-stepper-dot{background:var(--marine-2);border-color:var(--marine-2);color:#fff;box-shadow:0 7px 18px -10px rgba(18,91,219,.85)}
.cb-form-steps{padding:1.5rem 1.7rem .85rem}
.cb-form-step-title>span{background:#EAF2FF;color:var(--marine-2);font-family:var(--sans);font-weight:800}
.cb-form-step-title strong{font-family:var(--sans);font-weight:800;font-size:1.05rem}
.cb-field{font-size:.77rem;color:#28436D}
.cb-field input,.cb-field select{border-color:#CFDDF0;border-radius:12px;min-height:50px;background-color:#FBFDFF;font-weight:600}
.cb-field input:focus,.cb-field select:focus{border-color:#8CB1F0;box-shadow:0 0 0 4px rgba(18,91,219,.09);background-color:#fff}
.cb-field select{appearance:none;-webkit-appearance:none;color:var(--encre);cursor:pointer;padding-right:2.7rem;background-color:#FBFDFF;background-image:linear-gradient(45deg,transparent 50%,var(--marine-2) 50%),linear-gradient(135deg,var(--marine-2) 50%,transparent 50%);background-position:calc(100% - 17px) 50%,calc(100% - 12px) 50%;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.cb-field select option{background:#fff;color:var(--encre)}
.cb-form-privacy{background:#F2F7FF;border-left:0;border-radius:12px;color:#627493;padding:1rem 1.05rem}
.cb-form-actions{background:#F8FBFF;border-top-color:#E1EAF7;padding:1rem 1.7rem 1.25rem}
.cb-form-count{font-family:var(--sans);font-size:.66rem;color:#7B8EAD}
.cb-form-next,.cb-form-submit{background:linear-gradient(135deg,#FF8A25,#FF7412);border-radius:999px;padding:.9rem 1.3rem;box-shadow:0 12px 28px -18px rgba(255,122,26,.75)}
.cb-form-next:hover,.cb-form-submit:hover{background:linear-gradient(135deg,#F27610,#E65D00)}
.cb-form-back{border-color:#C6D7EF;border-radius:999px;background:#fff;color:var(--marine-2)}
.cb-form-back:hover{border-color:#9FBAE8;background:#EFF5FF}

/* Footer */
.site-pied{border-top:0;background:linear-gradient(135deg,#061D4A,#0A347D);margin-top:4.5rem;color:#DDE8FA;padding-block:3.4rem 2rem}
.site-pied .logo{color:#fff}
.site-pied .brand-mark::after{background:#0A2D6A}
.site-pied .brand-tagline{color:#9CB2D7}
.site-pied .brand-name .brand-blue{color:#7FAAFF}
.site-pied p,.site-pied .pied-grille a,.site-pied .pied-bas,.site-pied .pied-bas button[data-cookies-ouvrir]{color:#B9C8E0!important}
.site-pied .pied-grille h4{font-family:var(--sans);color:#fff;letter-spacing:.06em}
.site-pied .pied-grille a:hover,.site-pied .pied-bas a:hover,.site-pied .pied-bas button[data-cookies-ouvrir]:hover{color:#fff!important}
.pied-bas{border-top-color:rgba(255,255,255,.14)}

/* Misc components */
.ticker{background:linear-gradient(135deg,var(--marine),#0E3D89);border-radius:18px}
.ticker .item b{font-family:var(--sans)}
.encart-telephone{background:linear-gradient(135deg,#071E4C,#0B3C8A);border-radius:20px;box-shadow:var(--ombre)}
.encart-telephone .eyebrow{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.1);color:#fff}
.encart-telephone .pastille{background:#FFB26F}
.tel-cta img{border-radius:12px}
.resultat-url{color:var(--marine-2);font-family:var(--sans)}
.resultat-titre a{color:var(--marine)}
.resultat-titre a:hover{color:var(--marine-2)}
.bc-accepte{background:var(--rouge);border-color:var(--rouge)}
.bc-accepte:hover{background:var(--rouge-fonce);border-color:var(--rouge-fonce)}

/* Responsive */
@media(max-width:1180px){
  .nav-principale,.cta-header{display:none!important}
  .bouton-burger{display:inline-flex}
  .recherche-entete{max-width:none;flex:1 1 220px}
}
@media(max-width:900px){
  .hero{grid-template-columns:1fr;padding:0}
  .hero>div:first-child{padding:2rem clamp(1.2rem,5vw,2.3rem)}
  .hero h1{max-width:15ch}
  .hero-visual{min-height:360px}
  .hero-visual::after{background:linear-gradient(180deg,rgba(238,245,255,.3),rgba(8,38,95,0))}
  .home-trust{grid-template-columns:repeat(2,1fr)}
  .home-trust__item:nth-child(2){border-right:0}
  .home-trust__item:nth-child(-n+2){border-bottom:1px solid var(--trait)}
}
@media(max-width:700px){
  body{font-size:15px}
  .site-entete .brand-tagline{display:none}
  .site-entete .logo{font-size:1.3rem}
  .brand-mark{width:30px;height:30px}
  .entete-flex{min-height:66px}
  .recherche-entete{display:none}
  .menu-mobile .mobile-recherche form{display:flex;gap:.45rem}
  .menu-mobile .mobile-recherche input{flex:1;min-width:0;border:1px solid var(--trait);border-radius:12px;padding:.75rem .9rem;font:inherit}
  .menu-mobile .mobile-recherche button{width:44px;border:0;border-radius:12px;background:var(--marine-2);color:#fff}
  .menu-mobile{border-top-color:var(--trait);box-shadow:0 18px 34px -28px rgba(8,38,95,.5)}
  .menu-mobile .accordeon-bouton{color:var(--marine)}
  .menu-mobile .accordeon-panneau a:hover{color:var(--marine-2)}
  .hero{border-radius:20px;margin-top:.8rem}
  .hero>div:first-child{padding:1.55rem 1.2rem 1.35rem}
  .hero h1{font-size:clamp(2.15rem,10vw,3.2rem);margin:.72rem 0 1rem}
  .hero .actions{display:grid;grid-template-columns:1fr;gap:.65rem}
  .hero .actions .cta{justify-content:center}
  .hero-visual{min-height:330px}
  .hero-float{left:.75rem;right:.75rem;bottom:.75rem}
  .hero-float b{font-size:.67rem}.hero-float span{font-size:.58rem}
  .home-trust{margin:.75rem 0 0;border-radius:16px}
  .home-trust__item{padding:.85rem .75rem;gap:.55rem}
  .home-trust__icon{width:34px;height:34px}
  main.enveloppe>section.colonne{border-radius:18px;padding:1.15rem;margin-top:1.5rem}
  h2{padding-left:1.15rem}
  h2::before{width:.65rem}
  .cb-stepper{gap:.25rem}
  .cb-stepper-item{font-size:0;gap:0;justify-content:center}
  .cb-stepper-dot{font-size:.65rem;width:27px;height:27px}
  .cb-form-head,.cb-form-steps{padding-left:1rem;padding-right:1rem}
  .cb-form-actions{padding-left:1rem;padding-right:1rem}
  .form-cadre{border-radius:18px}
}
@media(max-width:480px){
  .enveloppe{padding-inline:14px}
  .site-entete .brand-name{font-size:1.16rem}
  .hero .sujets{display:none}
  .hero-visual{min-height:290px}
  .hero-float{grid-template-columns:1fr 1fr}
  .hero-float div:nth-child(2){border-right:0}
  .hero-float div:nth-child(3){display:none}
  .home-trust{grid-template-columns:1fr}
  .home-trust__item{border-right:0;border-bottom:1px solid var(--trait)!important}
  .home-trust__item:last-child{border-bottom:0!important}
  .carte{border-radius:16px}
  .site-pied{margin-top:3rem}
}