/* =========================================================================
   Für Unternehmen + gemeinsame Bausteine mit Hotellerie (Präfix menne-gw-)
   ========================================================================= */

/* ---------- Intro (Eyebrow, H2, Lead) ---------- */
.menne-gw-intro { max-width: 800px; }
.menne-gw-intro > * { margin-bottom: 0; }
.menne-gw-intro .is-style-menne-lead { max-width: none; font-size: 18px; margin-top: 16px; }
.menne-inner > .menne-gw-intro + * { margin-top: 20px; } /* Vorlage: .pain-grid 20 px, .acc 22 px */

/* ---------- Hero-Zahlenband ---------- */
.wp-block-cover.is-style-menne-hero:has(.menne-gw-statband) .is-style-menne-lead { max-width: 60ch; }
.wp-block-cover.is-style-menne-hero:has(.menne-gw-statband) h1 { max-width: 18ch; }
.wp-block-cover .wp-block-cover__inner-container > .menne-gw-statband {
	display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 34px !important;
}
.wp-block-cover .wp-block-cover__inner-container > .menne-gw-statband--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 620px; }
.menne-gw-statband > .menne-gw-statcell { margin: 0 !important; }
.menne-gw-statband--3 > .menne-gw-statcell { padding: 24px 22px; }
.menne-gw-statcell {
	position: relative; overflow: hidden; border-radius: 3px; padding: 26px 24px 24px;
	background: rgba(255, 255, 255, .045); border: 1px solid var(--m-walnut-line);
	transition: transform .2s var(--m-ease), background .2s var(--m-ease);
}
.menne-gw-statcell::before {
	content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--m-moss-bright);
	transform-origin: top; animation: menne-gw-bar .6s var(--m-ease) .5s both;
}
.menne-gw-statcell:nth-child(2)::before { animation-delay: .6s; }
.menne-gw-statcell:nth-child(3)::before { animation-delay: .7s; }
.menne-gw-statcell:nth-child(4)::before { animation-delay: .8s; }
@keyframes menne-gw-bar { from { transform: scaleY(0); } to { transform: scaleY(1); } }
.menne-gw-statcell:hover { transform: translateY(-4px); background: rgba(255, 255, 255, .08); }
.menne-gw-statband .menne-gw-statcell > p { margin: 0; text-shadow: none; }
.menne-gw-statband .menne-gw-statcell > p:first-child {
	font-family: var(--m-display); font-weight: 500; font-size: clamp(30px, 4vw, 46px); line-height: 1; color: var(--m-moss-bright);
	transition: transform .2s var(--m-ease);
}
.menne-gw-statband--3 .menne-gw-statcell > p:first-child { font-size: clamp(28px, 4vw, 42px); }
.menne-gw-statcell:hover > p:first-child { transform: translateY(-2px); }
.menne-gw-statband .menne-gw-statcell > p:last-child { font-size: 13px; line-height: 1.4; color: var(--m-cream-soft); margin-top: 8px; }
@media (max-width: 920px) {
	.wp-block-cover .wp-block-cover__inner-container > .menne-gw-statband { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.wp-block-cover .wp-block-cover__inner-container > .menne-gw-statband--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
	.wp-block-cover .wp-block-cover__inner-container > .menne-gw-statband,
	.wp-block-cover .wp-block-cover__inner-container > .menne-gw-statband--3 { grid-template-columns: 1fr; gap: 10px; }
	.menne-gw-statcell { padding: 18px 20px; }
}

/* ---------- Kartenraster ---------- */
.menne-gw-grid { display: grid; gap: 22px; }
.menne-gw-grid > * { margin: 0 !important; }
.menne-gw-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.menne-gw-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.menne-inner > .menne-gw-grid + .menne-gw-grid, .menne-inner > .menne-gw-grid + .wp-block-group { margin-top: 24px; }
@media (max-width: 920px) {
	.menne-gw-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
	.menne-gw-grid--2, .menne-gw-grid--3 { grid-template-columns: 1fr; }
}

/* Karte mit Nummer */
.menne-gw-card, .menne-gw-pain {
	background: var(--m-paper); border: 1px solid var(--m-line); border-radius: 3px; padding: 28px 26px;
	transition: transform .2s var(--m-ease), box-shadow .2s var(--m-ease), border-color .2s var(--m-ease);
}
.menne-gw-card:hover, .menne-gw-pain:hover { transform: translateY(-4px); box-shadow: var(--m-shadow-card); border-color: var(--m-moss); }
.menne-gw-card > *, .menne-gw-pain > * { margin: 0; }
.menne-gw-num { font-family: var(--m-display); font-size: 22px; line-height: 1; color: var(--m-moss); }
.menne-gw-card h3.wp-block-heading { font-family: var(--m-display); font-weight: 500; font-size: 20px; line-height: 1.2; letter-spacing: 0; color: var(--m-ink); margin: 14px 0 7px; }
.menne-gw-card > p:not(.menne-gw-num):not(.is-style-menne-label) { font-size: 14.5px; line-height: 1.55; color: var(--m-ink-soft); }
.wp-block-columns > .wp-block-column.menne-gw-card { align-self: stretch; }

/* Problem-Karte (mit Warnsymbol) */
.menne-gw-pain { position: relative; padding: 20px 22px 20px 57px; font-size: 15.5px; line-height: 1.55; color: var(--m-ink-soft); }
.menne-gw-pain::before {
	content: "!"; position: absolute; left: 22px; top: 21px; width: 22px; height: 22px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; line-height: 1;
	background: rgba(176, 86, 64, .14); color: #b05640;
}
.menne-gw-pain p { font-size: 15.5px; line-height: 1.55; color: var(--m-ink-soft); }
.menne-gw-pain strong { display: block; color: var(--m-ink); font-weight: 700; margin-bottom: 3px; }
.menne-gw-pain strong + br { display: none; }

/* Liste mit Gedankenstrich */
.wp-block-list.menne-gw-dash { list-style: none; padding: 0; margin: 16px 0 0; display: flex; flex-direction: column; gap: 9px; }
.menne-gw-dash > li { position: relative; padding-left: 24px; margin: 0; font-size: 14.5px; line-height: 22px; color: var(--m-ink-soft); }
.menne-gw-dash > li::before { content: ""; position: absolute; left: 0; top: 10px; width: 13px; height: 2px; background: currentColor; color: var(--m-moss); }

/* Kartenreihe aus Spalten */
.wp-block-columns.menne-gw-cards { margin-bottom: 0; }

/* ---------- Preis-Box ---------- */
.menne-inner > .menne-gw-grid + .menne-gw-pricebox { margin-top: 40px; }
.menne-gw-pricebox { background: var(--m-paper); border: 1px solid var(--m-line); border-radius: 3px; padding: clamp(24px, 3vw, 32px) clamp(22px, 3vw, 34px); }
.menne-gw-pricebox > * { margin-bottom: 0; }
.menne-gw-pricebox > h3.wp-block-heading { font-family: var(--m-display); font-weight: 500; font-size: clamp(22px, 2.6vw, 30px); line-height: 1.12; margin-top: 12px !important; }
.menne-gw-pricebox > p:not(.is-style-menne-eyebrow):not(.is-style-menne-note) { font-size: 17px; line-height: 1.6; color: var(--m-ink-soft); max-width: 62ch; margin-top: 12px; }
.menne-gw-pricebox > .menne-gw-prices { margin-top: 22px; }
.menne-gw-prices.is-style-menne-tiles > .wp-block-column { padding: 22px 20px; }
.menne-gw-pricebox > .wp-block-columns.is-style-menne-tiles.menne-gw-prices:not(.menne-x) { row-gap: 1px !important; }
.menne-gw-prices > .wp-block-column > * { margin: 0; }
.menne-gw-prices .is-style-menne-label { letter-spacing: .12em; margin-bottom: 8px; }
.menne-gw-price { font-family: var(--m-display); font-size: 26px; line-height: 1; color: var(--m-ink); }
.menne-gw-prices .is-style-menne-note { font-size: 12.5px; line-height: 1.4; margin-top: 6px; }
.menne-gw-pricebox > .is-style-menne-note { font-size: 12.5px; margin-top: 12px; }
.menne-gw-pricebox > .is-style-menne-note a { color: var(--m-moss); font-weight: 600; }

/* ---------- Drei Wege (dunkle Karten) ---------- */
.wp-block-column.menne-gw-way { position: relative; overflow: hidden; padding: 32px 30px; border: 1px solid var(--m-walnut-line); }
.wp-block-column.menne-gw-way > * { margin: 0; }
.menne-gw-way::after {
	content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px;
	background: linear-gradient(90deg, var(--m-moss), var(--m-moss-bright)); transform-origin: left; transition: transform .55s var(--m-ease);
}
.js .menne-gw-way::after { transform: scaleX(0); }
.js .menne-gw-way.is-visible::after, .menne-gw-way:hover::after { transform: scaleX(1); }
.menne-gw-way:hover { transform: translateY(-6px); box-shadow: var(--m-shadow-cta); }
.menne-gw-way .menne-gw-num { font-size: 30px; color: var(--m-moss-bright); transition: transform .2s var(--m-ease); }
.menne-gw-way:hover .menne-gw-num { transform: translateY(-2px); }
.menne-gw-way h3.wp-block-heading { font-family: var(--m-display); font-weight: 500; font-size: 21px; line-height: 1.2; letter-spacing: 0; color: #fff; margin: 14px 0 14px; }
.menne-gw-way .menne-gw-dash { margin-top: 0; }
.menne-gw-way .menne-gw-dash > li { color: var(--m-cream-soft); }
.menne-gw-way .menne-gw-dash > li::before { color: var(--m-moss-bright); }

/* ---------- Farbwechsel-Karten (Zwei Wege / Pakete) ---------- */
.wp-block-column.is-style-menne-card-invert:has(.menne-gw-dash) { padding: 32px 30px; }
.is-style-menne-card-invert > h3.wp-block-heading { font-family: var(--m-display); font-weight: 500; font-size: 24px; line-height: 1.2; letter-spacing: 0; margin: 0 0 4px; color: var(--m-ink); }
.is-style-menne-card-invert > .is-style-menne-label { margin: 0; }
.is-style-menne-card-invert > .is-style-menne-label + h3.wp-block-heading { margin-top: 10px; }
.is-style-menne-card-invert > p:not(.is-style-menne-label) { margin: 0; font-size: 15px; line-height: 1.6; color: var(--m-ink-soft); }
.is-style-menne-card-invert > p.menne-gw-tag { font-size: 14px; line-height: 1.45; font-weight: 600; color: var(--m-moss); margin: 4px 0 14px; }
.is-style-menne-card-invert > p.menne-gw-who, .menne-gw-who { font-size: 14px; line-height: 1.45; font-weight: 600; color: var(--m-ink-mute); margin: 4px 0 14px; }
.is-style-menne-card-invert.menne-gw-featured { background: var(--m-sand); border-color: var(--m-moss); }
.is-style-menne-card-invert.menne-gw-featured:hover, .is-style-menne-card-invert.menne-gw-featured:focus-within { background: var(--m-walnut); border-color: var(--m-moss); }
.is-style-menne-card-invert:hover .menne-gw-tag, .is-style-menne-card-invert:focus-within .menne-gw-tag { color: var(--m-moss-bright) !important; }
.is-style-menne-card-invert:hover .menne-gw-who, .is-style-menne-card-invert:focus-within .menne-gw-who { color: var(--m-cream-soft) !important; }
.is-style-menne-card-invert:hover .menne-gw-dash > li, .is-style-menne-card-invert:focus-within .menne-gw-dash > li { color: var(--m-cream-soft) !important; }
.is-style-menne-card-invert:hover .menne-gw-dash > li::before, .is-style-menne-card-invert:focus-within .menne-gw-dash > li::before { color: var(--m-moss-bright); }
.is-style-menne-card-invert:focus-within :is(h3, p:not(.is-style-menne-label)) { color: var(--m-cream); }
.is-style-menne-card-invert:focus-within h3 { color: #fff; }

/* ---------- Bildband mit Text darüber ---------- */
.wp-block-cover.is-style-menne-band.menne-gw-band { border-radius: 3px; min-height: clamp(380px, 40vw, 520px); }
.wp-block-cover.menne-gw-band::before {
	background:
		linear-gradient(90deg, rgba(14, 9, 4, .62) 0%, rgba(14, 9, 4, .3) 45%, rgba(14, 9, 4, 0) 72%),
		linear-gradient(180deg, rgba(14, 9, 4, 0) 35%, rgba(14, 9, 4, .55) 100%);
}
.wp-block-cover.menne-gw-band .wp-block-cover__image-background { transition: transform .7s var(--m-ease); }
.wp-block-cover.menne-gw-band:hover .wp-block-cover__image-background { transform: scale(1.04); }
.wp-block-cover.menne-gw-band .wp-block-cover__inner-container { box-sizing: border-box; max-width: none; padding: clamp(28px, 4vw, 52px); }
.wp-block-cover.menne-gw-band .wp-block-cover__inner-container > * { max-width: 560px; margin-top: 0; margin-bottom: 0; }
.wp-block-cover.menne-gw-band h2 { font-size: clamp(28px, 3.4vw, 40px); line-height: 1.1; letter-spacing: -.02em; margin-top: 14px !important; }
.wp-block-cover.menne-gw-band p:not(.is-style-menne-eyebrow) { font-size: 18px; line-height: 1.6; color: #f0ebe2; margin-top: 16px !important; }
/* Unbeschnitten: Bildband in Bildproportion */
.wp-block-cover.is-style-menne-band.menne-gw-band--full { min-height: 0; aspect-ratio: 1800 / 1201; }
.wp-block-cover.menne-gw-band--full:hover .wp-block-cover__image-background { transform: none; }
@media (max-width: 700px) {
	.wp-block-cover.is-style-menne-band.menne-gw-band { flex-direction: column; align-items: stretch; min-height: 0; aspect-ratio: auto; }
	.wp-block-cover.menne-gw-band .wp-block-cover__image-background { position: relative; inset: auto; height: auto; aspect-ratio: 16 / 10; }
	.wp-block-cover.menne-gw-band--full .wp-block-cover__image-background { aspect-ratio: 1800 / 1201; }
	.wp-block-cover.menne-gw-band::before { display: none; }
	.wp-block-cover.menne-gw-band .wp-block-cover__inner-container { padding: 24px 22px 28px; }
	.wp-block-cover.menne-gw-band :is(h2, p) { text-shadow: none; }
	.wp-block-cover.menne-gw-band:hover .wp-block-cover__image-background { transform: none; }
}

/* ---------- Logos „Schon an Bord“ ---------- */
.menne-gw-trust {
	display: flex; flex-wrap: wrap; align-items: center; gap: 52px; margin-top: 38px !important;
	background: #fff; border: 1px solid var(--m-line); border-radius: 3px; box-shadow: var(--m-shadow-card); padding: 34px 44px;
}
.menne-gw-trust > * { margin: 0 !important; }
.menne-gw-trust > .is-style-menne-label { flex: none; font-size: 13px; letter-spacing: .14em; line-height: 1.4; }
.menne-gw-trust > .is-style-menne-logos { flex: 1; flex-wrap: wrap; justify-content: center; gap: 60px; } /* Vorlage: gap 60, zentriert */
/* Vorlage: alle Logos 62 px hoch (mobil 52 px) */
.menne-gw-trust .is-style-menne-logos .wp-block-image img { width: auto; max-width: none; filter: none; opacity: .92; transition: transform .2s var(--m-ease), opacity .2s var(--m-ease); }
.menne-gw-trust .is-style-menne-logos .wp-block-image img { height: 62px; }
.menne-gw-trust .is-style-menne-logos .wp-block-image:hover img { opacity: 1; transform: translateY(-3px); }
/* Wortmarke ohne Logo-Datei (wie im Prototyp als Text) */
.menne-gw-trust .menne-gw-logo-text {
	font-family: var(--m-body); font-weight: 700; font-size: 22px; line-height: 1.6; letter-spacing: .06em; text-transform: uppercase; color: var(--m-ink);
	opacity: .92; transition: transform .2s var(--m-ease), opacity .2s var(--m-ease);
}
.menne-gw-trust .menne-gw-logo-text:hover { opacity: 1; transform: translateY(-3px); }
@media (max-width: 680px) {
	.menne-gw-trust { flex-direction: column; align-items: flex-start; gap: 24px; }
	.menne-gw-trust > .is-style-menne-logos { width: 100%; gap: 40px; justify-content: flex-start; }
	.menne-gw-trust .is-style-menne-logos .wp-block-image img { height: 52px; }
}
@media (prefers-reduced-motion: reduce) {
	.menne-gw-trust .menne-gw-logo-text, .menne-gw-trust .is-style-menne-logos .wp-block-image img { transition: none; transform: none !important; }
}

/* ---------- Vergleich (aufklappbar) ---------- */
.wp-block-details.menne-gw-compare { border: 1px solid var(--m-line); border-radius: 3px; background: var(--m-paper); overflow: hidden; }
.menne-gw-compare > summary {
	cursor: pointer; list-style: none; padding: 20px 26px; display: flex; justify-content: space-between; align-items: center; gap: 16px;
	font-family: var(--m-body); font-weight: 600; font-size: 16px; color: var(--m-ink); transition: background .2s var(--m-ease);
}
.menne-gw-compare > summary::-webkit-details-marker { display: none; }
.menne-gw-compare > summary::marker { content: ""; }
.menne-gw-compare > summary::after { content: "+"; font-family: var(--m-display); font-size: 24px; line-height: 1; color: var(--m-moss); }
.menne-gw-compare[open] > summary::after { content: "\2013"; }
.menne-gw-compare > summary:hover { background: var(--m-sand); }
.menne-gw-compare > summary:focus-visible { outline-offset: -3px; }
.menne-gw-compare > .wp-block-columns { margin: 0 26px !important; gap: 0 !important; border-bottom: 1px solid var(--m-line); transition: background .2s var(--m-ease); }
.menne-gw-compare > .wp-block-columns:last-child { margin-bottom: 24px !important; }
.menne-gw-compare > .wp-block-columns:not(.menne-gw-cmp-head):hover { background: var(--m-sand); }
.menne-gw-cmp-row > .wp-block-column { padding: 15px 18px; }
.menne-gw-cmp-row > .wp-block-column:first-child { flex: 0 0 38% !important; }
.menne-gw-cmp-row p { margin: 0; font-size: 15px; line-height: 1.55; }
.menne-gw-cmp-need p { font-weight: 600; color: var(--m-ink); }
.menne-gw-cmp-neg p { color: var(--m-ink-mute); }
.menne-gw-cmp-pos p { color: var(--m-ink); }
.menne-gw-cmp-head p { font-family: var(--m-body); font-weight: 600 !important; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--m-ink-mute) !important; }
.menne-gw-cmp-head .menne-gw-cmp-pos p { color: var(--m-moss) !important; }
.menne-gw-cmp-row:not(.menne-gw-cmp-head) .menne-gw-cmp-pos p::before { content: "\2713"; font-weight: 700; margin-right: 7px; color: var(--m-moss); }
.menne-gw-compare--x .menne-gw-cmp-row:not(.menne-gw-cmp-head) .menne-gw-cmp-neg p::before { content: "\2717"; font-weight: 700; margin-right: 7px; color: #b05640; }
@media (max-width: 920px) {
	.wp-block-details.menne-gw-compare .wp-block-columns.menne-gw-cmp-row { row-gap: 4px !important; padding: 14px 0; }
	.menne-gw-compare > .menne-gw-cmp-head { display: none !important; }
	.menne-gw-cmp-row > .wp-block-column { padding: 0; }
	.menne-gw-cmp-row > .wp-block-column:first-child { flex-basis: 100% !important; }
	.menne-gw-compare > summary { padding: 18px 20px; }
	.menne-gw-compare > .wp-block-columns { margin: 0 20px !important; }
}

/* ---------- Schritte mit Hinweis-Pille ---------- */
.menne-gw-steps > li em {
	display: inline-block; margin-top: 8px; font-style: normal; font-size: 12.5px; font-weight: 600; line-height: 1.4;
	color: var(--m-moss); background: rgba(110, 147, 34, .1); border-radius: 999px; padding: 5px 12px;
}

/* ---------- Bewegung reduzieren ---------- */
@media (prefers-reduced-motion: reduce) {
	.menne-gw-statcell::before { animation: none; }
	.js .menne-gw-way::after { transform: scaleX(1); }
	.menne-gw-card:hover, .menne-gw-pain:hover, .menne-gw-way:hover, .menne-gw-statcell:hover { transform: none; }
	.wp-block-cover.menne-gw-band:hover .wp-block-cover__image-background { transform: none; }
}

/* Bildband: Kopf (Überschrift | Text) über dem Bild – wie Design-Referenz */
.menne-gw-band-head { margin-bottom: 34px !important; }
.menne-gw-band-text { font-size: 18px; line-height: 1.6; max-width: 52ch; }
.menne-gw-band-fig { margin: 0 !important; }
.menne-gw-band-fig img { width: 100%; height: auto; }
.menne-gw-band-fig { border: 1px solid var(--m-line); box-shadow: none !important; }
.menne-gw-band:not(.menne-gw-band--full) .menne-gw-band-fig img { height: clamp(220px, 32vw, 360px); object-fit: cover; object-position: 50% 28%; }
.menne-gw-band--full .menne-gw-band-fig:hover img { transform: none; }
