/* Eyachwerk – Ergänzungen zu theme.json */

/* Grundlagen */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
:where(h1, h2, h3) { text-wrap: balance; }
:where(a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible) {
	outline: 3px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
}

/* Links in Karten, Navigation, Buttons ohne Unterstreichung */
.wp-block-navigation a,
.ew-logo a,
.ew-card-link a,
.ew-footer a { text-decoration: none; }
.ew-footer a:hover { color: var(--wp--preset--color--base); text-decoration: underline; }

/* Header */
.ew-header { border-bottom: 1px solid var(--wp--preset--color--border); }
.ew-logo { display: flex; align-items: center; gap: 12px; line-height: 1; }
.ew-logo a { display: inline-flex; align-items: center; gap: 12px; color: var(--wp--preset--color--contrast); }
.ew-logo svg { width: 38px; height: 38px; flex: none; }
.ew-wordmark { font-family: var(--wp--preset--font-family--logo); font-size: 20px; letter-spacing: 0.12em; }
.ew-wordmark b { font-weight: 800; }
.ew-wordmark span { font-weight: 300; }

/* Navigation: aktiver Punkt und CTA-Pille */
.wp-block-navigation .wp-block-navigation-item__content { padding: 12px 0; }
.wp-block-navigation .current-menu-item > .wp-block-navigation-item__content,
.wp-block-navigation [aria-current="page"] { box-shadow: inset 0 -2px 0 var(--wp--preset--color--accent); font-weight: 700; }
.wp-block-navigation .ew-nav-cta > .wp-block-navigation-item__content {
	padding: 11px 22px;
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
	border-radius: 999px;
	font-weight: 600;
	box-shadow: none;
}
.wp-block-navigation .ew-nav-cta > .wp-block-navigation-item__content:hover { background: var(--wp--preset--color--accent); color: var(--wp--preset--color--contrast); }
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
	width: 48px; height: 48px; border-radius: 999px;
	background: var(--wp--preset--color--surface);
	display: inline-flex; align-items: center; justify-content: center;
}
.wp-block-navigation__responsive-container.is-menu-open { padding: 24px; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { gap: 4px; font-size: 20px; font-weight: 600; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { padding: 12px 0 !important; }
.wp-block-navigation__responsive-container.is-menu-open .ew-nav-cta > .wp-block-navigation-item__content {
	margin-top: 12px; padding: 14px 22px !important; background: var(--wp--preset--color--accent); color: var(--wp--preset--color--contrast);
}

/* Dachzeile */
.is-style-eyebrow { font-size: var(--wp--preset--font-size--small); font-weight: 600; }

/* Bild-Platzhalter (Stockfoto-Label auf Cover-Block) */
.is-style-photo-label {
	display: inline-block;
	align-self: flex-start;
	margin: 0;
	padding: 6px 12px;
	font-size: 12px;
	line-height: 1.4;
	color: var(--wp--preset--color--text-muted);
	background: var(--wp--preset--color--base);
	border-radius: 999px;
}
.wp-block-cover.ew-photo { padding: 14px; align-items: flex-end; justify-content: flex-start; overflow: hidden; }
.wp-block-cover.ew-photo .wp-block-cover__inner-container { width: auto; }
.wp-block-cover.ew-photo img.wp-block-cover__image-background { transition: transform .25s ease; }
a:hover .wp-block-cover.ew-photo img.wp-block-cover__image-background,
.ew-prod:hover img.wp-block-cover__image-background { transform: scale(1.02); }

/* Karten mit Hover und ganzflächigem Link */
.is-style-card-hover { transition: transform .2s ease; position: relative; }
.is-style-card-hover:hover { transform: translateY(-4px); }
.ew-card-link a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.ew-card-link { margin-top: auto !important; }
@media (prefers-reduced-motion: reduce) { .is-style-card-hover, .is-style-card-hover:hover { transition: none; transform: none; } }

/* Produktkarte: ganze Karte klickbar */
.ew-prod { position: relative; }
.ew-prod .wp-block-heading a::after { content: ""; position: absolute; inset: 0; }
.ew-prod .wp-block-heading a { text-decoration: none; }

/* Ziffernkreis für Ablauf-Schritte */
.ew-step-num {
	display: inline-flex !important; align-items: center; justify-content: center;
	width: 36px; height: 36px; margin: 0; border-radius: 999px; font-weight: 700; line-height: 1;
}

/* Linie oben für Prinzipien / Ablauf */
.ew-topline { border-top: 3px solid var(--wp--preset--color--accent); padding-top: 20px; }
.ew-topline-dark { border-top: 3px solid var(--wp--preset--color--contrast); padding-top: 20px; }

/* Dateiformat-Pillen */
.ew-chip {
	display: inline-block; margin: 0; padding: 8px 14px; border-radius: 999px;
	font-family: var(--wp--preset--font-family--mono); font-size: 14px; line-height: 1.3;
	background: var(--wp--preset--color--contrast); color: var(--wp--preset--color--base);
}
.ew-chip-light {
	display: inline-block; margin: 0; padding: 10px 18px; border-radius: 999px;
	font-size: 15px; font-weight: 600; line-height: 1.3; background: var(--wp--preset--color--surface);
}

/* Faktenliste (Begriff/Wert) */
.ew-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; }
.ew-facts > * { margin: 0 !important; padding: 14px 0; border-top: 1px solid var(--wp--preset--color--border); }
.ew-facts .ew-fact-label { display: block; font-size: 14px; color: var(--wp--preset--color--text-subtle); font-weight: 400; }
.ew-facts strong { font-size: 17px; }

/* Akkordeon (Details-Block) */
.wp-block-details { border-bottom: 1px solid var(--wp--preset--color--border); }
.wp-block-details summary {
	list-style: none; cursor: pointer; padding: 20px 40px 20px 0; position: relative;
	font-size: 18px; font-weight: 700;
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after {
	content: ""; position: absolute; right: 6px; top: 50%; width: 10px; height: 10px; margin-top: -7px;
	border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg);
	transition: transform .2s ease;
}
.wp-block-details[open] summary::after { transform: rotate(-135deg); margin-top: -2px; }
.wp-block-details > :not(summary) { margin-top: 0; margin-bottom: 20px; color: var(--wp--preset--color--text-muted); }
.ew-faq { border-top: 1px solid var(--wp--preset--color--border); }
.ew-faq > .wp-block-details { margin-top: 0 !important; }

/* Tabellen */
.wp-block-table.is-style-eyachwerk { background: var(--wp--preset--color--base); border-radius: 20px; overflow-x: auto; }
.wp-block-table.is-style-eyachwerk table { border-collapse: collapse; width: 100%; min-width: 360px; }
.wp-block-table.is-style-eyachwerk th,
.wp-block-table.is-style-eyachwerk td { border: 0; border-bottom: 1px solid var(--wp--preset--color--border); padding: 18px 24px; text-align: left; }
.wp-block-table.is-style-eyachwerk tr:last-child td { border-bottom: 0; }
.wp-block-table.is-style-eyachwerk thead { border-bottom: 0; }
.wp-block-table.is-style-eyachwerk thead th { font-size: 14px; color: var(--wp--preset--color--text-subtle); font-weight: 600; }
.wp-block-table.is-style-eyachwerk td:first-child { font-weight: 700; color: var(--wp--preset--color--contrast); }
.wp-block-table.is-style-eyachwerk td { color: var(--wp--preset--color--text-muted); font-variant-numeric: tabular-nums; }
.wp-block-table.ew-price td:last-child, .wp-block-table.ew-price th:last-child { text-align: right; }

/* Illustrationen */
.ew-illustration img { width: 100%; height: auto; display: block; }

/* Inhaltsseiten (Impressum etc.) */
.ew-prose h2 { font-size: var(--wp--preset--font-size--xx-large); margin-top: 2.2em; }
.ew-prose h3 { margin-top: 1.8em; }

/* Kontakt-Box */
.ew-mail { font-size: 20px; font-weight: 700; user-select: all; }

/* Abstände zwischen Kopf, Inhalt, Fuß: Abschnitte bringen eigenes Padding mit */
.wp-site-blocks > * + * { margin-block-start: 0; }
.wp-site-blocks > main, .wp-site-blocks > .wp-block-group { margin-block-start: 0; }

/* Logo-Wortmarke */
.ew-wordmark { margin: 0; font-weight: 300; line-height: 1; }
.ew-wordmark a { color: var(--wp--preset--color--contrast); }
.ew-wordmark strong { font-weight: 800; }
.ew-logo-mark { margin: 0; }
.ew-logo-mark img { display: block; }

/* Karten mit Rahmen */
.has-border-card { border: 1px solid var(--wp--preset--color--border); }
.ew-form-box { border-radius: 24px; }

/* Trennlinien */
.ew-border-bottom { border-bottom: 1px solid var(--wp--preset--color--border); }
.ew-trust { border-top: 1px solid var(--wp--preset--color--border); border-bottom: 1px solid var(--wp--preset--color--border); }

/* Footer */
.ew-footer p { margin: 0; }

/* Seitenverhältnisse der Bildflächen (Cover) */
.wp-block-cover.ew-photo { min-height: 0 !important; height: auto; }
.ew-ratio-1 { aspect-ratio: 1 / 1; }
.ew-ratio-4-5 { aspect-ratio: 4 / 5; }
.ew-ratio-4-3 { aspect-ratio: 4 / 3; }
.ew-ratio-5-4 { aspect-ratio: 5 / 4; }
.ew-ratio-16-9 { aspect-ratio: 16 / 9; }

/* Nummernkreise: kein Hintergrund-Padding aus dem Absatz-Block */
p.ew-step-num.has-background { padding: 0 !important; align-self: flex-start; }

/* Lesebreite für Einleitungstexte */
.ew-measure { max-width: 460px; }

/* Flex-Spalten: Bildflächen und Illustrationen in voller Breite, nicht stauchen */
.wp-block-cover.ew-photo { width: 100%; flex-shrink: 0; }
.wp-block-image.ew-illustration { width: 100%; flex-shrink: 0; margin: 0; }

/* Größerer Zeilenabstand in Produkt- und Ideen-Rastern */
.is-layout-grid.ew-rowgap-40 { row-gap: 40px; }
.is-layout-grid.ew-rowgap-32 { row-gap: 32px; }