/*
Theme Name: Ridler 8
Theme URI: https://example.com/ridler8
Author: Ridler 8 · Praxis Kirchhoff
Description: Block-Theme für Ridler 8 · Praxis Kirchhoff – Hausarztpraxis & Orthopädie, Ridlerstraße 8, München. Farben Petrol und Koralle, Schrift Figtree (lokal eingebunden, ohne Google-Server).
Requires at least: 6.5
Tested up to: 6.7
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ridler8
*/

/* Kicker über Überschriften */
.r8-kicker {
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--koralle-text);
	margin-bottom: 0.25rem !important;
}

/* Kopfbereich */
.r8-header {
	border-bottom: 1px solid var(--wp--preset--color--linie);
	background: var(--wp--preset--color--grund);
}
.r8-header .r8-logo img { height: 46px; width: auto; display: block; }
.r8-header .wp-block-navigation a:hover { color: var(--wp--preset--color--petrol); }

/* Karten */
.r8-karte {
	background: var(--wp--preset--color--papier);
	border-radius: 14px;
	padding: 2rem !important;
	box-shadow: var(--wp--preset--shadow--karte);
}
.r8-karte h3 { margin-top: 1rem; }
.r8-karte p { color: var(--wp--preset--color--ink-muted); }

/* Icon-Kreis */
.r8-icon { width: 52px; height: 52px; border-radius: 999px; background: var(--wp--preset--color--minze); display: flex; align-items: center; justify-content: center; }
.r8-icon svg { width: 26px; height: 26px; stroke: var(--wp--preset--color--petrol); fill: none; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }

/* Bildflächen und Platzhalter */
.r8-bild {
	background: var(--wp--preset--color--minze);
	border-radius: 28px;
	overflow: hidden;
	min-height: 320px;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
}
.r8-bild img { height: min(300px, 55vw); width: auto; }
.r8-bild figure { margin: 0; }
.r8-foto-platzhalter {
	background: var(--wp--preset--color--minze);
	border-radius: 28px;
	aspect-ratio: 4 / 5;
	display: flex;
	align-items: flex-end;
	padding: 1.25rem !important;
	color: var(--wp--preset--color--ink-muted);
	font-size: 0.875rem;
}

/* Sprechzeiten-Tabelle */
.r8-zeiten table { border-collapse: collapse; width: 100%; }
.r8-zeiten td { border: 0; border-bottom: 1px solid var(--wp--preset--color--linie); padding: 0.75rem 0; }
.r8-zeiten td:last-child { text-align: right; color: var(--wp--preset--color--ink-muted); }

/* Hinweis-Kasten */
.r8-hinweis {
	background: var(--wp--preset--color--papier);
	border-radius: 14px;
	padding: 1.5rem !important;
}

/* Arztnamen */
.r8-arzt-klein { font-size: 0.9375rem; color: var(--wp--preset--color--ink-muted); }

/* Fußbereich */
.r8-footer { color: #d3e6e2; }
.r8-footer a { color: #ffffff; }
.r8-footer .r8-logo img { height: 44px; width: auto; }
.r8-footer p { font-size: 0.9375rem; }

/* Fokus */
:where(a, button, input, select, textarea):focus-visible {
	outline: 2px solid var(--wp--preset--color--petrol);
	outline-offset: 2px;
}

@media (max-width: 781px) {
	.r8-bild { min-height: 240px; }
	.r8-zeiten td:last-child { text-align: left; }
}

/* Werdegang */
.r8-werdegang { list-style: none; padding-left: 0; }
.r8-werdegang li { padding: 0.75rem 0; border-bottom: 1px solid var(--wp--preset--color--linie); }
.r8-cta .wp-block-button__link:hover { background: var(--wp--preset--color--minze) !important; }

/* Porträt */
.r8-portrait img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 30%; border-radius: 28px; display: block; }
.r8-avatar img { width: 48px; height: 48px; border-radius: 999px; object-fit: cover; object-position: 50% 25%; display: block; }
.r8-mit-avatar { gap: 0.75rem; }
.r8-mit-avatar p { margin: 0; }

/* Zwei-Klick-Karte */
.r8-map { position: relative; aspect-ratio: 16 / 9; border-radius: 28px; overflow: hidden; background: var(--wp--preset--color--minze); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; padding: 2rem; text-align: center; }
.r8-map img { height: 72px; width: auto; }
.r8-map p { max-width: 34rem; margin: 0; font-size: 0.9375rem; color: var(--wp--preset--color--ink-muted); }
.r8-map .r8-karte-laden { cursor: pointer; border: 0; font-family: inherit; }
.r8-map.ist-geladen { padding: 0; }
.r8-map iframe { width: 100%; height: 100%; border: 0; display: block; }
@media (max-width: 600px) { .r8-map { aspect-ratio: 4 / 5; } }