/* =============================================
   LADY M – GESTALTUNG DER SEITENINHALTE (Baukasten)
   Gilt für die Webseite UND den Block-Editor.

   Idee: ruhige, einheitliche Struktur mit viel Luft.
   Erkennungsmerkmal: Bilder im Bogenformat mit feiner,
   versetzter Goldlinie (Stil "Bogen mit Goldlinie").
   Schriften und Farben: unverändert (siehe variables.css).
   ============================================= */

:root {
  --lm-gutter: clamp(1.25rem, 5vw, 2.5rem);          /* Seitenrand */
  --lm-section: clamp(3.75rem, 8vw, 6.5rem);          /* Abstand oben/unten je Abschnitt */
  --lm-section-tight: clamp(2.75rem, 5vw, 4rem);
  /* Farben (Gold, Mokka …) stehen zentral in css/variables.css */
}

/* ---------- Seiten-Rahmen ---------- */
.lm-content {
  padding-inline: var(--lm-gutter);
  padding-bottom: 0;
  overflow-x: clip;
}

/* Abschnitte über die volle Breite: ohne Lücken aneinander */
.lm-content > .alignfull {
  margin-left: calc(var(--lm-gutter) * -1) !important;
  margin-right: calc(var(--lm-gutter) * -1) !important;
  margin-block: 0;
  max-width: none;
  width: auto;
}

.wp-block-group.alignfull {
  padding: var(--lm-section) var(--lm-gutter);
}

.lm-content > :not(.alignfull):first-child {
  margin-top: var(--lm-section);
}

.lm-content > :not(.alignfull):last-child {
  margin-bottom: var(--lm-section);
}

/* ---------- Flächen ---------- */
.wp-block-group.is-style-lm-white {
  background: var(--white);
}

.wp-block-group.is-style-lm-dark {
  background: var(--lm-mokka-deep);
  color: rgba(255, 255, 255, 0.72);
}

.wp-block-group.is-style-lm-dark :is(h1, h2, h3, h4) {
  color: var(--white);
}

.wp-block-group.is-style-lm-dark p {
  color: rgba(255, 255, 255, 0.72);
}

.wp-block-group.is-style-lm-card {
  background: var(--white);
  border: 1px solid var(--light);
  padding: clamp(1.75rem, 4vw, 3rem);
}

/* Seitenkopf (oben auf jeder Seite) */
.wp-block-group.lm-page-head {
  text-align: center;
  padding-top: clamp(3.5rem, 8vw, 5.75rem);
  padding-bottom: clamp(2.75rem, 6vw, 4rem);
}

/* Folgt direkt ein Abschnitt mit gleichem (beigem) Hintergrund, braucht er oben keinen
   zweiten Abstand. Abschnitte mit eigener Fläche (weiß, Mokka, Kernpunkte) behalten ihn. */
.wp-block-group.lm-page-head + .wp-block-group.alignfull:not(.is-style-lm-white):not(.is-style-lm-dark):not(.is-style-lm-usp) {
  padding-top: 0;
}

/* Abschnitt mit wenig Abstand (z. B. direkt nach einem anderen) */
.wp-block-group.lm-tight {
  padding-top: var(--lm-section-tight);
  padding-bottom: var(--lm-section-tight);
}

/* ---------- Schrift ---------- */
.lm-content :where(h1, h2, h3, h4),
.wp-block-heading {
  font-family: 'Cormorant Garamond', serif;
  color: var(--dark);
  letter-spacing: 0;
  margin: 0 0 1rem;
}

.lm-content h1,
h1.wp-block-heading {
  font-weight: 300;
  font-style: italic;
  font-size: clamp(2.4rem, 5.2vw, 3.7rem);
  line-height: 1.1;
}

.lm-content h2,
h2.wp-block-heading {
  font-weight: 400;
  font-size: clamp(1.85rem, 3.4vw, 2.6rem);
  line-height: 1.18;
}

.lm-content h3,
h3.wp-block-heading {
  font-weight: 500;
  font-size: 1.45rem;
  line-height: 1.3;
}

.wp-block-heading.is-style-lm-display {
  font-weight: 300;
  font-style: italic;
  font-size: clamp(2.6rem, 6vw, 4.2rem);
  line-height: 1.05;
}

.lm-content p,
.lm-content li {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.9rem;
  line-height: 1.95;
  color: var(--mid);
}

.lm-content p {
  margin: 0 0 1rem;
}

.lm-content a:not(.wp-block-button__link):not(.kmc-btn):not(.bk-modal-cta):not(.lm-marquee__link) {
  color: var(--dark);
  text-decoration: underline;
  text-decoration-color: var(--gold);
  text-underline-offset: 0.25em;
}

.lm-content a:not(.wp-block-button__link):not(.kmc-btn):not(.bk-modal-cta):not(.lm-marquee__link):hover {
  color: var(--gold);
}

/* Kleine Überschrift (Gold) */
p.is-style-lm-eyebrow {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--gold) !important;
  line-height: 1.6;
  margin: 0 0 0.9rem;
}

/* Einleitung: Cormorant aufrecht, ruhig und elegant (auf allen Seiten gleich) */
p.is-style-lm-lead {
  font-family: 'Cormorant Garamond', serif;
  font-style: normal;
  font-weight: 500;
  font-size: clamp(1.1rem, 1.45vw, 1.24rem);
  line-height: 1.7;
  letter-spacing: 0.005em;
  color: var(--lm-text-warm);
  max-width: 38rem;
}

p.is-style-lm-lead.has-text-align-center,
.has-text-align-center.is-style-lm-lead {
  margin-left: auto;
  margin-right: auto;
}

.lm-page-head p.is-style-lm-lead {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0;
}

