@import url("./case-pediatric.css?v=2");

.dental-hospital-case {
  --steel-blue: #5f8097;
  --steel-blue-light: #91a9ba;
  --slate: #66737a;
  --coral: var(--steel-blue);
}

.dental-hospital-case ::selection { background: var(--steel-blue-light); color: var(--teal-dark); }
.dental-hospital-case .case-nav .case-nav-action,
.dental-hospital-case .case-numbered-list li > span,
.dental-hospital-case .case-editorial-list li::before,
.dental-hospital-case .case-narrative .case-label { color: var(--steel-blue-light); }

.dental-hospital-case .case-intro-media,
.dental-hospital-case .dental-hospital-attitude .case-split-media,
.dental-hospital-case .dental-hospital-network .case-split-media,
.dental-hospital-case .dental-hospital-execution .case-split-media {
  min-height: 0;
  aspect-ratio: 5 / 4;
}

.dental-hospital-case .case-diagnosis-media,
.dental-hospital-case .dental-hospital-wide-media,
.dental-hospital-case .case-result-media {
  min-height: 0;
  aspect-ratio: 16 / 9;
}

.dental-hospital-case .case-diagnosis { padding-bottom: clamp(180px, 16vw, 250px); }
.dental-hospital-case .case-diagnosis-media { width: 100%; }
.dental-hospital-case .case-diagnosis-panel {
  position: relative;
  right: auto;
  bottom: auto;
  width: min(760px, 54vw);
  margin: clamp(-180px, -12vw, -130px) 0 0 auto;
  padding: clamp(30px, 3.5vw, 52px);
}
.dental-hospital-case .case-diagnosis-panel > p:not(.case-lead) { margin-top: 12px; font-size: 13px; }
.dental-hospital-case .case-numbered-list { margin-top: 22px; }
.dental-hospital-case .case-numbered-list li { padding: 15px 0; }
.dental-hospital-case .case-numbered-list p { margin-top: 6px; line-height: 1.55; }
.dental-hospital-case .case-numbered-list p + p { margin-top: 5px; }

.dental-hospital-case .dental-hospital-issue {
  position: relative;
  padding-top: clamp(110px, 11vw, 170px);
  padding-bottom: clamp(170px, 15vw, 230px);
}
.dental-hospital-case .dental-hospital-wide-media { width: 100%; }
.dental-hospital-case .dental-hospital-wide-panel {
  position: relative;
  z-index: 2;
  width: min(680px, 48vw);
  margin: clamp(-150px, -10vw, -108px) 0 0 var(--page);
  padding: clamp(30px, 3.6vw, 54px);
}
.dental-hospital-case .dental-hospital-wide-panel .case-editorial-list { margin: 28px 0; }

.dental-hospital-case .case-copy,
.dental-hospital-case .case-expertise-panel { max-width: 720px; }
.dental-hospital-case .case-copy h2,
.dental-hospital-case .case-expertise-panel h2 { font-size: clamp(38px, 4vw, 62px); }

.dental-hospital-case .dental-hospital-trust-sequence {
  margin: 34px 0;
  border-top: 1px solid var(--charcoal);
}
.dental-hospital-case .dental-hospital-trust-sequence > div {
  position: relative;
  display: grid;
  grid-template-columns: minmax(132px, 1fr) 2fr;
  gap: 18px;
  padding: 15px 0;
  border-bottom: 1px solid var(--line);
}
.dental-hospital-case .dental-hospital-trust-sequence > div:not(:last-child)::after {
  content: "↓";
  position: absolute;
  bottom: -11px;
  left: 2px;
  z-index: 2;
  padding: 0 4px;
  background: var(--ivory);
  color: var(--steel-blue);
  font-size: 11px;
}
.dental-hospital-case .dental-hospital-trust-sequence strong {
  color: var(--steel-blue);
  font-size: 10px;
  letter-spacing: .06em;
}
.dental-hospital-case .dental-hospital-trust-sequence p { margin: 0; font-size: 12px; line-height: 1.55; }

.dental-hospital-case .case-narrative { background: var(--teal-dark); }
.dental-hospital-case .case-narrative h2 { max-width: 900px; }

.dental-hospital-case .dental-hospital-content-groups {
  margin-top: 34px;
  border-top: 1px solid var(--charcoal);
}
.dental-hospital-case .dental-hospital-content-groups section {
  padding: 20px 0;
  border-bottom: 1px solid var(--line);
}
.dental-hospital-case .dental-hospital-content-groups h3 {
  margin: 0 0 12px;
  color: var(--steel-blue);
  font-size: 11px;
  letter-spacing: .04em;
}
.dental-hospital-case .dental-hospital-content-groups p { margin: 0; font-size: 13px; line-height: 1.6; }
.dental-hospital-case .dental-hospital-content-groups p + p { margin-top: 8px; }

.dental-hospital-case .case-impact-grid > .case-impact-wide { grid-column: 1 / -1; }
.dental-hospital-case .case-impact-grid strong { color: var(--steel-blue); }

@media (max-width: 900px) {
  .dental-hospital-case .case-diagnosis-panel { width: min(760px, 65vw); }
  .dental-hospital-case .dental-hospital-wide-panel { width: min(680px, 58vw); }
}

@media (max-width: 680px) {
  .dental-hospital-case .case-title-display { font-size: clamp(50px, 14vw, 58px); }
  .dental-hospital-case .case-intro-media,
  .dental-hospital-case .dental-hospital-attitude .case-split-media,
  .dental-hospital-case .dental-hospital-network .case-split-media,
  .dental-hospital-case .dental-hospital-execution .case-split-media { min-height: 0; aspect-ratio: 5 / 4; }
  .dental-hospital-case .case-diagnosis,
  .dental-hospital-case .dental-hospital-issue { padding-bottom: 90px; }
  .dental-hospital-case .case-diagnosis-media,
  .dental-hospital-case .dental-hospital-wide-media,
  .dental-hospital-case .case-result-media { min-height: 0; aspect-ratio: 16 / 9; }
  .dental-hospital-case .case-diagnosis-panel,
  .dental-hospital-case .dental-hospital-wide-panel { width: auto; margin: 0; padding: 34px var(--page); }
  .dental-hospital-case .case-copy h2,
  .dental-hospital-case .case-expertise-panel h2 { font-size: clamp(38px, 10.8vw, 48px); }
  .dental-hospital-case .case-split-text-first .case-copy { margin: 0; }
  .dental-hospital-case .dental-hospital-trust-sequence > div { grid-template-columns: 1fr; gap: 6px; }
}