/*--------------------------------------------------------------
# Biorezonance.pro - site specific styles (Horizon child theme)
# Colors come from Theme > Customize (primary #6c2a7c, secondary #f2673a)
# through the Horizon variables (--accent-color, --accent-color-2 ...).
--------------------------------------------------------------*/

@keyframes hueAnimation {
  0%   { filter: hue-rotate(0deg); }
  100% { filter: hue-rotate(360deg); }
}

/* Logo hero with animated background */
#herologo {
  position: relative;
  height: 70vh;
  min-height: 420px;
  padding: 0;
  background: transparent;
}

#herologo .img-wrapper {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

#herologo .img-wrapper img {
  position: relative;
  z-index: 10;
  width: 50vw;
  max-width: 720px;
  max-height: 60vh;
}

#herologo .overlay {
  position: absolute;
  inset: 0;
  background-image: url('/storage/app/media/images/bg.webp');
  background-size: cover;
  background-position: center;
  animation: hueAnimation 25s infinite linear;
}

#herologo .hero-image-text {
  position: relative;
  z-index: 10;
  margin-top: 24px;
}

@media (max-width: 768px) {
  #herologo {
    height: 50vh;
  }

  #herologo .img-wrapper img {
    width: 80vw;
  }
}

/* Header: lotus icon + italic site name */
.header .logo .img-logo-ico {
  max-height: 44px;
  margin-right: 14px;
}

.header .logo h1 {
  font-style: italic;
  font-weight: 800;
  letter-spacing: 0;
  color: var(--accent-color);
}

@media (max-width: 576px) {
  .header .logo h1 {
    font-size: 22px;
  }
}

/* Section subtitles in the brand color (as on the original site) */
.section-title p {
  font-size: 1.2em;
  font-weight: 600;
  color: var(--accent-color);
}

/* Section titles in the secondary (orange) color, accent bar in purple */
.section-title.section-title-colored h2 {
  color: var(--accent-color-2);
}

.about .content-text p:first-child {
  font-size: 1.2em;
  font-weight: 600;
  color: var(--accent-color);
}

/* Footer logo (white horizontal version) */
.footer .footer-about .logo img {
  max-height: 72px;
}