/* Restore the original homepage header and first-screen layout.
   The original responsive hero rules remain in home-redesign.css. */
.home-first-screen .header-inner {
  gap: 30px !important;
  padding: 15px var(--gutter) !important;
  flex-wrap: nowrap;
}
.home-first-screen .desktop-nav {
  gap: clamp(22px, 2.3vw, 46px) !important;
}
.home-first-screen .desktop-nav a {
  font-size: clamp(14px, 1.04vw, 20px) !important;
}
.home-first-screen .header-actions {
  width: auto;
  gap: 15px !important;
}
.home-first-screen .header-actions .contact-pill:not(.brief-catalogue-download) {
  padding: 15px 27px !important;
  font-size: clamp(15px, 1.1vw, 21px) !important;
}
.home-first-screen .category-card--single .category-art img { width: 90%; }
/* Leave room for the additional requested catalogue action on smaller desktops. */
@media (min-width: 1361px) and (max-width: 1599px) {
  .home-first-screen .header-inner { gap: 20px !important; padding-inline: 3vw !important; }
  .home-first-screen .desktop-nav { gap: 16px !important; }
  .home-first-screen .desktop-nav a { font-size: 14px !important; }
  .home-first-screen .header-actions { gap: 10px !important; }
  .home-first-screen .header-actions .contact-pill:not(.brief-catalogue-download) { padding: 13px 17px !important; font-size: 14px !important; }
}
@media (max-width: 1360px) {
  .home-first-screen .header-inner { gap: 20px !important; }
  .home-first-screen .header-actions .contact-pill:not(.brief-catalogue-download) { padding: 13px 20px !important; font-size: 15px !important; }
}
@media (max-width: 700px) {
  .home-first-screen .header-inner { min-height: 78px; padding: 16px var(--gutter) !important; gap: 14px !important; }
  .home-first-screen .header-actions { flex: 0 0 auto; width: auto; gap: 10px !important; justify-content: flex-end; }
  .home-first-screen .header-actions .menu-toggle { position: static; width: 44px; height: 44px; }
  .home-first-screen .header-actions .contact-pill:not(.brief-catalogue-download) { display: none !important; }
  .home-first-screen .header-actions .brief-catalogue-download { width: 38px; min-width: 38px; height: 38px; flex: 0 0 38px; justify-content: center; padding: 8px !important; }
  .home-first-screen .header-actions .brief-catalogue-download span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
}
/* Preserve the original desktop navigation breakpoint. */
@media (min-width: 1051px) and (max-width: 1360px) {
  .home-first-screen .header-inner { gap: 18px !important; padding-inline: 3vw !important; }
  .home-first-screen .desktop-nav { display: flex !important; gap: 15px !important; }
  .home-first-screen .desktop-nav a { font-size: 14px !important; }
  .home-first-screen .header-actions { gap: 10px !important; }
  .home-first-screen .header-actions .menu-toggle { display: none !important; }
}
/* Keep the full download label on laptops and tablets. */
@media (min-width: 701px) and (max-width: 1050px) and (min-height: 501px), (min-width: 701px) and (max-width: 1050px) and (hover: hover) {
  .home-first-screen .header-inner { padding-inline: 24px !important; gap: 14px !important; }
  .home-first-screen .header-actions { gap: 8px !important; }
  .home-first-screen .header-actions .contact-pill:not(.brief-catalogue-download) { padding: 11px 12px !important; font-size: 13px !important; }
}

@media (max-width: 700px), (max-width: 1024px) and (max-height: 500px) and (hover: none) and (pointer: coarse) {
  .home-first-screen .header-actions .mail-button:not(.brief-mobile-mail) { display: none !important; }
  .home-first-screen .header-actions .mail-button.brief-mobile-mail {
    display: inline-flex !important;
    flex: 0 0 38px;
    width: 38px;
    min-width: 38px;
    height: 38px;
    min-height: 38px;
    padding: 9px !important;
    border-radius: 9px;
  }
  .home-first-screen .brief-mobile-mail span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
}

/* Owner-supplied legacy badge follows the homepage brand. */
.home-first-screen .header-legacy-badge {
  display: block;
  width: clamp(70.8px, 5.4vw, 102px);
  height: auto;
  max-height: 42px;
  align-self: flex-start;
  object-fit: contain;
  flex: 0 0 auto;
}
@media (min-width: 1051px) and (max-width: 1360px) {
  .home-first-screen .desktop-nav { display: none !important; }
  .home-first-screen .header-actions .menu-toggle { display: inline-grid !important; }
}
@media (min-width: 701px) and (max-width: 1360px) {
  .home-first-screen .header-actions { margin-left: auto; }
}
@media (max-width: 850px) and (min-width: 701px) {
  .home-first-screen .header-legacy-badge { width: 60px; }
  .home-first-screen .header-inner { gap: 10px !important; padding-inline: 18px !important; }
}
@media (max-width: 700px) {
  .home-first-screen .header-inner { padding-inline: 16px !important; gap: 8px !important; }
  .home-first-screen .brand { gap: 7px; }
  .home-first-screen .brand-symbol { width: 30px; height: 30px; }
  .home-first-screen .brand-wordmark { width: 110px; }
  .home-first-screen .header-legacy-badge { width: clamp(40.8px, 12vw, 66px); max-height: 31.2px; }
  .home-first-screen .header-actions { margin-left: auto; }
}

