.as-hero{background:linear-gradient(135deg,hsl(44,18%,97%),hsl(44,23%,93%));border-left:5px solid hsl(44,46%,54%);border-radius:0 12px 12px 0;padding:28px 32px;margin:0 0 32px;font-size:16px;line-height:1.75}
.as-hero p{margin:0 0 14px}.as-hero p:last-child{margin:0}
.as-keypoints{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 32px;padding:0;list-style:none}
.as-keypoints li{background:#fff;border:1px solid hsl(44,23%,93%);border-radius:20px;padding:7px 16px;font-size:13px;font-weight:700;color:hsl(44,32%,26%);letter-spacing:.2px}
.as-section{margin:52px 0}.as-section h2{font-size:21px;font-weight:800;letter-spacing:-.2px;color:#1a1a1a;border-bottom:3px solid hsl(44,46%,54%);padding-bottom:10px;margin-bottom:22px}
.as-section p{font-size:15px;line-height:1.8;color:#2d2d2d;margin:0 0 18px}.as-section p:last-child{margin:0}
.as-tip{background:hsl(45,90%,95%);border-left:4px solid hsl(45,80%,55%);border-radius:0 8px 8px 0;padding:16px 20px;margin:24px 0;font-size:14px;line-height:1.6}
.as-callout{background:hsl(145,40%,95%);border-left:4px solid hsl(145,50%,40%);border-radius:0 8px 8px 0;padding:16px 20px;margin:24px 0;font-size:14px;color:#2d3748;line-height:1.6}
.as-pull{border-top:3px solid hsl(44,46%,54%);border-bottom:1px solid hsl(44,23%,93%);padding:20px 28px;margin:32px 0;font-size:17px;font-style:italic;color:hsl(44,41%,15%);line-height:1.65;text-align:center;background:hsl(44,18%,97%);border-radius:0 0 8px 8px}
.as-divider{height:2px;background:linear-gradient(to right,transparent,hsl(44,23%,93%) 30%,hsl(44,46%,54%) 50%,hsl(44,23%,93%) 70%,transparent);margin:40px 0;border:none}
.as-toc{background:hsl(44,18%,97%);border:1px solid hsl(44,23%,93%);border-radius:10px;padding:20px 26px;margin:0 0 32px}
.as-toc-title{font-size:14px;font-weight:800;color:hsl(44,32%,26%);text-transform:uppercase;letter-spacing:.8px;display:block;margin-bottom:14px}
.as-toc-list{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:6px 20px;counter-reset:toc}
.as-toc-list li{counter-increment:toc}
.as-toc-list a{display:flex;align-items:baseline;gap:8px;color:hsl(44,32%,26%);text-decoration:none;font-size:14px;padding:4px 0;border-bottom:1px dashed hsl(44,23%,93%)}
.as-toc-list a:hover{color:hsl(44,46%,54%)}.as-toc-list a::before{content:counter(toc);font-size:11px;font-weight:800;color:hsl(44,46%,54%);min-width:16px}
.as-comparison{margin:32px 0;overflow-x:auto;border-radius:10px;box-shadow:0 2px 8px rgba(0,0,0,.1)}
.as-comparison table{width:100%;border-collapse:collapse}
.as-comparison caption{font-weight:800;padding:14px 18px;text-align:left;font-size:14px;background:hsl(44,41%,15%);color:hsl(44,46%,94%);display:table-caption;letter-spacing:.3px}
.as-comparison th{background:hsl(44,32%,26%);color:hsl(44,18%,97%);padding:11px 14px;text-align:left;font-size:13px;font-weight:700}
.as-comparison td{padding:11px 14px;border-bottom:1px solid hsl(44,23%,93%);font-size:14px}
.as-comparison tr:nth-child(even) td{background:hsl(44,18%,97%)}
.as-sources{background:#f0f7ff;border-radius:8px;padding:18px 22px;margin:28px 0;font-size:14px}
.as-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;margin:16px 0 24px}
.as-card{background:#fff;border:1px solid hsl(44,23%,93%);border-radius:10px;padding:16px 18px;box-shadow:0 1px 4px rgba(0,0,0,.06)}
.as-card-title{display:block;font-size:14px;font-weight:700;color:hsl(44,41%,15%);margin-bottom:6px}
.as-card-desc{font-size:13px;color:#555;margin:0 0 10px;line-height:1.5}
.as-card-price{display:inline-block;font-size:13px;font-weight:700;color:hsl(44,46%,54%);background:hsl(44,18%,97%);padding:3px 10px;border-radius:12px}
.as-cta-block{background:linear-gradient(135deg,hsl(44,41%,15%),hsl(44,32%,26%));color:#fff;border-radius:14px;padding:28px 32px;margin:36px 0;text-align:center}
.as-cta-block p{color:#fff !important;margin:0;font-size:16px;font-weight:600;line-height:1.6}
.as-cta-block strong{color:hsl(44,46%,94%) !important}
@media(max-width:768px){
  .as-hero{padding:20px 18px;border-radius:0 8px 8px 0;font-size:15px;margin:0 0 24px}
  .as-keypoints{gap:6px;margin:0 0 24px}
  .as-keypoints li{padding:6px 12px;font-size:12px}
  .as-toc{padding:16px 18px;margin:0 0 24px}
  .as-toc-list{grid-template-columns:1fr;gap:4px}
  .as-toc-list a{font-size:13px;padding:5px 0}
  .as-card-grid{grid-template-columns:1fr;gap:10px}
  .as-card{padding:14px 16px}
  .as-section{margin:36px 0}
  .as-section h2{font-size:18px}
  .as-section p{font-size:14px}
  .as-tip{padding:12px 16px;font-size:13px}
  .as-callout{padding:12px 16px;font-size:13px}
  .as-pull{padding:14px 18px;font-size:15px;margin:20px 0}
  .as-comparison{border-radius:6px}
  .as-comparison td,.as-comparison th{padding:9px 10px;font-size:12px}
  .as-sources{padding:14px 16px;font-size:13px}
  .as-cta-block{padding:20px 18px;border-radius:10px;margin:24px 0}
  .as-cta-block p{font-size:14px}
}

/* ── iPad 768-1024px ────────────────────────────────────────────────────── */
@media(min-width:769px) and (max-width:1024px){
  .main-nav a{padding:6px 7px !important;font-size:10px !important;letter-spacing:.02em !important}
  .brand-name{font-size:16px !important}
  .brand-tagline{display:none !important}
  .header-search{display:none !important}
}

/* ── Mobile 375-768px ───────────────────────────────────────────────────── */
@media(max-width:768px){
  .site-brand{margin-right:auto !important}
  .brand-name{font-size:15px !important}
  .brand-logo{width:32px !important;height:32px !important;font-size:15px !important}
  /* Homepage hero responsive */
  .hp-hero{padding:40px 0 36px !important}
  .hp-hero h1{font-size:clamp(26px,7vw,38px) !important}
  .hp-hero-sub{font-size:15px !important}
  .hp-stats-grid{grid-template-columns:repeat(2,1fr) !important;gap:12px !important}
  .hp-stat{border-right:none !important;padding:12px !important}
  .hp-pillars-grid,.hp-guides-grid,.hp-trust-grid{grid-template-columns:1fr !important}
  .hp-eeat-inner{grid-template-columns:1fr !important;gap:32px !important}
  .hp-eeat-avatar{width:80px !important;height:80px !important;font-size:32px !important}
  .hp-hero-actions{flex-direction:column !important;gap:10px !important}
  .btn-primary,.btn-ghost{width:100% !important;justify-content:center !important}
}

/* ══ LOGO LEFT FINAL — spécificité .site-header .xxx ════════════════════ */
.site-header .header-inner{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
}
.site-header .site-brand{
  flex-shrink:0 !important;
  order:0 !important;
  margin-right:0 !important;
}
.site-header .header-right{
  display:flex !important;
  align-items:center !important;
  flex:1 !important;
  justify-content:flex-end !important;
  order:1 !important;
  gap:6px !important;
}
.site-header .main-nav{flex:unset !important}
.site-header .main-nav ul{
  display:flex !important;
  flex-wrap:nowrap !important;
  justify-content:flex-end !important;
  gap:0 !important;
  align-items:center !important;
}
.site-header .main-nav a{
  padding:4px 8px !important;
  font-size:10px !important;
  white-space:nowrap !important;
}
.site-header .brand-name{font-size:18px !important}
.site-header .brand-tagline{font-size:9px !important}

@media(min-width:769px) and (max-width:1200px){
  .site-header .main-nav a{font-size:8.5px !important;padding:4px 6px !important}
  .site-header .brand-tagline{display:none !important}
  .site-header .header-search{display:none !important}
}
@media(max-width:768px){
  .site-header .main-nav{display:none !important}
  .site-header .nav-toggle{display:block !important}
  .site-header .header-search{display:none !important}
  .site-header .brand-tagline{display:none !important}
}