/*
Theme Name: Kalivanture
Theme URI: https://kalivanture.de
Author: Kalivanture
Description: Block-Theme für kalivanture.de in der Richtung „Werkstatt“: warm, handwerklich, nah am Showroom. Schriften Lora und Nunito Sans werden lokal ausgeliefert, das Theme lädt nichts von fremden Servern.
Version: 1.5.0
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kalivanture
Tags: block-patterns, full-site-editing, one-column, custom-colors, editor-style
*/

/* -------------------------------------------------------------------------
   Grundlagen
   Farben, Schriften und Abstände kommen aus theme.json. Hier steht nur,
   was theme.json nicht kann: Layouts der Patterns, Block-Stile, Details.
   ------------------------------------------------------------------------- */

:root {
  --kv-radius: 6px;
  --kv-shadow: 0 14px 34px -18px rgba(30, 42, 34, 0.45);
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 5rem;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6,
.wp-block-post-title {
  text-wrap: balance;
}

/* Kursiver Akzent in Überschriften: <em> wird zur zweiten Stimme */
h1 em, h2 em, h3 em,
.wp-block-post-title em {
  font-style: italic;
  font-weight: 500;
  color: var(--wp--preset--color--tanne);
}

.has-tanne-background-color h1 em,
.has-tanne-background-color h2 em,
.has-tanne-background-color h3 em {
  color: var(--wp--preset--color--salbei);
}

:focus-visible {
  outline: 3px solid var(--wp--preset--color--holz);
  outline-offset: 3px;
}

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

/* -------------------------------------------------------------------------
   Sektionen
   ------------------------------------------------------------------------- */

.kv-section {
  padding-block: var(--wp--preset--spacing--60);
}

.kv-section--eng {
  padding-block: var(--wp--preset--spacing--50);
}

.kv-section-head {
  margin-bottom: var(--wp--preset--spacing--40);
}

.kv-section-head p {
  margin: 0;
}

/* Kicker: kleine Versalzeile über Überschriften */
.is-style-kicker,
.kv-kicker {
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--wp--preset--color--holz);
}

.has-tanne-background-color .is-style-kicker,
.has-tanne-background-color .kv-kicker {
  color: var(--wp--preset--color--salbei);
}

/* -------------------------------------------------------------------------
   Header
   ------------------------------------------------------------------------- */

.kv-header {
  padding-block: 1rem;
  background: var(--wp--preset--color--kreide);
  border-bottom: 1px solid var(--wp--preset--color--linie);
}

.kv-header .wp-block-site-logo img {
  border-radius: 50%;
}

.kv-header .wp-block-navigation {
  gap: 1.75rem;
}

.kv-header .wp-block-navigation a:hover,
.kv-header .wp-block-navigation .current-menu-item > a {
  color: var(--wp--preset--color--tinte);
}

.kv-header__cta .wp-block-button__link {
  padding: 0.7rem 1.2rem;
  font-size: 0.9rem;
}

@media (max-width: 599px) {
  .kv-header__cta { display: none; }
}

/* -------------------------------------------------------------------------
   Buttons
   ------------------------------------------------------------------------- */

