/*
Theme Name: Rhino Solar
Theme URI: https://rhino-solar.de
Author: Rhino Solar
Description: Custom WordPress theme for Rhino Solar. Rebuilt against the original Abkauf/RH-60 styling.
Version: 2.7.0
Requires at least: 6.0
Tested up to: 6.7
License: Private
Text Domain: rhino-solar
*/

/* ============================================================
   01 – RHINO BASISVARIABLEN
   ============================================================ */
:root {
  --rh--color--ci: #fdc414ff;
  --rh--color--ci--contrast: #000;
  --rh--color--ci--secondary: rgb(124, 183, 125);
  --rh--color--ci--secondary--contrast: #000;
  --rh--color--ci--secondary--lighten-30: #dfeddf;
  --rh--color--content: #fff;
  --rh--color--content--text: #333333ff;
  --rh--color--header: rgb(47, 41, 27);
  --rh--color--footer: #2f291bff;
  --rh--color--footer--text: #fff;
  --rh--color--link--text: rgb(51, 51, 51);
  --rh--color--link--text--hover: rgb(51, 51, 51);
  --rh--font--main: 'Lexend', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  --rh--general--font-size: 1.7rem;
  --rh--font--line-height--body: 1.8;
  --rh--size--content: 1400px;
  --rh--size--wide: 1600px;
  --rh--size--logo--height: 170px;
  --rh--size--logo--height--small: 100px;
  --rh--size--general--margin--bottom: 2.4rem;
  --rh--size--block-gap: clamp(4rem, 4.5vw, 12rem);
  --rhino-header-height: 0px;
}

/* ============================================================
   02 – GRUNDLAYOUT
   ============================================================ */
html {
  font-size: 62.5%;
  overflow-x: hidden;
  scroll-behavior: smooth;
}

body {
  background: var(--rh--color--content);
  color: var(--rh--color--content--text);
  font-family: var(--rh--font--main);
  font-size: var(--rh--general--font-size);
  line-height: var(--rh--font--line-height--body);
  margin: 0;
  overflow-x: hidden;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

#page.site {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.site-content {
  flex: 1 0 auto;
  padding: 0;
  max-width: 100%;
  margin-top: var(--rhino-header-height, 0px);
}

.admin-bar .header.nav-fixed-wrapper {
  top: 32px;
}

@media (max-width: 782px) {
  .admin-bar .header.nav-fixed-wrapper {
    top: 46px;
  }
}

.container {
  max-width: var(--rh--size--content);
  margin-left: auto;
  margin-right: auto;
  padding-left: max(env(safe-area-inset-left), 2rem);
  padding-right: max(env(safe-area-inset-right), 2rem);
}

@media (min-width: 840px) {
  .container {
    padding-left: max(env(safe-area-inset-left), 4rem);
    padding-right: max(env(safe-area-inset-right), 4rem);
  }
}

img {
  max-width: 100%;
  height: auto;
}

/* ============================================================
   03 – HEADER WIE ORIGINAL: LOGO LINKS, NAVIGATION DANEBEN
   ============================================================ */
.header.nav-fixed-wrapper {
  background: var(--rh--color--header);
  box-shadow: 0 2px 10px rgba(0,0,0,.22);
  left: 0;
  margin-top: 0;
  position: fixed;
  right: 0;
  top: 0;
  width: 100%;
  z-index: 110;
}

.header > .nav-wrapper {
  align-items: center;
  display: flex;
  flex-direction: row;
  margin: 0 auto;
  max-width: var(--rh--size--content);
  min-height: 0;
  width: 100%;
}

.nav-wrapper .site-header {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  order: 0;
  padding-bottom: 0;
  padding-top: 0;
  width: auto;
}

.site-branding {
  align-items: center;
  display: flex;
  flex-grow: 0;
}

.site-branding > a,
.custom-logo-link {
  box-shadow: none !important;
  display: inline-flex;
  line-height: 0;
  text-decoration: none;
}

.custom-logo {
  display: block;
  height: var(--rh--size--logo--height);
  margin: 15px 0 5px;
  max-height: 170px;
  width: auto;
  transition: height .25s ease, max-height .25s ease, margin .25s ease;
}

.header.scrolled .custom-logo {
  height: var(--rh--size--logo--height--small);
  max-height: 100px;
  margin: 8px 0 4px;
}

/* ============================================================
   04 – DESKTOP-NAVIGATION
   ============================================================ */
