.knowledge-sections { padding-block: 64px; background: #f6f8fa; }
.knowledge-hero { padding: 0; overflow: hidden; }
.knowledge-hero .knowledge-hero-layout { display: grid; grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: stretch; }
.knowledge-hero-copy { padding: 60px 0; align-self: center; }
.knowledge-hero-copy h1 { font-size: clamp(40px, 4.1vw, 62px); line-height: 1.08; }
.knowledge-hero-copy p { max-width: 680px; font-size: 18px; line-height: 1.7; }
.knowledge-hero-image { position: relative; min-height: 420px; margin: 0; }
.knowledge-hero-image img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.knowledge-category-hero { padding: 0; overflow: hidden; }
.knowledge-category-layout { display: grid; grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: stretch; }
.knowledge-category-copy { padding: 60px 0; align-self: center; }
.knowledge-category-copy h1 { font-size: clamp(40px, 4.1vw, 62px); line-height: 1.08; }
.knowledge-category-copy p { max-width: 680px; font-size: 18px; line-height: 1.7; color: #dde6ef; }
.knowledge-category-cover { position: relative; min-height: 420px; margin: 0; }
.knowledge-category-cover > img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.inner-page .page-hero .knowledge-category-cover > img { height: 100%; }
.knowledge-laptop-screen { position: absolute; left: 24.9%; top: 17.1%; width: 50.3%; height: 45.2%; overflow: hidden; border-radius: 2px; background: #0b3026; }
.knowledge-laptop-screen img { width: 18%; height: auto; filter: brightness(0) invert(1); }
.knowledge-laptop-screen span { font-family: Georgia, serif; font-size: clamp(15px, 1.7vw, 25px); line-height: 1.2; letter-spacing: .015em; }
.knowledge-laptop-screen img.knowledge-laptop-display { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: center top; filter: none; }
.knowledge-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.knowledge-grid .knowledge-card { display: flex; flex-direction: column; gap: 0; padding: 28px; color: #17212b; text-decoration: none; background: #fff; border: 1px solid #dce3eb; border-radius: 12px; box-shadow: 0 3px 12px rgb(23 33 43 / 3%); transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.knowledge-card-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; }
.knowledge-card-number { color: #53667c; font-size: 12px; font-weight: 600; letter-spacing: .12em; }
.knowledge-card-arrow { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #edf3f9; color: #17528b; font-size: 22px; line-height: 1; }
.knowledge-grid .knowledge-card h2 { margin: 0 0 16px; font-size: clamp(25px, 2vw, 30px); line-height: 1.2; letter-spacing: -.02em; color: inherit; }
.knowledge-grid .knowledge-card p { margin: 0; color: #526174; font-size: 15px; line-height: 1.75; }
.knowledge-card:focus-visible { outline: 3px solid #1764ad; outline-offset: 4px; }
@media (hover: hover) { .knowledge-card:hover { border-color: #779aba; box-shadow: 0 10px 26px rgb(23 33 43 / 8%); transform: translateY(-3px); } }
@media (max-width: 1000px) { .knowledge-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .knowledge-sections { padding-block: 32px; } .knowledge-grid { grid-template-columns: 1fr; gap: 16px; } .knowledge-grid .knowledge-card { padding: 24px; } .knowledge-card-top { margin-bottom: 18px; } .knowledge-hero .knowledge-hero-layout { grid-template-columns: 1fr; gap: 0; } .knowledge-hero-copy { padding: 38px 0 28px; } .knowledge-hero-copy h1 { font-size: 40px; } .knowledge-hero-image { min-height: 0; margin-bottom: 30px; } .knowledge-hero-image img { height: auto; aspect-ratio: 3 / 2; } .knowledge-category-layout { grid-template-columns: 1fr; gap: 0; } .knowledge-category-copy { padding: 38px 0 28px; } .knowledge-category-copy h1 { font-size: 40px; } .knowledge-category-copy p { font-size: 16px; } .knowledge-category-cover { min-height: 0; margin-bottom: 30px; } .knowledge-category-cover > img { height: auto; aspect-ratio: 3 / 2; } .knowledge-laptop-screen span { font-size: clamp(13px, 4vw, 20px); } }
@media (prefers-reduced-motion: reduce) { .knowledge-grid .knowledge-card { transition: none; transform: none; } }