.wp-block-button__link {
  transition: background-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

.wp-block-button__link:hover {
  transform: translateY(-1px);
}

/* Textlink: sekundäre Aktion neben einem Button */
.wp-block-button.is-style-textlink .wp-block-button__link {
  background: transparent;
  color: var(--wp--preset--color--tanne);
  padding-inline: 0;
  padding-block: 0.4rem;
  border-radius: 0;
  border-bottom: 2px solid var(--wp--preset--color--tanne);
}

.wp-block-button.is-style-textlink .wp-block-button__link:hover {
  color: var(--wp--preset--color--holz);
  border-color: var(--wp--preset--color--holz);
  transform: none;
}

.has-tanne-background-color .wp-block-button.is-style-textlink .wp-block-button__link {
  color: var(--wp--preset--color--kreide);
  border-color: var(--wp--preset--color--salbei);
}

/* Umriss: ruhiger Button auf Fotos oder dunklem Grund */
.wp-block-button.is-style-umriss .wp-block-button__link {
  background: transparent;
  color: var(--wp--preset--color--tanne);
  border: 2px solid currentColor;
}

.wp-block-button.is-style-umriss .wp-block-button__link:hover {
  background: var(--wp--preset--color--tanne);
  color: var(--wp--preset--color--weiss);
}

.has-tanne-background-color .wp-block-button.is-style-umriss .wp-block-button__link {
  color: var(--wp--preset--color--kreide);
}

.has-tanne-background-color .wp-block-button.is-style-umriss .wp-block-button__link:hover {
  background: var(--wp--preset--color--kreide);
  color: var(--wp--preset--color--tanne);
}

/* -------------------------------------------------------------------------
   Hero
   ------------------------------------------------------------------------- */

.kv-hero {
  overflow: hidden;
  padding-block: var(--wp--preset--spacing--50) 0;
}

.kv-hero__cols {
  gap: clamp(1.5rem, 4vw, 4rem);
}

.kv-hero__text > * + * {
  margin-block-start: 1.4rem;
}

.kv-hero__text p {
  max-width: 34rem;
}

.kv-hero__media {
  position: relative;
  align-self: center;
}

.kv-hero__img {
  margin: 0;
}

.kv-hero__img img {
  width: 100%;
  aspect-ratio: 5 / 4;
  object-fit: cover;
  border-radius: var(--kv-radius);
}

.kv-hero__badge {
  position: absolute;
  left: 10%;
  bottom: 7%;
  max-width: 15rem;
  padding: 0.9rem 1.2rem;
  background: var(--wp--preset--color--kreide);
  border-radius: var(--kv-radius);
  box-shadow: 0 12px 30px rgba(30, 42, 34, 0.28);
}

.kv-hero__badge p {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.35;
}

.kv-hero__badge .kv-hero__badge-big {
  font-family: var(--wp--preset--font-family--lora);
  font-size: 1.6rem;
  font-weight: 500;
  color: var(--wp--preset--color--tanne);
  line-height: 1.1;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

@media (min-width: 782px) {
  .kv-hero {
    padding-block: 0;
  }

  .kv-hero__text {
    padding-block: var(--wp--preset--spacing--60);
  }

  .kv-hero__img img {
    aspect-ratio: 6 / 5;
    border-radius: 0;
    clip-path: polygon(9% 0, 100% 0, 100% 100%, 0 100%);
  }
}

/* -------------------------------------------------------------------------
   Vertrauensleiste
   ------------------------------------------------------------------------- */

.kv-vertrauen {
  padding-block: var(--wp--preset--spacing--40);
}

.kv-vertrauen p {
  margin: 0;
  font-size: 0.92rem;
  color: var(--wp--preset--color--salbei);
}

.kv-vertrauen p strong {
  display: block;
  margin-bottom: 0.15rem;
  font-size: 1.05rem;
  color: var(--wp--preset--color--weiss);
}

/* -------------------------------------------------------------------------
   Karten
   ------------------------------------------------------------------------- */

.wp-block-group.is-style-karte {
  background: var(--wp--preset--color--weiss);
  border: 1px solid var(--wp--preset--color--linie);
  border-radius: 8px;
  overflow: hidden;
  height: 100%;
}

.wp-block-group.is-style-karte > .wp-block-image {
  margin: 0;
}

.wp-block-group.is-style-karte > .wp-block-image img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.wp-block-group.is-style-karte > .wp-block-image.kv-karte__produkt img {
  object-fit: contain;
  background: var(--wp--preset--color--weiss);
  padding: 1rem;
}

.wp-block-group.is-style-karte > .wp-block-image.kv-karte__portrait img {
  aspect-ratio: 4 / 5;
}

.kv-karte__body {
  padding: 1.3rem 1.5rem 1.6rem;
}

.kv-karte__body > * {
  margin-block: 0;
}

.kv-karte__body > * + * {
  margin-block-start: 0.5rem;
}

.wp-block-group.is-style-karte h3 {
  font-size: 1.45rem;
}

.kv-spec {
  font-size: 0.9rem;
  color: var(--wp--preset--color--nebel);
}

.kv-preis {
  font-weight: 700;
  color: var(--wp--preset--color--tanne);
}

.kv-karte__body .wp-block-buttons {
  margin-top: 1rem;
}

/* Karte mit Rahmen, ohne Bild: für "Zwei Wege" */
.wp-block-group.is-style-karte.kv-karte--text {
  padding: 2rem 2rem 2.2rem;
  height: 100%;
}

.wp-block-group.is-style-karte.kv-karte--text > * {
  margin-block: 0;
}

.wp-block-group.is-style-karte.kv-karte--text > * + * {
  margin-block-start: 0.9rem;
}

/* Salbei-Fläche: leichte Betonung ohne Karte */
.wp-block-group.is-style-flaeche {
  background: color-mix(in srgb, var(--wp--preset--color--salbei) 28%, var(--wp--preset--color--kreide));
  border-radius: 8px;
  padding: 2rem;
}

/* -------------------------------------------------------------------------
   Listen
   ------------------------------------------------------------------------- */

.wp-block-list.is-style-checkliste {
  list-style: none;
  padding-left: 0;
}

.wp-block-list.is-style-checkliste li {
  position: relative;
  padding-left: 1.7rem;
  margin-bottom: 0.45rem;
}

.wp-block-list.is-style-checkliste li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.45em;
  width: 0.85rem;
  height: 0.45rem;
  border-left: 2.5px solid var(--wp--preset--color--holz);
  border-bottom: 2.5px solid var(--wp--preset--color--holz);
  transform: rotate(-45deg);
}

/* Nummerierte Schritte, für Abläufe (Anfrage, Übergabe, Rückgabe) */
.wp-block-list.is-style-schritte {
  list-style: none;
  padding-left: 0;
  counter-reset: kv-schritt;
}

.wp-block-list.is-style-schritte li {
  position: relative;
  padding-left: 3rem;
  margin-bottom: 1rem;
  counter-increment: kv-schritt;
}

.wp-block-list.is-style-schritte li::before {
  content: counter(kv-schritt);
  position: absolute;
  left: 0;
  top: -0.15rem;
  width: 2rem;
  height: 2rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--wp--preset--color--tanne);
  color: var(--wp--preset--color--kreide);
  font-family: var(--wp--preset--font-family--lora);
  font-size: 1rem;
}

/* -------------------------------------------------------------------------
   FAQ (Details-Block)
   ------------------------------------------------------------------------- */

