/* Blog — Ferrari cockpit layer */
.blog-page{
  overflow:hidden;
  color:var(--blog-text-color);
  font-family:var(--blog-body-font);
}
.blog-page h1,.blog-page h2,.blog-page h3{
  font-family:var(--blog-title-font)!important;
  font-weight:var(--blog-title-weight)!important;
  color:var(--blog-title-color)!important;
  letter-spacing:-.02em;
}
.blog-page p,.blog-page li{
  font-family:var(--blog-body-font)!important;
  font-weight:var(--blog-body-weight)!important;
  color:var(--blog-text-color)!important;
  font-size:var(--blog-body-d)!important;
  line-height:1.6!important;
}
.blog-page .blog-label,.blog-page .blog-eyebrow,
.blog-page button,.blog-page select,.blog-page input{
  font-family:var(--blog-ui-font)!important;
  font-weight:var(--blog-ui-weight)!important;
}
.blog-page .blog-eyebrow{
  display:block;
  margin-bottom:12px;
  color:var(--blog-label-color);
  font-size:12px;
  letter-spacing:.16em;
  text-transform:uppercase;
}

/* HERO — même langage visuel que les pages Ferrari validées */
.blog-page .blog-hero{
  min-height:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(300px,var(--blog-hero-photo-width))!important;
  gap:56px!important;
  align-items:center!important;
  background:var(--blog-hero-bg)!important;
  padding:var(--blog-hero-pad-d) max(28px,calc((100% - 1180px)/2))!important;
}
.blog-page .blog-hero-copy{padding:0!important;display:block!important}
.blog-page .blog-label{
  display:inline-flex!important;
  align-items:center;
  border:1px solid color-mix(in srgb,var(--blog-label-color) 48%,transparent)!important;
  border-radius:999px!important;
  padding:8px 16px!important;
  color:var(--blog-label-color)!important;
  font-size:11px!important;
  margin:0 0 18px!important;
}
.blog-page .blog-hero h1{
  margin:0 0 22px!important;
  max-width:700px!important;
  font-size:var(--blog-h1-d)!important;
  line-height:1.04!important;
}
.blog-page .blog-hero-copy>p{
  max-width:650px!important;
  margin:0 0 26px!important;
}
.blog-page .blog-hero-visual{
  height:var(--blog-hero-photo-h);
  border-radius:var(--blog-photo-radius);
  overflow:hidden;
  box-shadow:0 14px 38px rgba(44,62,54,.10);
  background:rgba(255,255,255,.45);
}
.blog-page .blog-hero-photo{
  width:100%!important;height:100%!important;
  object-fit:cover!important;
  object-position:var(--blog-hero-position,center center)!important;
  border-radius:inherit!important;
}
.blog-page .blog-hero-button,
.blog-page .blog-btn-primary{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;
  width:max-content!important;
  background:var(--blog-btn-bg)!important;color:var(--blog-btn-text)!important;
  border:1px solid var(--blog-btn-bg)!important;
  border-radius:var(--blog-btn-radius)!important;
  padding:var(--blog-btn-y) var(--blog-btn-x)!important;
  font-family:var(--blog-ui-font)!important;font-size:var(--blog-btn-size)!important;font-weight:var(--blog-ui-weight)!important;
}

/* MAILLAGE */
.blog-page .blog-mesh{
  background:var(--blog-mesh-bg)!important;
  padding:var(--blog-mesh-pad-d) max(28px,calc((100% - 1180px)/2))!important;
}
.blog-page .blog-section-head{
  max-width:780px;
  margin:0 auto 30px;
  text-align:center;
}
.blog-page .blog-section-head h2{
  margin:0 0 12px!important;
  font-size:var(--blog-h2-d)!important;
  line-height:1.08!important;
}
.blog-page .blog-section-head p{margin:0 auto!important;max-width:720px!important}
.blog-page .blog-mesh-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:var(--blog-mesh-gap);
}
.blog-page .blog-mesh-card{
  display:flex;
  flex-direction:column;
  min-height:250px;
  padding:28px;
  border-radius:var(--blog-mesh-radius);
  background:var(--blog-mesh-card-bg);
  border:1px solid rgba(60,70,60,.08);
}
.blog-page .blog-mesh-card h3{
  margin:0 0 12px!important;
  font-size:27px!important;
  color:var(--blog-mesh-card-title)!important;
}
.blog-page .blog-mesh-card p{
  margin:0 0 20px!important;
  color:var(--blog-mesh-card-text)!important;
  font-size:14px!important;
}
.blog-page .blog-mesh-card a{
  margin-top:auto;
  font-family:var(--blog-ui-font);
  font-weight:700;
  font-size:12px;
  color:#000;
  text-decoration:none;
  border-bottom:1px solid rgba(0,0,0,.25);
  width:max-content;
}

