.area-page .area-topics { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 20px; }
.area-page .area-topic { grid-column: span 3; display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 28px 24px; min-width: 0; text-align: left; }
.area-page .area-topic:nth-child(-n+3) { grid-column: span 4; }
.area-page .area-number { position: absolute; top: 28px; right: 24px; padding: 0; }
.area-page .area-topic-main { flex: 1; min-width: 0; }
.area-page .area-topic h3 { font-size: clamp(1.25rem, 1.7vw, 1.7rem); overflow-wrap: break-word; }
.area-page .area-topic .cp-topic-button { align-self: flex-start; margin-top: 28px; color: #fffdf9; font-weight: 500; gap: 12px; white-space: normal; }
.area-page .area-topic .cp-topic-button:hover, .area-page .area-topic .cp-topic-button:focus-visible { color: #e63540; }
.area-page .area-contact { width: 100%; max-width: none; background: #f1ede6; color: #151312; border: 0; padding: 128px max(24px, calc((100% - 1180px) / 2)); }
.area-page .area-contact p:not(.area-eyebrow) { color: #514941; }
.area-page .area-contact .area-action { color: #fffdf9; }
.area-page .area-contact .area-action:focus-visible { outline-color: #b30e18; }
@media (max-width: 1000px) {
  .area-page .area-topics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .area-page .area-topic, .area-page .area-topic:nth-child(-n+3) { grid-column: auto; }
}
@media (max-width: 600px) { .area-page .area-topics { grid-template-columns: 1fr; } }

/* The existing animated outline is the only card border. */
.area-page .area-topic { border-color: transparent; background: linear-gradient(120deg, #111, #0c0c0c); }

@media (max-width: 700px) { .area-page .area-contact { padding-top: 88px; padding-bottom: 88px; } }