.kv-faq .wp-block-details {
  margin: 0;
  padding-block: 1.1rem;
  border-top: 1px solid var(--wp--preset--color--linie);
}

.kv-faq .wp-block-details:last-child {
  border-bottom: 1px solid var(--wp--preset--color--linie);
}

.kv-faq .wp-block-details summary {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  cursor: pointer;
  list-style: none;
  font-family: var(--wp--preset--font-family--lora);
  font-size: 1.25rem;
  font-weight: 500;
}

.kv-faq .wp-block-details summary::-webkit-details-marker {
  display: none;
}

.kv-faq .wp-block-details summary::after {
  content: "+";
  flex: none;
  font-family: var(--wp--preset--font-family--nunito-sans);
  font-size: 1.4rem;
  line-height: 1;
  color: var(--wp--preset--color--holz);
}

.kv-faq .wp-block-details[open] summary::after {
  content: "−";
}

.kv-faq .wp-block-details > :not(summary) {
  margin-top: 0.8rem;
  color: var(--wp--preset--color--nebel);
  max-width: 62ch;
}

/* -------------------------------------------------------------------------
   Galerie
   ------------------------------------------------------------------------- */

.kv-galerie img {
  border-radius: var(--kv-radius);
}

/* -------------------------------------------------------------------------
   Kontakt
   ------------------------------------------------------------------------- */

.kv-kontakt .wp-block-columns {
  gap: clamp(1.5rem, 4vw, 4rem);
}

/* Kontaktwege: Zeilen mit Trennlinie, Bezeichnung klein, Wert groß */
.kv-kontakt__wege {
  margin-top: var(--wp--preset--spacing--40);
}

.kv-kontakt__wege p {
  position: relative;
  margin: 0;
  padding-block: 0.9rem;
  border-top: 1px solid var(--wp--preset--color--linie);
  line-height: 1.45;
}

.kv-kontakt__wege p:last-child {
  border-bottom: 1px solid var(--wp--preset--color--linie);
}

.kv-kontakt__wege p strong {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--wp--preset--color--nebel);
}

.kv-kontakt__wege a {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--wp--preset--color--tinte);
  text-decoration: none;
}

.kv-kontakt__wege a:hover,
.kv-kontakt__wege a:focus-visible {
  color: var(--wp--preset--color--holz);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

/* Icon im runden Feld, gewählt über die Klasse kv-weg--whatsapp, --telefon, --mail oder --ort */
.kv-kontakt__wege p[class*="kv-weg--"] {
  padding-left: 3.75rem;
}

.kv-kontakt__wege p[class*="kv-weg--"]::before,
.kv-kontakt__wege p[class*="kv-weg--"]::after {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 2.75rem;
  height: 2.75rem;
  transform: translateY(-50%);
}

.kv-kontakt__wege p[class*="kv-weg--"]::before {
  border-radius: 50%;
  background: var(--wp--preset--color--weiss);
  border: 1px solid var(--wp--preset--color--linie);
}

.kv-kontakt__wege p[class*="kv-weg--"]::after {
  background: var(--wp--preset--color--tanne);
  -webkit-mask: var(--kv-icon) center / 1.25rem no-repeat;
  mask: var(--kv-icon) center / 1.25rem no-repeat;
}

.kv-kontakt__wege p[class*="kv-weg--"]:has(a:hover)::before {
  border-color: var(--wp--preset--color--holz);
}

.kv-kontakt__wege p[class*="kv-weg--"]:has(a:hover)::after {
  background: var(--wp--preset--color--holz);
}

.kv-weg--whatsapp {
  --kv-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z'/%3E%3C/svg%3E");
}

.kv-weg--telefon {
  --kv-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.91.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
}

.kv-weg--mail {
  --kv-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 7-10 6L2 7'/%3E%3C/svg%3E");
}

.kv-weg--ort {
  --kv-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
}

/* Formularkarte: etwas abgehoben, Holzkante oben */
.wp-block-group.is-style-karte.kv-kontakt__formular {
  border-top: 4px solid var(--wp--preset--color--holz);
  box-shadow: var(--kv-shadow);
}

.kv-kontakt__formular-titel {
  font-size: var(--wp--preset--font-size--x-large);
}

.wp-block-group.is-style-karte.kv-karte--text.kv-kontakt__formular > .wp-block-shortcode,
.wp-block-group.is-style-karte.kv-karte--text.kv-kontakt__formular > .wpcf7,
.wp-block-group.is-style-karte.kv-karte--text.kv-kontakt__formular > .wp-block-contact-form-7-contact-form-selector {
  margin-block-start: 1.5rem;
}

/* Kontaktseite: Seitenkopf etwas enger an den Header */
.kv-kontakt--seite {
  padding-top: var(--wp--preset--spacing--50);
}

@media (min-width: 782px) {
  .kv-kontakt--seite .kv-kontakt__cols > .wp-block-column:first-child {
    position: sticky;
    top: 6rem;
    align-self: flex-start;
  }
}

/* Kontaktformular: Name und E-Mail nebeneinander */
@media (min-width: 600px) {
  .kv-kontakt .wpcf7 form:has([data-name="your-email"]):not(:has([data-name="your-prename"])) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 1rem;
  }

  .kv-kontakt .wpcf7 form:has([data-name="your-email"]):not(:has([data-name="your-prename"])) > * {
    grid-column: 1 / -1;
  }

  .kv-kontakt .wpcf7 form:has([data-name="your-email"]):not(:has([data-name="your-prename"])) > p:has([data-name="your-name"], [data-name="your-email"]) {
    grid-column: auto;
  }
}