/* ---------- Goldlinie ---------- */
hr.wp-block-separator.is-style-lm-gold {
  width: 3rem;
  max-width: 3rem;
  border: 0;
  border-top: 1px solid var(--gold);
  height: 0;
  opacity: 1;
  margin: 1.5rem auto;
  background: none;
}

.wp-block-column hr.wp-block-separator.is-style-lm-gold {
  margin-left: 0;
}

/* ---------- Buttons ---------- */
.wp-block-buttons {
  gap: 0.9rem;
  margin-top: 1.75rem;
}

.wp-block-button__link,
.wp-block-button .wp-block-button__link.wp-element-button {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  line-height: 1.4;
  padding: 1.05rem 2.4rem;
  border-radius: 0;
  border: 1px solid var(--gold);
  background: var(--gold);
  color: var(--white);
  text-decoration: none;
  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

.wp-block-button__link:hover,
.wp-block-button__link:focus-visible {
  background: var(--lm-gold-dark);
  border-color: var(--lm-gold-dark);
  color: var(--white);
}

.wp-block-button.is-style-lm-dark .wp-block-button__link {
  background: var(--lm-mokka);
  border-color: var(--lm-mokka);
}

.wp-block-button.is-style-lm-dark .wp-block-button__link:hover {
  background: var(--gold);
  border-color: var(--gold);
}

.wp-block-button.is-style-lm-outline .wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent;
  border-color: var(--lm-mokka);
  color: var(--lm-mokka-deep);
}

.wp-block-button.is-style-lm-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: var(--lm-mokka);
  border-color: var(--lm-mokka);
  color: var(--white);
}

.is-style-lm-dark .wp-block-button.is-style-lm-outline .wp-block-button__link {
  border-color: rgba(255, 255, 255, 0.6);
  color: var(--white);
}

.is-style-lm-dark .wp-block-button.is-style-lm-outline .wp-block-button__link:hover {
  background: var(--white);
  color: var(--dark);
}

:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 3px;
}

/* ---------- Bilder ---------- */
.wp-block-image {
  margin: 0 0 1rem;
}

.wp-block-image img {
  display: block;
  height: auto;
}

.wp-block-image figcaption,
.wp-block-image .wp-element-caption {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 1rem;
  color: var(--mid);
  text-align: center;
  margin-top: 1rem;
}

/* Bogen mit Goldlinie – das Lady-M-Erkennungsmerkmal */
.wp-block-image.is-style-lm-arch {
  position: relative;
  isolation: isolate;
  max-width: 440px;
  margin-left: auto;
  margin-right: auto;
}

.wp-block-image.is-style-lm-arch img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: 1000px 1000px 0 0;
}

.wp-block-image.is-style-lm-arch::before {
  content: '';
  position: absolute;
  z-index: -1;
  top: 14px;
  left: 14px;
  width: 100%;
  aspect-ratio: 4 / 5;
  border: 1px solid var(--gold);
  border-radius: 1000px 1000px 0 0;
  pointer-events: none;
}

.wp-block-image.is-style-lm-soft img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
}

/* ---------- Bild & Text nebeneinander ---------- */
.wp-block-columns.is-style-lm-split {
  gap: clamp(2.5rem, 7vw, 6rem);
  margin-bottom: 0;
}

.wp-block-columns.is-style-lm-split + .wp-block-columns.is-style-lm-split {
  margin-top: var(--lm-section);
}

.wp-block-columns.is-style-lm-split .wp-block-column > :last-child {
  margin-bottom: 0;
}

/* ---------- Galerie (versetzt) ---------- */
.wp-block-gallery.is-style-lm-staggered {
  --wp--style--unstable-gallery-gap: 1.25rem;
  gap: 1.25rem;
  padding-bottom: 3rem;
}

.wp-block-gallery.is-style-lm-staggered figure.wp-block-image {
  flex-direction: column !important;
}

.wp-block-gallery.is-style-lm-staggered figure.wp-block-image img {
  aspect-ratio: 3 / 4;
  object-fit: cover;
  height: auto !important;
  width: 100%;
}

.wp-block-gallery.is-style-lm-staggered figure.wp-block-image:nth-child(even) {
  transform: translateY(3rem);
}

.wp-block-gallery.is-style-lm-staggered figure.wp-block-image figcaption {
  position: static !important;
  background: none !important;
  color: var(--mid) !important;
  padding: 0.75rem 0 0 !important;
  max-height: none !important;
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 1rem !important;
  text-shadow: none !important;
}

/* ---------- Schlagwörter (z. B. Marken) ---------- */
.wp-block-list.is-style-lm-chips {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.6rem;
  max-width: 760px;
}

.wp-block-list.is-style-lm-chips li {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.66rem;
  line-height: 1.4;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--mid);
  padding: 0.6rem 1.1rem;
  border: 1px solid var(--light);
  background: var(--white);
  margin: 0;
}

.is-style-lm-dark .wp-block-list.is-style-lm-chips li {
  color: rgba(255, 255, 255, 0.68);
  border-color: rgba(255, 255, 255, 0.16);
  background: transparent;
}

/* ---------- Baustein: Handschrift ---------- */
.lm-handwriting {
  margin: 0.25rem auto 0;
}

/* ---------- Baustein: Kontaktdaten ---------- */
.lm-contact-list {
  margin: 0;
  display: grid;
  gap: 1.25rem;
}

.lm-contact-row dt {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 0.3rem;
}

.lm-contact-row dd {
  margin: 0;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.88rem;
  line-height: 1.8;
  color: var(--dark);
}

.lm-contact-row dd a {
  color: var(--dark) !important;
  text-decoration: none !important;
  border-bottom: 1px solid var(--light);
}

.lm-contact-row dd a:hover {
  border-bottom-color: var(--gold);
}

.lm-social {
  display: flex;
  gap: 0.6rem;
  margin-top: 1.75rem;
}