/* ARTICLES */
.blog-page .articles-section{
  background:var(--blog-articles-bg)!important;
  padding:var(--blog-articles-pad-d) max(28px,calc((100% - 1240px)/2))!important;
}
.blog-page .articles-top{
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:32px!important;
  margin-bottom:34px!important;
}
.blog-page .articles-title h2{
  margin:0 0 10px!important;
  font-size:var(--blog-h2-d)!important;
  line-height:1.05!important;
}
.blog-page .articles-title p{margin:0!important}
.blog-page .article-tools{
  display:flex!important;
  gap:14px!important;
  align-items:center!important;
}
.blog-page .category-select,
.blog-page .searchbox{
  min-height:46px!important;
  border:1px solid #d9c7bc!important;
  border-radius:999px!important;
  background:#fff!important;
}
.blog-page .category-select{
  padding:0 18px!important;
  color:#3e4f48!important;
  font-size:12px!important;
}
.blog-page .searchbox{
  width:300px!important;
  display:flex!important;
  overflow:hidden!important;
}
.blog-page .searchbox input{
  flex:1;min-width:0;border:0!important;outline:0!important;background:transparent!important;
  padding:0 16px!important;font-size:12px!important;color:#3e4f48!important;
}
.blog-page .searchbox button{
  width:48px;border:0!important;background:transparent!important;color:var(--blog-label-color)!important;
}
.blog-page .searchbox svg{width:17px!important;height:17px!important}

.blog-page .article-grid{
  display:grid!important;
  grid-template-columns:repeat(var(--blog-card-cols),1fr)!important;
  gap:var(--blog-card-gap)!important;
}
.blog-page .article-card{
  min-width:0;
  display:flex;
  flex-direction:column;
  background:var(--blog-card-bg);
  border:1px solid var(--blog-card-border);
  border-radius:var(--blog-card-radius);
  overflow:hidden;
  box-shadow:0 9px 26px rgba(55,60,50,.055);
}
.blog-page .article-image-link{
  display:block;
  overflow:hidden;
  background:#f4f1ec;
}
.blog-page .article-card-img{
  width:100%!important;
  height:var(--blog-card-img-h)!important;
  object-fit:cover!important;
  border-radius:0!important;
  transition:transform .25s ease;
}
.blog-page .article-card:hover .article-card-img{transform:scale(1.015)}
.blog-page .article-card-body{
  display:flex;
  flex:1;
  flex-direction:column;
  padding:var(--blog-card-padding);
}
.blog-page .article-tags{
  display:flex!important;flex-wrap:wrap!important;gap:6px!important;
  margin:0 0 12px!important;
}
.blog-page .article-tags span{
  background:var(--blog-tag-bg)!important;
  color:var(--blog-tag-text)!important;
  border-radius:999px;
  padding:5px 8px;
  font-family:var(--blog-ui-font)!important;
  font-size:8px!important;
  font-weight:700!important;
  letter-spacing:.04em;
}
.blog-page .article-card h3{
  min-height:0!important;
  margin:0 0 12px!important;
  font-size:var(--blog-card-title-d)!important;
  line-height:1.08!important;
}
.blog-page .article-card h3 a{color:inherit;text-decoration:none}
.blog-page .article-card .excerpt{
  min-height:0!important;
  margin:0 0 18px!important;
  font-size:var(--blog-excerpt-d)!important;
  line-height:1.55!important;
}
.blog-page .article-meta{
  margin-top:auto;
  padding-top:14px;
  border-top:1px solid rgba(80,80,70,.10);
}
.blog-page .article-meta strong,
.blog-page .article-meta span{
  display:block!important;
  color:var(--blog-meta-color)!important;
  font-family:var(--blog-ui-font)!important;
  font-size:var(--blog-meta-d)!important;
  line-height:1.35!important;
}
.blog-page .article-meta strong{font-weight:700!important}
.blog-page .article-meta span{margin-top:3px!important}
.blog-page .article-card[hidden]{display:none!important}
.blog-page .blog-filter-empty{text-align:center;margin:40px 0 0!important}