/* Kontaktformular (Contact Form 7 plus Bild-Captcha-Plugin) */

.wpcf7 form,
.wpcf7 form *,
.wpcf7 form *::before,
.wpcf7 form *::after {
  box-sizing: border-box;
}

.wpcf7 form p {
  margin: 0 0 1rem;
}

.wpcf7 form label {
  display: block;
  margin: 0;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--wp--preset--color--nebel);
}

/* CF7 setzt nach dem Label-Text ein <br>, der Abstand kommt stattdessen vom Feld. */
.wpcf7 form label > br {
  display: none;
}

.wpcf7 form .wpcf7-form-control-wrap {
  display: block;
  margin-top: 0.35rem;
}

/* Nur echte Eingabefelder bekommen den Feld-Look, keine Checkbox-, Radio- oder Captcha-Container. */
.wpcf7 form :is(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="hidden"], [type="file"]), select, textarea).wpcf7-form-control {
  display: block;
  width: 100%;
  max-width: 100%;
  padding: 0.75rem 0.9rem;
  border: 1px solid var(--wp--preset--color--linie);
  border-radius: var(--kv-radius);
  background: var(--wp--preset--color--kreide);
  font: inherit;
  font-weight: 400;
  color: var(--wp--preset--color--tinte);
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.wpcf7 form textarea.wpcf7-form-control {
  height: 9rem;
  min-height: 6rem;
  resize: vertical;
}

.wpcf7 form :is(input, select, textarea).wpcf7-form-control:focus {
  outline: 2px solid var(--wp--preset--color--tanne);
  outline-offset: 1px;
  border-color: var(--wp--preset--color--tanne);
  background: var(--wp--preset--color--weiss);
}

/* Hinweistexte im Formular („Bitte beachten“, Datenschutz). */
.wpcf7 form > p:not(:has(label, .wpcf7-submit, .wpcf7-form-control-wrap)) {
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--wp--preset--color--nebel);
}

.wpcf7 form > p:not(:has(label, .wpcf7-submit, .wpcf7-form-control-wrap)) + p:not(:has(label, .wpcf7-submit, .wpcf7-form-control-wrap)) {
  margin-top: -0.6rem;
}

/* Zustimmung: Checkbox und Text in einer Zeile. */
.wpcf7 form label:has(.wpcf7-acceptance),
.wpcf7 form .wpcf7-acceptance .wpcf7-list-item label {
  display: inline-flex;
  flex-direction: row-reverse;
  align-items: center;
  gap: 0.6rem;
  font-size: 0.95rem;
  color: var(--wp--preset--color--tinte);
  cursor: pointer;
}

.wpcf7 form .wpcf7-form-control-wrap:has(.wpcf7-acceptance) {
  display: inline-block;
  margin-top: 0;
}

.wpcf7 form .wpcf7-acceptance .wpcf7-list-item {
  margin: 0;
}

.wpcf7 form input[type="checkbox"],
.wpcf7 form input[type="radio"] {
  width: 1.15rem;
  height: 1.15rem;
  margin: 0;
  accent-color: var(--wp--preset--color--tanne);
  cursor: pointer;
}

/* Bild-Captcha („wähle das Symbol …“) */
.wpcf7 form .captcha-image {
  display: block;
  width: 100%;
  padding: 0.9rem 1rem 0.6rem;
  border: 1px solid var(--wp--preset--color--linie);
  border-radius: var(--kv-radius);
  background: var(--wp--preset--color--kreide);
  font-size: 0.9rem;
  line-height: 1.45;
  color: var(--wp--preset--color--tinte);
  text-align: center;
}

.wpcf7 form .captcha-image .cf7ic_instructions {
  margin-bottom: 0.4rem;
}

.wpcf7 form .captcha-image > label {
  margin: 0 0.2rem !important;
  vertical-align: middle;
}

