/* Phase 1 — Critical hero styles for homepage (index-2024.php). Loaded before style-2024.css. */
@keyframes fadein {
  from { opacity: 0; }
  to { opacity: 1; }
}

.background-first-line {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  overflow: hidden;
}

.background-first-line__image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

/* Desktop: subtle fade-in (desktop LH 98 tolerates this; mobile skips — see below) */
@media (min-width: 769px) {
  .background-first-line__image {
    -webkit-animation: fadein 0.5s ease-in alternate 1;
    -moz-animation: fadein 0.5s ease-in alternate 1;
    animation: fadein 0.5s ease-in alternate 1;
  }
}

.page-home .headline.first-line > .container.no-padding > .col-md-6.no-padding {
  position: relative;
  z-index: 1;
}

/* Phase 2 — Mobile: preserve intrinsic aspect ratio when .responsive scales width */
@media (max-width: 768px) {
  .page-home img.responsive {
    height: auto;
  }

  /*
   * Touch targets via invisible ::after hit areas — must NOT change navbar height
   * (min-height/padding on these controls broke slicknav layout on mobile).
   */
  .page-home #btn-inscription-header::after {
    display: block;
    width: 48px;
    height: 48px;
  }

  .page-home .slicknav_btn {
    position: relative;
  }

  .page-home .slicknav_btn::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 48px;
    height: 48px;
    transform: translate(-50%, -50%);
  }
}