/* ==========================================================================
   Reisetipps mit Kindern — global.css
   Mobile-first. theme.json owns color/type tokens; this file owns layout,
   responsive behaviour, and styling for core-block compositions that
   theme.json can't express (grids, the route-trail, header/nav polish).
   Breakpoints: 640px (tablet), 960px (small desktop), 1280px (desktop)
   ========================================================================== */

* { box-sizing: border-box; }

img, svg, video { max-width: 100%; height: auto; display: block; }

a { text-underline-offset: 0.15em; }

/* Respect reduced-motion preference site-wide */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}
}

/* --------------------------------------------------------------------
   Skip link
   -------------------------------------------------------------------- */
.skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100000;
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--paper);
	padding: 0.85em 1.4em;
	border-radius: 0 0 var(--wp--custom--radius--sm) 0;
}
.skip-link:focus {
	left: 0;
}

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}
.skip-link.screen-reader-text:focus {
	clip: auto;
	clip-path: none;
	height: auto;
	width: auto;
}

/* Visible, consistent focus state everywhere (incl. inside custom blocks) */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible {
	outline: 3px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
	border-radius: 4px;
}

/* --------------------------------------------------------------------
   Site header / navigation
   -------------------------------------------------------------------- */
.site-header {
	border-bottom: 1px solid var(--wp--preset--color--border-color);
	background: var(--wp--preset--color--paper);
	position: sticky;
	top: 0;
	z-index: 40;
}

.site-header .wp-block-navigation {
	font-family: var(--wp--preset--font-family--ui);
	font-weight: 500;
	font-size: var(--wp--preset--font-size--small);
}

.site-header .wp-block-navigation a {
	text-decoration: none;
}

.site-header .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--paper) !important;
}

/* Custom logo: keep header height stable across breakpoints */
.site-header .custom-logo-link img,
.site-header .wp-block-site-logo img {
	max-height: 48px;
	width: auto;
	height: auto;
}
@media (min-width: 640px) {
	.site-header .custom-logo-link img,
	.site-header .wp-block-site-logo img { max-height: 56px; }
}

/* --------------------------------------------------------------------
   Query loop → card grid (used by archives, related posts, homepage)
   auto-fit/minmax means column count adapts continuously, no breakpoint
   jumps needed for the grid itself.
   -------------------------------------------------------------------- */
.reisetipps-grid.wp-block-post-template {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 1.5rem;
	align-items: start; /* tops of cards aligned, not stretched */
}

/* WP's is-layout-flow adds margin-block-start to flow children,
   which offsets cards in the same grid row. Zero it out. */
.reisetipps-grid.wp-block-post-template > li,
.reisetipps-grid.wp-block-post-template > .wp-block-post {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
	display: flex !important;
	flex-direction: column;
}

.reisetipps-grid .wp-block-post {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--border-color);
	border-radius: var(--wp--custom--radius--md);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

.reisetipps-grid .wp-block-post-featured-image {
	margin: 0;
	aspect-ratio: 4 / 3;
	overflow: hidden;
}
.reisetipps-grid .wp-block-post-featured-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.35s ease;
}
.reisetipps-grid .wp-block-post:hover .wp-block-post-featured-image img {
	transform: scale(1.04);
}

.reisetipps-grid .wp-block-post-terms,
.reisetipps-grid .wp-block-post-title,
.reisetipps-grid .wp-block-post-excerpt,
.reisetipps-grid .wp-block-post-date,
.reisetipps-grid .wp-block-post-author {
	padding-left: 1.25rem;
	padding-right: 1.25rem;
}

.reisetipps-grid .wp-block-post-terms {
	margin-top: 1rem;
	font-family: var(--wp--preset--font-family--ui);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--secondary);
}
.reisetipps-grid .wp-block-post-terms a { text-decoration: none; }

.reisetipps-grid .wp-block-post-title {
	font-size: var(--wp--preset--font-size--large);
	margin: 0.5rem 0;
	color: var(--wp--preset--color--ink);
}
.reisetipps-grid .wp-block-post-title a {
	color: var(--wp--preset--color--ink) !important;
	text-decoration: none;
}
.reisetipps-grid .wp-block-post-title a:hover {
	color: var(--wp--preset--color--primary) !important;
}