.lm-social a {
  width: 40px;
  height: 40px;
  border: 1px solid var(--light);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--dark) !important;
  text-decoration: none !important;
  transition: border-color 0.25s, color 0.25s;
}

.lm-social a:hover {
  border-color: var(--gold);
  color: var(--gold) !important;
}

.lm-social svg {
  width: 17px;
  height: 17px;
}

/* ---------- Baustein: Karte ---------- */
.lm-map {
  position: relative;
  margin-bottom: 2rem;
}

.lm-map-badge {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--dark);
  margin-bottom: 0.75rem;
}

.lm-map-badge svg {
  color: var(--gold);
  flex-shrink: 0;
}

.lm-map iframe {
  width: 100%;
  height: 340px;
  border: 1px solid var(--light);
  display: block;
}

.kontakt-map-consent {
  height: 340px;
  border: 1px solid var(--light);
  background:
    radial-gradient(circle at 50% 42%, rgba(201, 169, 110, 0.10), transparent 60%),
    repeating-linear-gradient(45deg, #f4f1ec 0 14px, #f7f4f0 14px 28px);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 1.5rem;
}

.kmc-inner {
  max-width: 340px;
}

.kmc-title {
  font-family: 'Cormorant Garamond', serif !important;
  font-style: italic;
  font-size: 1.4rem !important;
  color: var(--dark) !important;
  margin: 0 0 0.5rem !important;
  line-height: 1.3 !important;
}

.kmc-text {
  font-size: 0.72rem !important;
  line-height: 1.65 !important;
  margin: 0 0 1.1rem !important;
}

.kmc-btn {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.66rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--white);
  background: var(--gold);
  border: none;
  padding: 0.85rem 1.8rem;
  cursor: pointer;
  transition: background 0.25s ease;
}

.kmc-btn:hover,
.kmc-btn:focus-visible {
  background: var(--lm-gold-dark);
}

.kmc-link {
  display: block;
  margin-top: 0.8rem;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.64rem;
  letter-spacing: 0.06em;
  color: var(--mid) !important;
}

/* ---------- Baustein: Info-Punkt ---------- */
.lm-info {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 1.1rem;
  align-items: start;
  margin-bottom: 1.5rem;
}

.lm-info-icon {
  width: 44px;
  height: 44px;
  border: 1px solid var(--gold);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gold);
}

.lm-info-icon svg {
  width: 19px;
  height: 19px;
}

p.lm-info-title {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 0.68rem !important;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--dark) !important;
  margin: 0.15rem 0 0.35rem !important;
  line-height: 1.6 !important;
}

p.lm-info-text {
  font-size: 0.84rem !important;
  line-height: 1.8 !important;
  margin: 0 !important;
}

/* ---------- Baustein: Termin-Formular in einer Karte ---------- */
.lm-form {
  width: 100%;
}

/* ---------- Kleider-Galerie: leerer Zustand ---------- */
.bk-empty {
  text-align: center;
  padding: 3rem 1rem;
  font-family: 'Cormorant Garamond', serif !important;
  font-style: italic;
  font-size: 1.2rem !important;
}

/* ---------- Hinweise, die nur Admins/der Editor sehen ---------- */
.lm-editor-note {
  background: #fff8e8;
  border: 1px dashed var(--gold);
  padding: 1rem 1.25rem;
  margin: 1rem 0;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.78rem;
  line-height: 1.6;
  color: var(--dark);
}

/* =============================================
   HANDY & TABLET
   ============================================= */
@media (max-width: 781px) {
  /* Bild immer über dem Text – egal ob es am Desktop links oder rechts steht */
  .wp-block-columns.is-style-lm-split > .wp-block-column:has(> .wp-block-image, > .lm-salon) {
    order: -1;
  }

  .wp-block-columns.is-style-lm-split {
    gap: 2.75rem;
  }

  .wp-block-image.is-style-lm-arch {
    max-width: min(78%, 360px);
  }

  .wp-block-image.is-style-lm-arch::before {
    top: 10px;
    left: 10px;
  }

  .lm-map iframe,
  .kontakt-map-consent {
    height: 300px;
  }
}

@media (max-width: 599px) {
  .wp-block-gallery.is-style-lm-staggered {
    padding-bottom: 1.75rem;
  }

  .wp-block-gallery.is-style-lm-staggered figure.wp-block-image:nth-child(even) {
    transform: translateY(1.75rem);
  }

  .wp-block-buttons {
    flex-direction: column;
    align-items: stretch;
  }

  .wp-block-buttons .wp-block-button {
    width: 100%;
  }

  .wp-block-buttons .wp-block-button__link {
    width: 100%;
    text-align: center;
  }
}

/* =============================================
   ABSCHNITTS-VARIANTEN
   ============================================= */

/* Zwei Spalten oben auf einer Seite (Kontakt, Termin) */
.wp-block-group.lm-page-head-cols {
  padding-top: clamp(3.5rem, 8vw, 5.5rem);
}

.wp-block-columns.lm-two-col {
  align-items: flex-start !important;
  gap: clamp(2.5rem, 6vw, 5rem);
}

.wp-block-columns.lm-two-col > .wp-block-column {
  align-self: flex-start;
}

.wp-block-columns.lm-two-col h1.wp-block-heading {
  font-size: clamp(2.3rem, 4.4vw, 3.3rem);
}

/* Aufruf (z. B. "Termin vereinbaren") */
.wp-block-group.lm-cta {
  text-align: center;
  border-top: 1px solid var(--light);
}

.wp-block-group.lm-cta + footer,
.wp-block-group.lm-cta:last-child {
  border-bottom: 0;
}

/* Kleider-Abschnitt */
.wp-block-group.lm-dresses {
  padding-top: var(--lm-section-tight);
}