.wpcf7 form .captcha-image label > input + svg {
  width: 2.75rem;
  height: 2.75rem;
  padding: 0.6rem;
  border: 2px solid transparent;
  border-radius: var(--kv-radius);
  color: var(--wp--preset--color--tanne);
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

.wpcf7 form .captcha-image label:hover > input + svg {
  background: var(--wp--preset--color--weiss);
}

.wpcf7 form .captcha-image label > input:checked + svg,
.wpcf7 form .captcha-image label > input:focus-visible + svg {
  border-color: var(--wp--preset--color--holz);
  background: var(--wp--preset--color--weiss);
}

.wpcf7 form .captcha-image label > input:focus:not(:focus-visible):not(:checked) + svg {
  border-color: transparent;
}

/* Absenden */
.wpcf7 form .wpcf7-submit {
  display: inline-block;
  padding: 0.9rem 1.6rem;
  border: 0;
  border-radius: 4px;
  background: var(--wp--preset--color--holz);
  color: var(--wp--preset--color--weiss);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.wpcf7 form .wpcf7-submit:hover,
.wpcf7 form .wpcf7-submit:focus-visible {
  background: var(--wp--preset--color--tanne);
}

.wpcf7 form .wpcf7-submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.wpcf7 form p:has(.wpcf7-submit) {
  margin: 1.25rem 0 0;
}

/* Rückmeldungen */
.wpcf7 form .wpcf7-not-valid-tip {
  margin-top: 0.3rem;
  font-size: 0.8rem;
  font-weight: 400;
}

.wpcf7 form .wpcf7-response-output:empty {
  display: none;
}

.wpcf7 form .wpcf7-response-output {
  margin: 1rem 0 0;
  padding: 0.75rem 1rem;
  border-radius: var(--kv-radius);
  font-size: 0.9rem;
}

/* -------------------------------------------------------------------------
   Blog und Archive
   ------------------------------------------------------------------------- */

/* Einleitender Text unter Seitenüberschriften */
.kv-lead {
  max-width: 60ch;
  font-size: var(--wp--preset--font-size--large);
  line-height: 1.5;
  color: var(--wp--preset--color--nebel);
}

.kv-section-head .kv-lead {
  margin-top: 1rem;
}

.kv-blog__kopf {
  padding-bottom: var(--wp--preset--spacing--40);
  border-bottom: 1px solid var(--wp--preset--color--linie);
}

/* Raster: drei Spalten, darunter zwei, auf dem Handy eine */
.kv-beitraege .wp-block-post-template.is-layout-grid {
  gap: 1.75rem;
}

@media (min-width: 600px) and (max-width: 959px) {
  .kv-beitraege .wp-block-post-template.is-layout-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Karte. Die ganze Karte ist über den Titel-Link klickbar. */
.kv-beitraege .wp-block-post {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--wp--preset--color--weiss);
  border: 1px solid var(--wp--preset--color--linie);
  border-radius: 8px;
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.kv-beitraege .wp-block-post:hover,
.kv-beitraege .wp-block-post:focus-within {
  transform: translateY(-3px);
  border-color: var(--wp--preset--color--salbei);
  box-shadow: var(--kv-shadow);
}

/* Ohne Beitragsbild: Holzkante statt leerer Fläche */
.kv-beitraege .wp-block-post:not(:has(.wp-block-post-featured-image)) {
  border-top: 4px solid var(--wp--preset--color--holz);
}

.kv-beitraege .wp-block-post > * {
  margin: 0;
}

.kv-beitraege .wp-block-post-featured-image {
  overflow: hidden;
}

.kv-beitraege .wp-block-post-featured-image img {
  display: block;
  width: 100%;
  transition: transform 0.6s ease;
}

.kv-beitraege .wp-block-post:hover .wp-block-post-featured-image img {
  transform: scale(1.04);
}

.kv-beitrag__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 1.3rem 1.5rem 1.5rem;
}

.kv-beitrag__body > * {
  margin-block: 0;
}

.kv-beitrag__body > * + * {
  margin-block-start: 0.6rem;
}

/* Meta-Zeile: Kategorie · Datum · Lesezeit */
.kv-beitrag__meta.is-layout-flex {
  gap: 0.35rem 0;
  font-size: 0.82rem;
  color: var(--wp--preset--color--nebel);
}

.kv-beitrag__meta > * + *::before {
  content: "·";
  margin-inline: 0.55rem;
  color: var(--wp--preset--color--salbei);
}

.kv-beitrag__meta .wp-block-post-terms {
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.kv-beitrag__meta .wp-block-post-terms a {
  position: relative;
  z-index: 2;
  color: var(--wp--preset--color--holz);
  text-decoration: none;
}

.kv-beitrag__meta .wp-block-post-terms a:hover {
  color: var(--wp--preset--color--tanne);
}

.kv-beitraege .wp-block-post-title {
  font-size: 1.4rem;
  line-height: 1.25;
}

.kv-beitraege .wp-block-post-title a {
  color: inherit;
  text-decoration: none;
}

.kv-beitraege .wp-block-post-title a::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}

.kv-beitraege .wp-block-post:hover .wp-block-post-title a {
  color: var(--wp--preset--color--tanne);
}

.kv-beitraege .wp-block-post-excerpt {
  font-size: 0.95rem;
  color: var(--wp--preset--color--nebel);
}

.kv-beitraege .wp-block-post-excerpt__excerpt {
  margin: 0;
}

.kv-beitraege .wp-block-read-more {
  position: relative;
  z-index: 2;
  margin-top: auto;
  padding-top: 1rem;
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--wp--preset--color--holz);
  text-decoration: none;
}

.kv-beitraege .wp-block-read-more::after {
  content: "→";
  display: inline-block;
  margin-left: 0.35em;
  transition: transform 0.25s ease;
}

.kv-beitraege .wp-block-post:hover .wp-block-read-more::after {
  transform: translateX(4px);
}

/* Aufmacher: Auf der ersten Blogseite wird der neueste Beitrag groß gezeigt.
   Gibt es nur einen weiteren, liegt er gespiegelt darunter. */
@media (min-width: 782px) {
  body:not(.paged) .kv-beitraege--aufmacher .wp-block-post:first-child,
  body:not(.paged) .kv-beitraege--aufmacher .wp-block-post:nth-child(2):last-child {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
    align-items: stretch;
  }

  body:not(.paged) .kv-beitraege--aufmacher .wp-block-post:first-child .wp-block-post-featured-image img,
  body:not(.paged) .kv-beitraege--aufmacher .wp-block-post:nth-child(2):last-child .wp-block-post-featured-image img {
    height: 100% !important;
    min-height: 22rem;
  }

  body:not(.paged) .kv-beitraege--aufmacher .wp-block-post:first-child .kv-beitrag__body,
  body:not(.paged) .kv-beitraege--aufmacher .wp-block-post:nth-child(2):last-child .kv-beitrag__body {
    justify-content: center;
    padding: var(--wp--preset--spacing--50);
  }

  body:not(.paged) .kv-beitraege--aufmacher .wp-block-post:first-child .wp-block-post-title {
    font-size: clamp(1.8rem, 2.6vw, 2.4rem);
  }

  body:not(.paged) .kv-beitraege--aufmacher .wp-block-post:first-child .wp-block-post-excerpt {
    font-size: var(--wp--preset--font-size--medium);
  }

  body:not(.paged) .kv-beitraege--aufmacher .wp-block-post:first-child .wp-block-read-more {
    margin-top: 0.6rem;
  }

  body:not(.paged) .kv-beitraege--aufmacher .wp-block-post:nth-child(2):last-child {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr);
  }

  body:not(.paged) .kv-beitraege--aufmacher .wp-block-post:is(:first-child, :nth-child(2):last-child):not(:has(.wp-block-post-featured-image)) {
    grid-template-columns: minmax(0, 1fr);
  }

  body:not(.paged) .kv-beitraege--aufmacher .wp-block-post:nth-child(2):last-child .wp-block-post-featured-image {
    order: 2;
  }

  body:not(.paged) .kv-beitraege--aufmacher .wp-block-post:nth-child(2):last-child .wp-block-post-title {
    font-size: clamp(1.5rem, 2vw, 1.85rem);
  }

  body:not(.paged) .kv-beitraege--aufmacher .wp-block-post:nth-child(2):last-child .wp-block-read-more {
    margin-top: 0.6rem;
  }
}

