/* Case studies: catalog, long-form articles and original survey tables. */
.case-page { background: #fffefa; }
.case-main { min-height: 60vh; }
.case-hero {
  position: relative;
  overflow: hidden;
  background:
    repeating-radial-gradient(ellipse 70% 95% at 100% 115%, transparent 0 50px, #79d3d01e 51px 52px, transparent 53px 100px),
    linear-gradient(115deg, #0b2b44, #17667a);
  padding: 43px 0 82px;
  color: #fff;
}
.case-breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 66px; color: #c6e9e7; font-size: 13px; font-weight: 600; }
.case-breadcrumbs a { color: inherit; text-decoration: none; }
.case-breadcrumbs a:hover { text-decoration: underline; }
.case-breadcrumbs span { color: #76b9bd; }
.case-eyebrow { margin: 0 0 17px; color: #a6e5e1; font-size: 11px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.case-hero h1 { max-width: 1000px; margin: 0; color: #fff; font-size: clamp(43px, 5.1vw, 72px); line-height: 1.1; letter-spacing: -.045em; }

.case-catalog { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; padding-block: 82px 118px; }
.case-region { min-width: 0; border: 1px solid #c5dedd; border-radius: 9px; background: #fff; padding: 30px 34px 16px; }
.case-region::before { content: ""; display: block; width: 36px; height: 4px; margin-bottom: 26px; background: #eb876d; border-radius: 4px; }
.case-region h2 { margin: 0 0 19px; color: #102c47; font-size: clamp(26px, 2.4vw, 34px); line-height: 1.19; }
.case-region ul { margin: 0; padding: 0; list-style: none; }
.case-region li { border-top: 1px solid #d7e7e5; }
.case-region li a { display: block; position: relative; padding: 17px 23px 17px 0; color: #1b5267; font-size: 16px; font-weight: 600; line-height: 1.48; text-decoration: none; }
.case-region li a::after { content: "↗"; position: absolute; right: 0; top: 16px; color: #087c89; font-size: 19px; line-height: 1; }
.case-region li a:hover { color: #087c89; text-decoration: underline; }

.case-reading { padding-block: 48px 112px; }
.case-back { display: inline-flex; gap: 8px; margin-bottom: 43px; border-bottom: 1px solid #80b9bc; padding-bottom: 8px; color: #087c89; font-size: 14px; font-weight: 750; text-decoration: none; }
.case-back:hover { color: #102c47; }
.case-article { width: min(100%, 920px); margin-inline: auto; }
.case-body { color: #304d5b; font-size: 17px; line-height: 1.78; overflow-wrap: anywhere; }
.case-body > :first-child { margin-top: 0; }
.case-body h2 { margin: 55px 0 22px; color: #102c47; font-size: clamp(28px, 3vw, 39px); line-height: 1.2; }
.case-body h3 { margin: 45px 0 16px; border-top: 1px solid #bbd9d9; padding-top: 22px; color: #102c47; font-size: clamp(23px, 2.4vw, 31px); line-height: 1.23; }
.case-body h4 { margin: 32px 0 12px; color: #17536a; font-size: 20px; }
.case-body p { margin: 0 0 21px; }
.case-body ul, .case-body ol { margin: 12px 0 29px; padding-left: 27px; }
.case-body li { margin: 0 0 8px; padding-left: 4px; }
.case-body a { color: #087c89; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.case-body a:hover { color: #102c47; }
.case-body img { display: block; width: auto; max-width: 100%; height: auto; margin: 22px auto 9px; }
.case-body .center, .case-body [align="center"] { text-align: center; }
.case-body .center img, .case-body [align="center"] img { margin-inline: auto; }
.case-body blockquote { margin: 30px 0; border-left: 4px solid #eb876d; background: #eff8f6; padding: 19px 25px; }

.case-table-scroll { max-width: 100%; margin: 25px 0 36px; overflow-x: auto; border: 1px solid #c5dddd; border-radius: 7px; }
.case-table-scroll table { width: max-content !important; min-width: 100%; margin: 0; border-collapse: collapse !important; background: #fff !important; color: #304d5b !important; }
.case-table-scroll th, .case-table-scroll td { min-width: 88px; border: 1px solid #d0e1df !important; background: #fff !important; padding: 10px 12px !important; color: #304d5b !important; font: inherit !important; vertical-align: top; }
.case-table-scroll tr:nth-child(odd) > td { background: #edf7f5 !important; }
.case-table-scroll tr:first-child > td, .case-table-scroll th { background: #d9eeeb !important; color: #102c47 !important; font-weight: 700 !important; }
.case-table-scroll p { margin: 0; }
.case-table-scroll span { color: inherit !important; font-family: inherit !important; font-size: inherit !important; }

@media (max-width: 760px) {
  .case-hero { padding: 36px 0 63px; }
  .case-breadcrumbs { margin-bottom: 50px; }
  .case-catalog { gap: 14px; padding-block: 62px 86px; }
  .case-region { padding: 25px 25px 12px; }
  .case-reading { padding-block: 36px 83px; }
}
@media (max-width: 620px) {
  .case-hero h1 { font-size: clamp(37px, 10vw, 52px); }
  .case-breadcrumbs { font-size: 12px; margin-bottom: 43px; }
  .case-catalog { grid-template-columns: 1fr; padding-block: 53px 76px; }
  .case-region h2 { font-size: 28px; }
  .case-region li a { font-size: 15px; }
  .case-back { margin-bottom: 31px; }
  .case-body { font-size: 16px; line-height: 1.7; }
  .case-body h3 { margin-top: 37px; }
}
