/*
 * Beans & Brews – Seitenweiter Stil im Look von Marktplatz und Kleinanzeigen (15.10.2026, seit 20.10.2026 im Child-Theme)
 * Cardo für Überschriften, Inter für Text und Bedienung, Creme-Flächen, dunkle Knöpfe, Rot nur als Akzent.
 * Nutzt nur Schriften, die bereits geladen sind (Cardo 400, Inter).
 */

/* ---------- Grundwerte ---------- */
html body {
	--bb-ink: #1b1d1f;
	--bb-mut: #5d5a55;
	--bb-cream: #f4f1ec;
	--bb-sand: #e9e2d7;
	--bb-line: #e7e2da;
	--bb-dark: #22272b;
	--bb-red: #c8231b;
	--bb-serif: "Cardo", Georgia, "Times New Roman", serif;
	--bb-sans: "Inter", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;

	--body-font: var(--bb-sans);
	--ui-font: var(--bb-sans);
	--text-font: var(--bb-sans);
	--title-font: var(--bb-serif);
	--c-headings: var(--bb-ink);
	--c-links: var(--bb-ink);
	--c-separator: var(--bb-line);
	--c-separator2: var(--bb-line);
	--c-post-meta: #6b665f;
	--footer-bg: var(--bb-cream);
	--title-fw-bold: 400;
	--title-fw-semi: 400;
	color: #2f2d2a;
	font-family: var(--bb-sans);
	-webkit-font-smoothing: antialiased;
}