.wp-block-query-pagination {
  margin-top: var(--wp--preset--spacing--50);
  font-weight: 700;
}

.wp-block-query-pagination a {
  text-decoration: none;
}

.wp-block-query-pagination-numbers .page-numbers {
  display: inline-grid;
  place-items: center;
  min-width: 2.4rem;
  height: 2.4rem;
  border-radius: 50%;
}

.wp-block-query-pagination-numbers .page-numbers.current {
  background: var(--wp--preset--color--tanne);
  color: var(--wp--preset--color--weiss);
}

/* Einzelner Beitrag */
.kv-artikel__kopf > * {
  margin-block: 0;
}

.kv-artikel__kopf > * + * {
  margin-block-start: 1.1rem;
}

.kv-artikel__zurueck.is-layout-flex {
  justify-content: space-between;
  gap: 0.5rem 1.5rem;
  font-size: 0.9rem;
}

.kv-artikel__zurueck p {
  margin: 0;
}

.kv-artikel__zurueck p a {
  font-weight: 700;
  color: var(--wp--preset--color--nebel);
  text-decoration: none;
}

.kv-artikel__zurueck p a:hover {
  color: var(--wp--preset--color--holz);
}

.kv-artikel__zurueck .wp-block-post-terms a {
  color: inherit;
  text-decoration: none;
}

.kv-artikel .wp-block-post-title {
  font-size: clamp(2.2rem, 5vw, 3.4rem);
  line-height: 1.1;
}

.kv-artikel .kv-beitrag__meta {
  font-size: 0.9rem;
}

.kv-artikel > .wp-block-post-featured-image {
  margin-top: var(--wp--preset--spacing--50);
}

.kv-artikel > .wp-block-post-featured-image img {
  border-radius: 8px;
}

/* Lesetext */
.kv-artikel__inhalt {
  margin-top: var(--wp--preset--spacing--50);
  font-size: 1.1rem;
  line-height: 1.75;
}

.kv-artikel__inhalt > h2 {
  margin-top: 2.6em;
  font-size: clamp(1.7rem, 3vw, 2.1rem);
}

.kv-artikel__inhalt > h3 {
  margin-top: 2.2em;
  font-size: 1.45rem;
}

.kv-artikel__inhalt > :is(h2, h3, h4) + * {
  margin-top: 0.8rem;
}

