/* ============================================
   Navigation / Header
   ============================================ */

/* Header fixieren – bleibt beim Scrollen oben */
header {
	position: fixed;
	width: 100%;
	z-index: 999;
}

/* Inhalt nach unten schieben, damit er nicht unter dem fixierten Header verschwindet */
main {
	overflow: hidden;
	padding-top: 10rem !important;
	margin-top:0rem!important;
}

/* Aktueller Menüpunkt hervorheben */
.current-menu-item a.wp-block-navigation-item__content {
	color: #222482 !important;
}

/* ============================================
   CTA Buttons – Hover
   ============================================ */

/* --- Ausgefüllt (fill) – Hover --- */
.wp-block-button.is-style-fill .wp-block-button__link:hover,
.wp-block-button.is-style-fill .wp-block-button__link:focus {
	background-color: #222482;
	color: #ffffff;
	border-color: #222482;
}

/* --- Umriss (outline) – Hover --- */
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:focus {
	background-color: #f6f6f6;
	color: #191A6C;
	border-color: #191A6C;
}

/* Aktueller Menüpunkt hervorheben */
.current-menu-item a.wp-block-navigation-item__content {
	text-decoration: underline;
	text-decoration-color: #CDA721;
	text-underline-offset: 8px;
	text-decoration-thickness: 3px !important;
}

footer .current-menu-item a.wp-block-navigation-item__content {
	color: #ffffff !important;
}

/* Hover über einen Menüpunkt */
a.wp-block-navigation-item__content:hover {
	text-decoration: underline;
	text-decoration-color: #CDA721;
	text-underline-offset: 8px;
	text-decoration-thickness: 3px !important;
}

/* Untermenü-Punkte – nur Farbe */
.wp-block-navigation-submenu a.wp-block-navigation-item__content {
	color: #191A6C!important;
}

/* Versatz für Sprungmarken (wegen fixiertem Header) */
:target {
	scroll-margin-top: 7rem;
}

strong{
	font-weight: 600;
}


/* POLAROID IMAGE LOOK */


/* Bild-Block mit Polaroid-Look + Farbfläche im Hintergrund */
.wp-block-image.polaroid-image {
  position: relative;
  display: inline-block;
  max-width: 100%;
  margin: 2rem;
  isolation: isolate;
}

/* Farbfläche im Hintergrund */
/* Gutenberg Bild-Block mit Polaroid-Look */
.wp-block-image.polaroid-img {
  --polaroid-bg: #9cf7a0;
  --polaroid-rotation: -2deg;
  --polaroid-padding: 14px;

  position: relative;
  display: inline-block;
  margin: 2rem;
  isolation: isolate;
}

/* Farbfläche im Hintergrund */
.wp-block-image.polaroid-img::before {
  content: "";
  position: absolute;
  top: 18%;
  right: -22%;
  width: 65%;
  height: 42%;
  background: var(--polaroid-bg);
  z-index: -1;
}

/* Bild im Polaroid-Stil */
.wp-block-image.polaroid-img img {
  display: block;
  width: 100%;
  height: auto;
  box-sizing: border-box;

  padding: var(--polaroid-padding);
  background: #fff;

  transform: rotate(var(--polaroid-rotation));
  box-shadow: 0 18px 35px rgba(0, 0, 0, 0.18);

  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

/* Rectangles */

/* gelbes Parallelogramm im Hintergrund */
.wp-block-group.rect-yellow {
  position: relative;
}

.wp-block-group.rect-yellow::before {
  content: "";
  position: absolute;

  top: clamp(-6rem, -5vw, -1.5rem);
  left: clamp(-4rem, -4vw, -0.75rem);

  width: clamp(120px, 16vw, 220px);
  height: clamp(220px, 28vw, 360px);

  background: #eadb9b;
  clip-path: polygon(0 0, 55% 0, 100% 88%, 0 75%);

  z-index: -1;
  pointer-events: none;
}

/* Mobile etwas dezenter */
@media (max-width: 767px) {
  .wp-block-group.rect-yellow::before {
    top: clamp(-2rem, -6vw, -1rem);
    left: clamp(-1.5rem, -5vw, -0.5rem);

    width: clamp(95px, 32vw, 140px);
    height: clamp(180px, 52vw, 240px);
  }
}

/* dezentes grünes Rechteck im Hintergrund */
/* dezentes grünes Rechteck im Hintergrund */
.wp-block-group.rect-green {
  position: relative;
  overflow: visible;
}

/* Inhalt über das Rechteck legen */
.wp-block-group.rect-green > * {
  position: relative;
  z-index: 1;
}

.wp-block-group.rect-green::before {
  content: "";
  position: absolute;

  top: clamp(2rem, 5vw, 5rem);
  left: clamp(0.25rem, 2vw, 2rem);

  width: clamp(22px, 2.5vw, 38px);
  height: clamp(300px, 42vw, 600px);

  background: rgba(223, 233, 223, 0.85);

  transform: rotate(-2deg);
  transform-origin: top left;

  z-index: 0;
  pointer-events: none;
}

/* Tablet */
@media (max-width: 1024px) {
  .wp-block-group.rect-green::before {
    top: clamp(1.5rem, 4vw, 3rem);
    left: clamp(0.25rem, 2vw, 1rem);

    height: clamp(260px, 46vw, 480px);
  }
}

/* Mobile */
@media (max-width: 767px) {
  .wp-block-group.rect-green::before {
    top: 1rem;
    left: 0.25rem;

    width: clamp(16px, 5vw, 24px);
    height: clamp(200px, 58vw, 320px);

    opacity: 0.65;
  }
}