body ::selection { background: #efe2d0; color: var(--bb-ink); }

/* Überschriften: Cardo ist nur in 400 geladen, daher kein Fettdruck */
body h1, body h2, body h3, body h4,
body .is-title, body .post-title, body .heading, body .widget-title .heading {
	font-family: var(--bb-serif);
	font-weight: 400;
	letter-spacing: -0.005em;
	color: var(--bb-ink);
}
body .post-title a { color: inherit; }
body .post-title a:hover { color: var(--bb-red); }

/* ---------- Kopfbereich ---------- */
body .smart-head-main { border-bottom: 1px solid var(--bb-line); }
body .smart-head-bot { border-top: 1px solid var(--bb-line) !important; }
body .navigation-main .menu > li > a {
	font-family: var(--bb-sans);
	font-size: 14.5px;
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0;
	color: var(--bb-ink);
	white-space: nowrap;
	padding-left: 10px;
	padding-right: 10px;
	height: auto;
	line-height: 1.2;
	padding-top: 13px;
	padding-bottom: 13px;
}
/* 14 Menüpunkte passen nicht in eine Zeile: sauber in zwei Zeilen statt abgeschnitten */
@media (min-width: 941px) {
	body .navigation-main .menu { flex-wrap: wrap; justify-content: center; align-items: center; align-content: center; height: auto !important; }
	body .navigation-main .menu > li { height: auto !important; }
	body .navigation-main,
	body .smart-head-bot .nav-wrap,
	body .smart-head-bot .items { height: auto !important; }
	body .smart-head-bot .smart-head-center { flex: 1 1 auto; min-width: 0; }
	body .smart-head-main .smart-head-bot,
	body .smart-head-main .smart-head-bot > .inner { height: auto !important; min-height: 52px; }
	body .smart-head-main { min-height: 0 !important; }
	body .navigation-main .menu > li > a { padding-top: 9px; padding-bottom: 9px; }
	body .smart-head-bot > .inner { padding-top: 4px; padding-bottom: 4px; }
}
body .navigation-main .menu > li > a:hover,
body .navigation-main .menu > .current-menu-item > a,
body .navigation-main .menu > .current-menu-ancestor > a { color: var(--bb-red); }
body .navigation-main .sub-menu {
	border: 1px solid var(--bb-line);
	border-radius: 12px;
	box-shadow: 0 14px 30px -18px rgba(0, 0, 0, .3);
	overflow: hidden;
}
body .navigation-main .sub-menu a { font-family: var(--bb-sans); font-size: 14px; text-transform: none; }
body .breadcrumbs { font-family: var(--bb-sans); font-size: 13px; color: var(--bb-mut); }
body .breadcrumbs a { color: var(--bb-mut); }

/* Suche und Off-Canvas */
body .search-modal-box input[type="search"],
body .search-form input[type="search"] { border-radius: 10px; }
body .off-canvas .menu a { font-family: var(--bb-sans); text-transform: none; font-weight: 500; }

/* ---------- Abschnitts-Überschriften ---------- */
body .block-head .heading {
	font-family: var(--bb-serif);
	font-size: clamp(24px, 2.4vw, 32px);
	font-weight: 400;
	text-transform: none;
	letter-spacing: -0.01em;
	color: var(--bb-ink);
	line-height: 1.15;
}
body .block-head { border-color: var(--bb-line) !important; }
body .block-head .filters a,
body .block-head .view-link,
body .block-head .more-link { font-family: var(--bb-sans); font-size: 14px; text-transform: none; }

/* ---------- Beitrags-Karten ---------- */
/* Niedrige Spezifität (:where), damit runde Bilder (z. B. Café Szene) rund bleiben und kein eckiger Rahmen dahinter liegt */
:where(.l-post) :where(.media, .media-ratio, .image-link) { border-radius: 12px; }
:where(.l-post) :where(.media) { overflow: hidden; }
body .l-post .media:has(.img[style*="border-radius"]),
body .l-post .media:has(.ratio-1-1) { border-radius: 50%; }
body .l-post .post-title { font-size: 1.12em; line-height: 1.25; }
body .grid-post .post-title,
body .list-post .post-title { font-size: clamp(18px, 1.5vw, 22px); }
body .small-post .post-title { font-size: 16px; line-height: 1.3; }
body .grid-sm-post .post-title { font-size: 17px; line-height: 1.25; }
body .spc-newsletter .mail-top-icon { background: var(--bb-dark); }
body .spc-newsletter button[type="submit"] { margin-top: 10px; width: 100%; max-width: 234px; }
body .post-cat a,
body .cat-labels a,
body .cat-labels .category {
	font-family: var(--bb-sans);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
}
body .cat-labels a,
body .cat-labels .category { border-radius: 999px; padding: 4px 10px; }
body .post-meta,
body .post-meta .meta-item { font-family: var(--bb-sans); color: #6b665f; }

/* Nummerierte Liste (z. B. Café Szene) */
body .post-number,
body .counter { font-family: var(--bb-serif); font-weight: 400; color: var(--bb-red); }

/* ---------- Knöpfe ---------- */
body .ts-button,
body .read-more-btn,
body .wp-block-button__link,
body .widget input[type="submit"],
body .spc-newsletter button,
body .spc-newsletter input[type="submit"],
body .comment-form .submit,
body .wpcf7-submit {
	background: var(--bb-dark);
	color: #fff;
	border: 0;
	border-radius: 10px;
	font-family: var(--bb-sans);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	padding: 12px 20px;
	box-shadow: none;
}
body .ts-button:hover,
body .read-more-btn:hover,
body .wp-block-button__link:hover,
body .widget input[type="submit"]:hover,
body .spc-newsletter button:hover,
body .spc-newsletter input[type="submit"]:hover,
body .comment-form .submit:hover { background: #000; color: #fff; }

/* Eingabefelder */
body .widget input[type="email"],
body .widget input[type="text"],
body .spc-newsletter input[type="email"],
body .comment-form input[type="text"],
body .comment-form input[type="email"],
body .comment-form input[type="url"],
body .comment-form textarea {
	border: 1px solid #d8d1c6;
	border-radius: 10px;
	font-family: var(--bb-sans);
	box-shadow: none;
}

/* ---------- Seitenleiste und Widgets ---------- */
body .widget .widget-title .heading,
body .widget-title .heading { font-size: 22px; text-transform: none; }
body .spc-newsletter,
body .widget .spc-newsletter {
	background: var(--bb-cream);
	border: 1px solid var(--bb-line);
	border-radius: 16px;
	box-shadow: none;
}
body .spc-newsletter .heading,
body .spc-newsletter .title { font-family: var(--bb-serif); font-weight: 400; }
body .spc-newsletter .fa,
body .spc-newsletter .tsi { background: var(--bb-dark); }

/* ---------- Artikel ---------- */
body .the-post-header .post-title {
	font-size: clamp(32px, 3.8vw, 50px);
	line-height: 1.08;
	letter-spacing: -0.01em;
}
body .the-post-header .cat-labels a { background: var(--bb-red); color: #fff; }
body .single-featured img,
body .single-featured .image-link { border-radius: 16px; }
body .entry-content h2,
body .entry-content h3,
body .entry-content h4 {
	font-family: var(--bb-serif);
	font-weight: 400;
	color: var(--bb-ink);
	letter-spacing: -0.005em;
}
body .entry-content h2 { font-size: clamp(26px, 2.4vw, 32px); line-height: 1.2; }
body .entry-content h3 { font-size: clamp(21px, 1.9vw, 25px); line-height: 1.25; }
body .entry-content a { color: var(--bb-ink); text-decoration: underline; text-decoration-color: rgba(200, 35, 27, .55); text-underline-offset: 3px; }
body .entry-content a:hover { color: var(--bb-red); }
body .entry-content img { border-radius: 12px; }
body .entry-content table { border-collapse: collapse; }
body .entry-content table th { font-family: var(--bb-sans); background: var(--bb-cream); }
body .entry-content table th,
body .entry-content table td { border-color: var(--bb-line); }
body .post-share .share-text,
body .post-share-b .service { border-radius: 10px; }
body .author-box {
	background: var(--bb-cream);
	border: 1px solid var(--bb-line);
	border-radius: 16px;
	padding: 22px;
}
body .navigate-posts { border-color: var(--bb-line); }
body .related-posts .block-head .heading { font-size: 26px; }
body .comments-area .comment-respond { border-radius: 16px; }

/* Seiten-Überschrift (normale Seiten) */
body .the-page-title,
body .page-title,
body .archive-head .heading { font-family: var(--bb-serif); font-weight: 400; text-transform: none; color: var(--bb-ink); }
body .archive-head { border-color: var(--bb-line); }
/* Archiv-Überschrift: statt „BROWSING: EQUIPMENT" ein ruhiger Seitentitel */
body .archive-heading {
	font-size: 0;
	border: 0 !important;
	padding: 0 !important;
	margin-bottom: 28px;
	text-transform: none;
}
body .archive-heading::before {
	content: "Kategorie";
	display: block;
	font: 600 12px/1 var(--bb-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--bb-mut);
	margin: 0 0 10px;
	position: static;
	width: auto;
	height: auto;
	background: none;
}
body .archive-heading span {
	display: block;
	font: 400 clamp(34px, 4vw, 48px)/1.08 var(--bb-serif);
	letter-spacing: -0.01em;
	color: var(--bb-ink);
	text-transform: none;
}

/* ---------- Seitennavigation ---------- */
body .main-pagination .page-numbers,
body .pagination .page-numbers {
	border-radius: 999px;
	font-family: var(--bb-sans);
	border-color: var(--bb-line);
}
body .main-pagination .page-numbers.current,
body .pagination .page-numbers.current { background: var(--bb-dark); border-color: var(--bb-dark); color: #fff; }
body .load-button { border-radius: 10px; font-family: var(--bb-sans); text-transform: none; }

/* ---------- Footer ---------- */
body .main-footer .upper-footer { background: var(--bb-cream); border-top: 1px solid var(--bb-line); }
body .main-footer .lower-footer { background: #ece6dc; border-top: 0; color: var(--bb-mut); }
body .main-footer .widget-title .heading,
body .main-footer .widget-title {
	font-family: var(--bb-serif);
	font-size: 22px;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
}
body .main-footer .widget-title { border-color: var(--bb-line) !important; }
body .main-footer .lower-footer a { color: var(--bb-ink); }
body .main-footer .lower-footer a:hover { color: var(--bb-red); }
body .main-footer .l-post img { border-radius: 10px; }

/* ---------- Handy ---------- */
body .smart-head-mobile .smart-head-row { background-color: var(--bb-dark); }
@media (max-width: 767px) {
	body .the-post-header .post-title { font-size: 30px; }
	body .block-head .heading { font-size: 24px; }
}