.kv-artikel__inhalt a {
  text-decoration-color: var(--wp--preset--color--holz);
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

.kv-artikel__inhalt li::marker {
  color: var(--wp--preset--color--holz);
}

.kv-artikel__inhalt li + li {
  margin-top: 0.35rem;
}

.kv-artikel__inhalt .wp-block-quote {
  margin-block: 2.2rem;
}

.kv-artikel__inhalt .wp-block-table {
  font-size: 0.95rem;
}

.kv-artikel__inhalt .wp-block-table table {
  border-collapse: collapse;
  width: 100%;
  background: var(--wp--preset--color--weiss);
}

.kv-artikel__inhalt .wp-block-table :is(th, td) {
  padding: 0.65rem 0.9rem;
  border: 1px solid var(--wp--preset--color--linie);
  text-align: left;
}

.kv-artikel__inhalt .wp-block-table thead {
  border-bottom: 0;
}

.kv-artikel__inhalt .wp-block-table th {
  background: var(--wp--preset--color--tanne);
  color: var(--wp--preset--color--kreide);
}

/* Mehr aus dem Blog */
.kv-weitere {
  background: var(--wp--preset--color--weiss);
  border-top: 1px solid var(--wp--preset--color--linie);
}

.kv-weitere:not(:has(.wp-block-post)) {
  display: none;
}

.kv-weitere .wp-block-post {
  background: var(--wp--preset--color--kreide);
}

.kv-weitere .wp-block-post-title {
  font-size: 1.25rem;
}

.kv-weitere .kv-section-head {
  gap: 1rem 2rem;
  margin-bottom: var(--wp--preset--spacing--40);
}

.kv-weitere__alle {
  margin: 0;
}

.kv-weitere__alle a {
  font-weight: 700;
  text-decoration: none;
}

@media (prefers-reduced-motion: reduce) {
  .kv-beitraege .wp-block-post,
  .kv-beitraege .wp-block-post-featured-image img,
  .kv-beitraege .wp-block-read-more::after {
    transition: none;
  }

  .kv-beitraege .wp-block-post:hover,
  .kv-beitraege .wp-block-post:focus-within,
  .kv-beitraege .wp-block-post:hover .wp-block-post-featured-image img {
    transform: none;
  }
}

/* -------------------------------------------------------------------------
   Footer
   ------------------------------------------------------------------------- */

.kv-footer {
  padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--40);
}

/* Endet die Seite mit einer grünen Sektion, ohne hellen Streifen, nur mit feiner Linie anschließen. */
main:has(.wp-block-post-content > .has-tanne-background-color:last-child) + .wp-block-template-part {
  margin-block-start: 0;
}

main:has(.wp-block-post-content > .has-tanne-background-color:last-child) + .wp-block-template-part .kv-footer {
  border-top: 1px solid rgba(243, 240, 232, 0.14);
}

.kv-footer p {
  margin: 0;
}

.kv-footer p + p {
  margin-top: 0.45rem;
}

.kv-footer a {
  color: var(--wp--preset--color--kreide);
  text-decoration: none;
}

.kv-footer a:hover {
  color: var(--wp--preset--color--salbei);
  text-decoration: underline;
}

.kv-footer .wp-block-site-logo img {
  border-radius: 50%;
}

.kv-footer__marke {
  font-family: var(--wp--preset--font-family--lora);
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--wp--preset--color--kreide);
}

.kv-footer__titel {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--wp--preset--color--salbei);
  margin-bottom: 0.9rem;
}

.kv-footer__leise {
  font-size: 0.85rem;
  color: var(--wp--preset--color--salbei);
}

.kv-footer__unten {
  margin-top: var(--wp--preset--spacing--50);
  padding-top: var(--wp--preset--spacing--30);
  border-top: 1px solid rgba(243, 240, 232, 0.18);
}

/* -------------------------------------------------------------------------
   Mietseite
   ------------------------------------------------------------------------- */

.kv-zeltkarte__kopf {
  align-items: flex-start;
  gap: 1rem;
}

.kv-zeltkarte__kopf > * {
  margin: 0;
}

.kv-preis--gross {
  font-family: var(--wp--preset--font-family--lora);
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.kv-preis--gross span {
  font-family: var(--wp--preset--font-family--nunito-sans);
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--wp--preset--color--nebel);
  margin-left: 0.15rem;
}

.kv-zeltkarte .kv-karte__body .wp-block-list {
  margin-top: 0.9rem;
}

.kv-hinweis {
  margin-top: var(--wp--preset--spacing--40);
  font-size: 0.9rem;
  color: var(--wp--preset--color--nebel);
  max-width: 70ch;
}

.wp-block-group.is-style-flaeche.kv-karte--text > * {
  margin-block: 0;
}

.wp-block-group.is-style-flaeche.kv-karte--text > * + * {
  margin-block-start: 1rem;
}

.wp-block-group.is-style-flaeche .is-style-schritte li::before {
  background: var(--wp--preset--color--holz);
}

/* Fahrzeiten-Liste auf dunklem Grund */
.kv-orte {
  padding: 1.6rem 1.8rem;
  border: 1px solid rgba(243, 240, 232, 0.18);
  border-radius: 8px;
}

.kv-orte p {
  margin: 0;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding-block: 0.7rem;
  border-top: 1px solid rgba(243, 240, 232, 0.14);
}

.kv-orte p:first-child {
  border-top: 0;
  padding-top: 0;
}

.kv-orte p strong {
  font-weight: 700;
}

.kv-orte p span {
  color: var(--wp--preset--color--salbei);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.kv-orte__titel {
  display: block;
  padding-bottom: 0.6rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--wp--preset--color--salbei);
}

.has-tanne-background-color .kv-faq .wp-block-details {
  border-color: rgba(243, 240, 232, 0.18);
}

.kv-cta {
  border-top: 1px solid var(--wp--preset--color--linie);
}

/* -------------------------------------------------------------------------
   Zelt-Detailseiten (Little Bamboo, Willow Pro)
   ------------------------------------------------------------------------- */

