/* ==========================================================================
   Innenseiten: Seiten-Hero, Leistungsdetail, Kontakt, Rechtstexte, Formular
   ========================================================================== */

/* ---- Seiten-Hero (Text, ohne Bild) ---- */
.page-hero{
  background: var(--ink);
  color: var(--paper);
  padding-block: var(--space-lg) var(--space-md);
}
.page-hero h1{ color: var(--paper); margin-top: 0.6rem; max-width: 22ch; }
.page-hero__lede{ color: oklch(88% 0.02 80); font-size: var(--step-1); max-width: 52ch; margin-top: 1.25rem; }

/* ---- Seiten-Hero mit Bild (Leistungsdetail) ---- */
.page-hero--media{
  position: relative;
  min-height: 60vh;
  display: flex;
  align-items: flex-end;
  padding: 0;
  overflow: hidden;
}
.page-hero--media img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.page-hero--media::after{
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(to top, oklch(10% 0.01 55 / 0.85), transparent 62%);
}
.page-hero--media .container{ position: relative; z-index: 2; padding-block: var(--space-md) var(--space-md); }

/* ---- Inhalt aus Gutenberg (the_content) ---- */
.entry-content{ padding-block: var(--space-md) var(--space-lg); }
.entry-content > *{ max-width: 68ch; margin-left: auto; margin-right: auto; }
.entry-content > .alignwide{ max-width: min(100%, 1100px); }
.entry-content > .alignfull{ max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
.entry-content > .wp-block-columns{ max-width: 100%; gap: clamp(1.5rem, 3vw, 3rem); }
.entry-content h2{ margin-block: 2.4rem 1rem; }
.entry-content h3{ margin-block: 1.8rem 0.8rem; font-size: var(--step-2); }
.entry-content ul, .entry-content ol{ padding-left: 1.3em; color: var(--text-muted); }
.entry-content li{ margin-bottom: 0.5em; }
.entry-content li::marker{ color: var(--accent); }
.entry-content a{ color: var(--ink); text-decoration-color: var(--accent); text-decoration-thickness: 1px; text-underline-offset: 0.15em; }
.entry-content a:hover{ color: var(--accent); }
.entry-content figure{ margin: 0; }
.entry-content figcaption{ font-size: var(--step--1); color: var(--text-muted); margin-top: 0.6rem; }
.entry-content blockquote{
  border-left: 2px solid var(--accent);
  padding-left: 1.5rem;
  font-family: var(--font-display);
  font-size: var(--step-2);
  font-style: italic;
  margin-block: 2rem;
}

/* ---- Leistungen-Übersichtsseite ---- */
.service-list{ padding-block: var(--space-md) var(--space-lg); }

/* ---- Leistungsdetail: Cross-Links zu anderen Leistungen ---- */
.related-services{ padding-block: var(--space-md) var(--space-xl); }
.related-services__head{ grid-column: 1 / span 5; margin-bottom: var(--space-sm); }
.related-services__list{
  grid-column: 1 / -1;
  list-style: none;
  margin: 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1.25rem, 2.5vw, 2rem);
}
.related-services__list a{
  display: block;
  text-decoration: none;
  padding: 1.5rem 0;
  border-top: 1px solid var(--line);
  transition: padding-left var(--dur-med) var(--ease-out);
}
.related-services__list a:hover{ padding-left: 0.5rem; color: var(--accent); }
.related-services__list .eyebrow{ margin-bottom: 0.6rem; }

@media (max-width: 900px){
  .related-services__head{ grid-column: 1 / -1; }
  .related-services__list{ grid-template-columns: 1fr; }
}

/* ---- Kontaktseite ---- */
.contact-section{ padding-block: var(--space-md) var(--space-xl); }
.contact-info{ grid-column: 1 / span 5; }
.contact-info__block{ margin-bottom: var(--space-sm); }
.contact-info__block h3{ font-size: var(--step-1); margin-bottom: 0.6rem; }
.contact-list{ list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.75rem; }
.contact-list li{ display: flex; align-items: center; gap: 0.7rem; }
.contact-list .icon{ color: var(--accent); flex-shrink: 0; }
.contact-list a{ text-decoration: none; }
.contact-list a:hover{ color: var(--accent); }
.contact-map{ margin-top: var(--space-sm); aspect-ratio: 4/3; overflow: hidden; filter: grayscale(0.35) contrast(1.05); }
.contact-map iframe{ width: 100%; height: 100%; border: 0; }

.contact-form-wrap{ grid-column: 7 / span 6; }
.contact-form-wrap h3{ font-size: var(--step-1); margin-bottom: 1.2rem; }

@media (max-width: 900px){
  .contact-info, .contact-form-wrap{ grid-column: 1 / -1; }
  .contact-form-wrap{ margin-top: var(--space-md); }
}

/* ---- Contact Form 7 Overrides (Editorial statt Standard) ---- */
.wpcf7-form{ font-family: var(--font-body); }
.wpcf7-form p{ max-width: none; }
.wpcf7-form label{ display: block; font-size: var(--step--1); letter-spacing: 0.03em; margin-bottom: 0.4rem; color: var(--text-muted); }
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form textarea{
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  padding: 0.7em 0.1em;
  font-family: var(--font-body);
  font-size: var(--step-0);
  color: var(--ink);
  margin-bottom: 1.5rem;
  transition: border-color var(--dur-med) var(--ease-out);
}
.wpcf7-form input:focus,
.wpcf7-form textarea:focus{ border-color: var(--accent); outline: none; }
.wpcf7-form textarea{ min-height: 130px; resize: vertical; }
.wpcf7-form .wpcf7-acceptance label{ display: flex; align-items: flex-start; gap: 0.6rem; font-size: var(--step--1); }
.wpcf7-form input[type="submit"]{
  display: inline-flex;
  align-items: center;
  padding: 0.95em 2.2em;
  font-size: var(--step--1);
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  border: 1px solid var(--ink);
  border-radius: var(--radius);
  background: var(--ink);
  color: var(--paper);
  cursor: pointer;
  min-height: 44px;
  transition: background var(--dur-med) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}
.wpcf7-form input[type="submit"]:hover{ background: var(--accent); border-color: var(--accent); }
.wpcf7-form input[type="submit"]:active{ transform: scale(0.98); }
.wpcf7-form input[type="submit"]:disabled{ opacity: 0.6; cursor: wait; }
.wpcf7-not-valid-tip{ color: #a8332a; font-size: var(--step--2); margin-top: -1.1rem; margin-bottom: 1rem; }
.wpcf7-response-output{
  margin-top: 1.5rem;
  padding: 1em 1.25em;
  border: 1px solid var(--line);
  font-size: var(--step--1);
}
.wpcf7-mail-sent-ok{ border-color: var(--accent); color: var(--ink); }