/* CTA FINAL */
.blog-page .blog-final-cta{
  background:var(--blog-final-bg)!important;
  padding:var(--blog-final-pad-d) 28px!important;
  text-align:center;
}
.blog-page .blog-final-cta h2{
  max-width:800px;
  margin:0 auto 14px!important;
  font-size:var(--blog-h2-d)!important;
  line-height:1.08!important;
  color:var(--blog-final-title)!important;
}
.blog-page .blog-final-cta p{
  max-width:700px!important;
  margin:0 auto 24px!important;
  color:var(--blog-final-text)!important;
}
.blog-page .blog-final-actions{
  display:flex;
  justify-content:center;
  gap:12px;
  flex-wrap:wrap;
}
.blog-page .blog-btn-secondary{
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--blog-btn-alt-bg)!important;color:var(--blog-btn-alt-text)!important;
  border:1px solid var(--blog-btn-alt-border)!important;
  border-radius:var(--blog-btn-radius)!important;
  padding:var(--blog-btn-y) var(--blog-btn-x)!important;
  font-family:var(--blog-ui-font)!important;font-size:var(--blog-btn-size)!important;font-weight:var(--blog-ui-weight)!important;
}

/* RESSOURCES — aligné sur Mon approche */
.blog-page .blog-resources-lead{
  background:var(--blog-resources-bg)!important;
  min-height:0!important;
  display:flex!important;
  align-items:center!important;
  gap:18px!important;
  padding:var(--blog-resources-pad-d) max(28px,calc((100% - 1180px)/2))!important;
}
.blog-page .blog-resources-lead .resources-icon{
  width:72px!important;height:72px!important;flex:0 0 72px!important;
  border-radius:50%!important;background:#f7ddd3!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
}
.blog-page .blog-resources-lead .resources-icon svg,
.blog-page .blog-resources-lead .resources-icon img{
  width:38px!important;height:38px!important;object-fit:contain!important;
  fill:none;stroke:#7a3f32;stroke-width:1.5;
}
.blog-page .blog-resources-lead .resources-copy{min-width:0}
.blog-page .blog-resources-lead .resources-copy h2{
  margin:0!important;
  font-size:30px!important;
  color:var(--blog-title-color)!important;
}
.blog-page .blog-resources-lead .resources-copy p{
  margin:6px 0 0!important;
  font-size:13px!important;
}
.blog-page .blog-resources-lead .resources-form{
  margin-left:auto!important;
  width:min(440px,100%)!important;
  min-height:50px!important;
  display:flex!important;
  overflow:hidden!important;
  border:1px solid #d8b7aa!important;
  border-radius:999px!important;
  background:#fff!important;
}
.blog-page .blog-resources-lead .resources-form input{
  flex:1;min-width:0;border:0!important;outline:0!important;padding:0 18px!important;background:transparent!important;font-size:12px!important;
}
.blog-page .blog-resources-lead .resources-form button{
  border:0!important;
  background:#000!important;color:#fff!important;
  padding:0 22px!important;
  font-size:12px!important;
  white-space:nowrap;
}

/* Responsive */
@media(max-width:1050px){
  .blog-page .blog-hero{
    grid-template-columns:1fr!important;
    gap:30px!important;
    padding:var(--blog-hero-pad-m) 20px!important;
  }
  .blog-page .blog-hero h1{font-size:var(--blog-h1-m)!important;max-width:900px!important}
  .blog-page .blog-hero-visual{height:var(--blog-hero-photo-hm)!important}
  .blog-page h2{font-size:var(--blog-h2-m)!important}
  .blog-page p{font-size:var(--blog-body-m)!important}
  .blog-page .blog-mesh{padding:var(--blog-mesh-pad-m) 20px!important}
  .blog-page .blog-mesh-grid{grid-template-columns:1fr!important}
  .blog-page .blog-mesh-card{min-height:0}
  .blog-page .articles-section{padding:var(--blog-articles-pad-m) 20px!important}
  .blog-page .articles-top{align-items:flex-start!important;flex-direction:column!important}
  .blog-page .article-tools{width:100%!important;flex-wrap:wrap!important}
  .blog-page .searchbox{width:min(360px,100%)!important}
  .blog-page .article-grid{grid-template-columns:repeat(2,1fr)!important}
  .blog-page .article-card h3{font-size:var(--blog-card-title-m)!important}
  .blog-page .blog-final-cta{padding:var(--blog-final-pad-m) 20px!important}
  .blog-page .blog-resources-lead{padding:var(--blog-resources-pad-m) 20px!important;flex-wrap:wrap!important}
  .blog-page .blog-resources-lead .resources-form{margin-left:0!important;width:100%!important}
}
@media(max-width:650px){
  .blog-page .article-grid{grid-template-columns:1fr!important}
  .blog-page .article-tools{flex-direction:column!important;align-items:stretch!important}
  .blog-page .category-select,.blog-page .searchbox{width:100%!important}
  .blog-page .blog-final-actions{flex-direction:column;align-items:center}
  .blog-page .blog-resources-lead{display:grid!important;grid-template-columns:auto 1fr!important}
  .blog-page .blog-resources-lead .resources-form{grid-column:1/-1!important}
}