.wp-block-group.lm-dresses > .lm-dress-gallery,
.wp-block-group.lm-dresses > .bk-collections {
  max-width: var(--wp--style--global--wide-size, 1160px) !important;
}

@media (max-width: 781px) {
  .wp-block-columns.lm-two-col {
    gap: 3rem;
  }
}

/* Letzter Abschnitt vor dem Footer: etwas weniger Luft */
.lm-content > .alignfull:last-child {
  padding-bottom: clamp(3.25rem, 6vw, 5rem);
}

/* Einleitung in Text-Abschnitten: gleiche Breite wie der übrige Text */
.wp-block-group:not(.lm-page-head):not(.lm-cta) > p.is-style-lm-lead:not(.has-text-align-center) {
  max-width: var(--wp--style--global--content-size, 720px);
}

.wp-block-column p.is-style-lm-lead {
  max-width: none;
}

/* Einleitung neben einem Bild: schlicht – nur wenig größer als der Fließtext */
.wp-block-column p.is-style-lm-lead {
  font-size: clamp(1.04rem, 1.15vw, 1.12rem);
  line-height: 1.75;
  margin-bottom: 1.15rem;
}

/* =============================================
   KLEIDER-GALERIE IM NEUEN DESIGN
   ============================================= */
.lm-dress-gallery.bk-collections {
  max-width: none;
  padding: 0;
}

.lm-dress-gallery .bk-collection {
  margin-top: 0;
}

.lm-dress-gallery .bk-coll-title {
  font-size: clamp(1.85rem, 3.4vw, 2.6rem) !important;
  font-weight: 400 !important;
  font-style: normal;
  margin-bottom: 0;
}

.lm-dress-gallery .bk-coll-line {
  width: 3rem;
  opacity: 1;
  margin: 1.5rem auto clamp(2.25rem, 5vw, 3.25rem);
}

.lm-dress-gallery .bk-grid {
  gap: clamp(2.25rem, 4vw, 3.25rem) clamp(1rem, 2.5vw, 2rem);
}

.lm-dress-gallery .bk-card {
  background: transparent;
  border: 0;
  overflow: visible;
}

.lm-dress-gallery .bk-card:hover {
  transform: none;
  box-shadow: none;
}

.lm-dress-gallery .bk-card-img {
  background: var(--light);
}

.lm-dress-gallery .bk-card:hover .bk-card-img img {
  transform: scale(1.03);
}

.lm-dress-gallery .bk-card-info {
  padding: 1rem 0 0;
  text-align: center;
}

.lm-dress-gallery p.bk-card-name {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 1.3rem;
  line-height: 1.3;
  color: var(--dark);
  margin: 0;
}

.lm-dress-gallery .bk-card-brand {
  margin-bottom: 0.3rem;
}

@media (max-width: 781px) {
  .lm-dress-gallery .bk-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem 0.9rem;
  }

  .lm-dress-gallery p.bk-card-name {
    font-size: 1.1rem;
  }
}

/* Handy: Kontakt/Termin-Einleitung mittig – wie auf allen anderen Seiten */
@media (max-width: 781px) {
  .wp-block-columns.lm-two-col > .wp-block-column:first-child {
    text-align: center;
  }

  .wp-block-columns.lm-two-col > .wp-block-column:first-child hr.wp-block-separator.is-style-lm-gold {
    margin-left: auto;
    margin-right: auto;
  }

  .wp-block-columns.lm-two-col > .wp-block-column:first-child .lm-social {
    justify-content: center;
  }
}

/* =============================================
   Rechtliches: Impressum & Datenschutzerklärung
   ruhig, gut lesbar, mit nummerierten Abschnitten
   ============================================= */
.wp-block-group.lm-legal {
  counter-reset: lm-legal;
  padding-bottom: var(--lm-section);
}

.lm-legal h1,
.lm-page-head h1 {
  hyphens: auto;
  -webkit-hyphens: auto;
}

.lm-legal h2.wp-block-heading {
  counter-increment: lm-legal;
  position: relative;
  font-size: clamp(1.5rem, 2.6vw, 1.85rem);
  margin: clamp(2.5rem, 5vw, 3.25rem) 0 0.9rem;
  padding-top: 1.4rem;
  border-top: 1px solid var(--light);
  scroll-margin-top: 110px;
  hyphens: auto;
  -webkit-hyphens: auto;
}

.lm-legal h2.wp-block-heading::before {
  content: counter(lm-legal, decimal-leading-zero);
  display: block;
  margin-bottom: 0.35rem;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  color: var(--gold);
}

.lm-legal p,
.lm-legal li {
  font-size: 0.86rem;
  line-height: 1.9;
  overflow-wrap: anywhere;
  hyphens: auto;
  -webkit-hyphens: auto;
}

.lm-legal a {
  overflow-wrap: anywhere;
}

/* Inhaltsverzeichnis */
.wp-block-group.lm-legal-toc-box {
  background: var(--white);
  border: 1px solid var(--light);
  border-top: 2px solid var(--gold);
  padding: clamp(1.4rem, 3.5vw, 2rem) clamp(1.4rem, 3.5vw, 2.25rem);
  margin-top: 0;
}

.lm-legal-toc-box p.is-style-lm-eyebrow {
  margin-bottom: 0.8rem;
}

ul.is-style-lm-legal-toc {
  list-style: none;
  margin: 0;
  padding: 0;
  columns: 2;
  column-gap: 2.5rem;
  counter-reset: lm-toc;
}

ul.is-style-lm-legal-toc li {
  counter-increment: lm-toc;
  break-inside: avoid;
  margin: 0;
  padding: 0.2rem 0;
  line-height: 1.6;
}

ul.is-style-lm-legal-toc li::before {
  content: counter(lm-toc, decimal-leading-zero);
  display: inline-block;
  width: 2rem;
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: var(--gold);
}

