/*
Theme Name:   Bärbel Schmid (Hello Elementor Child)
Description:  Child-Theme für baerbelschmid.net – Gestaltung erfolgt über Elementor Pro (Website-Einstellungen + Theme Builder). Hier nur ergänzende Styles.
Template:     hello-elementor
Version:      1.0.3
Text Domain:  bs-child
*/

:root {
	--bs-petrol: #31525B;
	--bs-orange: #FFA101;
	--bs-hellblau: #B3DEE5;
	--bs-creme: #FAE6B1;
	--bs-text: #2E3B3F;
	--bs-radius: 6px;
}

body { background: #fff; color: var(--bs-text); }

/* ---------- Header ---------- */
.bs-header { z-index: 100; }
.bs-header .elementor-nav-menu--main .elementor-item {
	color: #fff;
	text-transform: uppercase;
	letter-spacing: .06em;
	font-family: "Roboto", sans-serif;
	font-weight: 500;
	font-size: 15px;
	padding: 10px 14px;
}
.bs-header .elementor-nav-menu--main .elementor-item:hover,
.bs-header .elementor-nav-menu--main .elementor-item.elementor-item-active {
	color: var(--bs-hellblau);
}
.bs-header .elementor-menu-toggle { color: #fff; background: transparent; font-size: 26px; }
.bs-header .elementor-menu-toggle svg { fill: #fff; }
.bs-header .elementor-nav-menu--dropdown { background: var(--bs-petrol); }
.bs-header .elementor-nav-menu--dropdown .elementor-item {
	color: #fff; text-transform: uppercase; letter-spacing: .05em; font-family: "Roboto", sans-serif;
	border-top: 1px solid rgba(255,255,255,.12);
}
.bs-header .elementor-nav-menu--dropdown .elementor-item:hover,
.bs-header .elementor-nav-menu--dropdown .elementor-item.elementor-item-active { background: rgba(255,255,255,.08); color: var(--bs-hellblau); }
.bs-logo img { max-width: 230px; height: auto; }
@media (max-width: 767px) { .bs-logo img { max-width: 170px; } }

/* Menü: gleiche Abstände in allen Zuständen (verhindert Springen beim Überfahren) */
.bs-header .elementor-nav-menu--main .elementor-nav-menu a,
.bs-header .elementor-nav-menu--main .elementor-nav-menu a:hover,
.bs-header .elementor-nav-menu--main .elementor-nav-menu a:focus,
.bs-header .elementor-nav-menu--main .elementor-nav-menu a.highlighted,
.bs-header .elementor-nav-menu--main .elementor-nav-menu a.elementor-item-active { padding: 10px 14px !important; line-height: 20px; transform: none !important; }
.bs-header .elementor-nav-menu--main .elementor-item { transition: color .2s ease; }

/* ---------- Typografie-Ergänzungen ---------- */
.bs-kicker { text-transform: uppercase; letter-spacing: .12em; font-size: 13px; color: var(--bs-petrol); font-weight: 600; }
.bs-zitat p, .bs-zitat { font-family: "Merriweather", serif; font-style: italic; font-size: 1.15em; color: var(--bs-petrol); }

/* ---------- Bilder ---------- */
.bs-circle img {
	border-radius: 50%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	width: 100%;
	max-width: 420px;
	box-shadow: 0 10px 30px rgba(49,82,91,.18);
}
@media (max-width: 767px) { .bs-circle img { max-width: 280px; margin: 0 auto; } }
.bs-rounded img { border-radius: var(--bs-radius); box-shadow: 0 8px 24px rgba(49,82,91,.14); width: 100%; max-height: 520px; object-fit: cover; }
.bs-cover img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--bs-radius); }

/* ---------- Seitenkopf (Unterseiten) ---------- */
.bs-pagehead { position: relative; }
.bs-pagehead::after {
	content: ""; position: absolute; left: 50%; bottom: -1px; transform: translateX(-50%);
	width: 80px; height: 4px; background: var(--bs-orange); border-radius: 2px;
}

/* ---------- Beispiel-Karten ---------- */
.bs-card {
	background: #fff;
	border-radius: var(--bs-radius);
	border-top: 4px solid var(--bs-orange);
	box-shadow: 0 6px 20px rgba(49,82,91,.10);
	transition: transform .2s ease, box-shadow .2s ease;
}
.bs-card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(49,82,91,.16); }
.bs-card h3, .bs-card .elementor-heading-title { margin-bottom: .4em; }