.reisetipps-grid .wp-block-post-excerpt {
	font-family: var(--wp--preset--font-family--body);
	color: var(--wp--preset--color--ink-soft);
	flex-grow: 1;
}

.reisetipps-grid .wp-block-post-date,
.reisetipps-grid .wp-block-post-author {
	padding-bottom: 1.25rem;
	font-family: var(--wp--preset--font-family--ui);
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--ink-soft);
}

/* --------------------------------------------------------------------
   Stamp / category badge (used inline in patterns + single template)
   -------------------------------------------------------------------- */
.reisetipps-stamp {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: var(--wp--preset--color--accent);
	color: #3F2C00;
	font-family: var(--wp--preset--font-family--ui);
	font-weight: 600;
	font-size: var(--wp--preset--font-size--x-small);
	padding: 0.4em 0.9em 0.4em 0.6em;
	border-radius: var(--wp--custom--radius--pill);
}

/* --------------------------------------------------------------------
   Article body (single posts) — comfortable long-form reading
   -------------------------------------------------------------------- */
.reisetipps-article {
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.75;
}
.reisetipps-article > * + * { margin-top: 1.4em; }
.reisetipps-article figure { margin: 2rem 0; }
.reisetipps-article figcaption {
	font-family: var(--wp--preset--font-family--ui);
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--ink-soft);
	text-align: center;
	margin-top: 0.5rem;
}
.reisetipps-article img { border-radius: var(--wp--custom--radius--md); }

/* Comfortable reading width on small screens too */
@media (max-width: 639px) {
	.reisetipps-article { font-size: 1rem; line-height: 1.7; }
}

/* --------------------------------------------------------------------
   Author bio + meta row
   -------------------------------------------------------------------- */
.reisetipps-meta-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem 1rem;
	font-family: var(--wp--preset--font-family--ui);
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--ink-soft);
}
.reisetipps-meta-row .sep { opacity: 0.5; }

/* --------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------- */
.site-footer a { text-decoration: none; }
.site-footer .wp-block-navigation {
	font-family: var(--wp--preset--font-family--ui);
	font-size: var(--wp--preset--font-size--small);
}

.reisetipps-category-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
}
.reisetipps-category-pills a {
	display: inline-block;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--border-color);
	border-radius: var(--wp--custom--radius--pill);
	padding: 0.5em 1.1em;
	font-family: var(--wp--preset--font-family--ui);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
}
.reisetipps-category-pills a:hover {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary-dark);
}

/* --------------------------------------------------------------------
   Responsive section rhythm
   -------------------------------------------------------------------- */
.reisetipps-section {
	padding-top: 3rem;
	padding-bottom: 3rem;
}
@media (min-width: 960px) {
	.reisetipps-section {
		padding-top: 5.5rem;
		padding-bottom: 5.5rem;
	}
}

/* Table of Contents styling lives in blocks/table-of-contents/style.css
   (loaded automatically by WordPress wherever the block is used). */

/* scroll position accounts for sticky header */
:target { scroll-margin-top: 96px; }
html { scroll-behavior: smooth; }

/* --------------------------------------------------------------------
   Newsletter / CTA pattern
   -------------------------------------------------------------------- */
.reisetipps-newsletter {
	background: var(--wp--preset--color--secondary);
	border-radius: var(--wp--custom--radius--lg);
	padding: 2.5rem 1.75rem;
	color: var(--wp--preset--color--white);
}
.reisetipps-newsletter input[type="email"] {
	width: 100%;
	padding: 0.85em 1.1em;
	border-radius: var(--wp--custom--radius--pill);
	border: none;
	font-family: var(--wp--preset--font-family--ui);
	font-size: var(--wp--preset--font-size--small);
}
@media (min-width: 640px) {
	.reisetipps-newsletter-form {
		display: flex;
		gap: 0.75rem;
		max-width: 460px;
	}
	.reisetipps-newsletter-form input[type="email"] { flex: 1; }
}