.lm-content ul.is-style-lm-legal-toc a {
  color: var(--dark);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color 0.2s;
}

.lm-content ul.is-style-lm-legal-toc a:hover,
.lm-content ul.is-style-lm-legal-toc a:focus-visible {
  border-bottom-color: var(--gold);
}

/* Häkchen-Liste "Das Wichtigste in Kürze" */
ul.is-style-lm-legal-check {
  list-style: none;
  margin: 0 0 1rem;
  padding: 0;
}

ul.is-style-lm-legal-check li {
  position: relative;
  padding: 0.55rem 0 0.55rem 2.1rem;
  border-bottom: 1px solid var(--light);
}

ul.is-style-lm-legal-check li:last-child {
  border-bottom: 0;
}

ul.is-style-lm-legal-check li::before {
  content: "";
  position: absolute;
  left: 0.25rem;
  top: 1.05rem;
  width: 0.95rem;
  height: 0.5rem;
  border-left: 1.5px solid var(--gold);
  border-bottom: 1.5px solid var(--gold);
  transform: rotate(-45deg);
}

/* Angaben-Karte (Anbieter, Kontakt, Steuer …) */
.lm-legal-details {
  background: var(--white);
  border: 1px solid var(--light);
  border-top: 2px solid var(--gold);
  padding: 0.4rem clamp(1.4rem, 3.5vw, 2.25rem);
  margin: 0 0 1.25rem;
}

.lm-legal-row {
  display: grid;
  grid-template-columns: minmax(8.5rem, 30%) 1fr;
  gap: 0.4rem 1.5rem;
  padding: 1.15rem 0;
  border-bottom: 1px solid var(--light);
}

.lm-legal-row:last-child {
  border-bottom: 0;
}

.lm-content p.lm-legal-label,
p.lm-legal-label {
  margin: 0.2rem 0 0;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.6rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  line-height: 1.6;
  text-transform: uppercase;
  color: var(--gold);
  hyphens: auto;
  -webkit-hyphens: auto;
}

.lm-legal-value {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.88rem;
  line-height: 1.85;
  color: var(--dark);
  overflow-wrap: anywhere;
}

.lm-legal-value p {
  margin: 0 0 0.5rem;
  color: var(--dark);
}

.lm-legal-value strong {
  font-weight: 600;
}

.lm-content .lm-legal-value a {
  color: var(--dark);
}

/* Nur für Admins: fehlende Pflichtangabe */
.lm-content p.lm-legal-missing,
p.lm-legal-missing {
  margin: 0.75rem 0;
  padding: 0.75rem 1rem;
  background: #fff4f2;
  border-left: 3px solid #c0503c;
  font-size: 0.78rem;
  line-height: 1.6;
  color: #7a2a1d;
}

.lm-legal-missing span {
  opacity: 0.75;
  font-size: 0.7rem;
}

@media (max-width: 600px) {
  ul.is-style-lm-legal-toc {
    columns: 1;
  }

  .lm-legal-row {
    grid-template-columns: 1fr;
    gap: 0.15rem;
    padding: 1rem 0;
  }
}

/* =============================================
   Einblend-Effekte beim Scrollen (js/reveal.js)
   Auswahl: Design → Anpassen → Lady M Theme → Einblend-Effekt
   nur aktiv, wenn <html> die Klasse "lm-reveal-on" hat
   ============================================= */
html.lm-reveal-on:not(.lm-reveal--none) .lm-content :is(.wp-block-image.is-style-lm-arch, .wp-block-image.is-style-lm-soft, .wp-block-gallery .wp-block-image) img {
  opacity: 0;
  transition:
    opacity 1.4s cubic-bezier(0.25, 0.1, 0.25, 1) var(--lm-reveal-delay, 0s),
    scale 2.2s cubic-bezier(0.2, 0.7, 0.2, 1) var(--lm-reveal-delay, 0s),
    filter 1.6s ease var(--lm-reveal-delay, 0s);
}

html.lm-reveal-on:not(.lm-reveal--none) .lm-content :is(.wp-block-image.is-style-lm-arch, .wp-block-image.is-style-lm-soft, .wp-block-gallery .wp-block-image).is-inview img {
  opacity: 1;
  scale: 1;
  filter: none;
}

/* 1) Sanft einblenden – nur Deckkraft (Standard) */

/* 2) Einblenden mit leichtem Zoom */
html.lm-reveal--zoom .lm-content .lm-reveal:not(.is-inview) img {
  scale: 1.045;
}

/* 3) Aus der Unschärfe */
html.lm-reveal--blur .lm-content .lm-reveal:not(.is-inview) img {
  filter: blur(14px);
}

/* 4) Aus dem Licht (wie durch einen hellen Schleier) */
html.lm-reveal--light .lm-content .lm-reveal:not(.is-inview) img {
  filter: brightness(1.55) saturate(0.55) contrast(0.85);
}

html.lm-reveal-on.lm-reveal--light .lm-content :is(.wp-block-image.is-style-lm-arch, .wp-block-image.is-style-lm-soft, .wp-block-gallery .wp-block-image) img {
  transition:
    opacity 1.1s ease var(--lm-reveal-delay, 0s),
    filter 2.2s cubic-bezier(0.25, 0.1, 0.25, 1) var(--lm-reveal-delay, 0s);
}

/* Goldene Linie der Bogen-Bilder: blendet kurz nach dem Bild ein */
html.lm-reveal-on:not(.lm-reveal--none) .lm-content .wp-block-image.is-style-lm-arch::before {
  opacity: 0;
  transition: opacity 1.2s ease 0.6s;
}