/* Hero mit freigestelltem Produktfoto: weiße Bühne statt schräger Bildkante */
.kv-hero--produkt .kv-hero__media {
  padding-block: var(--wp--preset--spacing--40);
}

.kv-hero--produkt .kv-hero__img img,
.kv-hero--produkt .kv-hero__img img[style] {
  aspect-ratio: 1 / 1;
  object-fit: contain;
  padding: clamp(1rem, 4vw, 2.5rem);
  background: var(--wp--preset--color--weiss);
  border: 1px solid var(--wp--preset--color--linie);
  border-radius: 8px;
  clip-path: none;
}

.kv-hero--produkt .kv-hero__badge {
  left: 1.25rem;
  bottom: calc(var(--wp--preset--spacing--40) + 1.25rem);
}

.kv-hero--produkt .kv-hero__badge .kv-hero__badge-big {
  word-spacing: -0.08em;
}

.kv-hero__badge .kv-hero__badge-big span {
  margin-left: 0.15rem;
  font-family: var(--wp--preset--font-family--nunito-sans);
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--wp--preset--color--nebel);
}

@media (min-width: 782px) {
  .kv-hero--produkt .kv-hero__img img {
    aspect-ratio: 5 / 4;
  }
}

/* Eckdaten: Bezeichnung klein oben, Wert groß darunter */
.kv-fakten p {
  display: flex;
  flex-direction: column-reverse;
  gap: 0.2rem;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.kv-fakten p strong {
  margin: 0;
  word-spacing: -0.08em;
  font-family: var(--wp--preset--font-family--lora);
  font-size: 1.35rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  font-variant-numeric: tabular-nums;
}

.kv-details {
  gap: clamp(1.5rem, 4vw, 4rem);
}

/* Galerie als ruhiges Raster: erstes Bild groß, die übrigen quadratisch daneben und darunter */
.kv-galerie .wp-block-gallery.has-nested-images {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
  margin: 0;
}

.kv-galerie .wp-block-gallery.has-nested-images figure.wp-block-image {
  width: auto !important;
  margin: 0 !important;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: var(--kv-radius);
  background: var(--wp--preset--color--weiss);
}

.kv-galerie .wp-block-gallery.has-nested-images figure.wp-block-image:first-child {
  grid-column: span 2;
  grid-row: span 2;
}

.kv-galerie .wp-block-gallery.has-nested-images figure.wp-block-image img {
  width: 100%;
  height: 100% !important;
  object-fit: cover;
  border-radius: 0;
}

@media (max-width: 599px) {
  .kv-galerie .wp-block-gallery.has-nested-images {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
  }

  .kv-galerie .wp-block-gallery.has-nested-images figure.wp-block-image:first-child,
  .kv-galerie .wp-block-gallery.has-nested-images figure.wp-block-image:nth-child(even):last-child {
    grid-column: span 2;
    grid-row: span 1;
    aspect-ratio: 2 / 1;
  }
}

@media (max-width: 781px) {
  .kv-fakten .wp-block-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem 1rem;
  }

  .kv-fakten p {
    font-size: 0.7rem;
  }

  .kv-fakten p strong {
    font-size: 1.1rem;
  }
}

/* Buchungsformular: zusammengehörige Felder nebeneinander */
@media (min-width: 600px) {
  .wpcf7 form:has([data-name="your-prename"]) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 1rem;
  }

  .wpcf7 form:has([data-name="your-prename"]) > * {
    grid-column: 1 / -1;
  }

  .wpcf7 form:has([data-name="your-prename"]) > p:has([data-name="your-prename"], [data-name="your-name"], [data-name="your-city"], [data-name="your-zip"], [data-name="date-start"], [data-name="date-end"]) {
    grid-column: auto;
  }
}

.kv-anfrage .wp-block-columns {
  gap: clamp(1.5rem, 4vw, 4rem);
}

.kv-anfrage .is-style-flaeche {
  margin-top: var(--wp--preset--spacing--40);
}

.kv-anfrage .is-style-flaeche h3 {
  font-size: 1.35rem;
}

.kv-anfrage .is-style-flaeche .wp-block-list {
  margin-bottom: 0;
}

.kv-anfrage + .kv-cta {
  border-top: 0;
}

.kv-anfrage .is-style-flaeche a,
.kv-details .kv-spec a {
  color: inherit;
}

/* -------------------------------------------------------------------------
   Editor
   ------------------------------------------------------------------------- */

.editor-styles-wrapper .kv-hero__badge {
  position: static;
  margin-top: 1rem;
  max-width: none;
}

/* -------------------------------------------------------------------------
   Sektionen im Seiteninhalt immer über die volle Breite
   Seiten, die mit einer älteren Fassung der Patterns gespeichert wurden, haben
   Sektionen ohne „Volle Breite“. Die würden sonst auf die Textbreite (760px)
   schrumpfen und ihre breiten Spalten gleich mit. Wirkt vorne und im Editor.
   ------------------------------------------------------------------------- */

:is(.wp-block-post-content, .is-root-container).has-global-padding > :is(.kv-section, .kv-section--eng):not(.alignfull, .alignwide, .alignleft, .alignright) {
  max-width: none;
  margin-left: calc(var(--wp--style--root--padding-left) * -1) !important;
  margin-right: calc(var(--wp--style--root--padding-right) * -1) !important;
}