@media (min-width: 840px) {
  .mobile-menu-toggle,
  .mobile-menu-toggle-inside {
    display: none !important;
  }

  .header > .nav-wrapper > .main-navigation {
    flex: 1 1 auto;
  }

  .nav-wrapper .main-navigation {
    align-self: center;
    background: transparent;
    bottom: auto;
    height: auto;
    left: auto;
    overflow: visible;
    position: static;
    transition: none;
    width: auto;
  }

  .main-navigation > .container {
    align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    padding-bottom: 0;
    padding-top: 0;
    width: 100%;
  }

  .nav-menu {
    align-items: center;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
    margin: 0;
    min-width: 0;
    padding: 0;
    width: auto;
  }

  .nav-menu > .menu-item {
    color: #fff;
    flex: none;
    margin: 0;
    position: relative;
  }

  .nav-menu > .menu-item > a {
    align-items: center;
    box-shadow: none !important;
    color: currentColor;
    display: flex;
    font-size: 1.7rem;
    font-weight: 400;
    line-height: 2.3;
    overflow: hidden;
    padding: 10px 2.2rem;
    text-align: center;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .nav-menu > .menu-item:hover,
  .nav-menu > .menu-item:focus-within,
  .nav-menu > .menu-item.current-menu-item,
  .nav-menu > .menu-item.current_page_item,
  .nav-menu > .menu-item.current-menu-ancestor,
  .nav-menu > .menu-item.current_page_ancestor {
    background: var(--rh--color--ci);
    color: var(--rh--color--ci--contrast);
  }

  .nav-menu > .menu-item.current-menu-item:hover,
  .nav-menu > .menu-item.current_page_item:hover,
  .nav-menu > .menu-item.current-menu-ancestor:hover,
  .nav-menu > .menu-item.current_page_ancestor:hover {
    background: var(--rh--color--ci--secondary);
    color: var(--rh--color--ci--secondary--contrast);
  }

  .main-navigation .sub-menu {
    background: var(--rh--color--ci);
    box-shadow: 0 8px 22px rgba(0,0,0,.18);
    clip: rect(1px, 1px, 1px, 1px);
    display: block;
    height: 1px;
    left: 0;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: absolute;
    top: 100%;
    width: 1px;
    z-index: 100;
  }

  .main-navigation .menu-item:hover > .sub-menu,
  .main-navigation .menu-item:focus-within > .sub-menu,
  .main-navigation .sub-menu.sub-menu-open {
    clip: inherit;
    height: auto;
    overflow: visible;
    width: auto;
  }

  .main-navigation .sub-menu a {
    box-shadow: none !important;
    color: #000;
    display: block;
    font-size: 1.6rem;
    line-height: 1.5;
    padding: 1rem 2rem;
    text-align: left;
    text-decoration: none;
    white-space: normal;
    width: 250px;
  }

  .main-navigation .sub-menu .menu-item:hover,
  .main-navigation .sub-menu .menu-item:focus-within {
    background: var(--rh--color--ci--secondary);
  }
}

/* ============================================================
   05 – MOBILE-NAVIGATION
   ============================================================ */
.mobile-menu-toggle {
  align-items: center;
  appearance: none;
  background: var(--rh--color--ci);
  border: 0;
  color: #000;
  cursor: pointer;
  display: flex;
  gap: .8rem;
  margin-left: auto;
  padding: 1rem 2rem;
  white-space: nowrap;
}

.mobile-menu-toggle__icon {
  display: inline-flex;
  flex-direction: column;
  gap: 4px;
}

.mobile-menu-toggle__icon span {
  background: currentColor;
  display: block;
  height: 2px;
  width: 22px;
}

.mobile-menu-toggle__label {
  font-size: 1.5rem;
  line-height: 1;
}

@media (max-width: 839px) {
  :root {
    --rh--size--logo--height: 100px;
    --rh--size--logo--height--small: 80px;
  }

  .header > .nav-wrapper {
    padding-right: 0;
  }

  .custom-logo {
    margin: 8px 0 6px;
  }

  .main-navigation {
    background: var(--rh--color--ci);
    bottom: 0;
    left: 0;
    overflow: hidden;
    position: fixed;
    top: 0;
    transition: width .3s ease;
    width: 0;
    z-index: 1000;
  }

  html.nav-open .main-navigation {
    overflow: auto;
    width: 256px;
  }

  .main-navigation > .container {
    display: flex;
    flex-direction: column;
    padding: 0;
    width: 100%;
  }

  .mobile-menu-toggle-inside {
    appearance: none;
    background: rgba(0,0,0,.08);
    border: 0;
    color: #000;
    cursor: pointer;
    display: block;
    font-family: var(--rh--font--main);
    font-size: 1.7rem;
    line-height: 2;
    padding: 1rem 2rem;
    text-align: left;
    width: 100%;
  }

  .main-navigation .nav-menu {
    display: block;
    margin: 0;
    padding: 0;
    width: 100%;
  }

  .main-navigation .menu-item {
    color: #000;
    display: block;
    position: relative;
  }

  .main-navigation .menu-item > a {
    box-shadow: none !important;
    color: currentColor;
    display: block;
    font-size: 1.7rem;
    line-height: 2.3;
    overflow: hidden;
    padding: 10px 4rem 10px 2rem;
    text-align: left;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .main-navigation .current-menu-item,
  .main-navigation .current_page_item,
  .main-navigation .menu-item:hover,
  .main-navigation .menu-item:focus-within {
    background: var(--rh--color--ci--secondary);
  }

  #nav-blocker {
    bottom: 0;
    left: 100%;
    position: fixed;
    right: 0;
    top: 0;
    transition: left .3s ease;
    z-index: 99999;
  }

  html.nav-open #nav-blocker {
    left: 256px;
  }
}

/* ============================================================
   06 – GUTENBERG / CONTENT KORREKTUREN
   ============================================================ */
.entry-content {
  width: 100vw;
}

.entry-content > .alignfull,
.entry-content > *.alignfull {
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  max-width: 100vw !important;
  padding-left: 0;
  padding-right: 0;
  width: 100vw !important;
}

.entry-content > *:not(.alignfull) {
  max-width: var(--rh--size--content);
  margin-left: auto;
  margin-right: auto;
}

.wp-block-cover.is-header-image,
.is-header-image.wp-block-cover {
  min-height: 450px;
}

@media (min-width: 1135px) {
  .home .wp-block-cover.is-header-image,
  .home .is-header-image.wp-block-cover {
    min-height: 30vw !important;
  }
}

.wp-block-cover.is-header-image .wp-block-cover__inner-container {
  max-width: calc(var(--rh--size--content) - 8rem);
}

.wp-block-cover.is-header-image .wp-block-heading,
.wp-block-cover.is-header-image h1,
.wp-block-cover.is-header-image h2 {
  color: #fff !important;
}

.wp-block-button__link,
.wp-element-button,
button[type="submit"],
input[type="submit"] {
  background-color: var(--rh--color--ci);
  border: 0;
  border-radius: 0;
  box-shadow: none !important;
  color: #000 !important;
  font-family: var(--rh--font--main);
  font-weight: 700;
  text-decoration: none;
}

.wp-block-button__link:hover,
.wp-element-button:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
  background-color: var(--rh--color--ci--secondary);
  color: #000 !important;
}

a {
  color: var(--rh--color--link--text);
  text-decoration: none;
}

a:hover,
a:focus {
  color: var(--rh--color--link--text--hover);
}

/* ============================================================
   07 – FOOTER WIE ORIGINALFARBEN, ABER SAUBER FÜR WP-MENÜS
   ============================================================ */
.site-footer {
  background: var(--rh--color--footer);
  color: var(--rh--color--footer--text);
  flex-shrink: 0;
  margin-top: auto;
}

.site-footer h2,
.site-footer h3,
.site-footer p,
.site-footer li,
.site-footer span {
  color: var(--rh--color--footer--text);
}