html.lm-reveal-on:not(.lm-reveal--none) .lm-content .wp-block-image.is-style-lm-arch.is-inview::before {
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  html.lm-reveal-on .lm-content .wp-block-image img,
  html.lm-reveal-on .lm-content .wp-block-image::before {
    opacity: 1 !important;
    scale: none !important;
    filter: none !important;
    transition: none !important;
  }
}

/* =============================================
   Handschrift · Goldlinie mit Herz · Persönlicher Abschluss im Bogen
   ============================================= */
p.is-style-lm-script,
.lm-content p.is-style-lm-script {
  font-family: 'Great Vibes', cursive;
  font-style: normal;
  font-weight: 400;
  font-size: clamp(2.3rem, 4.6vw, 3.3rem);
  line-height: 1.15;
  letter-spacing: 0;
  color: var(--lm-mokka-deep);
  margin: 0 0 0.6rem;
}

hr.wp-block-separator.is-style-lm-heart {
  width: min(220px, 70%);
  height: 18px;
  margin: 0.4rem auto 1.4rem;
  border: 0;
  opacity: 1;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 20.5s-7.5-4.6-7.5-10.2A4.3 4.3 0 0 1 12 7.4a4.3 4.3 0 0 1 7.5 2.9c0 5.6-7.5 10.2-7.5 10.2z' fill='none' stroke='%23c9a96e' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E") center / 18px 18px no-repeat,
    linear-gradient(var(--gold), var(--gold)) left center / calc(50% - 18px) 1px no-repeat,
    linear-gradient(var(--gold), var(--gold)) right center / calc(50% - 18px) 1px no-repeat;
}

/* Abschnitt mit dem Bogen */
.wp-block-group.is-style-lm-letter {
  padding-top: var(--lm-section);
  padding-bottom: var(--lm-section);
  background:
    radial-gradient(ellipse at 50% 0%, rgba(201, 169, 110, 0.10), transparent 60%),
    var(--cream);
}

/* Die Karte: oben rund wie ein Torbogen, mit versetzter Goldlinie */
.wp-block-group.lm-letter-card {
  position: relative;
  isolation: isolate;
  max-width: 640px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: clamp(5rem, 10vw, 7rem) clamp(1.5rem, 6vw, 4rem) clamp(2.5rem, 5vw, 3.5rem);
  text-align: center;
  background: var(--white);
  border-radius: 320px 320px 0 0;
  box-shadow: 0 24px 60px rgba(78, 63, 53, 0.08);
}

.wp-block-group.lm-letter-card::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 14px -14px -14px 14px;
  border: 1px solid var(--gold);
  border-radius: 320px 320px 0 0;
  pointer-events: none;
}

.lm-letter-card p.is-style-lm-lead {
  margin-left: auto;
  margin-right: auto;
  max-width: 30rem;
}

.lm-letter-card .wp-block-buttons {
  justify-content: center;
  margin-top: 2rem;
}

@media (max-width: 600px) {
  .wp-block-group.lm-letter-card {
    border-radius: 200px 200px 0 0;
    padding-top: 4.5rem;
    margin-right: 10px !important;
  }

  .wp-block-group.lm-letter-card::before {
    border-radius: 200px 200px 0 0;
    inset: 10px -10px -10px 10px;
  }

  .lm-letter-card .wp-block-buttons {
    flex-direction: column;
    align-items: stretch;
  }
}

.lm-letter-card .wp-block-button__link {
  min-width: 16rem;
  text-align: center;
}

/* =============================================
   Seitentitel: Einblenden beim Laden der Seite
   (kleine Überschrift → Titel → Goldlinie → Einleitung)
   ============================================= */
@keyframes lmHeadUp {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: none; }
}

@keyframes lmHeadTitle {
  from { opacity: 0; transform: translateY(28px); filter: blur(6px); }
  to   { opacity: 1; transform: none; filter: none; }
}

@keyframes lmLineGrow {
  from { opacity: 0; transform: scaleX(0); }
  to   { opacity: 1; transform: scaleX(1); }
}

.lm-content :is(.lm-page-head, .lm-page-head-cols .wp-block-column:first-child) > p.is-style-lm-eyebrow {
  animation: lmHeadUp 0.9s cubic-bezier(0.2, 0.7, 0.2, 1) 0.1s both;
}

.lm-content :is(.lm-page-head, .lm-page-head-cols .wp-block-column:first-child) > :is(h1, h2).wp-block-heading {
  animation: lmHeadTitle 1.1s cubic-bezier(0.2, 0.7, 0.2, 1) 0.25s both;
}

.lm-content :is(.lm-page-head, .lm-page-head-cols .wp-block-column:first-child) > hr.wp-block-separator {
  transform-origin: center;
  animation: lmLineGrow 0.9s cubic-bezier(0.65, 0, 0.35, 1) 0.65s both;
}

.lm-content .lm-page-head-cols .wp-block-column:first-child > hr.wp-block-separator {
  transform-origin: left center;
}

.lm-content :is(.lm-page-head, .lm-page-head-cols .wp-block-column:first-child) > p.is-style-lm-lead,
.lm-content :is(.lm-page-head, .lm-page-head-cols .wp-block-column:first-child) > p:not(.is-style-lm-eyebrow) {
  animation: lmHeadUp 1s cubic-bezier(0.2, 0.7, 0.2, 1) 0.85s both;
}

@media (prefers-reduced-motion: reduce) {
  .lm-content :is(.lm-page-head, .lm-page-head-cols .wp-block-column:first-child) > * {
    animation: none !important;
  }
}

/* =============================================
   STARTSEITE (Oktober 2026)
   1) Drei Kernpunkte mit Symbolen  (Gruppen-Stil "Drei Kernpunkte")
   2) Salon-Collage                (Galerie-Stil "Salon-Collage")
   3) Schlankes Marken-Band         (Klasse "lm-brands")
   ============================================= */

