/* ==========================================================================
   Onepager – Hero + sauberer Verlauf bis 100% CI-Grün
   ========================================================================== */

/* Seitentitel ausblenden */
body.page-template-templates-template-onepage-php .entry-title,
body.page-template-templates-template-onepage-php .wp-block-post-title,
.is-onepage .entry-title, .is-onepage .page-title, .site-content > h1:first-child{ display:none!important }

/* Anker-Offset (berücksichtigt Header mit Padding) */
#start,#leistungen,#galerie,#wissen,#kontakt,#impressum{
  scroll-margin-top: calc(var(--header-height) + 16px);
}

/* Hero */
.hero{ position:relative; min-height:78vh; display:grid; place-items:center; padding-top:var(--header-height); isolation:isolate; overflow:hidden; }
@media (min-width:980px){ .hero{ min-height:92vh; } }
.hero__media{ position:absolute; inset:0; z-index:-3; }
.hero__media img{ width:100%; height:100%; object-fit:cover; transform:scale(1.02); will-change:transform; }

/* Wir nutzen ::before (Dunkel/Glow) + ::after (grüner Fade bis 100%) */
.hero__overlay{ display:none; }

/* Dunkel + Glow (mit Blend) */
.hero::before{
  content:""; position:absolute; inset:0; z-index:-2; pointer-events:none;
  background:
    linear-gradient(180deg,
      var(--hero-overlay-top) 0%,
      var(--hero-overlay-mid) 36%,
      var(--hero-overlay-low) calc(var(--hero-green-start) - 6%),
      rgba(0,0,0,0) calc(var(--hero-green-start) - 2%)
    ),
    radial-gradient(1000px 600px at 18% 18%,
      color-mix(in srgb, var(--ci-primary-700) 35%, transparent) 0%,
      transparent 70%
    );
  mix-blend-mode:multiply;
  animation:heroGlow 18s ease-in-out infinite alternate;
}
@keyframes heroGlow{
  0%{ background-position:0% 0%, 0% 0% }
  100%{ background-position:0% 0%, 100% 20% }
}

/* Grüner Fade ohne Blend → Bild unten vollständig verdeckt */
.hero::after{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background: linear-gradient(180deg,
    rgba(106,180,46,0) var(--hero-green-start),
    rgba(106,180,46,.06) calc(var(--hero-green-start) + 2%),
    rgba(106,180,46,.14) calc(var(--hero-green-start) + 4%),
    rgba(106,180,46,.26) calc(var(--hero-green-start) + 7%),
    rgba(106,180,46,.42) calc(var(--hero-green-start) + 10%),
    rgba(106,180,46,.62) calc(var(--hero-green-start) + 13%),
    rgba(106,180,46,.78) calc(var(--hero-green-start) + 15%),
    #6ab42e 100%
  );
}

/* Inhalt */
.hero__content{
  position:relative; z-index:1; text-align:center; color:#fff;
  max-width:980px; width:100%; margin-inline:auto; padding:clamp(2rem,4vw,3rem) 0; text-wrap:balance;
}
.hero__title{ font-family:var(--font-accent); font-weight:800; font-size:clamp(1.6rem,6vw,3rem); line-height:1.1; margin:0 0 var(--space-4); text-shadow:0 10px 28px rgba(0,0,0,.45); }
.hero__subtitle{ font-size:clamp(.95rem,3.5vw,1.15rem); margin:0 0 var(--space-8); opacity:.95; }
.hero__cta .btn{ font-size:clamp(.95rem,3.5vw,1.05rem); }

/* ==== Leistungen: Fallback (falls cards.css nicht geladen wäre) ==== */
.section__header{ margin-bottom: var(--space-8); }
.section--green .section__title{ color:#fff; }
.section--green .section__intro{ color:rgba(255,255,255,.92); max-width:65ch; margin:var(--space-4) 0 0; }
.cards-grid{ display:grid; gap:var(--space-6); grid-template-columns:1fr; }
@media (min-width:700px){ .cards-grid{ grid-template-columns:repeat(2,1fr); } }
.card{ background:#fff; color:var(--ci-dark); border-radius:var(--radius); box-shadow:var(--shadow-sm); padding:var(--space-6); display:flex; flex-direction:column; min-height:100%; }
.card__body{ flex:1 1 auto; }
.card__title{ font-family:var(--font-accent); font-size:1.25rem; line-height:1.25; margin:0 0 var(--space-3); }
.card__text{ margin:0; opacity:.92; }
.card__footer{ margin-top:auto; padding-top:var(--space-6); }
.btn--sm{ padding:.7rem 1rem; font-size:.95rem; line-height:1; }

/* ==== Onepager: Ergänzung für den Leistungen-Block (näher an Hero) ==== */
.section--services { 
  padding-top: 0 !important;
}
.section--services .section__header { 
  margin-top: 0;
}