:root {
  --paper: #f3e6cf;
  --ink: #1a1410;
  --graphite: #6a5a4a;
  --moss: #1f6a3a;
  --gold: #e8b31a;
  --mushroom: #c41e1e;
  --leaf: #fffdf6;
}

html { scroll-behavior: smooth; }

body {
  margin: 0;
  color: var(--ink);
  background-color: var(--paper);
  background-image:
    url("stars-field.svg"),
    radial-gradient(circle at 8% 12%, rgba(232, 179, 26, 0.09), transparent 26%),
    radial-gradient(circle at 92% 80%, rgba(31, 106, 58, 0.08), transparent 30%);
  background-repeat: repeat, no-repeat, no-repeat;
  background-size: 900px auto, 100% 100%, 100% 100%;
}

/* Footer bleibt unten, auch bei kurzen Seiten */
.wp-site-blocks {
  padding: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.wp-site-blocks > main,
.wp-site-blocks > *:not(header):not(footer) {
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* Einzelwerk */
.werkblatt .wp-block-post-featured-image img {
  width: 100%;
  aspect-ratio: 4 / 5;
  height: auto;
  object-fit: cover;
  object-position: center 38%;
  border: 2px solid var(--ink);
  background: var(--leaf);
}

.werkblatt .wp-block-post-terms {
  color: var(--graphite);
  margin: 1em 0 1.4em;
  display: block;
}

.werkblatt .wp-block-post-terms a { color: var(--graphite); }

a { text-decoration-thickness: 1px; text-underline-offset: 0.22em; }

/* Header like a notebook rule */
header .wp-block-group.alignfull {
  background: transparent;
  border-bottom: 2px solid var(--ink) !important;
}

.wp-block-site-title a {
  background-image: url("ornament-star.svg");
  background-repeat: no-repeat;
  background-size: 0.85em;
  background-position: right 0.15em;
  padding-right: 1.15em;
}

.wp-block-navigation a,
.wp-block-navigation-item__content {
  font-family: "Shantell Sans", cursive;
  padding: 0 0.2em;
}

.wp-block-navigation .current-menu-item > a {
  background: none;
  box-shadow: inset 0 -2px 0 var(--gold);
}

/* Mobiles Overlay-Menü */
.wp-block-navigation__responsive-container.is-menu-open {
  background-color: var(--paper) !important;
  color: var(--ink) !important;
  padding: clamp(20px, 6vw, 40px) !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
  align-items: flex-start !important;
  justify-content: flex-start !important;
  padding-top: clamp(28px, 9vw, 56px);
  width: 100%;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
  gap: 2px !important;
  align-items: flex-start !important;
  width: 100%;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
  font-size: clamp(1.6rem, 9vw, 2.3rem) !important;
  padding: 6px 0 !important;
}

.wp-block-navigation__responsive-container.is-menu-open .current-menu-item > a {
  box-shadow: inset 0 -3px 0 var(--gold);
}

.wp-block-navigation__responsive-container-close,
.wp-block-navigation__responsive-container-open {
  color: var(--ink) !important;
}

.wp-block-navigation__responsive-container-close {
  top: clamp(20px, 6vw, 40px) !important;
  right: clamp(20px, 6vw, 40px) !important;
}

/* Cover = title page, compact */
.wp-block-cover.is-wald-cover {
  position: relative;
  min-height: clamp(420px, 66vh, 620px) !important;
  padding: 0 !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  border-bottom: 2px solid var(--ink);
  overflow: hidden;
}

.wp-block-cover.is-wald-cover .wp-block-cover__image-background,
.wp-block-cover.is-wald-cover > img {
  position: absolute !important;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 42%;
}

.wp-block-cover.is-wald-cover .wp-block-cover__inner-container {
  position: relative;
  z-index: 2;
  flex: 0 0 auto !important;
  width: min(540px, 86vw) !important;
  max-width: min(540px, 86vw) !important;
  margin: 0 0 clamp(18px, 3.5vh, 38px) clamp(20px, 4vw, 32px) !important;
  background: var(--paper);
  border: 2px solid var(--ink);
  padding: 1.1rem 1.3rem 1rem;
  color: var(--ink) !important;
}

.wp-block-cover.is-wald-cover .wp-block-cover__inner-container h1,
.wp-block-cover.is-wald-cover .wp-block-cover__inner-container p,
.wp-block-cover.is-wald-cover .wp-block-cover__inner-container a {
  color: var(--ink) !important;
  text-shadow: none;
}

.wp-block-cover.is-wald-cover .wp-block-cover__inner-container .handnote {
  color: var(--graphite) !important;
}

.wp-block-cover.is-wald-cover h1 {
  font-size: clamp(2.1rem, 5.2vw, 4rem) !important;
  margin: 0.1em 0 0.35em;
}

.wp-block-cover.is-wald-cover p:not(.handnote) {
  font-size: 1.02rem;
  margin: 0 0 0.9em;
}

p + .handnote { margin-top: 0.9em !important; }

/* Seitentitel im Inhalt etwas ruhiger als die Titelseite */
main h1.wp-block-heading {
  font-size: clamp(1.9rem, 3.4vw, 2.9rem);
  margin-bottom: 0.5em;
}

.handnote {
  font-family: "Shantell Sans", cursive !important;
  font-size: 0.92rem !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  color: var(--graphite);
  /* nur vertikal setzen - sonst fällt die Auto-Zentrierung des Layouts weg */
  margin-block: 0 0.3em !important;
}

/* Images as drawings, not cards */
.wp-block-image img,
.wp-block-post-featured-image img,
.wp-block-cover img,
.wp-block-video video {
  border-radius: 0 !important;
}

.wp-block-image.is-style-zeichenblatt img {
  border: 2px solid var(--ink);
  background: var(--leaf);
}

.wp-block-image figcaption,
.wp-element-caption {
  font-family: "Shantell Sans", cursive;
  color: var(--graphite);
  text-align: left;
  margin-top: 0.45rem;
  font-size: 0.9rem;
}

/* Buttons = drawn labels */
.wp-element-button,
.wp-block-button__link,
.wp-block-button .wp-block-button__link,
a.wp-block-button__link {
  border-radius: 0 !important;
  border: 2px solid var(--ink) !important;
  background: var(--paper) !important;
  color: var(--ink) !important;
  box-shadow: 3px 3px 0 var(--ink);
  font-family: "Shantell Sans", cursive !important;
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link {
  background: var(--gold) !important;
}

.wp-element-button:hover {
  transform: translate(1px, 1px);
  box-shadow: 2px 2px 0 var(--ink);
}

/* Three plates */
.platten .wp-block-column:nth-child(2) { transform: translateY(26px); }

.platten img {
  aspect-ratio: 4 / 5;
  height: auto;
  width: 100%;
  object-fit: cover;
  object-position: center 48%;
  border: 2px solid var(--ink);
  background: var(--leaf);
  filter: contrast(1.06) saturate(1.05);
}

.platten .wp-block-column:nth-child(3) img { object-position: center 38%; }

/* Diptych: graphite vs colour */
.diptych {
  border-top: 2px solid var(--ink);
  border-bottom: 2px solid var(--ink);
  margin-bottom: 0 !important;
}

.diptych .wp-block-column { background: #ded0b4; }
.diptych .wp-block-column:last-child { background: #e9f1e2; }

.diptych .wp-block-column {
  padding: clamp(18px, 3vw, 34px) clamp(14px, 3vw, 30px);
}

.diptych figure {
  margin: 0 auto !important;
  max-width: 420px;
}

.diptych img {
  aspect-ratio: 3 / 4;
  height: auto;
  width: 100%;
  object-fit: cover;
  object-position: center 34%;
  border: 2px solid var(--ink);
  display: block;
}

.diptych .wp-block-column:first-child img {
  filter: grayscale(1) contrast(1.6) brightness(1.02);
  object-position: center 30%;
}

.diptych figcaption {
  padding: 0;
  margin: 0.5rem 0 0 !important;
}

/* Kolophon */
.kolophon img {
  aspect-ratio: 4 / 5;
  height: auto;
  width: 100%;
  object-fit: cover;
  object-position: center 40%;
}

.notizliste {
  list-style: none;
  padding: 0;
  margin: 0.2em 0 1em;
  font-size: 0.98rem;
}

.notizliste li {
  padding: 0.3em 0;
  border-bottom: 1px dotted rgba(26, 20, 16, 0.25);
}

.notizliste li strong { font-family: "Shantell Sans", cursive; font-weight: 600; }

.wp-block-separator.is-style-wide {
  border: 0;
  border-top: 2px solid var(--ink);
  margin: 1.1em 0 0.6em;
}

/* Making-of video */
.entstehung {
  border-top: 2px solid var(--ink);
  background: #16341f;
  color: var(--paper);
}

.entstehung h2,
.entstehung p { color: var(--paper); }

.entstehung .handnote { color: #cbb98f; }

.entstehung .wp-block-video,
.entstehung figure {
  margin: 0;
}

.entstehung video {
  width: 100%;
  max-height: 62vh;
  border: 2px solid var(--paper);
  background: #0e1f13;
  display: block;
}

.entstehung figcaption,
.entstehung .wp-element-caption { color: #cbb98f; }

/* Quote as a clearing */
.wp-block-quote {
  border: 0 !important;
  padding: 26px 0 0 !important;
  position: relative;
}

.wp-block-quote p {
  font-family: "Young Serif", serif;
  margin: 0;
}

.lichtung {
  max-width: none;
}

.lichtung .wp-block-quote {
  max-width: 46ch;
  margin-inline: auto !important;
  text-align: left;
}

.wp-block-quote cite {
  display: block;
  font-family: "Shantell Sans", cursive;
  font-style: normal;
  font-size: 0.85rem;
  color: var(--graphite);
  margin-top: 0.8em;
}

.wp-block-quote:before {
  content: "";
  position: absolute;
  width: 22px;
  height: 22px;
  left: 0;
  top: 0;
  background: url("ornament-star.svg") center / contain no-repeat;
}

/* Gallery / query */
.wp-block-query .wp-block-post-featured-image img {
  aspect-ratio: 4 / 5;
  height: auto;
  width: 100%;
  object-fit: cover;
  object-position: center 38%;
  border: 2px solid var(--ink);
  background: var(--leaf);
  /* hebt die flauen Handyfotos leicht an, bis Scans da sind */
  filter: contrast(1.06) saturate(1.05);
}

.wp-block-query .wp-block-post-title {
  font-family: "Shantell Sans", cursive;
  font-size: 1.12rem;
  padding: 8px 0 0;
  margin: 0;
}

.wp-block-query .wp-block-post-excerpt {
  font-size: 0.94rem;
  color: var(--graphite);
  padding: 0;
  margin: 0.2em 0 0;
}

.wp-block-query .wp-block-post-excerpt__more-text { display: none; }

/* Night footer */
footer .wp-block-group.alignfull {
  border-top: 2px solid var(--ink);
}

footer p { margin: 0; }

.fusszeile-links a {
  color: inherit;
  text-decoration-color: rgba(243, 230, 207, 0.5);
}

.fusszeile-links a:hover { text-decoration-color: var(--gold); }

/* Forms */
.wpcf7 { max-width: 640px; }

.zettel-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 18px;
}

.zettel-feld { margin: 0 0 14px; }

.zettel-feld label {
  display: block;
  font-family: "Shantell Sans", cursive;
  font-size: 0.88rem;
  color: var(--graphite);
  margin-bottom: 4px;
}

.wpcf7 input,
.wpcf7 textarea,
.wpcf7 select {
  width: 100%;
  border: 2px solid var(--ink);
  background: var(--leaf);
  border-radius: 0;
  padding: 10px 12px;
  font-family: inherit;
  font-size: 1rem;
  box-sizing: border-box;
}

.wpcf7 textarea { resize: vertical; }

.wpcf7 input:focus,
.wpcf7 textarea:focus,
.wpcf7 select:focus {
  outline: none;
  box-shadow: 3px 3px 0 var(--gold);
}

.zettel-senden { margin: 6px 0 0; }

.wpcf7-not-valid-tip {
  font-family: "Shantell Sans", cursive;
  font-size: 0.82rem;
  color: var(--mushroom);
}

.wpcf7-response-output {
  border: 2px solid var(--ink) !important;
  background: var(--leaf);
  font-family: "Shantell Sans", cursive;
  margin: 14px 0 0 !important;
  padding: 10px 12px !important;
}

@media (max-width: 600px) {
  .zettel-grid { grid-template-columns: 1fr; }
}

.wpcf7-submit {
  background: var(--gold) !important;
  color: var(--ink) !important;
  border: 2px solid var(--ink) !important;
  border-radius: 0 !important;
  box-shadow: 3px 3px 0 var(--ink);
  font-family: "Shantell Sans", cursive !important;
  width: auto !important;
}

@media (max-width: 781px) {
  .platten .wp-block-column:nth-child(2) { transform: none; }
  .platten img { aspect-ratio: 1 / 1; }
  .diptych figure { max-width: 260px; }
  .wp-block-cover.is-wald-cover {
    min-height: clamp(400px, 72vh, 560px) !important;
  }
  .wp-block-cover.is-wald-cover .wp-block-cover__inner-container {
    margin: 0 auto 4vh;
    width: 92vw;
  }
  .wp-block-cover.is-wald-cover h1 {
    font-size: clamp(1.75rem, 7.4vw, 2.4rem) !important;
  }
  .entstehung video { max-height: 52vh; }

  /* Galerie zweispaltig statt endlos untereinander */
  .wp-block-query .wp-block-post-template.is-layout-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 16px 14px !important;
  }
  .wp-block-query .wp-block-post-title { font-size: 0.98rem; }
  .wp-block-query .wp-block-post-excerpt { display: none; }
}