/* ---------- 1) Drei Kernpunkte ---------- */
.wp-block-group.is-style-lm-usp {
  background: var(--white);
  padding-top: clamp(2.4rem, 4.5vw, 3.6rem);
  padding-bottom: clamp(2.4rem, 4.5vw, 3.6rem);
  border-bottom: 1px solid var(--light);
}

.wp-block-group.is-style-lm-usp > p.is-style-lm-eyebrow {
  margin-bottom: clamp(1.4rem, 3vw, 2.2rem);
}

.is-style-lm-usp .wp-block-columns.lm-usp-cols {
  max-width: 1080px;
  margin-bottom: 0;
  column-gap: 0;
  row-gap: 0;
}

.lm-usp-cols > .wp-block-column {
  position: relative;
  padding: 0 clamp(1rem, 2.6vw, 2.4rem);
  text-align: center;
}

/* feine Goldlinie zwischen den Punkten */
.lm-usp-cols > .wp-block-column + .wp-block-column::before {
  content: '';
  position: absolute;
  left: 0;
  top: 10%;
  bottom: 10%;
  width: 1px;
  background: linear-gradient(transparent, var(--gold), transparent);
  opacity: 0.6;
}

.is-style-lm-usp .lm-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  margin: 0;
}

.is-style-lm-usp .lm-info-icon {
  width: 64px;
  height: 64px;
  color: var(--lm-gold-dark);
  background: var(--cream);
  border-color: rgba(201, 169, 110, 0.65);
  flex-shrink: 0;
}

.is-style-lm-usp .lm-info-icon svg {
  width: 30px;
  height: 30px;
}

.is-style-lm-usp p.lm-info-title {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: clamp(1.3rem, 1.8vw, 1.5rem) !important;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: var(--lm-mokka-deep) !important;
  line-height: 1.25 !important;
  margin: 0 0 0.4rem !important;
}

.is-style-lm-usp p.lm-info-text {
  font-size: 0.84rem !important;
  line-height: 1.75 !important;
  color: var(--lm-text-warm) !important;
  max-width: 19rem;
  margin: 0 auto !important;
}

/* sanft nacheinander einblenden (nur wenn JavaScript läuft) */
html.lm-reveal-on:not(.lm-reveal--none) .lm-content .lm-reveal-text {
  opacity: 0;
  transform: translateY(14px);
  transition:
    opacity 1s ease var(--lm-reveal-delay, 0s),
    transform 1.2s cubic-bezier(0.2, 0.7, 0.2, 1) var(--lm-reveal-delay, 0s);
}

html.lm-reveal-on:not(.lm-reveal--none) .lm-content .lm-reveal-text.is-inview {
  opacity: 1;
  transform: none;
}

@media (max-width: 781px) {
  .lm-usp-cols > .wp-block-column {
    padding: 1.05rem 0;
    text-align: left;
  }

  .lm-usp-cols > .wp-block-column:first-child {
    padding-top: 0;
  }

  .lm-usp-cols > .wp-block-column:last-child {
    padding-bottom: 0;
  }

  .lm-usp-cols > .wp-block-column + .wp-block-column::before {
    top: 0;
    bottom: auto;
    right: 0;
    width: auto;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--gold) 20%, var(--gold) 80%, transparent);
    opacity: 0.45;
  }

  .is-style-lm-usp .lm-info {
    display: grid;
    grid-template-columns: 54px 1fr;
    gap: 1.1rem;
    align-items: center;
  }

  .is-style-lm-usp .lm-info-icon {
    width: 54px;
    height: 54px;
  }

  .is-style-lm-usp .lm-info-icon svg {
    width: 25px;
    height: 25px;
  }

  .is-style-lm-usp p.lm-info-title {
    font-size: 1.24rem !important;
    margin-bottom: 0.15rem !important;
  }

  .is-style-lm-usp p.lm-info-text {
    font-size: 0.8rem !important;
    line-height: 1.65 !important;
    max-width: none;
  }
}

/* ---------- 2) Salon-Collage ---------- */
.lm-salon {
  max-width: 520px;
  margin-left: auto;
  margin-right: auto;
}

.wp-block-gallery.is-style-lm-salon {
  position: relative;
  display: block !important;
  margin: 0 !important;
  padding: 7% 0 9%;
}

.wp-block-gallery.is-style-lm-salon > figure.wp-block-image {
  margin: 0 !important;
  display: block !important;
}

.wp-block-gallery.is-style-lm-salon > figure.wp-block-image img {
  display: block;
  width: 100% !important;
  height: auto !important;
  object-fit: cover;
}

.wp-block-gallery.is-style-lm-salon figcaption {
  display: none !important;
}

/* großes Bild im Bogen, mit versetzter Goldlinie */
.wp-block-gallery.is-style-lm-salon > figure.wp-block-image:nth-child(1) {
  position: relative;
  z-index: 1;
  width: 62% !important;
  margin-left: 19% !important;
}

.wp-block-gallery.is-style-lm-salon > figure.wp-block-image:nth-child(1) img {
  aspect-ratio: 4 / 5;
  border-radius: 1000px 1000px 0 0;
}

.wp-block-gallery.is-style-lm-salon > figure.wp-block-image:nth-child(1)::after {
  content: '';
  position: absolute;
  z-index: -1;
  inset: -14px 14px 14px -14px;
  border: 1px solid var(--gold);
  border-radius: 1000px 1000px 0 0;
  pointer-events: none;
}

/* zwei kleinere Bilder mit feinem weißen Rand, die das große überlappen */
.wp-block-gallery.is-style-lm-salon > figure.wp-block-image:nth-child(2),
.wp-block-gallery.is-style-lm-salon > figure.wp-block-image:nth-child(3) {
  position: absolute;
  z-index: 2;
  border: 5px solid var(--white);
  box-shadow: 0 18px 40px -22px rgba(78, 63, 53, 0.55);
  background: var(--white);
}

