/* News and column index headers share the quiet visual language of news articles. */
.news-index-page .news-index-template-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background:
    radial-gradient(circle at 86% 15%, rgba(194, 233, 245, .34), transparent 26rem),
    radial-gradient(circle at 4% 75%, rgba(208, 238, 247, .4), transparent 30rem),
    linear-gradient(160deg, #fff 0%, #f8fcfd 42%, #f1f8fb 100%);
  color: #19465d;
}

.news-index-page .news-index-template-hero::before {
  position: absolute;
  z-index: 0;
  top: 0;
  left: max(-150px, calc((100vw - 1440px) / 2 - 150px));
  width: 620px;
  height: 540px;
  background: url("../img/logo/logo-beside_blue.svg") left top / 1870px auto no-repeat;
  content: "";
  opacity: .1;
  pointer-events: none;
}

.news-index-page .news-index-template-hero::after {
  position: absolute;
  z-index: 0;
  top: 0;
  right: 0;
  width: min(47vw, 850px);
  height: 100%;
  background: url("../img/photo-date-web/hero-clinic-exterior-2026.jpg") center 28% / cover no-repeat;
  content: "";
  opacity: .34;
  -webkit-mask-image: radial-gradient(ellipse at 66% 30%, #000 15%, transparent 78%);
  mask-image: radial-gradient(ellipse at 66% 30%, #000 15%, transparent 78%);
  pointer-events: none;
}

.news-index-page .news-index-template-hero__ambient,
.news-index-page .news-index-template-hero__ambient::before {
  position: absolute;
  pointer-events: none;
  border: 1px solid rgba(63, 165, 202, .14);
  border-radius: 50%;
}

.news-index-page .news-index-template-hero__ambient {
  z-index: 0;
  top: -90px;
  right: max(-120px, calc((100vw - 1380px) / 2));
  width: 460px;
  height: 460px;
  box-shadow: 0 0 0 72px rgba(194, 233, 245, .09), 0 0 0 148px rgba(194, 233, 245, .045);
}

.news-index-page .news-index-template-hero__ambient::before {
  top: 50%;
  left: 50%;
  width: 204px;
  height: 204px;
  background: rgba(255, 255, 255, .22);
  transform: translate(-50%, -50%);
  content: "";
}

.news-index-page .news-index-template-hero__inner {
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  width: min(100% - 48px, 1060px);
  margin: 0 auto;
  padding: 44px 0 52px;
}

.news-index-page .news-index-template-hero__heading {
  width: min(100%, 850px);
  margin: 0 auto;
}

.news-index-page .news-index-template-hero__breadcrumb {
  display: flex;
  gap: 10px;
  margin: 0 0 34px;
  color: #5d7e8e;
  font-size: .78rem;
  font-weight: 650;
}

.news-index-page .news-index-template-hero__breadcrumb a {
  color: inherit;
  text-decoration: none;
}

.news-index-page .news-index-template-hero__breadcrumb a:hover { text-decoration: underline; }

.news-index-page .news-index-template-hero__section-name {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0;
  color: #0c739f;
}

.news-index-page .news-index-template-hero__section-name span:first-child {
  font-size: 1.18rem;
  font-weight: 850;
  letter-spacing: .22em;
}

.news-index-page .news-index-template-hero__section-name span:last-child {
  color: #174e69;
  font-size: 1.02rem;
  font-weight: 800;
  letter-spacing: .06em;
}

.news-index-page .news-index-template-hero__section-name::after {
  width: 70px;
  height: 2px;
  margin-left: 2px;
  background: #6bbbd9;
  content: "";
}

.news-index-page .news-index-template-hero h1 {
  margin: 52px 0 0;
  color: #164e6a;
  font-size: clamp(2rem, 3vw, 2.75rem);
  font-weight: 750;
  line-height: 1.4;
  letter-spacing: .035em;
}

.news-index-page .news-index-template-hero__heading::after {
  display: block;
  width: 100%;
  height: 1px;
  margin-top: 40px;
  background: linear-gradient(90deg, #8ac8df, rgba(138, 200, 223, .18));
  content: "";
}

@media (max-width: 767px) {
  /* Override the shared lower-page 501px minimum only for compact list headers. */
  html body #root main .news-index-template-hero {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
  }

  html body #root main .news-index-template-hero .news-index-template-hero__inner {
    min-height: 0;
    display: block;
  }

  .news-index-page .news-index-template-hero::after {
    width: 58vw;
    opacity: .17;
  }

  .news-index-page .news-index-template-hero::before {
    top: 90px;
    left: -116px;
    width: 300px;
    height: 262px;
    background-size: 905px auto;
    opacity: .07;
  }

  .news-index-page .news-index-template-hero__ambient {
    top: -45px;
    right: -130px;
    width: 285px;
    height: 285px;
    opacity: .64;
    box-shadow: 0 0 0 44px rgba(194, 233, 245, .07);
  }

  .news-index-page .news-index-template-hero__ambient::before {
    width: 120px;
    height: 120px;
  }

  .news-index-page .news-index-template-hero__inner {
    width: calc(100% - 36px);
    padding: 24px 0 28px;
  }

  .news-index-page .news-index-template-hero__breadcrumb { margin-bottom: 14px; }
  .news-index-page .news-index-template-hero__section-name { gap: 10px; }
  .news-index-page .news-index-template-hero__section-name span:first-child { font-size: .96rem; letter-spacing: .2em; }
  .news-index-page .news-index-template-hero__section-name span:last-child { font-size: .88rem; }
  .news-index-page .news-index-template-hero__section-name::after { width: 32px; margin-left: 0; }
  .news-index-page .news-index-template-hero h1 { margin-top: 16px; font-size: clamp(1.65rem, 6.8vw, 2rem); }
  .news-index-page .news-index-template-hero__heading::after { margin-top: 18px; }
}