/* ---------- Termine (Loop-Item) ---------- */
.bs-termin {
	background: #fff;
	border-radius: var(--bs-radius);
	overflow: hidden;
	box-shadow: 0 6px 20px rgba(49,82,91,.10);
	height: 100%;
}
.bs-termin-datum .elementor-heading-title,
.bs-termin-datum {
	background: var(--bs-petrol);
	color: #fff !important;
	font-family: "Roboto", sans-serif !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	letter-spacing: .08em;
	text-transform: uppercase;
}
.bs-termin-datum .elementor-heading-title { padding: 8px 18px; }
.bs-termin-ort { color: var(--bs-petrol); font-size: 14px; font-weight: 600; }
.bs-termin-ort .elementor-heading-title:not(:empty)::before { content: "\1F4CD\00a0"; }

/* ---------- Presse (Loop-Item) ---------- */
.bs-presse { background: #fff; border-radius: var(--bs-radius); overflow: hidden; box-shadow: 0 6px 20px rgba(49,82,91,.10); height: 100%; }
.bs-presse .bs-presse-bild img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: top center; }
.bs-presse-meta { font-size: 13px; color: var(--bs-petrol); text-transform: uppercase; letter-spacing: .08em; font-weight: 600; }

/* Mehr-Link */
.bs-mehr a, a.bs-mehr { color: var(--bs-petrol); font-weight: 600; text-decoration: none; }
.bs-mehr a:hover, a.bs-mehr:hover { color: var(--bs-orange); }

/* ---------- Footer mit überlappendem Kreisbild ---------- */
.bs-footer { margin-top: 170px; overflow: visible !important; }
.bs-footer-foto { margin-top: -150px; }
.bs-footer-foto img {
	width: 240px; height: 240px;
	border-radius: 50%;
	object-fit: cover;
	object-position: 50% 30%;
	border: 6px solid #fff;
	box-shadow: 0 10px 30px rgba(0,0,0,.25);
}
.bs-footer, .bs-footer p, .bs-footer li, .bs-footer .elementor-icon-list-text { color: rgba(255,255,255,.9); }
.bs-footer a, .bs-footer .elementor-icon-list-text a { color: #fff; }
.bs-footer a:hover { color: var(--bs-hellblau); }
.bs-footer .elementor-heading-title { color: var(--bs-creme) !important; }
.bs-footer .elementor-icon-list-icon i, .bs-footer .elementor-icon-list-icon svg { color: var(--bs-orange); fill: var(--bs-orange); }
.bs-footer-unten { border-top: 1px solid rgba(255,255,255,.15); font-size: 13px; }
.bs-footer-unten a { margin: 0 .6em; }
@media (max-width: 767px) {
	.bs-footer { margin-top: 130px; }
	.bs-footer-foto { margin-top: -110px; }
	.bs-footer-foto img { width: 180px; height: 180px; }
}

/* ---------- Formular ---------- */
.elementor-form .elementor-field-group .elementor-field { border-radius: var(--bs-radius); border-color: #cfd8da; }
.elementor-form .elementor-field:focus { border-color: var(--bs-petrol); box-shadow: 0 0 0 2px rgba(49,82,91,.15); }

/* ---------- Normale WordPress-Seiten (z. B. Cookie-Richtlinie) ---------- */
body:not(.elementor-page) .site-main { max-width: 860px; margin: 0 auto; padding: 60px 20px 40px; }
body:not(.elementor-page) .site-main .entry-title { font-family: "Merriweather", serif; color: var(--bs-petrol); font-size: 2.2rem; margin-bottom: 1rem; }
body:not(.elementor-page) .site-main h2, body:not(.elementor-page) .site-main h3 { font-family: "Merriweather", serif; color: var(--bs-petrol); }

/* ---------- Rechtstexte ---------- */
.bs-rechtstext h2 { font-size: 1.4em; margin-top: 1.6em; }
.bs-rechtstext h3 { font-size: 1.15em; margin-top: 1.2em; }

/* Seitenkopf-Titel in Petrol (besserer Kontrast auf Creme) */
.bs-pagehead .elementor-heading-title { color: var(--bs-petrol) !important; }

/* Kleinere Überschriften in Karten/Listen in Petrol statt Orange */
.bs-card .elementor-heading-title,
.bs-termin h3.elementor-heading-title, .bs-termin h3.elementor-heading-title a,
.bs-presse h3.elementor-heading-title, .bs-presse h3.elementor-heading-title a { color: var(--bs-petrol) !important; }
.bs-termin h3 a:hover, .bs-presse h3 a:hover { color: var(--bs-orange) !important; }
.bs-mehr-btn .elementor-button, .bs-presse .elementor-button { background: transparent !important; color: var(--bs-petrol) !important; padding: 0 !important; text-transform: none; letter-spacing: 0; }
.bs-mehr-btn .elementor-button:hover, .bs-presse .elementor-button:hover { color: var(--bs-orange) !important; }