.wp-block-gallery.is-style-lm-salon > figure.wp-block-image:nth-child(2) {
  width: 36% !important;
  left: 0;
  bottom: 0;
}

.wp-block-gallery.is-style-lm-salon > figure.wp-block-image:nth-child(2) img {
  aspect-ratio: 3 / 4;
}

.wp-block-gallery.is-style-lm-salon > figure.wp-block-image:nth-child(3) {
  width: 33% !important;
  right: 0;
  top: 0;
}

.wp-block-gallery.is-style-lm-salon > figure.wp-block-image:nth-child(3) img {
  aspect-ratio: 1 / 1;
}

.wp-block-gallery.is-style-lm-salon > figure.wp-block-image:nth-child(n+4) {
  display: none !important;
}

/* Gespiegelt: steht die Collage in der LINKEN Spalte (Bilder links, Text rechts),
   wird sie automatisch spiegelverkehrt angeordnet. */
@media (min-width: 782px) {
  .wp-block-column:first-child:not(:only-child) .wp-block-gallery.is-style-lm-salon > figure.wp-block-image:nth-child(1)::after {
    inset: -14px -14px 14px 14px;
  }

  .wp-block-column:first-child:not(:only-child) .wp-block-gallery.is-style-lm-salon > figure.wp-block-image:nth-child(2) {
    left: auto;
    right: 0;
  }

  .wp-block-column:first-child:not(:only-child) .wp-block-gallery.is-style-lm-salon > figure.wp-block-image:nth-child(3) {
    right: auto;
    left: 0;
  }
}

/* Link unter der Collage */
.lm-salon > p {
  font-family: 'Cormorant Garamond', serif !important;
  font-style: italic;
  font-size: 1.08rem !important;
  line-height: 1.5 !important;
  margin: 0.4rem 0 0 !important;
}

.lm-salon > p a {
  color: var(--lm-mokka);
  text-decoration: underline;
  text-decoration-color: rgba(201, 169, 110, 0.7);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.3em;
  transition: color 0.25s ease, text-decoration-color 0.25s ease;
}

.lm-salon > p a:hover {
  color: var(--lm-mokka-deep);
  text-decoration-color: var(--lm-mokka-deep);
}

@media (max-width: 781px) {
  .lm-salon {
    max-width: 420px;
  }

  /* Abschnitte mit Salon-Collage: am Handy alles mittig (am Computer bleibt es wie es ist) */
  .wp-block-columns:has(.lm-salon) > .wp-block-column {
    text-align: center;
  }

  .wp-block-columns:has(.lm-salon) > .wp-block-column :is(p, h1, h2, h3, h4, h5, h6) {
    text-align: center !important;
  }

  .wp-block-columns:has(.lm-salon) > .wp-block-column hr.wp-block-separator {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .wp-block-columns:has(.lm-salon) > .wp-block-column .wp-block-buttons {
    justify-content: center !important;
  }

  .wp-block-columns:has(.lm-salon) > .wp-block-column :is(.lm-handwriting, .hb, .hb-svg) {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* ---------- 3) Schlankes Marken-Band ---------- */
.wp-block-group.lm-brands {
  padding-top: clamp(1.6rem, 3vw, 2.3rem);
  padding-bottom: clamp(1.6rem, 3vw, 2.3rem);
}

.wp-block-group.lm-brands > p.is-style-lm-eyebrow {
  margin-bottom: 0.85rem;
}

.lm-brands .wp-block-list.is-style-lm-chips {
  gap: 0.45rem;
  max-width: 920px;
}

.lm-brands .wp-block-list.is-style-lm-chips li {
  font-size: 0.58rem;
  letter-spacing: 0.18em;
  padding: 0.42rem 0.85rem;
}

.lm-brands .wp-block-list.is-style-lm-chips li.is-clone {
  display: none;
}

@keyframes lmBrands {
  to { transform: translateX(-50%); }
}

@media (max-width: 781px) {
  .wp-block-group.lm-brands {
    padding-top: 1.05rem;
    padding-bottom: 1.1rem;
    overflow: hidden;
  }

  .wp-block-group.lm-brands > p.is-style-lm-eyebrow {
    margin-bottom: 0.55rem;
    font-size: 0.56rem;
  }

  /* alle Marken in einer Zeile */
  .wp-block-group.lm-brands .wp-block-list.is-style-lm-chips {
    flex-wrap: nowrap;
    justify-content: flex-start;
    width: max-content;
    max-width: none !important;
    gap: 0;
  }

  .lm-brands .wp-block-list.is-style-lm-chips li {
    margin-right: 0.4rem;
    white-space: nowrap;
    font-size: 0.55rem;
    padding: 0.36rem 0.75rem;
  }

  .lm-brands .wp-block-list.is-style-lm-chips li.is-clone {
    display: block;
  }

  .wp-block-group.lm-brands > .lm-brands-viewport {
    max-width: none !important;
    margin-left: calc(var(--lm-gutter) * -1) !important;
    margin-right: calc(var(--lm-gutter) * -1) !important;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 12%, #000 88%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 12%, #000 88%, transparent 100%);
  }

  .lm-brands .lm-brands-track {
    margin: 0 !important;
    animation: lmBrands var(--lm-brands-duration, 34s) linear infinite;
    will-change: transform;
  }
}

@media (max-width: 781px) and (prefers-reduced-motion: reduce) {
  .lm-brands .lm-brands-track {
    animation: none;
  }

  .lm-brands .wp-block-list.is-style-lm-chips li.is-clone {
    display: none;
  }

  .wp-block-group.lm-brands > .lm-brands-viewport {
    overflow-x: auto;
    -webkit-mask-image: none;
    mask-image: none;
    padding-inline: var(--lm-gutter);
  }
}