/* ============================================================
   NORMOVE — styles du blog
   ============================================================ */
.blog-wrap { max-width: 1200px; margin: 0 auto; padding: 0 40px; }
.blog-hero { padding: 64px 0 40px; }
.kicker { color:#A88A07; font-weight:800; font-size:13px; letter-spacing:.12em; text-transform:uppercase; margin-bottom:10px; }
.blog-hero h1 { font-size:44px; line-height:1.12; font-weight:800; margin:0 0 16px; letter-spacing:-0.015em; }
.blog-hero p { font-size:17.5px; line-height:1.65; color:#3D4C5E; max-width:62ch; margin:0; }

.grid { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:26px; padding:14px 0 72px; }
.card { background:#fff; border:1px solid #E4E1D6; border-radius:16px; overflow:hidden; display:flex; flex-direction:column; transition:transform .18s ease, box-shadow .18s ease; }
.card:hover { transform:translateY(-4px); box-shadow:0 20px 44px rgba(11,31,51,0.12); }
.card img { width:100%; height:190px; object-fit:cover; display:block; }
.card-body { padding:20px 22px 24px; display:flex; flex-direction:column; gap:10px; flex:1; }
.card h2 { font-size:19px; line-height:1.3; font-weight:800; margin:0; letter-spacing:-0.01em; }
.card p { font-size:14.5px; line-height:1.6; color:#3D4C5E; margin:0; flex:1; }
.card .meta { font-size:12.5px; color:#6B7A8C; }
.card a.more { font-weight:800; font-size:14px; color:#A88A07; }

/* ---------- Article ---------- */
.art-head { max-width:820px; margin:0 auto; padding:52px 40px 0; }
.art-head h1 { font-size:40px; line-height:1.15; font-weight:800; margin:12px 0 16px; letter-spacing:-0.018em; text-wrap:balance; }
.art-meta { font-size:13.5px; color:#6B7A8C; display:flex; gap:14px; flex-wrap:wrap; align-items:center; }
.art-cover { max-width:1000px; margin:32px auto 0; padding:0 40px; }
.art-cover img { width:100%; height:420px; object-fit:cover; border-radius:16px; display:block; }
.art-cover figcaption { font-size:12.5px; color:#6B7A8C; margin-top:8px; }
.art-body { max-width:760px; margin:0 auto; padding:44px 40px 0; }
.art-body p { font-size:17px; line-height:1.78; color:#243244; margin:0 0 20px; }
.art-body p.lead { font-size:19px; line-height:1.7; color:#0B1F33; font-weight:500; margin-bottom:34px; }
.art-body h2 { font-size:25px; font-weight:800; line-height:1.25; margin:44px 0 14px; letter-spacing:-0.012em; }
.art-body h2::before { content:""; display:block; width:44px; height:3px; background:#C7A008; margin-bottom:14px; }
.art-body ul, .art-body ol { font-size:17px; line-height:1.78; color:#243244; margin:0 0 22px; padding-left:22px; }
.art-body li { margin-bottom:9px; }
.art-body a { color:#A88A07; font-weight:600; text-decoration:underline; text-underline-offset:2px; }
.art-body a:hover { color:#C7A008; }
.art-body strong { color:#0B1F33; }

.art-cta { max-width:760px; margin:52px auto 0; padding:0 40px; }
.art-cta > div { background:#0B1F33; border-radius:16px; padding:34px 36px; color:#DCE4EE; }
.art-cta-k { color:#EFC93D; font-weight:800; font-size:12.5px; letter-spacing:.12em; text-transform:uppercase; margin-bottom:10px; }
.art-cta h2 { color:#fff; font-size:24px; font-weight:800; margin:0 0 10px; line-height:1.3; }
.art-cta p { font-size:15.5px; line-height:1.7; margin:0 0 22px; }
.art-cta strong { color:#EFC93D; }
.art-cta-btns { display:flex; gap:12px; flex-wrap:wrap; }
.btn-gold { background:#C7A008; color:#0B1F33 !important; font-weight:800; padding:13px 24px; border-radius:8px; font-size:15px; }
.btn-gold:hover { background:#EFC93D; }
.btn-line { border:2px solid #40597A; color:#DCE4EE !important; font-weight:800; padding:11px 22px; border-radius:8px; font-size:15px; }
.btn-line:hover { border-color:#EFC93D; color:#EFC93D !important; }

.art-more { max-width:1200px; margin:0 auto; padding:72px 40px 88px; }
.art-more h2 { font-size:24px; font-weight:800; margin:0 0 24px; }
.art-more .grid { padding-bottom:0; }

.breadcrumb { font-size:13px; color:#6B7A8C; }
.breadcrumb a { color:#6B7A8C; }
.breadcrumb a:hover { color:#A88A07; }

@media (max-width:1000px) {
  .blog-wrap, .art-head, .art-body, .art-cta, .art-more, .art-cover { padding-left:22px !important; padding-right:22px !important; }
  .grid { grid-template-columns:minmax(0,1fr) !important; gap:22px; }
  .blog-hero h1 { font-size:31px; }
  .art-head h1 { font-size:29px; }
  .art-body h2 { font-size:22px; }
  .art-body p, .art-body ul, .art-body ol { font-size:16.5px; }
  .art-cover img { height:230px; }
  .art-cta > div { padding:26px 22px; }
}