/* --------------------------------------------------------------------
   Reading progress bar (added by assets/js/main.js on article pages)
   -------------------------------------------------------------------- */
.reisetipps-progress {
	position: fixed;
	top: 0;
	left: 0;
	height: 3px;
	width: 0%;
	background: var(--wp--preset--color--primary);
	z-index: 50;
}
@media (prefers-reduced-motion: no-preference) {
	.reisetipps-progress { transition: width 0.1s linear; }
}

/* --------------------------------------------------------------------
   Print
   -------------------------------------------------------------------- */
@media print {
	.site-header, .site-footer, .reisetipps-newsletter, .wp-block-reisetipps-table-of-contents { display: none; }
}

/* ====================================================================
   SINGLE POST HERO — cover block with featured image + gradient overlay
   ==================================================================== */

/* Ensure cover sits flush under the sticky header */
.wp-block-cover.alignfull {
	margin-top: 0 !important;
}

/* Title inside hero: large, white, no link underline */
.wp-block-cover .wp-block-post-title {
	color: #ffffff !important;
	font-size: clamp(1.75rem, 4vw, 3rem) !important;
	line-height: 1.2 !important;
	text-decoration: none !important;
	margin-bottom: 0.75rem !important;
}

/* Meta row inside hero */
.reisetipps-hero-meta {
	color: rgba(255,255,255,0.8) !important;
	font-size: var(--wp--preset--font-size--small) !important;
}
.reisetipps-hero-meta * { color: rgba(255,255,255,0.8) !important; }
.reisetipps-hero-meta a { text-decoration: none !important; }
.reisetipps-hero-meta a:hover { color: #ffffff !important; }
.reisetipps-hero-meta .sep { opacity: 0.5; }

/* Category stamp inside hero */
.wp-block-cover .reisetipps-stamp { display: inline-flex; }

/* ====================================================================
   HERO COVER BLOCK — title always white, read-more as pill button
   ==================================================================== */

/* Post title inside cover: force white regardless of link colour */
.wp-block-cover .wp-block-post-title,
.wp-block-cover .wp-block-post-title a {
	color: #ffffff !important;
	text-decoration: none;
}

/* Excerpt inside cover */
.wp-block-cover .wp-block-post-excerpt * { color: #F3EAD8; }

/* "Artikel lesen" read-more styled as an orange pill button */
.reisetipps-hero-btn {
	display: inline-block;
	background: var(--wp--preset--color--primary);
	color: #ffffff !important;
	font-family: var(--wp--preset--font-family--ui);
	font-weight: 600;
	font-size: 1rem;
	padding: 0.85rem 1.8rem;
	border-radius: 999px;
	text-decoration: none !important;
	margin-top: 0.5rem;
	transition: background 0.2s;
}
.reisetipps-hero-btn:hover {
	background: var(--wp--preset--color--primary-dark);
	color: #ffffff !important;
}

/* ====================================================================
   DARK NAVY SECTIONS  (.reisetipps-dark-section)
   Used on: Am beliebtesten, site footer
   ==================================================================== */
.reisetipps-dark-section {
	--local-text:   #e8eaf6;
	--local-soft:   rgba(232,234,246,.55);
	--local-border: rgba(255,255,255,.12);
}

/* Base text */
.reisetipps-dark-section,
.reisetipps-dark-section p,
.reisetipps-dark-section li { color: var(--local-text); }

/* Headings */
.reisetipps-dark-section h1,
.reisetipps-dark-section h2,
.reisetipps-dark-section h3,
.reisetipps-dark-section h4 { color: #ffffff; }

/* Links */
.reisetipps-dark-section a {
	color: var(--local-text);
	text-decoration: none;
}
.reisetipps-dark-section a:hover { color: #ffffff; }

/* Muted hint text (e.g. "Tag 'beliebt' wird hier angezeigt") */
.reisetipps-dark-hint { color: var(--local-soft) !important; font-size: 0.875rem; }

/* Dark section uses a tighter vertical rhythm than editorial sections */
.reisetipps-dark-section.reisetipps-section {
	padding-top: 2rem;
	padding-bottom: 2rem;
}
@media (min-width: 960px) {
	.reisetipps-dark-section.reisetipps-section {
		padding-top: 3rem;
		padding-bottom: 3rem;
	}
}

/* Dark section: add horizontal padding so cards don't touch edges */
.reisetipps-dark-section .wp-block-query {
	padding-left: 0.5rem;
	padding-right: 0.5rem;
}

/* Article cards inside dark section — keep white card bg */
.reisetipps-dark-section .reisetipps-grid .wp-block-post {
	background: rgba(255,255,255,.06);
	border-color: var(--local-border);
}
.reisetipps-dark-section .reisetipps-grid .wp-block-post-title a,
.reisetipps-dark-section .reisetipps-grid .wp-block-post-title { color: #ffffff !important; }
.reisetipps-dark-section .reisetipps-grid .wp-block-post-excerpt,
.reisetipps-dark-section .reisetipps-grid .wp-block-post-date,
.reisetipps-dark-section .reisetipps-grid .wp-block-post-author { color: var(--local-soft) !important; }

/* Navigation in dark footer */
.site-footer .wp-block-navigation,
.site-footer .wp-block-navigation a { color: var(--local-text) !important; }
.site-footer .wp-block-navigation a:hover { color: #ffffff !important; }

/* Footer background + border override */
.site-footer {
	background: var(--wp--preset--color--navy) !important;
	border-top: none;
}

/* Footer widget columns */
.reisetipps-footer-widgets {
	padding-bottom: 2rem !important;
}

/* Footer divider accent line */
.reisetipps-footer-divider {
	width: 40px !important;
	height: 3px !important;
	border: none !important;
	margin-left: 0 !important;
}

/* Footer bottom bar — padding handled by the block's own spacing attributes */

/* Dynamic categories list in footer */
.reisetipps-footer-categories.wp-block-categories {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
}
.reisetipps-footer-categories.wp-block-categories li {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0.5rem 0;
	border-bottom: 1px solid rgba(255,255,255,0.08);
}
.reisetipps-footer-categories.wp-block-categories li:last-child {
	border-bottom: none;
}
.reisetipps-footer-categories.wp-block-categories a {
	color: rgba(232,234,246,0.85) !important;
	text-decoration: none !important;
	font-size: 0.9rem;
	font-weight: 600;
	transition: color 0.15s;
}
.reisetipps-footer-categories.wp-block-categories a:hover {
	color: #ffffff !important;
}
/* Post count: styled as a small badge */
.reisetipps-footer-categories.wp-block-categories .wp-block-categories__count,
.reisetipps-footer-categories.wp-block-categories li > span {
	background: rgba(255,255,255,0.1);
	color: rgba(232,234,246,0.7);
	font-size: 0.75rem;
	font-weight: 600;
	padding: 0.15em 0.55em;
	border-radius: 999px;
	margin-left: 0.5rem;
	white-space: nowrap;
}
.site-footer .has-ink-soft-color { color: var(--local-soft) !important; }

/* Category pills inside dark footer */
.site-footer .reisetipps-category-pills a {
	background: rgba(255,255,255,.1);
	border-color: var(--local-border);
	color: var(--local-text);
}
.site-footer .reisetipps-category-pills a:hover {
	background: rgba(255,255,255,.18);
	color: #ffffff;
	border-color: rgba(255,255,255,.3);
}

/* Newsletter form inside dark footer stays teal */
.site-footer .reisetipps-newsletter { background: rgba(255,255,255,.08); }

/* ====================================================================
   HEADER — centered logo + site title + icon navigation
   ==================================================================== */
.site-header {
	text-align: center;
}

.site-header__logo { margin: 0 auto; }

/* Site title displayed below the icon */
.site-header__title,
.site-header__title a {
	font-family: var(--wp--preset--font-family--display) !important;
	font-size: 1.1rem !important;
	font-weight: 800 !important;
	color: #1e2060 !important;
	text-decoration: none !important;
	letter-spacing: -0.02em;
	line-height: 1.1;
	margin: 0;
}
.site-header__title a:hover { color: var(--wp--preset--color--primary) !important; }

/* Give the nav links a bit of visual weight + spacing */
.site-header .wp-block-navigation a {
	padding: 0.3em 0.75em;
	border-radius: var(--wp--custom--radius--pill);
	font-size: 0.8125rem;
	letter-spacing: 0.01em;
	transition: background 0.18s, color 0.18s;
}
.site-header .wp-block-navigation a:hover {
	background: var(--wp--preset--color--paper-alt);
	color: var(--wp--preset--color--ink);
}

/* ====================================================================
   MAGENTA category badge (stamp variant)
   ==================================================================== */
.reisetipps-stamp--magenta {
	background: var(--wp--preset--color--magenta) !important;
	color: #ffffff !important;
}

/* Orange stamp — matches logo primary colour */
.reisetipps-stamp--orange {
	background: #F2712C !important;
	color: #ffffff !important;
}
.reisetipps-stamp--orange a,
.reisetipps-stamp--orange a:visited,
.reisetipps-stamp--orange a:hover {
	color: #ffffff !important;
	text-decoration: none !important;
}

/* ====================================================================
   DARK SECTION HEADER — centred intro above the grid
   ==================================================================== */
.reisetipps-dark-header {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
.reisetipps-dark-header .reisetipps-stamp {
	margin-bottom: 1rem;
}
/* Teal underline accent below the heading — echoes the wave in the logo */
.reisetipps-dark-header h2::after {
	content: '';
	display: block;
	width: 48px;
	height: 3px;
	background: #12B8CE;
	margin: 0.75rem auto 1rem;
	border-radius: 2px;
}

/* Dark section: category badges use logo orange instead of magenta */
.reisetipps-dark-section .reisetipps-grid .wp-block-post-terms a {
	background: #F2712C;
}
.reisetipps-dark-section .reisetipps-grid .wp-block-post-terms a:hover {
	background: #d45e1e;
}

/* Category terms in grids → magenta pill */
.reisetipps-grid .wp-block-post-terms a {
	display: inline-block;
	background: var(--wp--preset--color--magenta);
	color: #ffffff;
	padding: 0.2em 0.75em;
	border-radius: var(--wp--custom--radius--pill);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-decoration: none;
	margin-right: 0.25em;
	margin-bottom: 0.25em;
}
.reisetipps-grid .wp-block-post-terms a:hover {
	background: #b01259;
}

/* ====================================================================
   MAGAZINE LAYOUT — large featured card left + sidebar list right
   Two separate queries wrapped in reisetipps-magazine-wrap flex container.
   ==================================================================== */

/* Outer flex wrapper */
.reisetipps-magazine-wrap {
	display: flex !important;
	gap: 2rem !important;
	align-items: flex-start !important;
	flex-wrap: wrap;
}
.reisetipps-magazine-featured {
	flex: 3 1 280px;
	min-width: 0;
}
.reisetipps-magazine-sidebar {
	flex: 2 1 200px;
	min-width: 0;
}

@media (min-width: 700px) {
	.reisetipps-magazine-wrap { flex-wrap: nowrap; }
}

/* Featured hero card */
.reisetipps-magazine-hero.wp-block-post-template {
	margin: 0;
	padding: 0;
}
.reisetipps-magazine-hero .wp-block-post-featured-image {
	border-radius: var(--wp--custom--radius--md);
	overflow: hidden;
	margin-bottom: 0.75rem;
}
.reisetipps-magazine-hero .wp-block-post-terms {
	font-family: var(--wp--preset--font-family--ui);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--secondary);
	margin-bottom: 0.25rem;
}
.reisetipps-magazine-hero .wp-block-post-terms a { text-decoration: none; color: inherit; }
.reisetipps-magazine-hero .wp-block-post-title {
	font-size: var(--wp--preset--font-size--x-large) !important;
	margin: 0.25rem 0 0.5rem;
	line-height: 1.2;
}
.reisetipps-magazine-hero .wp-block-post-title a {
	color: var(--wp--preset--color--ink) !important;
	text-decoration: none;
}
.reisetipps-magazine-hero .wp-block-post-title a:hover {
	color: var(--wp--preset--color--primary) !important;
}
.reisetipps-magazine-hero .wp-block-post-excerpt {
	color: var(--wp--preset--color--ink-soft);
	margin-bottom: 0.5rem;
}
.reisetipps-magazine-hero .wp-block-post-date {
	font-family: var(--wp--preset--font-family--ui);
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--ink-soft);
}

/* Sidebar small cards */
.reisetipps-sidebar-cards.wp-block-post-template {
	margin: 0;
	padding: 0;
	display: flex !important;
	flex-direction: column !important;
	gap: 0 !important;
}
.reisetipps-sidebar-cards > li,
.reisetipps-sidebar-cards > .wp-block-post {
	margin: 0 !important;
	display: grid !important;
	grid-template-columns: 80px 1fr;
	gap: 0 0.75rem;
	align-items: start;
	border-bottom: 1px solid var(--wp--preset--color--border-color);
	padding: 0.6rem 0;
}
.reisetipps-sidebar-cards > li:first-child,
.reisetipps-sidebar-cards > .wp-block-post:first-child { padding-top: 0; }
.reisetipps-sidebar-cards > li:last-child,
.reisetipps-sidebar-cards > .wp-block-post:last-child { border-bottom: none; padding-bottom: 0; }

/* Thumbnail */
.reisetipps-sidebar-cards .wp-block-post-featured-image {
	grid-column: 1;
	grid-row: 1 / span 3;
	width: 80px;
	aspect-ratio: 1 / 1;
	border-radius: var(--wp--custom--radius--sm);
	overflow: hidden;
	align-self: start;
	margin: 0;
}
.reisetipps-sidebar-cards .wp-block-post-featured-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Text */
.reisetipps-sidebar-cards .wp-block-post-title,
.reisetipps-sidebar-cards .wp-block-post-date {
	grid-column: 2;
	padding: 0;
	margin: 0;
}
.reisetipps-sidebar-cards .wp-block-post-title {
	font-size: 0.9rem !important;
	font-weight: 700;
	line-height: 1.3;
	margin-bottom: 0.2rem !important;
}
.reisetipps-sidebar-cards .wp-block-post-title a {
	color: var(--wp--preset--color--ink) !important;
	text-decoration: none;
}
.reisetipps-sidebar-cards .wp-block-post-title a:hover {
	color: var(--wp--preset--color--primary) !important;
}
.reisetipps-sidebar-cards .wp-block-post-date {
	font-family: var(--wp--preset--font-family--ui);
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--ink-soft);
}

/* ====================================================================
   LOGO — larger on desktop
   ==================================================================== */
@media (min-width: 960px) {
	.site-header .wp-block-site-logo img {
		width: auto !important;
		max-height: 80px !important;
	}
	.site-header__title,
	.site-header__title a {
		font-size: 1.3rem !important;
	}
}

/* ====================================================================
   SINGLE POST — Option B: editorial split (text left / image right)
   ==================================================================== */
.reisetipps-post-hero-split {
	border-bottom: 1px solid var(--wp--preset--color--border-color);
	overflow: hidden;
}

/* Left text column */
.reisetipps-post-hero-text.wp-block-column {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 3rem 3.5rem 3rem 0;
}

.reisetipps-post-hero-text .wp-block-post-title {
	font-size: clamp(1.75rem, 3vw, 2.75rem) !important;
	line-height: 1.2 !important;
	color: var(--wp--preset--color--ink) !important;
	margin: 0 !important;
}

.reisetipps-post-hero-excerpt.wp-block-post-excerpt,
.reisetipps-post-hero-excerpt .wp-block-post-excerpt__excerpt {
	color: var(--wp--preset--color--ink-soft);
	font-size: var(--wp--preset--font-size--medium);
	margin: 0;
}

/* Meta row: author · date · reading-time */
.reisetipps-meta-row {
	font-family: var(--wp--preset--font-family--ui);
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--ink-soft);
}
.reisetipps-meta-row * { font-size: var(--wp--preset--font-size--x-small) !important; }
.reisetipps-meta-row a { color: var(--wp--preset--color--ink-soft) !important; text-decoration: none; }
.reisetipps-meta-row a:hover { color: var(--wp--preset--color--ink) !important; }
.reisetipps-meta-row .sep { opacity: 0.4; }

/* Right image column — fills height of the tallest column */
.reisetipps-post-hero-image.wp-block-column {
	overflow: hidden;
	padding: 0 !important;
	margin: 0 !important;
	align-self: stretch;
}
.reisetipps-post-hero-image .wp-block-post-featured-image {
	height: 100%;
	min-height: 380px;
}
.reisetipps-post-hero-image .wp-block-post-featured-image img,
.reisetipps-post-hero-image .wp-block-post-featured-image figure {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	margin: 0;
}

/* Mobile: stack text above image */
@media (max-width: 699px) {
	.reisetipps-post-hero-text.wp-block-column {
		padding: 1.5rem 1.5rem 1.25rem;
		order: 1;
	}
	.reisetipps-post-hero-image.wp-block-column {
		order: 0;
		min-height: 220px;
	}
	.reisetipps-post-hero-image .wp-block-post-featured-image { min-height: 220px; }
}

/* ====================================================================
   AUTHOR BIO — end-of-article card
   ==================================================================== */
.reisetipps-author-bio {
	border-top: 3px solid #F2712C;
	background: var(--wp--preset--color--paper, #faf8f4);
	border-radius: 12px;
	padding: 1.75rem !important;
	margin-top: 0 !important;
}
.reisetipps-author-bio__label {
	font-family: var(--wp--preset--font-family--ui) !important;
	font-size: var(--wp--preset--font-size--x-small) !important;
	font-weight: 700 !important;
	letter-spacing: 0.08em !important;
	text-transform: uppercase !important;
	color: #F2712C !important;
	margin: 0 0 1rem !important;
}
.reisetipps-author-bio__inner {
	gap: 1.25rem !important;
}
/* Hide the duplicate avatar-block's name/bio text */
.reisetipps-author-bio__avatar-block .wp-block-post-author__name,
.reisetipps-author-bio__avatar-block .wp-block-post-author__bio { display: none; }
.reisetipps-author-bio__avatar-block .wp-block-post-author__avatar img {
	border-radius: 50%;
	border: 3px solid #F2712C;
	width: 72px !important;
	height: 72px !important;
	object-fit: cover;
}
.reisetipps-author-bio__name .wp-block-post-author__name {
	font-size: 1.1rem !important;
	font-weight: 700 !important;
	color: var(--wp--preset--color--ink) !important;
	margin: 0 0 0.35rem !important;
}
/* Hide avatar in text column */
.reisetipps-author-bio__name .wp-block-post-author__avatar { display: none; }
.reisetipps-author-bio__desc {
	color: var(--wp--preset--color--ink-soft) !important;
	line-height: 1.6 !important;
}

/* ====================================================================
   AFFILIATE NOTE — inline disclosure below article body
   ==================================================================== */
.reisetipps-affiliate-note {
	background: #fff8f0;
	border: 1px solid #F2712C40;
	border-left: 4px solid #F2712C;
	border-radius: 8px;
	padding: 0.9rem 1.1rem !important;
	gap: 0.75rem !important;
}
.reisetipps-affiliate-note__icon {
	font-size: 1.1rem !important;
	color: #F2712C !important;
	flex-shrink: 0;
	margin: 0 !important;
	line-height: 1.6 !important;
}
.reisetipps-affiliate-note__text {
	font-family: var(--wp--preset--font-family--ui) !important;
	font-size: var(--wp--preset--font-size--x-small) !important;
	color: var(--wp--preset--color--ink-soft) !important;
	margin: 0 !important;
	line-height: 1.6 !important;
}

/* ====================================================================
   RELATED POSTS SECTION — single post bottom
   ==================================================================== */
.reisetipps-related-section {
	border-top: 1px solid var(--wp--preset--color--border-color, #e6d9be);
	padding-top: 3.5rem !important;
	padding-bottom: 3.5rem !important;
}
@media (min-width: 960px) {
	.reisetipps-related-section {
		padding-top: 5rem !important;
		padding-bottom: 5rem !important;
	}
}

/* ====================================================================
   SINGLE POST — Option C: centred overlay panel on hero image
   ==================================================================== */
.reisetipps-hero-panel {
	padding: 2.75rem 1rem !important;
	text-align: center;
	margin: 0 auto;
}
.reisetipps-hero-panel .wp-block-post-title {
	font-size: clamp(1.75rem, 3.5vw, 3rem) !important;
	line-height: 1.15 !important;
	color: #ffffff !important;
	margin: 0 !important;
}
.reisetipps-hero-panel .wp-block-post-excerpt,
.reisetipps-hero-panel .wp-block-post-excerpt p {
	color: rgba(255,255,255,0.82) !important;
	margin: 0 !important;
}
.reisetipps-hero-panel .reisetipps-stamp {
	display: inline-flex;
}
/* Light meta row for dark backgrounds */
.reisetipps-meta-row--light,
.reisetipps-meta-row--light * {
	color: rgba(255,255,255,0.75) !important;
	font-size: var(--wp--preset--font-size--x-small) !important;
}
.reisetipps-meta-row--light a { text-decoration: none !important; }
.reisetipps-meta-row--light a:hover { color: #ffffff !important; }
.reisetipps-meta-row--light .sep { opacity: 0.4; }

@media (max-width: 699px) {
	.reisetipps-hero-panel {
		padding: 1.75rem 1.5rem !important;
		border-radius: 12px;
	}
}

/* ====================================================================
   FOOTER BOTTOM BAR — copyright + nav links
   ==================================================================== */
.reisetipps-footer-bottom-inner {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 0.75rem 1rem !important;
}
.reisetipps-footer-copy {
	font-size: var(--wp--preset--font-size--x-small) !important;
	color: rgba(232,234,246,0.5) !important;
	margin: 0 !important;
}
.reisetipps-footer-links {
	gap: 0.25rem 1.5rem !important;
}
.reisetipps-footer-links p {
	margin: 0 !important;
	font-size: var(--wp--preset--font-size--x-small) !important;
}
.reisetipps-footer-links a {
	color: rgba(232,234,246,0.6) !important;
	text-decoration: none !important;
}
.reisetipps-footer-links a:hover {
	color: #ffffff !important;
}

/* ====================================================================
   SINGLE POST — breadcrumb row (Startseite › Kategorie · leestijd)
   ==================================================================== */
.reisetipps-breadcrumb {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	gap: 0 0.35rem !important;
	font-size: 0.78rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.06em !important;
	text-transform: uppercase !important;
	color: var(--wp--preset--color--muted, #666) !important;
	margin-bottom: 0 !important;
}
.reisetipps-breadcrumb p {
	margin: 0 !important;
	font-size: inherit !important;
	font-weight: inherit !important;
	color: inherit !important;
}
.reisetipps-breadcrumb a {
	color: inherit !important;
	text-decoration: none !important;
}
.reisetipps-breadcrumb a:hover {
	color: var(--wp--preset--color--primary, #F2712C) !important;
}
/* The category term in breadcrumb gets the orange accent */
.reisetipps-breadcrumb .wp-block-post-terms a {
	color: var(--wp--preset--color--primary, #F2712C) !important;
	text-decoration: none !important;
}
.reisetipps-breadcrumb .wp-block-post-terms {
	color: var(--wp--preset--color--primary, #F2712C) !important;
}
/* Reading time pill inside breadcrumb */
.reisetipps-breadcrumb .reisetipps-reading-time {
	color: inherit !important;
	background: none !important;
	padding: 0 !important;
	font-weight: inherit !important;
	font-size: inherit !important;
	letter-spacing: inherit !important;
	text-transform: inherit !important;
}