/* Educational resources */
.resources-section { padding: clamp(6rem, 11vw, 10rem) var(--page-gutter); background: #f7fbfb; }
.resource-preview-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.resource-preview-card { display: flex; min-height: 390px; flex-direction: column; align-items: flex-start; padding: clamp(2rem, 4vw, 4rem); border: 1px solid var(--hairline); border-radius: 24px; background: var(--canvas); box-shadow: var(--elevation); }
.resource-preview-card:nth-child(2) { border-top: 4px solid var(--teal-text); }
.resource-preview-card:first-child, .resource-preview-card:nth-child(3) { border-top: 4px solid var(--amber); }
.resource-preview-card h3 { margin: 2rem 0 1.25rem; font-size: clamp(2.5rem, 4vw, 4.8rem); }
.resource-preview-card > p:not(.eyebrow) { max-width: 36rem; color: var(--muted); }
.resource-preview-card .text-link { display: inline-flex; min-height: 44px; align-items: center; margin-top: auto; }
#resources { scroll-margin-top: 100px; }

.resource-page h2 { font-size: clamp(2.8rem, 5vw, 5.4rem); }
.resource-hero { display: grid; min-height: min(780px, calc(100vh - 84px)); grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2rem 1rem; align-items: end; padding: clamp(6rem, 10vw, 9rem) var(--page-gutter); background: radial-gradient(circle at 84% 20%, rgb(0 166 166 / 16%), transparent 22rem), linear-gradient(145deg, #fff 20%, #f3fbfb 100%); }
.resource-hero--compare { background: radial-gradient(circle at 82% 18%, rgb(245 163 0 / 17%), transparent 22rem), linear-gradient(145deg, #fff 20%, #fbf8f1 100%); }
.resource-hero__copy { grid-column: 2 / span 7; }
.resource-hero h1 { max-width: 10ch; margin-bottom: 2rem; font-size: clamp(4.5rem, 10vw, 10rem); font-weight: 790; letter-spacing: -0.07em; line-height: 0.86; }
.resource-hero__answer { max-width: 52rem; color: var(--muted); font-size: clamp(1.15rem, 1.6vw, 1.45rem); line-height: 1.6; }
.resource-hero__answer strong { color: var(--ink); }
.resource-hero__aside { grid-column: 10 / span 3; padding: 2rem 0 0 2rem; border-top: 1px solid var(--hairline); border-left: 4px solid var(--teal-text); }
.resource-hero--compare .resource-hero__aside { border-left-color: var(--amber); }
.resource-hero__aside p:last-child { margin: 1rem 0 0; font-family: var(--display); font-size: clamp(1.35rem, 2vw, 2rem); font-weight: 650; line-height: 1.25; }

.resource-layout { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1rem; padding: clamp(6rem, 11vw, 10rem) var(--page-gutter); }
.resource-toc { position: sticky; top: 120px; display: flex; height: fit-content; flex-direction: column; grid-column: 1 / span 3; gap: 0.75rem; padding: 1.5rem; border-top: 3px solid var(--teal-text); background: #f7fbfb; }
.resource-toc a { color: var(--muted); font-size: 0.9rem; text-decoration: none; }
.resource-toc a:hover, .resource-toc a:focus-visible { color: var(--ink); text-decoration: underline; text-underline-offset: 0.25em; }
.resource-article { grid-column: 5 / span 7; }
.resource-article > section { padding: 0 0 clamp(6rem, 10vw, 9rem); scroll-margin-top: 110px; }
.resource-article > section + section { padding-top: clamp(5rem, 8vw, 7rem); border-top: 1px solid var(--hairline); }
.resource-article h2 { max-width: 13ch; margin-bottom: 2rem; line-height: 0.95; }
.resource-article h3 { font-size: clamp(1.5rem, 2.4vw, 2.4rem); }
.resource-article p, .resource-article li, .comparison-table { font-size: clamp(1rem, 1.2vw, 1.125rem); line-height: 1.7; }
.resource-callout { margin: 3rem 0 0; padding: clamp(1.5rem, 3vw, 2.5rem); border-left: 4px solid var(--teal-text); background: #f7fbfb; }
.resource-callout p:last-child { margin: 1rem 0 0; font-family: var(--display); font-size: clamp(1.25rem, 2vw, 1.8rem); font-weight: 620; line-height: 1.35; }

.resource-number-list { margin: 3rem 0 0; padding: 0; border-bottom: 1px solid var(--hairline); list-style: none; }
.resource-number-list li { display: grid; grid-template-columns: 3rem 1fr; gap: 1.5rem; padding: 2.25rem 0; border-top: 1px solid var(--hairline); }
.resource-number-list li > span, .resource-card-grid article > span { color: var(--teal-text); font-family: var(--data); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; }
.resource-number-list h3 { margin: 0 0 0.75rem; }
.resource-number-list p { margin: 0; color: var(--muted); }
.resource-check-list { display: grid; gap: 0.8rem; margin: 2rem 0; padding: 0; list-style: none; }
.resource-check-list li { position: relative; padding-left: 2rem; }
.resource-check-list li::before { position: absolute; top: 0.72em; left: 0; width: 0.7rem; height: 0.7rem; border-radius: 50%; background: var(--teal-text); content: ""; }

.comparison-table-wrap { overflow-x: auto; border: 1px solid var(--hairline); border-radius: 18px; }
.comparison-table { width: 100%; min-width: 700px; border-collapse: collapse; background: var(--canvas); }
.comparison-table th, .comparison-table td { padding: 1.25rem; border-right: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline); text-align: left; vertical-align: top; }
.comparison-table tr:last-child > * { border-bottom: 0; }
.comparison-table tr > *:last-child { border-right: 0; }
.comparison-table thead th { background: var(--ink); color: var(--canvas); font-family: var(--display); font-size: 1.2rem; }
.comparison-table tbody th { width: 22%; font-family: var(--display); }

.resource-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 3rem; border-top: 1px solid var(--hairline); border-left: 1px solid var(--hairline); }
.resource-card-grid article { min-height: 280px; padding: 2rem; border-right: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline); }
.resource-card-grid h3 { margin: 2rem 0 0.75rem; }
.resource-card-grid p { margin: 0; color: var(--muted); }
.resource-split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 3rem 0; }
.resource-split article { padding: clamp(1.5rem, 3vw, 2.5rem); border: 1px solid var(--hairline); border-top: 4px solid var(--teal-text); border-radius: 18px; }
.resource-split article + article { border-top-color: var(--amber); }
.resource-split h3 { margin: 1rem 0; }
.resource-split ul { margin-bottom: 0; padding-left: 1.2rem; }

.resource-sources ul { margin: 2rem 0; padding: 0; border-top: 1px solid var(--hairline); list-style: none; }
.resource-sources li { padding: 1rem 0; border-bottom: 1px solid var(--hairline); }
.resource-sources a { color: var(--teal-text); font-weight: 650; text-underline-offset: 0.2em; }
.resource-source-note { color: var(--muted); font-size: 0.9rem !important; }
.resource-next { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 3rem 1rem; padding: clamp(6rem, 11vw, 10rem) var(--page-gutter); background: var(--ink); color: var(--canvas); }
.resource-next > div:first-child { grid-column: 2 / span 7; }
.resource-next .eyebrow { color: #72e5e5; }
.resource-next h2 { margin-bottom: 2rem; }
.resource-next > div:first-child > p:last-child { max-width: 46rem; color: #cdd3d8; }
.resource-next .delivery-actions { grid-column: 2 / span 10; margin-left: 0; }

@media (max-width: 1100px) {
  .resource-preview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .resource-preview-card--sample { grid-column: 1 / -1; }
  .resource-hero__copy { grid-column: 1 / span 8; }
  .resource-hero__aside { grid-column: 10 / span 3; }
  .resource-article { grid-column: 5 / span 8; }
}

@media (max-width: 767px) {
  .resource-preview-grid, .resource-card-grid, .resource-split { grid-template-columns: 1fr; }
  .resource-preview-card--sample { grid-column: auto; }
  .resource-preview-card { min-height: 340px; padding: 1.5rem; }
  .resource-hero { min-height: 0; grid-template-columns: 1fr; align-items: start; padding: 5rem var(--page-gutter); }
  .resource-hero__copy, .resource-hero__aside { grid-column: 1; }
  .resource-hero h1 { font-size: clamp(4rem, 20vw, 6.5rem); }
  .resource-hero__aside { margin-top: 1.5rem; }
  .resource-layout { display: block; padding: 5rem var(--page-gutter); }
  .resource-toc { position: static; margin-bottom: 5rem; }
  .resource-article h2 { font-size: clamp(2.8rem, 12vw, 4.2rem); }
  .resource-card-grid article { min-height: 0; }
  .resource-number-list li { grid-template-columns: 2rem 1fr; gap: 0.75rem; }
  .resource-next { grid-template-columns: 1fr; padding: 5rem var(--page-gutter); }
  .resource-next > div:first-child, .resource-next .delivery-actions { grid-column: 1; }
  .resource-next .delivery-actions { align-items: stretch; flex-direction: column; }
  .resource-next .button { width: 100%; }
}