/* Hero sections — neutral overlay + glass panels */

:root {
  --hero-overlay: linear-gradient(
    115deg,
    rgba(15, 23, 42, 0.72) 0%,
    rgba(51, 65, 85, 0.52) 50%,
    rgba(15, 23, 42, 0.68) 100%
  );
  --hero-glass-bg: rgba(11, 17, 32, 0.34);
  --hero-glass-border: rgba(255, 255, 255, 0.14);
}

/* Per-page hero images — same bright Pexels style as home; each photo matches the page */
[data-page="home"] { --hero-image: url("https://images.pexels.com/photos/5998040/pexels-photo-5998040.jpeg?auto=compress&cs=tinysrgb&w=1920"); }
[data-page="location"] { --hero-image: url("https://images.pexels.com/photos/5998040/pexels-photo-5998040.jpeg?auto=compress&cs=tinysrgb&w=1920"); }
[data-page="house"] { --hero-image: url("https://images.pexels.com/photos/7492984/pexels-photo-7492984.jpeg?auto=compress&cs=tinysrgb&w=1920"); }
[data-page="commercial"] { --hero-image: url("https://images.pexels.com/photos/1181406/pexels-photo-1181406.jpeg?auto=compress&cs=tinysrgb&w=1920"); }
[data-page="vacate"] { --hero-image: url("https://images.pexels.com/photos/8134818/pexels-photo-8134818.jpeg?auto=compress&cs=tinysrgb&w=1920"); }
[data-page="medical"] { --hero-image: url("https://images.pexels.com/photos/7579831/pexels-photo-7579831.jpeg?auto=compress&cs=tinysrgb&w=1920"); }
[data-page="ndis"] { --hero-image: url("https://images.pexels.com/photos/5264084/pexels-photo-5264084.jpeg?auto=compress&cs=tinysrgb&w=1920"); }
[data-page="guarantee"] { --hero-image: url("https://images.pexels.com/photos/5824705/pexels-photo-5824705.jpeg?auto=compress&cs=tinysrgb&w=1920"); }
[data-page="policies"] { --hero-image: url("https://images.pexels.com/photos/5905706/pexels-photo-5905706.jpeg?auto=compress&cs=tinysrgb&w=1920"); }
[data-page="about"] { --hero-image: url("https://images.pexels.com/photos/3184418/pexels-photo-3184418.jpeg?auto=compress&cs=tinysrgb&w=1920"); }
[data-page="faq"] { --hero-image: url("https://images.pexels.com/photos/7492984/pexels-photo-7492984.jpeg?auto=compress&cs=tinysrgb&w=1920"); }
[data-page="service-areas"] { --hero-image: url("https://images.pexels.com/photos/5998040/pexels-photo-5998040.jpeg?auto=compress&cs=tinysrgb&w=1920"); }
[data-page="contact"] { --hero-image: url("https://images.pexels.com/photos/8865066/pexels-photo-8865066.jpeg?auto=compress&cs=tinysrgb&w=1920"); }
[data-page="blog"] { --hero-image: url("https://images.pexels.com/photos/1957861/pexels-photo-1957861.jpeg?auto=compress&cs=tinysrgb&w=1920"); }
[data-page="portal"] { --hero-image: url("https://images.pexels.com/photos/5824495/pexels-photo-5824495.jpeg?auto=compress&cs=tinysrgb&w=1920"); }
[data-page="quote"] { --hero-image: url("https://images.pexels.com/photos/9462309/pexels-photo-9462309.jpeg?auto=compress&cs=tinysrgb&w=1920"); }

.hero,
.page-hero,
.faq-hero,
.about-hero {
  position: relative;
  overflow: hidden;
  background-color: #0f172a !important;
  background-image: var(--hero-overlay), var(--hero-image) !important;
  background-size: cover !important;
  background-position: center !important;
  border-bottom-left-radius: 100px;
  border-bottom-right-radius: 100px;
}

.hero::before,
.page-hero::before,
.faq-hero::before,
.about-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 90% 80% at 50% 45%, rgba(0, 0, 0, 0.12), transparent 68%);
  pointer-events: none;
  z-index: 0;
}

.about-hero::after {
  display: none;
}

.hero > .container,
.page-hero > .container,
.faq-hero > .container,
.about-hero > .container {
  position: relative;
  z-index: 1;
}

.hero-card,
.page-hero .hero-card,
.faq-hero-card,
.story-card {
  background: var(--hero-glass-bg) !important;
  border: 1px solid var(--hero-glass-border) !important;
  border-radius: 22px;
  box-shadow:
    0 20px 56px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.hero h1,
.page-hero h1,
.faq-hero-card h1,
.story-card h1 {
  color: #fff !important;
  text-shadow: 0 4px 24px rgba(0, 0, 0, 0.45);
}

.hero .sub,
.page-hero .sub,
.faq-hero-card p,
.story-card p {
  color: rgba(255, 255, 255, 0.92) !important;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.35);
}

.hero-trust-pill {
  background: rgba(11, 17, 32, 0.38) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  color: rgba(255, 255, 255, 0.94) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.hero .btn-ghost {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.28) !important;
  color: #fff !important;
}

.hero .btn-ghost:hover {
  background: rgba(255, 255, 255, 0.16) !important;
  border-color: rgba(255, 255, 255, 0.45) !important;
}

.faq-hero,
.about-hero {
  padding: 84px 0 90px;
}

.faq-hero {
  min-height: 420px;
}

.about-hero {
  min-height: 520px;
}

.faq-hero-card,
.story-card {
  position: relative;
  z-index: 2;
  color: #fff;
}

.faq-hero-card {
  max-width: 860px;
  padding: 44px;
  margin-top: 40px;
}

.story-card {
  max-width: 860px;
  padding: 44px;
  margin-top: 40px;
}

@media (max-width: 900px) {
  .hero h1,
  .page-hero h1,
  .faq-hero-card h1,
  .story-card h1 {
    font-size: 2.35rem !important;
  }

  .faq-hero-card,
  .story-card {
    padding: 30px;
  }
}