.eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .11em; margin-bottom: 20px; }
.content-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.content-card { display: flex; flex-direction: column; position: relative; border: 1.5px solid var(--ink); border-radius: 12px; padding: 28px; min-width: 0; transition: background .15s, box-shadow .15s; }
.content-card:hover { background: var(--light-blue); box-shadow: 4px 4px 0 var(--ink); }
.card-number { font-size: 11px; font-weight: 600; letter-spacing: .09em; margin-bottom: 35px; }
.content-card h3 { font-size: 30px; line-height: 1.08; overflow-wrap: anywhere; margin-bottom: 18px; }
.content-card p { font-size: 16px; line-height: 1.65; }
.card-arrow { font-size: 30px; color: var(--blue); margin-top: auto; padding-top: 28px; align-self: flex-end; }
.discovery-section { border-top: 1px solid var(--line); }
.discovery-section .section-intro h2 { max-width: 680px; }
.content-footer { display: grid; grid-template-columns: 1fr 1fr 1.1fr; gap: 35px; padding-block: 54px; border-bottom: 1px solid var(--line); font-size: 15px; }
.content-footer nav { display: flex; flex-direction: column; gap: 11px; align-items: flex-start; }
.content-footer strong { margin-bottom: 8px; }
.content-footer a:hover { text-decoration: underline; text-underline-offset: 4px; }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: 10px; padding-block: 22px; font-size: 13px; }
.breadcrumbs a { text-decoration: underline; text-underline-offset: 3px; }
.content-hero { padding-block: 58px 65px; background: var(--yellow); border-block: 1.5px solid var(--ink); }
.content-hero h1 { max-width: 1000px; font-size: clamp(44px, 6.6vw, 90px); line-height: 1.02; text-wrap: balance; }
.content-lead { font-size: clamp(18px, 2vw, 23px); max-width: 830px; margin-top: 28px; line-height: 1.6; }
.content-hero .button { margin-top: 28px; }
.byline { font-size: 14px; margin-top: 25px; }
.byline a { text-decoration: underline; }
.content-main { padding-block: 64px 80px; }
.reading-layout { display: grid; grid-template-columns: minmax(0, 760px) minmax(240px, 320px); gap: 72px; justify-content: space-between; }
.article-copy { min-width: 0; font-size: 18px; line-height: 1.8; }
.article-copy a, .article-section > p a { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }
.answer-box { background: var(--light-blue); padding: 28px 30px; border-left: 4px solid var(--blue); }
.answer-box > span { display: block; font-size: 11px; letter-spacing: .1em; font-weight: 600; margin-bottom: 12px; }
.article-section { margin-top: 46px; scroll-margin-top: 30px; }
.article-section h2 { font-size: clamp(28px, 3vw, 39px); line-height: 1.13; margin-bottom: 20px; letter-spacing: -.035em; }
.article-section p + p { margin-top: 18px; }
.article-section ul, .article-section ol { padding-left: 24px; }
.article-section li { padding-left: 5px; margin-bottom: 12px; }
.article-section > .content-cards { margin-top: 30px; }
.contents { display: flex; flex-direction: column; gap: 13px; border-bottom: 1px solid var(--line); padding-bottom: 28px; font-size: 15px; }
.contents a:hover { color: var(--blue); text-decoration: underline; }
.aside-contact { margin-top: 30px; padding: 26px; background: var(--light-blue); border: 1.5px solid var(--ink); border-radius: 12px; }
.aside-contact > span { font-size: 48px; color: var(--blue); }
.aside-contact h2 { font-size: 31px; line-height: 1.1; margin-block: 10px 18px; }
.aside-contact p { font-size: 16px; margin-bottom: 22px; }
.aside-contact .button { font-size: 14px; padding: 13px 16px; width: 100%; }
.questions details { border-top: 1px solid var(--line); padding-block: 18px; }
.questions summary { cursor: pointer; font-weight: 600; line-height: 1.5; }
.questions details p { margin-top: 14px; font-size: 17px; }
.related { margin-top: 80px; padding-top: 50px; border-top: 1px solid var(--line); }
.related h2 { font-size: clamp(34px, 4vw, 48px); margin-bottom: 30px; }
.content-cta { padding-block: 60px; background: var(--yellow); border-block: 1.5px solid var(--ink); }
.content-cta > div { display: flex; justify-content: space-between; align-items: center; gap: 35px; }
.content-cta h2 { font-size: clamp(34px, 4.4vw, 60px); }
.content-cta p:not(.eyebrow) { max-width: 700px; margin-top: 20px; }
.content-cta .button { flex-shrink: 0; }
.content-copyright { display: flex; align-items: center; justify-content: space-between; padding-block: 28px; }
.table-scroll { overflow-x: auto; max-width: 100%; }
.article-copy table { border-collapse: collapse; width: 100%; font-size: 15px; line-height: 1.55; }
.article-copy caption { text-align: left; margin-bottom: 14px; font-weight: 600; }
.article-copy th, .article-copy td { text-align: left; vertical-align: top; padding: 13px; border: 1px solid var(--line); }
.article-copy th { background: var(--light-blue); }
@media (max-width: 1000px) {
  .reading-layout { grid-template-columns: minmax(0, 1fr) 245px; gap: 35px; }
  .content-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .content-cta > div { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 760px) {
  .content-cards, .content-footer, .reading-layout { grid-template-columns: minmax(0, 1fr); }
  .content-footer { gap: 30px; padding-block: 35px; }
  .content-hero { padding-block: 38px 42px; }
  .content-hero h1 { font-size: clamp(38px, 9vw, 64px); hyphens: auto; overflow-wrap: anywhere; }
  .content-main { padding-block: 35px 55px; }
  .content-card { padding: 24px; }
  .reading-aside { grid-row: 1; }
  .reading-aside .aside-contact { display: none; }
  .contents { gap: 8px; font-size: 14px; }
  .article-copy { font-size: 17px; }
  .answer-box { padding: 23px; }
  .related { margin-top: 55px; }
  .content-cta { padding-block: 40px; }
  .article-copy th, .article-copy td { padding: 8px; overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) { .content-card { transition: none; } }
