.resource-kicker { margin: 0 0 14px; color: var(--blue); font-size: 10px; font-weight: 800; line-height: 1.35; letter-spacing: .085em; text-transform: uppercase; }
.knowledge-hero { max-width: 1240px; margin: 0 auto; padding: 76px 28px 64px; display: grid; grid-template-columns: 1fr 420px; align-items: end; gap: 90px; }
.knowledge-hero h1 { max-width: 760px; margin: 0; color: var(--navy); font-size: clamp(44px, 5.1vw, 72px); line-height: .98; letter-spacing: -.045em; }
.knowledge-hero > div > p:last-child { max-width: 720px; margin: 26px 0 0; color: var(--muted); font-size: 16px; line-height: 1.7; }
.resource-search { display: block; color: #405269; font-size: 11px; font-weight: 700; }
.resource-search input { width: 100%; height: 50px; margin-top: 9px; padding: 0 46px 0 14px; color: var(--ink); border: 1px solid #cbd7e4; border-radius: 4px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='19' viewBox='0 0 24 24' fill='none' stroke='%2366758a' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E") no-repeat calc(100% - 14px) 50%; font-size: 12px; }
.resource-search input:focus { border-color: var(--blue); box-shadow: 0 0 0 4px rgba(18,99,214,.1); outline: 0; }
.resource-topics { padding: 0 max(28px, calc((100vw - 1184px) / 2)); display: flex; overflow-x: auto; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); scrollbar-width: none; }
.resource-topics::-webkit-scrollbar { display: none; }
.resource-topics button { min-height: 54px; padding: 0 22px; flex: 0 0 auto; color: #68778b; border: 0; border-right: 1px solid var(--line); background: #fff; font-size: 11px; font-weight: 700; cursor: pointer; transition: color .2s ease, background .2s ease; }
.resource-topics button:first-child { border-left: 1px solid var(--line); }
.resource-topics button:hover { color: var(--blue); background: #f6f9fd; }
.resource-topics button.is-active { color: #fff; background: var(--navy); }

.featured-resources, .library-section, .resource-method { max-width: 1240px; margin: 0 auto; padding: 72px 28px; }
.resource-heading { margin-bottom: 30px; display: grid; grid-template-columns: 1fr 390px; align-items: end; gap: 70px; }
.resource-heading h2, .resource-method h2, .resource-contact h2, .article-inquiry h2 { margin: 0; color: var(--navy); font-size: clamp(30px, 3vw, 42px); line-height: 1.08; letter-spacing: -.035em; }
.resource-heading > p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.featured-layout { display: grid; grid-template-columns: 1.52fr .78fr; gap: 18px; }
.featured-primary { display: grid; grid-template-columns: 1.05fr .95fr; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; background: #fff; }
.featured-primary > a { min-height: 360px; overflow: hidden; background: #f4f6f8; }
.featured-primary img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .35s ease; }
.featured-primary:hover img { transform: scale(1.02); }
.featured-primary > div { padding: 34px; display: flex; flex-direction: column; align-items: flex-start; }
.featured-primary span, .featured-stack span, .resource-library-grid article > div:last-child > span { color: var(--blue); font-size: 9px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.featured-primary h3 { margin: 24px 0 0; color: var(--navy); font-size: 27px; line-height: 1.12; letter-spacing: -.03em; }
.featured-primary p { margin: 18px 0 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
.resource-link { margin-top: auto; padding-top: 22px; color: var(--blue); font-size: 11px; font-weight: 800; }
.featured-stack { display: grid; grid-template-rows: repeat(2, 1fr); gap: 18px; }
.featured-stack article { padding: 27px; display: flex; flex-direction: column; align-items: flex-start; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.featured-stack h3 { margin: 18px 0 0; color: var(--navy); font-size: 19px; line-height: 1.25; letter-spacing: -.02em; }
.featured-stack p { margin: 12px 0 0; color: var(--muted); font-size: 11px; line-height: 1.6; }

.library-section { max-width: none; padding-inline: max(28px, calc((100vw - 1184px) / 2)); background: #f6f8fa; }
.resource-library-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.resource-library-grid article { min-width: 0; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; background: #fff; }
.resource-card-image { height: 190px; display: grid; place-items: center; overflow: hidden; border-bottom: 1px solid var(--line); background: #eef2f5; }
.resource-card-image img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .35s ease; }
.resource-card-image--document img { object-fit: contain; padding: 12px; }
.resource-library-grid article:hover .resource-card-image img { transform: scale(1.025); }
.resource-library-grid article > div:last-child { min-height: 220px; padding: 23px; display: flex; flex-direction: column; align-items: flex-start; }
.resource-library-grid h3 { margin: 16px 0 0; color: var(--navy); font-size: 18px; line-height: 1.28; letter-spacing: -.02em; }
.resource-library-grid p { margin: 13px 0 0; color: var(--muted); font-size: 11px; line-height: 1.65; }
.resource-empty { padding: 80px 20px; text-align: center; border: 1px solid var(--line); background: #fff; }
.resource-empty h3 { margin: 0; color: var(--navy); }
.resource-empty p { color: var(--muted); }

.resource-method { display: grid; grid-template-columns: 300px 1fr; gap: 70px; }
.resource-method-grid { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.resource-method-grid article { min-height: 230px; padding: 28px 24px; border-right: 1px solid var(--line); }
.resource-method-grid article:last-child { border-right: 0; }
.resource-method-grid b { color: var(--blue); font-family: "IBM Plex Mono", monospace; font-size: 11px; }
.resource-method-grid h3 { margin: 35px 0 12px; color: var(--navy); font-size: 16px; line-height: 1.3; }
.resource-method-grid p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.65; }
.resource-contact, .article-inquiry { max-width: 1184px; margin: 0 auto 76px; padding: 34px 38px; display: flex; align-items: center; justify-content: space-between; gap: 48px; border-radius: 6px; background: var(--navy); }
.resource-contact h2, .article-inquiry h2 { color: #fff; font-size: 32px; }
.resource-contact p:last-child, .article-inquiry p:last-child { margin: 12px 0 0; color: #aebdd0; font-size: 12px; }
.resource-contact .button, .article-inquiry .button { flex: 0 0 auto; }

/* Article template */
.article-breadcrumb { max-width: 1120px; margin: 0 auto; padding: 26px 28px 0; display: flex; flex-wrap: wrap; gap: 9px; color: #738196; font-size: 10px; }
.article-breadcrumb strong { color: #405269; }
.article-header { max-width: 1120px; margin: 0 auto; padding: 45px 28px 62px; display: grid; grid-template-columns: 1.02fr .98fr; gap: 65px; align-items: center; }
.article-header h1 { margin: 0; color: var(--navy); font-size: clamp(42px, 5vw, 66px); line-height: .99; letter-spacing: -.045em; }
.article-deck { margin: 24px 0 0; color: #536276; font-size: 16px; line-height: 1.68; }
.article-meta { margin-top: 28px; padding-top: 18px; display: flex; flex-wrap: wrap; gap: 10px 18px; border-top: 1px solid var(--line); color: #77869a; font-size: 9px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.article-header figure { margin: 0; }
.article-header figure img { width: 100%; aspect-ratio: 1.15; display: block; object-fit: cover; border: 1px solid var(--line); border-radius: 6px; background: #f4f6f8; }
.article-header figcaption { margin-top: 9px; color: #7d8999; font-size: 9px; line-height: 1.5; }
.article-shell { max-width: 1120px; margin: 0 auto; padding: 0 28px 72px; display: grid; grid-template-columns: 190px minmax(0, 720px); justify-content: space-between; gap: 70px; border-top: 1px solid var(--line); }
.article-toc { position: sticky; top: 100px; height: max-content; padding-top: 48px; display: flex; flex-direction: column; }
.article-toc strong { margin-bottom: 13px; color: var(--navy); font-size: 11px; }
.article-toc a { padding: 9px 0; color: #6b7a8e; border-bottom: 1px solid var(--soft-line); font-size: 10px; line-height: 1.35; }
.article-toc a:hover { color: var(--blue); }
.article-body { min-width: 0; padding-top: 48px; }
.article-body section { padding: 0 0 46px; margin-bottom: 46px; border-bottom: 1px solid var(--line); }
.article-body section:last-child { margin-bottom: 0; }
.article-body h2 { margin: 0 0 20px; color: var(--navy); font-size: 30px; line-height: 1.15; letter-spacing: -.03em; }
.article-body p { margin: 0 0 17px; color: #536276; font-size: 14px; line-height: 1.82; }
.article-body p:last-child { margin-bottom: 0; }
.article-body a { color: var(--blue); font-weight: 700; }
.answer-box { padding: 30px !important; border: 1px solid #b9cde5 !important; border-left: 4px solid var(--blue) !important; border-radius: 4px; background: #f5f9fe; }
.answer-box h2 { font-size: 25px; }
.layer-sequence { margin: 26px 0; padding: 20px; display: flex; align-items: center; justify-content: center; gap: 9px; border: 1px solid var(--line); background: #f8fafc; }
.layer-sequence span { padding: 9px 10px; color: #536276; border: 1px solid #d8e1ea; background: #fff; font-size: 9px; font-weight: 700; text-align: center; }
.layer-sequence span.is-carbon { color: #fff; border-color: var(--blue); background: var(--blue); }
.layer-sequence b { color: #93a0b1; font-size: 11px; }
.article-warning { padding: 22px 24px; margin-top: 24px; border-left: 3px solid #d89b25; background: #fcf8ef; }
.article-warning strong { color: #785817; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; }
.article-warning p { margin-top: 10px; color: #6b5b38; font-size: 12px; }
.article-table { border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.article-table > div { display: grid; grid-template-columns: 1fr 1.18fr 1.18fr; }
.article-table > div > * { min-width: 0; padding: 14px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); color: #59697d; font-size: 10px; line-height: 1.55; }
.article-table__head span { color: var(--navy) !important; background: #f0f4f8; font-weight: 800; }
.article-table strong { color: var(--navy) !important; }
.article-checklist { padding: 0; margin: 22px 0 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; list-style: none; }
.article-checklist li { position: relative; padding: 13px 14px 13px 34px; color: #58687c; border: 1px solid var(--line); font-size: 11px; }
.article-checklist li::before { content: ""; position: absolute; left: 14px; top: 16px; width: 7px; height: 7px; border: 2px solid var(--blue); border-radius: 50%; }
.inline-product-card { margin-top: 25px; display: grid; grid-template-columns: 130px 1fr; border: 1px solid var(--line); border-radius: 5px; overflow: hidden; }
.inline-product-card img { width: 100%; height: 130px; object-fit: cover; background: #f4f6f8; }
.inline-product-card span { padding: 18px; display: flex; flex-direction: column; align-items: flex-start; }
.inline-product-card small { color: #77869a; font-size: 9px; text-transform: uppercase; }
.inline-product-card strong { margin-top: 11px; color: var(--navy); font-size: 15px; }
.inline-product-card b { margin-top: auto; color: var(--blue); font-size: 10px; }
.article-faq details { border-top: 1px solid var(--line); }
.article-faq details:last-child { border-bottom: 1px solid var(--line); }
.article-faq summary { position: relative; padding: 17px 38px 17px 0; color: var(--navy); font-size: 13px; font-weight: 700; cursor: pointer; list-style: none; }
.article-faq summary::-webkit-details-marker { display: none; }
.article-faq summary::after { content: "+"; position: absolute; right: 4px; color: var(--blue); font-size: 18px; }
.article-faq details[open] summary::after { content: "−"; }
.article-faq details p { padding: 0 38px 18px 0; font-size: 12px; }
.article-basis { padding: 24px !important; border: 1px solid var(--line) !important; background: #f8fafc; }
.article-basis p:last-child { font-size: 11px; }
.article-related { max-width: 1120px; margin: 0 auto; padding: 0 28px 74px; }
.article-related > div { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); border-radius: 5px; overflow: hidden; }
.article-related a { min-height: 108px; padding: 20px; display: flex; flex-direction: column; justify-content: space-between; border-right: 1px solid var(--line); }
.article-related a:last-child { border-right: 0; }
.article-related span { color: #7b889a; font-size: 9px; text-transform: uppercase; }
.article-related strong { color: var(--blue); font-size: 11px; line-height: 1.5; }

@media (max-width: 900px) {
  .knowledge-hero { grid-template-columns: 1fr; gap: 34px; }
  .featured-layout { grid-template-columns: 1fr; }
  .resource-library-grid { grid-template-columns: repeat(2, 1fr); }
  .resource-method { grid-template-columns: 1fr; gap: 30px; }
  .article-header { gap: 35px; }
  .article-shell { grid-template-columns: 160px minmax(0, 1fr); gap: 35px; }
}

@media (max-width: 760px) {
  .knowledge-hero { padding: 54px 18px 42px; }
  .knowledge-hero h1 { font-size: 42px; }
  .knowledge-hero > div > p:last-child { font-size: 14px; }
  .resource-topics { padding: 0; }
  .featured-resources, .library-section, .resource-method { padding: 54px 18px; }
  .resource-heading { grid-template-columns: 1fr; gap: 13px; }
  .featured-primary { grid-template-columns: 1fr; }
  .featured-primary > a { min-height: 250px; }
  .featured-primary > div { min-height: 310px; padding: 24px; }
  .resource-library-grid { grid-template-columns: 1fr; }
  .resource-method-grid { grid-template-columns: 1fr; }
  .resource-method-grid article { min-height: 170px; border-right: 0; border-bottom: 1px solid var(--line); }
  .resource-method-grid article:last-child { border-bottom: 0; }
  .resource-contact, .article-inquiry { margin: 0 18px 54px; padding: 28px 22px; align-items: flex-start; flex-direction: column; }
  .resource-contact .button, .article-inquiry .button { width: 100%; }
  .article-breadcrumb { padding: 20px 18px 0; }
  .article-header { padding: 40px 18px 48px; grid-template-columns: 1fr; }
  .article-header h1 { font-size: 41px; }
  .article-header figure { order: -1; }
  .article-shell { padding: 0 18px 54px; grid-template-columns: 1fr; }
  .article-toc { position: static; padding-top: 24px; display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 16px; }
  .article-toc strong { grid-column: 1 / -1; }
  .article-body { padding-top: 12px; }
  .article-body h2 { font-size: 26px; }
  .answer-box { padding: 22px !important; }
  .layer-sequence { align-items: stretch; flex-direction: column; }
  .layer-sequence b { text-align: center; transform: rotate(90deg); }
  .article-table { overflow-x: auto; }
  .article-table > div { min-width: 650px; }
  .article-checklist { grid-template-columns: 1fr; }
  .inline-product-card { grid-template-columns: 100px 1fr; }
  .inline-product-card img { height: 120px; }
  .article-related { padding: 0 18px 54px; }
  .article-related > div { grid-template-columns: 1fr; }
  .article-related a { min-height: 90px; border-right: 0; border-bottom: 1px solid var(--line); }
  .article-related a:last-child { border-bottom: 0; }
}