@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:86px}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#12182a;background:#f5f7fb;-webkit-font-smoothing:antialiased}a{text-decoration:none;color:inherit}.wrap{width:min(1180px,calc(100% - 40px));margin:auto}.header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.96);backdrop-filter:blur(16px);border-bottom:1px solid #e9edf3}.header-inner{height:74px;display:flex;align-items:center;gap:28px}.brand{display:flex;align-items:center;gap:9px;font-size:24px;font-weight:700;letter-spacing:-1px}.brand-icon{width:34px;height:34px;border:4px solid #6467eb;border-radius:50%;display:grid;place-items:center;color:#17bba8;background:white}.brand-text>span{color:#6c4ff7}.desktop-nav{display:flex;gap:25px;margin-left:auto;font-size:14px;font-weight:700;color:#566074}.desktop-nav a:hover{color:#6c4ff7}.header-btn{background:#11182d;color:#fff;padding:11px 15px;border-radius:10px;font-size:13px;font-weight:700}
.hero{background:#f5f7fb;border-bottom:1px solid #e7ebf1}.hero-layout{min-height:610px;display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;padding-top:70px;padding-bottom:70px}.tagline,.eyebrow{font-size:11px;font-weight:700;letter-spacing:1.7px;color:#6c4ff7}.hero h1{font-size:clamp(50px,5.8vw,76px);line-height:.96;letter-spacing:-4px;margin:18px 0 21px;color:#101629}.hero h1 span{color:#6c4ff7}.lead{font-size:18px;line-height:1.72;color:#657087;max-width:650px}.hero-ctas{display:flex;gap:15px;align-items:center;margin:30px 0 31px}.cta{font-weight:700}.cta-primary{background:#6c4ff7;color:#fff;padding:14px 19px;border-radius:11px;box-shadow:0 12px 28px rgba(108,79,247,.22)}.cta-link{color:#31394d}.hero-proof{display:grid;grid-template-columns:repeat(3,1fr);max-width:560px;border-top:1px solid #dde2eb;padding-top:19px}.hero-proof div{display:grid}.hero-proof strong{font-size:18px}.hero-proof span{font-size:11px;color:#7f899d;margin-top:2px}
.hero-tool{background:#fff;border:1px solid #dde3ec;border-radius:18px;padding:22px;box-shadow:0 24px 70px rgba(25,33,60,.1)}.tool-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}.tool-head>div{display:grid}.tool-label{font-size:9px;letter-spacing:1.2px;color:#8a93a6;font-weight:700}.tool-head h3{margin:4px 0 0;font-size:22px}.verified-chip{font-size:10px;font-weight:700;color:#16775c;background:#e9f8f2;padding:6px 8px;border-radius:99px}.recommendation{position:relative;border:1px solid #e5e9f0;border-radius:14px;padding:15px 15px 15px 50px;margin-top:10px}.primary-rec{border:2px solid #6c4ff7;background:#fbfaff;box-shadow:0 10px 30px rgba(108,79,247,.08)}.rec-rank{position:absolute;left:15px;top:16px;font-size:11px;font-weight:700;color:#6c4ff7}.rec-main{display:flex;justify-content:space-between;align-items:center}.rec-brand{display:flex;align-items:center;gap:11px}.tool-logo{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-weight:700;font-size:13px;flex:0 0 auto}.tool-logo.tiime{background:#153553;color:#fff}.tool-logo.indy{background:#111;color:#fff}.tool-logo.shine{background:#f0df5f;color:#26313b}.tool-logo.penny{background:#2c4053;color:#fff}.tool-logo.lg{width:44px;height:44px;border-radius:12px}.rec-brand div{display:grid}.rec-brand small{font-size:10px;color:#7b8497;margin-top:2px}.match{display:grid;text-align:right}.match strong{font-size:16px;color:#6c4ff7}.match span{font-size:9px;color:#8b94a7}.rec-reason{font-size:11px;line-height:1.55;color:#667086;margin-top:12px}.tool-foot{display:flex;justify-content:space-between;border-top:1px solid #edf0f5;margin-top:16px;padding-top:14px;font-size:11px;color:#7d869a}.tool-foot strong{color:#11182d}
.confidence{background:#fff;border-bottom:1px solid #e8ecf2}.confidence-grid{min-height:76px;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;align-items:center}.confidence-grid>div{display:flex;align-items:center;gap:10px}.confidence-grid>div>span{width:26px;height:26px;border-radius:50%;background:#eef9f5;color:#139174;display:grid;place-items:center;font-size:11px;font-weight:700}.confidence-grid p{display:grid;margin:0}.confidence-grid strong{font-size:12px}.confidence-grid small{font-size:10px;color:#7f899c;margin-top:2px}.section{padding:88px 0}.compare-zone{background:#fff}.compare-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:56px;align-items:start}.compare-sidebar{padding-top:12px}.compare-sidebar h2{font-size:clamp(38px,4vw,52px);line-height:1.05;letter-spacing:-2.3px;margin:10px 0 16px}.compare-sidebar>p{color:#697388;line-height:1.72}.sidebar-steps{display:grid;gap:12px;margin-top:26px}.sidebar-steps>div{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #edf0f5}.sidebar-steps>div>span{width:30px;height:30px;border-radius:9px;background:#eef0f5;display:grid;place-items:center;font-size:11px;font-weight:700;color:#6e778a}.sidebar-steps>div.active>span{background:#6c4ff7;color:#fff}.sidebar-steps p{display:grid;margin:0}.sidebar-steps strong{font-size:13px}.sidebar-steps small{font-size:10px;color:#7d8698;margin-top:2px}.quiz-shell{border:1px solid #dde3ec;border-radius:18px;padding:25px;background:#f9fafc}.quiz-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}.quiz-heading>div{display:grid}.quiz-heading small{font-size:9px;letter-spacing:1.2px;color:#8b94a7;font-weight:700}.quiz-heading strong{font-size:20px;margin-top:3px}.quiz-heading>span{font-size:10px;color:#7f899c;background:#eef1f5;padding:6px 8px;border-radius:99px}.progressText{display:flex;justify-content:space-between;font-size:11px;font-weight:700;color:#747d9a}.bar{height:7px;background:#e8ecf2;border-radius:99px;margin-top:10px}.bar i{display:block;height:100%;background:linear-gradient(90deg,#22c5b4,#6c4ff7);border-radius:99px}.quiz-shell h3{font-size:24px;letter-spacing:-.6px;margin:26px 0 17px}.choices{display:grid;grid-template-columns:1fr 1fr;gap:10px}.choice{font:inherit;font-weight:700;text-align:left;background:#fff;border:1px solid #dfe4ec;border-radius:11px;padding:14px;cursor:pointer}.choice:hover{border-color:#8a74ff;background:#fbfaff}.backbtn{border:0;background:transparent;color:#6f7890;font-weight:700;margin-top:18px;cursor:pointer}.restart{display:inline-flex;border:0;background:#6c4ff7;color:#fff;border-radius:10px;padding:11px 14px;font-weight:700;cursor:pointer}.results{display:grid;gap:9px}.resultCard{position:relative;background:#fff;border:1px solid #e2e6ed;border-radius:13px;padding:14px 14px 14px 62px}.resultCard.first{border:2px solid #6c4ff7;background:#fbfaff}.rank{position:absolute;left:14px;top:15px;width:34px;height:34px;border-radius:9px;display:grid;place-items:center;background:#eeeaff;color:#6c4ff7;font-weight:700}.score{position:absolute;right:12px;top:12px;color:#6c4ff7;font-size:9px;font-weight:700}.resultCard h4{margin:0;font-size:18px}.resultCard p{font-size:12px;color:#6f7890;line-height:1.5}.resultCard a{font-size:11px;color:#6c4ff7;font-weight:700}.resultActions{display:flex;gap:9px;flex-wrap:wrap;margin-top:16px}
.solutions{background:#f5f7fb}.section-title{text-align:center;max-width:760px;margin:0 auto 40px}.section-title.left{text-align:left;margin-left:0}.section-title h2{font-size:clamp(37px,4vw,50px);line-height:1.06;letter-spacing:-2.2px;margin:10px 0 13px}.section-title p{color:#697388;line-height:1.7}.compare-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.compare-card{position:relative;background:#fff;border:1px solid #dfe4ec;border-radius:17px;padding:21px}.compare-card.featured{border:1px solid #dfe4ec;box-shadow:none}.best-label{position:absolute;right:15px;top:-11px;background:#eef1f5;color:#5f687b;border-radius:99px;padding:6px 9px;font-size:8px;font-weight:700;letter-spacing:.8px}.card-top{display:flex;align-items:center;gap:11px}.card-top>div:nth-child(2){flex:1}.card-top h3{margin:0;font-size:20px}.card-top p{margin:2px 0 0;font-size:10px;color:#80899b}.fit-chip{font-size:9px;font-weight:700;background:#edf8f4;color:#16826a;padding:6px 8px;border-radius:99px}.fit-chip.purple{background:#eeeaff;color:#5d42d6}.fit-chip.dark{background:#edf0f4;color:#405064}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:18px}.metric-grid>div{background:#f7f8fb;border-radius:10px;padding:10px}.metric-grid span{display:block;font-size:9px;color:#8a93a5}.metric-grid strong{display:block;font-size:11px;margin-top:3px}.card-copy{font-size:13px;line-height:1.65;color:#697388}.compare-card>a{display:inline-block;margin-top:7px;font-size:11px;font-weight:700;color:#6c4ff7}.matrix{margin-top:22px;background:#fff;border:1px solid #dfe4ec;border-radius:17px;overflow:hidden}.matrix-head{display:flex;justify-content:space-between;align-items:end;padding:18px;border-bottom:1px solid #edf0f5}.matrix-head h3{margin:3px 0 0;font-size:20px}.matrix-head small{color:#858ea0}.matrix-scroll{overflow:auto}.matrix table{width:100%;border-collapse:collapse;min-width:760px}.matrix th,.matrix td{text-align:left;padding:16px;border-bottom:1px solid #edf0f5;font-size:12px}.matrix th{font-size:9px;letter-spacing:.7px;color:#7c8598;background:#fafbfc}.level{font-size:9px;font-weight:700;padding:6px 8px;border-radius:99px}.level.green{background:#eaf8f3;color:#16775c}.level.purple{background:#eeeaff;color:#5d42d6}.transparency{display:flex;gap:10px;align-items:flex-start;margin-top:16px;background:#fff8df;border:1px solid #efda92;border-radius:12px;padding:14px}.transparency>span{width:22px;height:22px;border-radius:50%;background:#fff0b8;display:grid;place-items:center;font-size:10px;font-weight:700}.transparency p{margin:0;font-size:12px;line-height:1.6;color:#5e5339}
.method-section{background:#fff}.method-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:start}.method-copy h2{font-size:clamp(38px,4vw,50px);letter-spacing:-2.2px;line-height:1.06;margin:10px 0 15px}.method-copy p{color:#6b758a;line-height:1.7}.criteria{display:grid;grid-template-columns:1fr 1fr;gap:12px}.criteria>div{display:flex;gap:11px;align-items:flex-start;border:1px solid #e2e6ed;border-radius:14px;padding:16px}.criteria>div>span{font-size:10px;font-weight:700;color:#6c4ff7}.criteria p{display:grid;margin:0}.criteria strong{font-size:13px}.criteria small{font-size:10px;color:#7f899c;margin-top:3px}
.details{background:#f5f7fb;padding:88px 0}.detail-stack{display:grid;gap:14px}.detail-card{background:#fff;border:1px solid #dfe4ec;border-radius:16px;padding:21px}.detail-title{display:flex;align-items:center;gap:11px}.detail-title h3{margin:0;font-size:20px}.detail-title p{margin:2px 0 0;font-size:10px;color:#7f899c}.verified{margin-left:auto;font-size:9px;font-weight:700;color:#16775c;background:#eaf8f3;padding:6px 8px;border-radius:99px}.detail-columns{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:18px}.detail-columns h4{margin:0 0 7px;font-size:13px}.detail-columns ul{margin:0;padding-left:18px;color:#626c81;line-height:1.75;font-size:12px}.detail-bottom{display:flex;justify-content:space-between;gap:18px;align-items:center;border-top:1px solid #edf0f5;margin-top:17px;padding-top:15px;font-size:11px;color:#4f5970}.detail-bottom button{border:0;background:#eef1f5;color:#838c9d;padding:9px 11px;border-radius:9px;font-weight:700}
.faq{background:#fff;padding:82px 0}.faq-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:70px}.faq-title h2{font-size:clamp(38px,4vw,48px);letter-spacing:-2px;margin:10px 0 12px}.faq-title p{color:#6d768a;line-height:1.7}.faq-list details{border-top:1px solid #e3e7ee;padding:20px 0}.faq-list summary{font-weight:700;cursor:pointer}.faq-list p{color:#6d768a;line-height:1.7;font-size:13px}footer{background:#101629;color:#c7cede;padding:34px 0}.footer-inner{display:grid;grid-template-columns:auto 1fr auto;gap:30px;align-items:center}.footer-brand{color:#fff}.footer-inner p{font-size:11px;color:#929cb1}.footer-inner>div{display:flex;gap:15px;font-size:11px}
@media(max-width:950px){.desktop-nav{display:none}.hero-layout,.compare-grid,.method-layout,.faq-layout{grid-template-columns:1fr}.hero-layout{gap:38px}.confidence-grid{grid-template-columns:1fr 1fr}.compare-cards{grid-template-columns:1fr}.criteria{grid-template-columns:1fr}.detail-columns{grid-template-columns:1fr}.footer-inner{grid-template-columns:1fr}.footer-inner>div{flex-wrap:wrap}}
@media(max-width:580px){.wrap{width:min(100% - 28px,1180px)}.header-inner{height:68px}.brand{font-size:21px}.header-btn{font-size:10px;padding:9px 10px}.hero-layout{padding-top:50px;padding-bottom:54px}.hero h1{font-size:42px;letter-spacing:-2.6px}.lead{font-size:16px}.hero-ctas{flex-direction:column;align-items:stretch}.cta{text-align:center;justify-content:center}.hero-proof{grid-template-columns:1fr}.hero-proof div{margin-bottom:10px}.confidence-grid{grid-template-columns:1fr}.section{padding:68px 0}.choices{grid-template-columns:1fr}.metric-grid{grid-template-columns:1fr}.details{padding:70px 0}.detail-title{align-items:flex-start;flex-wrap:wrap}.verified{margin-left:0}.detail-bottom{display:grid}.faq{padding:68px 0}.footer-inner{gap:13px}}
/* ===== V6.1 — typographie nette / desktop ===== */
html{
  text-rendering:optimizeLegibility;
  -webkit-text-size-adjust:100%;
}
body{
  font-family:"Inter","Segoe UI",Arial,sans-serif;
  font-weight:400;
  font-synthesis:none;
  letter-spacing:0;
}
button,input,select,textarea{
  font:inherit;
}
.brand,.hero h1,.compare-sidebar h2,.section-title h2,.method-copy h2,.faq-title h2{
  font-weight:800;
}
.hero h1{
  letter-spacing:-3.2px;
}
.compare-sidebar h2,.section-title h2,.method-copy h2,.faq-title h2{
  letter-spacing:-1.7px;
}
.quiz-shell h3{
  font-weight:700;
  letter-spacing:-.45px;
}
.choice{
  font-weight:600;
  letter-spacing:-.1px;
}
.progressText,.quiz-heading strong,.rec-brand strong,.card-top h3,.detail-title h3{
  font-weight:700;
}
.desktop-nav,.header-btn,.cta,.compare-card>a,.resultCard a,.restart{
  font-weight:600;
}
.tagline,.eyebrow,.tool-label,.verified-chip,.rec-rank,.level,.fit-chip,.best-label{
  font-weight:700;
}
.hero-proof strong,.match strong{
  font-weight:700;
}
p,li,td,th,small,span{
  text-rendering:optimizeLegibility;
}
@media (min-width:951px){
  .quiz-shell{padding:28px}
  .choice{font-size:15px;line-height:1.35}
  .quiz-shell h3{font-size:25px}
}

/* ===== V6.2 — quiz typography refinement ===== */
.quiz-shell h3{
  font-weight:600;
  letter-spacing:-.35px;
}
.choice{
  font-weight:500;
  letter-spacing:0;
}
.quiz-heading strong{
  font-weight:600;
}
.progressText{
  font-weight:600;
}


/* ===== V6.5 — mise en évidence du meilleur match ===== */
.compare-card.match-winner{
  border-color:#6c4ff7 !important;
  outline:3px solid #6c4ff7;
  outline-offset:3px;
  box-shadow:
    0 0 0 7px rgba(108,79,247,.10),
    0 18px 48px rgba(108,79,247,.20) !important;
  transform:translateY(-2px);
  transition:border-color .2s ease,outline-color .2s ease,box-shadow .2s ease,transform .2s ease;
}


/* ===== V6.6 — vrai meilleur match issu du questionnaire ===== */
.compare-card.match-winner{
  position:relative;
  border:3px solid #6c4ff7 !important;
  outline:none !important;
  box-shadow:
    0 0 0 5px rgba(108,79,247,.10),
    0 18px 48px rgba(108,79,247,.18) !important;
  transform:translateY(-2px);
}
.dynamic-match-badge{
  position:absolute;
  right:16px;
  top:-13px;
  z-index:5;
  background:#6c4ff7;
  color:#fff;
  border-radius:999px;
  padding:7px 10px;
  font-size:9px;
  font-weight:800;
  letter-spacing:.7px;
  box-shadow:0 8px 20px rgba(108,79,247,.22);
}
.compare-card.match-winner .best-label{
  display:none;
}


/* ===== V6.7 — correspondance stricte questionnaire -> carte ===== */
.compare-card.featured{
  border:1px solid #dfe4ec !important;
  box-shadow:none !important;
}
.best-label{
  display:none !important;
}
.compare-card.match-winner{
  position:relative;
  border:3px solid #6c4ff7 !important;
  outline:none !important;
  box-shadow:
    0 0 0 5px rgba(108,79,247,.12),
    0 18px 48px rgba(108,79,247,.20) !important;
  transform:translateY(-2px);
}
.dynamic-match-badge{
  position:absolute;
  right:16px;
  top:-13px;
  z-index:10;
  background:#6c4ff7;
  color:#fff;
  border-radius:999px;
  padding:7px 10px;
  font-size:9px;
  font-weight:800;
  letter-spacing:.7px;
  box-shadow:0 8px 20px rgba(108,79,247,.22);
}


/* ===== V6.8 — Guides & comparatifs ===== */
.guides-section{
  background:#fff;
  padding:88px 0;
  border-top:1px solid #e8ecf2;
}
.guides-grid{
  display:grid;
  grid-template-columns:minmax(0,760px);
  gap:16px;
}
.guide-card{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:18px;
  align-items:flex-start;
  background:#f8f9fc;
  border:1px solid #dfe4ec;
  border-radius:18px;
  padding:24px;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.guide-card:hover{
  transform:translateY(-2px);
  border-color:#cfc7ff;
  box-shadow:0 18px 44px rgba(25,33,60,.08);
}
.guide-icon{
  width:48px;
  height:48px;
  border-radius:14px;
  display:grid;
  place-items:center;
  background:#6c4ff7;
  color:#fff;
  font-size:20px;
  font-weight:800;
  box-shadow:0 10px 24px rgba(108,79,247,.18);
}
.guide-label{
  display:block;
  font-size:9px;
  letter-spacing:1.1px;
  font-weight:700;
  color:#6c4ff7;
  margin-bottom:7px;
}
.guide-content h3{
  margin:0 0 8px;
  font-size:23px;
  letter-spacing:-.7px;
}
.guide-content p{
  margin:0;
  color:#697388;
  font-size:13px;
  line-height:1.7;
}
.guide-content a{
  display:inline-block;
  margin-top:14px;
  color:#6c4ff7;
  font-size:12px;
  font-weight:700;
}
@media(max-width:620px){
  .guides-section{padding:66px 0}
  .guide-card{grid-template-columns:1fr}
}


/* ===== V6.8.1 — correction carte Guides sans icône € ===== */
.guide-card{
  grid-template-columns:1fr !important;
}

/* ===== V6.9 — plusieurs guides ===== */
.guides-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  max-width:1100px;
}
@media(max-width:820px){
  .guides-grid{grid-template-columns:1fr !important}
}

/* ===== V7.0 — grille Guides 3 cartes ===== */
.guides-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  max-width:1180px;
}
@media(max-width:980px){
  .guides-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}
@media(max-width:680px){
  .guides-grid{grid-template-columns:1fr !important}
}

/* ===== V7.1 — grille Guides 4 cartes ===== */
.guides-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  max-width:1100px;
}
@media(max-width:720px){
  .guides-grid{grid-template-columns:1fr !important}
}
