/* Additional child-eye guidance, scoped to the pediatric page. */
.children-page .cp-consult-layout,
.children-page .cp-amblyopia-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  gap: clamp(1.5rem, 4vw, 3.25rem);
  align-items: start;
}

.children-page .cp-minor-heading {
  margin: 0 0 1rem;
  font-size: clamp(1.1rem, 1.8vw, 1.3rem);
}

.children-page .cp-consult-layout .g-check {
  grid-template-columns: minmax(0, 1fr) !important;
  margin: 0;
}

.children-page .cp-consult-layout .g-check li {
  padding: .72rem 0;
}

.children-page .cp-story-photo {
  margin: 0;
}

.children-page .cp-story-photo img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 18px;
}

.children-page .cp-story-photo figcaption {
  margin-top: .55rem;
  color: #668494;
  font-size: .85rem;
  line-height: 1.65;
}

.children-page .cp-amblyopia-photos {
  display: grid;
  gap: 1rem;
}

.children-page .cp-amblyopia-photos .cp-story-photo img {
  aspect-ratio: 16 / 10;
  object-position: center;
}

.children-page .cp-exam-photo {
  width: min(100%, 780px);
  margin: 0 auto clamp(1.5rem, 3vw, 2.5rem);
}

.children-page .cp-exam-photo img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  object-position: center 42%;
  border-radius: 18px;
}

.children-page .cp-exam-photo figcaption {
  margin-top: .55rem;
  color: #668494;
  font-size: .85rem;
  line-height: 1.65;
}

.children-page .cp-early-note {
  margin-top: clamp(2rem, 4vw, 3rem);
  padding: 1.25rem 1.5rem;
  border-left: 4px solid #1d9bc5;
  background: #eef9fc;
  border-radius: 0 12px 12px 0;
}

.children-page .cp-early-note h3 {
  margin: 0 0 .45rem;
  font-size: 1.15rem;
}

.children-page .cp-early-note p,
.children-page .cp-reading-copy p,
.children-page .cp-strabismus p {
  margin: 0;
  line-height: 1.9;
}

.children-page .cp-condition-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(1.5rem, 4vw, 3rem);
}

.children-page .cp-condition-list article {
  padding: 1.15rem 0;
  border-top: 1px solid #c7e5ee;
}

.children-page .cp-condition-list h3 {
  margin: 0 0 .35rem;
  font-size: 1.16rem;
}

.children-page .cp-condition-list p {
  margin: 0;
  line-height: 1.8;
}

.children-page .cp-reading-copy h3 {
  margin: 0 0 1rem;
  font-size: clamp(1.25rem, 2vw, 1.55rem);
  line-height: 1.45;
}

.children-page .cp-reading-copy h4 {
  margin: 1.6rem 0 .55rem;
  color: #09536f;
  font-size: 1.12rem;
}

.children-page .cp-reading-copy p + p {
  margin-top: 1rem;
}

.children-page .cp-reading-copy .cp-reading-note {
  margin-top: 1.4rem;
  padding: 1rem 1.2rem;
  border-radius: 10px;
  background: #eef9fc;
}

.children-page .cp-story-photo--reading img {
  aspect-ratio: 4 / 5;
  object-position: 46% center;
}

.children-page .cp-strabismus {
  max-width: 56rem;
  margin-top: clamp(2.2rem, 5vw, 4rem);
  padding-top: 1.6rem;
  border-top: 1px solid #c7e5ee;
}

.children-page .cp-strabismus h3 {
  margin: 0 0 .6rem;
  font-size: clamp(1.25rem, 2vw, 1.5rem);
}

.children-page .cp-explainer {
  width: min(100%, 720px);
  margin: 1.6rem auto 0;
}

.children-page .cp-explainer img {
  display: block;
  width: 100%;
  height: auto;
}

.children-page .cp-explainer figcaption {
  margin-top: .55rem;
  color: #587887;
  font-size: .82rem;
  line-height: 1.7;
}

.children-page .cp-strabismus .cp-explainer {
  margin-top: 1.2rem;
}

.children-page .cp-reference {
  margin: 1.7rem 0 0;
  color: #668494;
  font-size: .82rem;
  line-height: 1.7;
}

.children-page .cp-reference a {
  color: #087eaf;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.children-page .cp-faq-mobile-break {
  display: none;
}

@media (max-width: 760px) {
  .children-page #faq-list .g-faq summary {
    padding: 12px 43px 12px 15px;
    font-size: .9rem;
    line-height: 1.5;
  }

  .children-page #faq-list .g-faq summary::after {
    top: 50%;
    transform: translateY(-50%);
  }

  .children-page .cp-faq-mobile-break {
    display: initial;
  }

  /* Keep each sign to its content height, with the check centered beside it. */
  .children-page #consult .cp-consult-layout .g-check li {
    position: relative;
    display: block;
    min-height: 0;
    padding: 9px 12px 9px 38px;
    line-height: 1.5;
  }

  .children-page #consult .cp-consult-layout .g-check li::before {
    position: absolute;
    top: 50%;
    left: 12px;
    width: 1rem;
    margin: 0;
    text-align: center;
    transform: translateY(-50%);
  }

  .children-page #flow > .sub-container > .g-check li {
    position: relative;
    display: block;
    min-height: 0;
    padding: 9px 10px 9px 36px;
    font-size: clamp(.72rem, 3.5vw, .85rem);
    line-height: 1.5;
    white-space: nowrap;
  }

  .children-page #flow > .sub-container > .g-check li::before {
    position: absolute;
    top: 50%;
    left: 10px;
    width: 1rem;
    margin: 0;
    text-align: center;
    transform: translateY(-50%);
  }

  .children-page .cp-consult-layout,
  .children-page .cp-amblyopia-layout,
  .children-page .cp-condition-list {
    grid-template-columns: minmax(0, 1fr);
  }

  .children-page .cp-consult-layout .cp-story-photo {
    margin-top: .5rem;
  }

  .children-page .cp-story-photo--reading img {
    aspect-ratio: 4 / 3;
  }

  .children-page .cp-amblyopia-photos .cp-story-photo img {
    aspect-ratio: 4 / 3;
  }

  .children-page .cp-exam-photo img {
    aspect-ratio: 4 / 3;
    border-radius: 14px;
  }

  .children-page .cp-early-note {
    padding: 1rem 1.1rem;
  }

  .children-page .cp-explainer {
    margin-top: 1.15rem;
  }
}
