.content-hero, .blog-hero { padding: 13rem 0 6rem; background: var(--color-ivory); }
.content-hero h1, .blog-hero h1 { max-width: 58rem; margin: var(--space-24) 0; font-size: clamp(2.75rem, 5vw, var(--font-size-64)); }
.content-hero .lead, .blog-hero .lead { max-width: 52rem; }
.content-visual, .content-card__visual { display: grid; place-items: center; overflow: hidden; }
.content-visual { min-height: clamp(24rem, 52vw, 42rem); margin-top: calc(var(--space-48) * -1); border-radius: var(--radius-20); }
.content-visual > div, .content-card__visual > div { width: min(70%, 42rem); aspect-ratio: 16 / 10; padding: clamp(var(--space-20), 4vw, var(--space-48)); border: .6rem solid var(--color-navy-900); border-bottom-width: 1.2rem; border-radius: var(--radius-20); display: grid; align-content: center; gap: var(--space-16); background: var(--color-white); box-shadow: 1.5rem 2rem 3rem rgba(16,32,47,.22); transform: rotate(-2deg); }
.content-visual i, .content-card__visual i { width: 24%; height: .45rem; background: var(--color-green-600); }
.content-visual b, .content-card__visual b { width: 78%; height: 1rem; background: var(--color-navy-900); }
.content-visual b:nth-child(3) { width: 55%; }
.content-visual span, .content-card__visual span { width: 42%; height: 2.2rem; border-radius: var(--radius-pill); background: var(--color-gold-500); }
.content-visual--company { background: linear-gradient(145deg, #dfe8ec, #f7f8f5); }
.content-visual--diagnosis { background: var(--color-green-100); }
.content-visual--diagnosis > div { border-radius: 50%; transform: rotate(3deg); }
.content-visual--proposal { background: linear-gradient(#b9d0d3 0 42%, #5c846d 43% 68%, #315742 69%); }
.content-visual--proposal > div { border-color: rgba(255,255,255,.9); background: rgba(16,32,47,.22); transform: rotate(2deg); }
.article-width { max-width: 52rem; }
.content-article section, .blog-body section { margin-bottom: var(--space-64); }
.content-article h2, .blog-body h2 { margin-bottom: var(--space-16); font-size: clamp(var(--font-size-24), 3vw, var(--font-size-40)); }
.content-article p, .blog-body p { color: var(--color-gray-700); }
.content-note, .article-cta { margin-top: var(--space-80); padding: var(--space-32); border-radius: var(--radius-20); background: var(--color-ivory); }
.content-note b { color: var(--color-navy-900); }
.content-note p { margin: var(--space-8) 0 var(--space-20); }
.content-note a { color: var(--color-green-700); font-weight: 800; }
.content-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-24); }
.content-card { overflow: hidden; border: 0.0625rem solid var(--color-gray-200); border-radius: var(--radius-20); }
.content-card > a { height: 100%; display: flex; flex-direction: column; text-decoration: none; }
.content-card__visual { min-height: 18rem; }
.content-card__visual > div { width: 72%; padding: var(--space-24); border-width: .4rem; border-bottom-width: .9rem; border-radius: var(--radius-12); }
.content-card__body { padding: var(--space-32); display: flex; flex: 1; flex-direction: column; align-items: flex-start; }
.content-card__body h2 { margin: var(--space-20) 0 var(--space-12); font-size: var(--font-size-24); }
.content-card__body p { margin-bottom: var(--space-32); color: var(--color-gray-700); }
.content-card__body strong { margin-top: auto; color: var(--color-green-700); }
.blog-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-24); }
.blog-card { border: 0.0625rem solid var(--color-gray-200); border-radius: var(--radius-20); background: var(--color-white); }
.blog-card > a { min-height: 23rem; padding: clamp(var(--space-32), 5vw, var(--space-48)); display: flex; flex-direction: column; align-items: flex-start; text-decoration: none; }
.blog-card h2 { margin: var(--space-24) 0 var(--space-12); font-size: clamp(var(--font-size-24), 3vw, var(--font-size-30)); }
.blog-card p { margin-bottom: var(--space-32); color: var(--color-gray-700); }
.blog-card strong { margin-top: auto; color: var(--color-green-700); }
.blog-intro { margin-bottom: var(--space-80); color: var(--color-navy-900) !important; font-size: clamp(var(--font-size-20), 2.5vw, var(--font-size-24)); font-weight: 700; }
.article-cta p { margin-bottom: var(--space-20); color: var(--color-navy-900); font-weight: 800; }

@media (max-width: 74.9375rem) {
  .content-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 47.9375rem) {
  .content-hero, .blog-hero { padding: 10rem 0 5rem; }
  .content-visual { min-height: 22rem; margin-top: calc(var(--space-24) * -1); }
  .content-visual > div { width: 82%; }
  .content-card-grid, .blog-card-grid { grid-template-columns: 1fr; }
  .content-card__visual { min-height: 15rem; }
  .blog-card > a { min-height: 20rem; padding: var(--space-32); }
}