.site-footer a {
  box-shadow: inset 0 -2px currentColor;
  color: var(--rh--color--footer--text);
  text-decoration: none;
}

.site-footer a:hover,
.site-footer a:focus {
  box-shadow: none;
  color: var(--rh--color--footer--text);
}

.footer-widgets.container {
  display: grid;
  gap: 3rem;
  padding-bottom: 4rem;
  padding-top: 5rem;
}

@media (min-width: 840px) {
  .footer-widgets.container {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding-bottom: 5rem;
    padding-top: 6rem;
  }
}

.site-info.container {
  align-items: center;
  border-top: 1px solid rgba(255,255,255,.18);
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding-bottom: 2rem;
  padding-top: 2rem;
}

.footer-nav-list {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 2rem;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
}

@media (min-width: 840px) {
  .site-info.container {
    flex-direction: row;
    justify-content: space-between;
  }

  .footer-nav-list {
    justify-content: flex-end;
  }
}

/* ============================================================
   08 – ACCESSIBILITY / KLEINE KORREKTUREN
   ============================================================ */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  word-wrap: normal !important;
}

.screen-reader-text:focus {
  background: var(--rh--color--ci);
  clip: auto !important;
  clip-path: none;
  color: #000;
  display: block;
  height: auto;
  left: 5px;
  padding: 1rem 1.5rem;
  top: 5px;
  width: auto;
  z-index: 100000;
}


/* ============================================================
   09 – HOTFIX 2.2: ORIGINAL-ABSTÄNDE HEADER + HERO
   ============================================================
   Ziel:
   - Header/Logo nicht mehr mittig im WordPress-Container.
   - Hero-Bild wieder echte volle Breite ohne weißen Rand.
   - Hero-Text auf der Startseite wieder links unten wie in der HTML-Version.
   - Inhaltsbreite unterhalb des Heros wieder näher am Original.
*/

/* Header: Wrapper wie Original, aber ohne versehentliche Zentrierung des Logo-Containers */
@media (min-width: 840px) {
  body .header.nav-fixed-wrapper > .nav-wrapper {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: max(env(safe-area-inset-left), 4rem) !important;
    padding-right: max(env(safe-area-inset-right), 4rem) !important;
    box-sizing: border-box !important;
  }

  body .header.nav-fixed-wrapper .site-header.container,
  body .header.nav-fixed-wrapper .nav-wrapper .site-header.container {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    flex: 0 0 auto !important;
    text-align: left !important;
  }

  body .header.nav-fixed-wrapper .site-branding {
    justify-content: flex-start !important;
    text-align: left !important;
  }

  body .header.nav-fixed-wrapper .main-navigation {
    flex: 1 1 auto !important;
    margin-left: 4rem !important;
  }

  body .header.nav-fixed-wrapper .main-navigation > .container {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    justify-content: flex-end !important;
  }

  body .header.nav-fixed-wrapper .nav-menu > .menu-item > a {
    padding-left: 1.3rem !important;
    padding-right: 1.3rem !important;
  }
}

/* Logo-Größe wie HTML-Vorlage: groß, aber nicht übertrieben */
body .header.nav-fixed-wrapper .custom-logo {
  height: 145px !important;
  max-height: 145px !important;
  width: auto !important;
  object-fit: contain !important;
}

body .header.nav-fixed-wrapper.scrolled .custom-logo {
  height: 92px !important;
  max-height: 92px !important;
}

@media (max-width: 839px) {
  body .header.nav-fixed-wrapper .custom-logo {
    height: 96px !important;
    max-height: 96px !important;
  }

  body .header.nav-fixed-wrapper > .nav-wrapper {
    padding-left: 2rem !important;
  }
}

/* Hero: WordPress-Block darf nicht im Inhaltscontainer kleben */
body .site-content,
body .site-main,
body .entry-content,
body article.page {
  max-width: none !important;
  width: 100% !important;
}

body .entry-content > .wp-block-cover.alignfull,
body .entry-content > .wp-block-cover.is-header-image,
body .site-main .wp-block-cover.alignfull,
body .site-main .wp-block-cover.is-header-image {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  margin-top: 0 !important;
  padding-left: 4rem !important;
  padding-right: 4rem !important;
  box-sizing: border-box !important;
}

/* Auf Desktop ist der Hero der Startseite flacher und bannerartiger wie die alte HTML-Seite. */
@media (min-width: 1135px) {
  body.home .entry-content > .wp-block-cover.is-header-image,
  body.home .site-main .wp-block-cover.is-header-image {
    min-height: 450px !important;
    height: 450px !important;
  }

  body:not(.home) .entry-content > .wp-block-cover.is-header-image,
  body:not(.home) .site-main .wp-block-cover.is-header-image {
    min-height: 350px !important;
    height: 350px !important;
  }
}

/* Hero-Inhalt: Startseiten-Claim wieder links unten statt rechts unten. */
body.home .wp-block-cover.is-header-image .wp-block-cover__inner-container {
  align-items: flex-start !important;
  justify-content: flex-end !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 760px !important;
  padding: 0 0 3rem 0 !important;
  text-align: left !important;
}

body.home .wp-block-cover.is-header-image .wp-block-heading,
body.home .wp-block-cover.is-header-image h1,
body.home .wp-block-cover.is-header-image h2 {
  font-size: clamp(3rem, 3.2vw, 4.8rem) !important;
  line-height: 1.22 !important;
  margin-bottom: 1.6rem !important;
  max-width: 760px !important;
  text-align: left !important;
}

body.home .wp-block-cover.is-header-image .wp-block-buttons,
body.home .wp-block-cover.is-header-image .wp-block-button {
  justify-content: flex-start !important;
  margin-top: 0 !important;
  text-align: left !important;
}