/* White hero fade keeps the original photograph and gradient coverage. */
.home-first-screen .hero { background: #fff; color: #00152d; }
.home-first-screen .hero::before {
  background: linear-gradient(90deg, #fff 0%, #fffffffa 25%, #ffffffeb 34%, #ffffff99 47%, #ffffff20 65%, transparent 81%);
}
.home-first-screen .hero-button { color: #fff; }
@media (max-width: 1050px) {
  .home-first-screen .hero::before { background: linear-gradient(90deg, #fffffff5 0%, #ffffffd9 36%, #ffffff55 80%); }
}
@media (max-width: 700px) {
  .home-first-screen .hero::before { background: linear-gradient(90deg, #ffffffeb, #ffffff88), linear-gradient(0deg, #fff 39%, transparent 85%); }
}
/* Deeper blue gives the headline stronger contrast against the white fade. */
.home-first-screen #hero-title .text-cyan { color: #002b5b; }
/* Brand teal-blue replaces orange in hero text, alongside the navy headline. */
.home-first-screen .hero .text-orange,
.home-first-screen .hero .hero-tagline { color: #007f9d; }
/* Preserve every item in the transparent modular OT equipment arrangement. */
.home-first-screen .category-card--room .category-art img { width: auto; max-width: 100%; height: 100%; object-fit: contain; border-radius: 0; }

/* Crossfade only the hero photographs; preserve the existing overlay and content. */
/* Blend on a single visual plane so the fade and mobile opacity stay constant. */
.home-first-screen .hero-slideshow { isolation: isolate; pointer-events: none; }
.home-first-screen .hero-slide { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: inherit; object-position: inherit; opacity: 0; z-index: 0; pointer-events: none; }
.home-first-screen .hero-slide.is-outgoing { opacity: 1; z-index: 1; }
.home-first-screen .hero-slide.is-active { opacity: 1; z-index: 2; }
@media (prefers-reduced-motion: reduce) {
  .home-first-screen .hero-slide { transition: none; }
}

/* Why Choose Us: retain the connected layout in the site's dark navy palette. */
.home-first-screen #why-choose-us { background: #001020; color: #f5f9ff; }
.home-first-screen #why-choose-us::before { background: #082b46; }
.home-first-screen #why-choose-us::after { background: radial-gradient(ellipse at 50% 30%, #103751 0%, #052139 48%, #00152d 90%); }
.home-first-screen #why-choose-us .benefit-label { color: #f5f9ff; }
.home-first-screen #why-choose-us .brief-benefit-copy,
.home-first-screen #why-choose-us .brief-warranty-note { color: #b9d1e2; }
.home-first-screen #why-choose-us .brief-warranty-note a { color: #66d9ff; }
.home-first-screen #why-choose-us .benefit-circle { border-color: #b9e7ff; box-shadow: 0 0 0 2px #226083, 0 0 28px color-mix(in srgb, var(--benefit-color) 35%, transparent); }
.home-first-screen #why-choose-us .benefits-orb { border-color: #c3efff; box-shadow: 0 0 0 3px #226083, 0 0 36px #008cff40, inset 0 13px 22px -7px #008cff; }
.home-first-screen #why-choose-us a:focus-visible { outline: 2px solid #66d9ff; outline-offset: 6px; border-radius: 8px; }
.home-first-screen #why-choose-us .brief-warranty-note a:hover { color: #ff7722; }

/* Keep full-photo framing on larger screens; retain the original mobile background. */
@media (min-width: 701px) {
  .home-first-screen .hero-inner { min-height: max(clamp(490px, 28.1vw, 580px), 39.396vw); }
  .home-first-screen .hero-slideshow { width: 70%; max-width: 70%; object-fit: contain; object-position: right center; mask-image: linear-gradient(90deg, transparent, #000 28%); }
}
@media (min-width: 701px) and (max-width: 1050px) {
  .home-first-screen .hero-inner { min-height: max(490px, 56.2799vw); }
  .home-first-screen .hero-slideshow { width: 100%; max-width: 100%; }
}
/* Use the same green as the floating WhatsApp control. */
.home-first-screen .hero .whatsapp-button { background: #087a3f; border-color: #4fe59a; filter: none; }
.home-first-screen .hero .whatsapp-button:is(:hover, :focus-visible) { background: #05914a; }