/* Normale Inhaltsblöcke nach dem Hero wieder breiter und originalnäher. */
body .entry-content > *:not(.alignfull):not(.wp-block-cover),
body .entry-content > .wp-block-group:not(.alignfull) > .wp-block-group__inner-container,
body .wp-block-group.is-layout-constrained > * {
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

body .entry-content > .wp-block-group:not(.alignfull) {
  max-width: none !important;
  width: 100% !important;
}

@media (min-width: 840px) {
  body .entry-content > .wp-block-group,
  body .wp-block-group {
    padding-top: clamp(5rem, 5vw, 9rem) !important;
    padding-bottom: clamp(5rem, 5vw, 9rem) !important;
  }
}

/* Spalten/Media-Text auf Leistungsseite dürfen wieder breiter laufen. */
body .wp-block-columns,
body .wp-block-media-text {
  max-width: 1180px !important;
}

/* Adminbar: Header-Abstand bleibt stabil, ohne doppelten Main-Nesting-Effekt. */
body.admin-bar .site-content {
  margin-top: var(--rhino-header-height, 0px) !important;
}


/* ============================================================
   10 – HOTFIX 2.3: HEADER-NAV RECHTS, HERO OHNE RÄNDER, ABSTÄNDE KÜRZER
   ============================================================
   Ergebnis aus Screenshot-Abgleich:
   - Menü muss an den rechten Rand wie in der HTML-Version.
   - Hero darf keine weißen Innenränder haben.
   - Hero darf nicht mit Abstand unter dem Header starten.
   - Startseiten-Text muss links unten sitzen, nicht rechts.
   - Abstand zwischen Hero und erstem Inhaltsblock wird deutlich reduziert.
*/

@media (min-width: 840px) {
  body .header.nav-fixed-wrapper > .nav-wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 4rem !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding-left: 4rem !important;
    padding-right: 4rem !important;
    box-sizing: border-box !important;
  }

  body .header.nav-fixed-wrapper .site-header.container {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body .header.nav-fixed-wrapper .main-navigation {
    flex: 0 0 auto !important;
    width: auto !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    position: static !important;
  }

  body .header.nav-fixed-wrapper .main-navigation > .container {
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    justify-content: flex-end !important;
  }

  body .header.nav-fixed-wrapper .nav-menu {
    width: auto !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    justify-content: flex-end !important;
  }

  body .header.nav-fixed-wrapper .nav-menu > .menu-item > a {
    padding-left: 1.45rem !important;
    padding-right: 1.45rem !important;
  }
}

/* Hero direkt unter Header, ohne weiße WordPress-Ränder */
body .site-content,
body .site-main,
body .entry-content,
body .entry-content > *:first-child {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body .entry-content > .wp-block-cover.alignfull,
body .entry-content > .wp-block-cover.is-header-image,
body .site-main .wp-block-cover.alignfull,
body .site-main .wp-block-cover.is-header-image {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

body .wp-block-cover.is-header-image img.wp-block-cover__image-background,
body .wp-block-cover.is-header-image video.wp-block-cover__video-background {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

@media (min-width: 1135px) {
  body.home .entry-content > .wp-block-cover.is-header-image,
  body.home .site-main .wp-block-cover.is-header-image {
    min-height: 430px !important;
    height: 430px !important;
  }

  body:not(.home) .entry-content > .wp-block-cover.is-header-image,
  body:not(.home) .site-main .wp-block-cover.is-header-image {
    min-height: 335px !important;
    height: 335px !important;
  }
}

/* Startseite: Claim und Button konsequent links unten */
body.home .wp-block-cover.is-header-image {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
}

body.home .wp-block-cover.is-header-image .wp-block-cover__inner-container {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 4rem 4rem 4rem !important;
  box-sizing: border-box !important;
  display: block !important;
  text-align: left !important;
}

body.home .wp-block-cover.is-header-image .wp-block-cover__inner-container > *,
body.home .wp-block-cover.is-header-image .wp-block-group,
body.home .wp-block-cover.is-header-image .wp-block-group__inner-container,
body.home .wp-block-cover.is-header-image .is-layout-constrained > * {
  margin-left: 0 !important;
  margin-right: auto !important;
  text-align: left !important;
  max-width: 760px !important;
}

body.home .wp-block-cover.is-header-image .wp-block-buttons,
body.home .wp-block-cover.is-header-image .wp-block-button {
  justify-content: flex-start !important;
  text-align: left !important;
}

/* Abstand nach dem Hero deutlich näher an der HTML-Version */
body.home .entry-content > .wp-block-cover.is-header-image + *,
body .entry-content > .wp-block-cover.is-header-image + * {
  margin-top: 0 !important;
  padding-top: clamp(5.5rem, 5vw, 8rem) !important;
}

@media (min-width: 840px) {
  body .entry-content > .wp-block-group,
  body .wp-block-group {
    padding-top: clamp(4rem, 4vw, 7rem) !important;
    padding-bottom: clamp(4rem, 4vw, 7rem) !important;
  }

  body .entry-content > .wp-block-cover.is-header-image + .wp-block-group {
    padding-top: clamp(5.5rem, 5vw, 8rem) !important;
  }
}

/* Falls WordPress Block-Gap zwischen Hero und nächstem Block setzt */
body .entry-content.is-layout-flow > * + *,
body .entry-content.is-layout-constrained > * + * {
  margin-block-start: 0 !important;
}


/* ============================================================
   09 – HOTFIX V4: STARTSEITEN-HERO WIE HTML-VERSION
   ============================================================
   Ziel:
   - Hero direkt unter dem Header, ohne weißen Abstand
   - Bild wieder volle Browserbreite
   - Text nicht mehr am Rand abgeschnitten
   - Text links unten wie in der HTML-Abkauf-Version
   - Kein übergroßer Leerraum nach dem Hero
   ============================================================ */

/* Grundproblem aus v3 korrigieren: entry-content darf nicht selbst 100vw breit sein,
   weil die alignfull-Berechnung sonst links aus dem Viewport rutschen kann. */
.entry-content {
  max-width: none !important;
  width: 100% !important;
}

/* Der erste Cover-Block auf der Startseite ist unser Hero. */
.home .entry-content > .wp-block-cover:first-child,
.home .entry-content > .wp-block-cover.alignfull:first-child,
.home .entry-content > .is-header-image.wp-block-cover:first-child {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  min-height: clamp(380px, 30vw, 470px) !important;
  margin-top: 0 !important;
  margin-bottom: clamp(4.5rem, 5vw, 7rem) !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  max-width: 100vw !important;
  overflow: hidden !important;
  padding: 0 !important;
  width: 100vw !important;
}

/* WP setzt teilweise globale Abstände auf den ersten Block. Die müssen beim Hero weg. */
.home .entry-content > .wp-block-cover:first-child:first-child {
  margin-block-start: 0 !important;
}

/* Bild sauber über die gesamte Hero-Fläche legen. */
.home .entry-content > .wp-block-cover:first-child .wp-block-cover__image-background,
.home .entry-content > .wp-block-cover:first-child video.wp-block-cover__video-background {
  height: 100% !important;
  left: 0 !important;
  object-fit: cover !important;
  object-position: center center !important;
  position: absolute !important;
  top: 0 !important;
  width: 100% !important;
}

/* Textbereich wieder links unten platzieren, aber mit sicherem Innenabstand,
   damit die Schrift nicht mehr links abgeschnitten wird. */
.home .entry-content > .wp-block-cover:first-child .wp-block-cover__inner-container {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-end !important;
  margin: 0 !important;
  max-width: none !important;
  min-height: clamp(380px, 30vw, 470px) !important;
  padding: 0 4rem 5.2rem clamp(3rem, 3vw, 5rem) !important;
  position: relative !important;
  transform: none !important;
  width: 100% !important;
}

.home .entry-content > .wp-block-cover:first-child h1,
.home .entry-content > .wp-block-cover:first-child h2,
.home .entry-content > .wp-block-cover:first-child .wp-block-heading {
  color: #fff !important;
  font-size: clamp(3rem, 3.2vw, 5.2rem) !important;
  font-weight: 800 !important;
  line-height: 1.18 !important;
  margin: 0 0 1.8rem 0 !important;
  max-width: 760px !important;
  text-align: left !important;
}

.home .entry-content > .wp-block-cover:first-child .wp-block-buttons,
.home .entry-content > .wp-block-cover:first-child .wp-block-button {
  margin: 0 !important;
}

.home .entry-content > .wp-block-cover:first-child .wp-block-button__link {
  font-size: 1.5rem !important;
  line-height: 1.2 !important;
  padding: 1.2rem 2rem !important;
}

/* Content nach dem Hero kompakter und näher an der HTML-Version. */
.home .entry-content > .wp-block-cover:first-child + * {
  margin-top: 0 !important;
}

.home .entry-content > .wp-block-group:not(.alignfull),
.home .entry-content > .wp-block-columns:not(.alignfull) {
  max-width: 1000px !important;
}

/* Auf Tablet/Mobile darf der Hero höher bleiben, damit Text und Button sauber passen. */
@media (max-width: 839px) {
  .home .entry-content > .wp-block-cover:first-child,
  .home .entry-content > .wp-block-cover:first-child .wp-block-cover__inner-container {
    min-height: 420px !important;
  }

  .home .entry-content > .wp-block-cover:first-child .wp-block-cover__inner-container {
    padding: 0 2rem 3.5rem 2rem !important;
  }
}


/* ============================================================
   11 – HOTFIX V5: HERO-ABGLEICH GEGEN HTML-ORIGINAL
   ============================================================
   Änderungen:
   - Admin-Bar verursacht keinen zusätzlichen weißen Abstand mehr
     (JS schreibt jetzt die echte Header-Höhe, nicht viewport-bottom).
   - Hero startet direkt unter dem Header.
   - Hero-Text bekommt wieder sicheren linken Innenabstand.
   - Überschrift läuft wie im Original auf zwei Zeilen.
   - Hero-Höhe wird auf Desktop wieder näher an der HTML-Version gesetzt.
   ============================================================ */

body.admin-bar .site-content,
body .site-content {
  margin-top: var(--rhino-header-height, 0px) !important;
}

.home .entry-content > .wp-block-cover:first-child,
.home .entry-content > .wp-block-cover.alignfull:first-child,
.home .entry-content > .is-header-image.wp-block-cover:first-child {
  height: clamp(440px, 31vw, 500px) !important;
  min-height: clamp(440px, 31vw, 500px) !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

.home .entry-content > .wp-block-cover:first-child .wp-block-cover__inner-container,
body.home .wp-block-cover.is-header-image .wp-block-cover__inner-container {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  min-height: clamp(440px, 31vw, 500px) !important;
  padding: 0 4rem 5.6rem clamp(3.2rem, 2.2vw, 4.2rem) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-end !important;
  text-align: left !important;
}

.home .entry-content > .wp-block-cover:first-child h1,
.home .entry-content > .wp-block-cover:first-child h2,
.home .entry-content > .wp-block-cover:first-child .wp-block-heading,
body.home .wp-block-cover.is-header-image h1,
body.home .wp-block-cover.is-header-image h2,
body.home .wp-block-cover.is-header-image .wp-block-heading {
  max-width: 920px !important;
  font-size: clamp(3.8rem, 2.7vw, 4.7rem) !important;
  line-height: 1.2 !important;
  letter-spacing: -0.02em !important;
  margin: 0 0 1.6rem 0 !important;
  text-align: left !important;
}

.home .entry-content > .wp-block-cover:first-child .wp-block-button__link,
body.home .wp-block-cover.is-header-image .wp-block-button__link {
  font-size: 1.45rem !important;
  padding: 1.15rem 1.9rem !important;
}

.home .entry-content > .wp-block-cover:first-child + *,
.home .entry-content > .wp-block-cover.is-header-image + * {
  margin-top: 0 !important;
  padding-top: clamp(6.5rem, 5.7vw, 9rem) !important;
}

@media (max-width: 839px) {
  .home .entry-content > .wp-block-cover:first-child,
  .home .entry-content > .wp-block-cover:first-child .wp-block-cover__inner-container {
    height: auto !important;
    min-height: 440px !important;
  }

  .home .entry-content > .wp-block-cover:first-child .wp-block-cover__inner-container,
  body.home .wp-block-cover.is-header-image .wp-block-cover__inner-container {
    padding: 0 2rem 3.5rem 2rem !important;
  }

  .home .entry-content > .wp-block-cover:first-child h1,
  .home .entry-content > .wp-block-cover:first-child h2,
  .home .entry-content > .wp-block-cover:first-child .wp-block-heading {
    font-size: clamp(3rem, 8vw, 4rem) !important;
    max-width: 100% !important;
  }
}


/* ============================================================
   12 – HOTFIX V6: STARTSEITE GEGEN LIVE-HTML FINALISIEREN
   ============================================================
   Ziel nach Screenshot-Vergleich:
   - Header bleibt wie in v5, weil Logo und Menü jetzt passen.
   - Hero darf NICHT mehr über negative 100vw-Ränder laufen, weil dadurch
     der Claim links angeschnitten wurde.
   - Hero sitzt direkt unter dem Header ohne weißen Zwischenraum.
   - Claim sitzt wie im HTML-Original links unten mit sicherem Innenabstand.
   - Hero-Bild wird etwas höher und voller dargestellt.
   - Erster Inhaltsblock rückt näher an den Hero.
   ============================================================ */

body.home .site-content,
body.home main,
body.home article,
body.home .entry-content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.home .entry-content {
  width: 100% !important;
  max-width: none !important;
  overflow: visible !important;
}

body.home .entry-content > .wp-block-cover:first-child,
body.home .entry-content > .wp-block-cover.alignfull:first-child,
body.home .entry-content > .wp-block-cover.is-header-image:first-child,
body.home .entry-content > .is-header-image.wp-block-cover:first-child {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  height: clamp(470px, 30.5vw, 540px) !important;
  min-height: clamp(470px, 30.5vw, 540px) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: stretch !important;
}

body.home .entry-content > .wp-block-cover:first-child .wp-block-cover__image-background,
body.home .entry-content > .wp-block-cover:first-child video.wp-block-cover__video-background,
body.home .entry-content > .wp-block-cover.is-header-image:first-child .wp-block-cover__image-background {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

body.home .entry-content > .wp-block-cover:first-child::before,
body.home .entry-content > .wp-block-cover:first-child .wp-block-cover__background {
  opacity: .45 !important;
}

body.home .entry-content > .wp-block-cover:first-child .wp-block-cover__inner-container,
body.home .entry-content > .wp-block-cover.is-header-image:first-child .wp-block-cover__inner-container,
body.home .wp-block-cover.is-header-image .wp-block-cover__inner-container {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 clamp(2.8rem, 2.4vw, 4.8rem) clamp(4.2rem, 4.1vw, 6.4rem) clamp(3.2rem, 2.2vw, 4.2rem) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-end !important;
  text-align: left !important;
  transform: none !important;
}

body.home .entry-content > .wp-block-cover:first-child h1,
body.home .entry-content > .wp-block-cover:first-child h2,
body.home .entry-content > .wp-block-cover:first-child .wp-block-heading,
body.home .wp-block-cover.is-header-image h1,
body.home .wp-block-cover.is-header-image h2,
body.home .wp-block-cover.is-header-image .wp-block-heading {
  box-sizing: border-box !important;
  color: #fff !important;
  display: block !important;
  width: auto !important;
  max-width: 820px !important;
  margin: 0 0 1.6rem 0 !important;
  padding: 0 !important;
  font-size: clamp(3.7rem, 3.05vw, 5.4rem) !important;
  font-weight: 800 !important;
  line-height: 1.12 !important;
  letter-spacing: -0.02em !important;
  text-align: left !important;
  white-space: normal !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

body.home .entry-content > .wp-block-cover:first-child .wp-block-buttons,
body.home .entry-content > .wp-block-cover:first-child .wp-block-button,
body.home .wp-block-cover.is-header-image .wp-block-buttons,
body.home .wp-block-cover.is-header-image .wp-block-button {
  margin: 0 !important;
  padding: 0 !important;
  justify-content: flex-start !important;
}

body.home .entry-content > .wp-block-cover:first-child .wp-block-button__link,
body.home .wp-block-cover.is-header-image .wp-block-button__link {
  font-size: 1.55rem !important;
  line-height: 1.15 !important;
  padding: 1.25rem 2.1rem !important;
}

body.home .entry-content > .wp-block-cover:first-child + *,
body.home .entry-content > .wp-block-cover.is-header-image:first-child + * {
  margin-top: 0 !important;
  padding-top: clamp(5.8rem, 4.8vw, 7.8rem) !important;
}

body.home .entry-content > .wp-block-group:not(.alignfull),
body.home .entry-content > .wp-block-columns:not(.alignfull) {
  max-width: 1000px !important;
}

@media (min-width: 1600px) {
  body.home .entry-content > .wp-block-cover:first-child,
  body.home .entry-content > .wp-block-cover.alignfull:first-child,
  body.home .entry-content > .wp-block-cover.is-header-image:first-child {
    height: 520px !important;
    min-height: 520px !important;
  }
}

@media (max-width: 839px) {
  body.home .entry-content > .wp-block-cover:first-child,
  body.home .entry-content > .wp-block-cover.alignfull:first-child,
  body.home .entry-content > .wp-block-cover.is-header-image:first-child {
    height: auto !important;
    min-height: 430px !important;
  }

  body.home .entry-content > .wp-block-cover:first-child .wp-block-cover__inner-container,
  body.home .entry-content > .wp-block-cover.is-header-image:first-child .wp-block-cover__inner-container {
    padding: 0 2rem 3.8rem 2rem !important;
  }

  body.home .entry-content > .wp-block-cover:first-child h1,
  body.home .entry-content > .wp-block-cover:first-child h2,
  body.home .entry-content > .wp-block-cover:first-child .wp-block-heading {
    max-width: 100% !important;
    font-size: clamp(3rem, 8vw, 4.1rem) !important;
  }
}


/* ============================================================
   13 – HOTFIX V7: STARTSEITEN-HERO BREITER UND HÖHER
   ============================================================
   Anlass aus Screenshot vom 30.05.:
   - Header/Logo/Menü sitzen jetzt gut und bleiben unberührt.
   - Der Hero ist auf der Startseite noch zu schmal: rechts bleibt ein
     sichtbarer weißer Rand.
   - Der Hero ist auf der Startseite zu niedrig und wirkt dadurch nicht wie
     die HTML-/Live-Version.

   Umsetzung:
   - Der erste Startseitenbereich wird konsequent als Full-Bleed-Bereich
     behandelt.
   - Der eigentliche Cover-/Hero-Block wird unabhängig von Gutenberg-
     Containerbreiten auf echte Viewport-Breite gesetzt.
   - Die Höhe wird auf Desktop deutlich erhöht.
   ============================================================ */

@media (min-width: 840px) {
  /* Der erste Block darf den Hero nicht mehr begrenzen. */
  body.home .entry-content > *:first-child {
    box-sizing: border-box !important;
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    margin-top: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Hero selbst: echte Browserbreite, nicht nur Inhalts-/Blockbreite. */
  body.home .site-content .wp-block-cover.is-header-image,
  body.home .site-content .wp-block-cover.alignfull.is-header-image,
  body.home .entry-content > .wp-block-cover:first-child,
  body.home .entry-content > .wp-block-cover:first-of-type {
    box-sizing: border-box !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 100vw !important;
    height: clamp(500px, 31vw, 560px) !important;
    min-height: clamp(500px, 31vw, 560px) !important;
    max-height: none !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  /* Bild füllt die neue Höhe sauber aus. */
  body.home .site-content .wp-block-cover.is-header-image .wp-block-cover__image-background,
  body.home .site-content .wp-block-cover.is-header-image img.wp-block-cover__image-background,
  body.home .site-content .wp-block-cover.is-header-image video.wp-block-cover__video-background {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  /* Overlay wie Original dunkel lassen, aber nicht weiter verdunkeln als nötig. */
  body.home .site-content .wp-block-cover.is-header-image .wp-block-cover__background,
  body.home .site-content .wp-block-cover.is-header-image::before {
    opacity: .46 !important;
  }

  /* Claim links unten wie Original, mit sicherem Rand und ohne Abschneiden. */
  body.home .site-content .wp-block-cover.is-header-image .wp-block-cover__inner-container,
  body.home .entry-content > .wp-block-cover:first-child .wp-block-cover__inner-container,
  body.home .entry-content > .wp-block-cover:first-of-type .wp-block-cover__inner-container {
    box-sizing: border-box !important;
    position: relative !important;
    z-index: 2 !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 clamp(4rem, 3vw, 5.6rem) clamp(5rem, 4vw, 6.8rem) clamp(4.2rem, 3vw, 5.8rem) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-end !important;
    text-align: left !important;
  }

  body.home .site-content .wp-block-cover.is-header-image h1,
  body.home .site-content .wp-block-cover.is-header-image h2,
  body.home .site-content .wp-block-cover.is-header-image .wp-block-heading {
    max-width: 900px !important;
    margin: 0 0 1.6rem 0 !important;
    font-size: clamp(4.1rem, 3.05vw, 5.4rem) !important;
    line-height: 1.16 !important;
    letter-spacing: -0.025em !important;
    text-align: left !important;
  }

  body.home .site-content .wp-block-cover.is-header-image .wp-block-button__link {
    font-size: 1.5rem !important;
    padding: 1.15rem 2rem !important;
  }

  /* Erster Inhaltsblock nach dem höheren Hero: Abstand ähnlich Live-HTML. */
  body.home .site-content .wp-block-cover.is-header-image + *,
  body.home .entry-content > *:first-child + * {
    margin-top: 0 !important;
    padding-top: clamp(7rem, 5.2vw, 9rem) !important;
  }
}

@media (min-width: 1600px) {
  body.home .site-content .wp-block-cover.is-header-image,
  body.home .entry-content > .wp-block-cover:first-child,
  body.home .entry-content > .wp-block-cover:first-of-type {
    height: 540px !important;
    min-height: 540px !important;
  }
}

@media (max-width: 839px) {
  body.home .site-content .wp-block-cover.is-header-image,
  body.home .entry-content > .wp-block-cover:first-child,
  body.home .entry-content > .wp-block-cover:first-of-type {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    min-height: 460px !important;
  }
}

/* ============================================================
   14 – HOTFIX V8: STARTSEITEN-HERO ORIGINALHÖHE / FULL BLEED
   ============================================================
   Stand nach v7:
   - Header, Logo und Menü sitzen gut.
   - Der Startseiten-Hero ist noch zu flach bzw. wirkt zu schmal.
   - Die HTML-/Live-Seite zeigt den Hero deutlich höher; im Inspector
     ist der Cover-Block als wp-block-cover / is-header-image erkennbar.

   Ziel:
   - Nur Startseite anfassen.
   - Header nicht verändern.
   - Hero bekommt echte Full-Bleed-Breite und eine feste Desktop-Höhe,
     nahe an der Originalseite.
   - Bild, Picture und Overlay werden auf die volle Hero-Höhe gezwungen.
   ============================================================ */

@media (min-width: 840px) {
  body.home article,
  body.home .hentry,
  body.home .entry,
  body.home .entry-content,
  body.home .site-main,
  body.home #primary,
  body.home #content,
  body.home .site-content {
    overflow: visible !important;
  }

  body.home .entry-content > .wp-block-cover.is-header-image:first-child,
  body.home .entry-content > .wp-block-cover.alignfull.is-header-image:first-child,
  body.home .site-main .wp-block-cover.is-header-image:first-of-type,
  body.home main .wp-block-cover.is-header-image:first-of-type,
  body.home .wp-block-cover.is-header-image:first-of-type {
    box-sizing: border-box !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    position: relative !important;
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 100vw !important;
    height: clamp(560px, 34vw, 640px) !important;
    min-height: clamp(560px, 34vw, 640px) !important;
    max-height: none !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding: 0 !important;
    overflow: hidden !important;
    aspect-ratio: auto !important;
  }

  body.home .wp-block-cover.is-header-image:first-of-type picture,
  body.home .wp-block-cover.is-header-image:first-of-type img.wp-block-cover__image-background,
  body.home .wp-block-cover.is-header-image:first-of-type .wp-block-cover__image-background,
  body.home .wp-block-cover.is-header-image:first-of-type video.wp-block-cover__video-background {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  body.home .wp-block-cover.is-header-image:first-of-type .wp-block-cover__background,
  body.home .wp-block-cover.is-header-image:first-of-type::before {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    opacity: .50 !important;
  }

  body.home .wp-block-cover.is-header-image:first-of-type .wp-block-cover__inner-container {
    box-sizing: border-box !important;
    position: relative !important;
    z-index: 2 !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 4.8rem 7.2rem 4.8rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-end !important;
    text-align: left !important;
  }

  body.home .wp-block-cover.is-header-image:first-of-type h1,
  body.home .wp-block-cover.is-header-image:first-of-type h2,
  body.home .wp-block-cover.is-header-image:first-of-type .wp-block-heading {
    max-width: 900px !important;
    margin: 0 0 1.6rem 0 !important;
    font-size: clamp(4.2rem, 3.2vw, 5.8rem) !important;
    line-height: 1.15 !important;
    letter-spacing: -0.025em !important;
  }

  body.home .wp-block-cover.is-header-image:first-of-type .wp-block-button__link {
    font-size: 1.5rem !important;
    padding: 1.2rem 2.15rem !important;
  }

  body.home .wp-block-cover.is-header-image:first-of-type + *,
  body.home .entry-content > .wp-block-cover.is-header-image:first-child + * {
    margin-top: 0 !important;
    padding-top: clamp(6.4rem, 5vw, 8.2rem) !important;
  }
}

@media (min-width: 1600px) {
  body.home .wp-block-cover.is-header-image:first-of-type,
  body.home .entry-content > .wp-block-cover.is-header-image:first-child {
    height: 620px !important;
    min-height: 620px !important;
  }
}

@media (min-width: 2200px) {
  body.home .wp-block-cover.is-header-image:first-of-type,
  body.home .entry-content > .wp-block-cover.is-header-image:first-child {
    height: 660px !important;
    min-height: 660px !important;
  }
}

/* ============================================================
   15 – HOTFIX V9: STARTSEITEN-HERO NÄHER AN LIVE-HTML
   ============================================================
   Stand nach v8 / Live-Vergleich:
   - Header, Logo und Menü sitzen gut und bleiben unverändert.
   - Der Startseiten-Hero muss optisch wieder wie die HTML-Seite wirken:
     volle Breite, höher, kein Container-Rand, Claim links unten.
   - Die Live-HTML-Seite zeigt im Inspector eine Hero-Bildhöhe von ca. 495px
     bei reduzierter DevTools-Breite. Auf großen Desktopbreiten darf der
     Hero deshalb moderat höher laufen.
   ============================================================ */

@media (min-width: 840px) {
  body.home,
  body.home #page,
  body.home .site,
  body.home .site-content,
  body.home #content,
  body.home #primary,
  body.home main,
  body.home .site-main,
  body.home article,
  body.home .entry-content {
    overflow-x: clip !important;
  }

  body.home .site-content,
  body.home #content,
  body.home #primary,
  body.home main,
  body.home .site-main,
  body.home article,
  body.home .entry-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  body.home .entry-content > .wp-block-cover.is-header-image:first-child,
  body.home .entry-content > .wp-block-cover.alignfull.is-header-image:first-child,
  body.home .site-main .wp-block-cover.is-header-image:first-of-type,
  body.home main .wp-block-cover.is-header-image:first-of-type,
  body.home .wp-block-cover.alignfull.is-header-image:first-of-type,
  body.home .wp-block-cover.is-header-image:first-of-type {
    box-sizing: border-box !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 100vw !important;
    height: clamp(500px, 30vw, 560px) !important;
    min-height: clamp(500px, 30vw, 560px) !important;
    max-height: none !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    padding: 0 !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    overflow: hidden !important;
    aspect-ratio: auto !important;
  }

  body.home .wp-block-cover.is-header-image:first-of-type > picture,
  body.home .wp-block-cover.is-header-image:first-of-type > img.wp-block-cover__image-background,
  body.home .wp-block-cover.is-header-image:first-of-type .wp-block-cover__image-background,
  body.home .wp-block-cover.is-header-image:first-of-type video.wp-block-cover__video-background {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  body.home .wp-block-cover.is-header-image:first-of-type .wp-block-cover__background,
  body.home .wp-block-cover.is-header-image:first-of-type::before {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }

  body.home .wp-block-cover.is-header-image:first-of-type .wp-block-cover__inner-container {
    box-sizing: border-box !important;
    position: relative !important;
    z-index: 2 !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 4.2rem 6.1rem 4.2rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-end !important;
    text-align: left !important;
  }

  body.home .wp-block-cover.is-header-image:first-of-type h1,
  body.home .wp-block-cover.is-header-image:first-of-type h2,
  body.home .wp-block-cover.is-header-image:first-of-type .wp-block-heading {
    max-width: 900px !important;
    margin: 0 0 1.45rem 0 !important;
    font-size: clamp(4.15rem, 3vw, 5.55rem) !important;
    line-height: 1.15 !important;
    letter-spacing: -0.025em !important;
    text-align: left !important;
  }

  body.home .wp-block-cover.is-header-image:first-of-type .wp-block-button__link {
    font-size: 1.45rem !important;
    line-height: 1.2 !important;
    padding: 1.1rem 2.05rem !important;
  }

  body.home .wp-block-cover.is-header-image:first-of-type + *,
  body.home .entry-content > .wp-block-cover.is-header-image:first-child + * {
    margin-top: 0 !important;
    padding-top: clamp(6.7rem, 5vw, 8.4rem) !important;
  }
}

@media (min-width: 1600px) {
  body.home .wp-block-cover.is-header-image:first-of-type,
  body.home .entry-content > .wp-block-cover.is-header-image:first-child {
    height: 560px !important;
    min-height: 560px !important;
  }
}

@media (min-width: 2200px) {
  body.home .wp-block-cover.is-header-image:first-of-type,
  body.home .entry-content > .wp-block-cover.is-header-image:first-child {
    height: 590px !important;
    min-height: 590px !important;
  }
}

@media (max-width: 839px) {
  body.home .wp-block-cover.is-header-image:first-of-type,
  body.home .entry-content > .wp-block-cover.is-header-image:first-child {
    min-height: 460px !important;
  }
}