/*
Theme Name: Castilo Child
Description: Child theme for the Castilo Theme
Author: Liviu Cerchez
Author URI: http://themeforest.net/user/liviu_cerchez
Template: castilo
Version: 0.1
*/

/* Google Fonts: Barlow / Barlow Condensed */
@import url("https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;500;600;700&family=Barlow:wght@400;500;600&display=swap");

/* Grundfarben Social Media Schnack */
:root {
	--schnack-theme: #e1306c;
	--schnack-secondary: #1da1f2;
	--schnack-title: #1a1a2e;
}

body {
	font-family: "Barlow", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
		Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	color: #262626;
}

.default-theme-fonts h1,
.default-theme-fonts h2,
.default-theme-fonts h3,
.default-theme-fonts h4,
.default-theme-fonts h5,
.default-theme-fonts h6 {
	font-family: "Barlow Condensed", "Oswald", sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

a,
.post-meta a,
.entry-title a {
	color: var(--schnack-theme);
}

a:hover,
a:focus {
	color: var(--schnack-secondary);
}

button,
input[type="submit"],
.btn,
.button,
.site-main .pagination .page-numbers.current,
.site-main .pagination .page-numbers:hover {
	/* Farben kommen aus dem Parent-Theme (inkl. #cc00aa für .button-color) */
	font-family: "Barlow Condensed", sans-serif;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	border-radius: 999px;
	padding: 0.9em 2.5em;
	font-size: 0.9rem;
}

/* Buttons in Widgets (z. B. „Abonnieren?“) einheitlich vollbreit */
.widget .button,
.widget button,
.widget input[type="button"],
.widget input[type="reset"],
.widget input[type="submit"] {
	display: block;
	width: 100%;
	text-align: center;
	margin-bottom: 0.75rem;
}

/* Header / Navbar */
.navbar {
	background-color: #ffffff;
	border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.navbar .site-title {
	padding-top: 12px;
	padding-bottom: 12px;
}

.schnack-logo-link {
	display: inline-flex;
	align-items: center;
}

.schnack-logo-img {
	max-height: 60px;
	width: auto;
	height: auto;
	display: block;
}

.navbar .main-navigation > ul > li > a {
	font-family: "Barlow Condensed", sans-serif;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--schnack-title);
}

.navbar .main-navigation > ul > li.current-menu-item > a,
.navbar .main-navigation > ul > li > a:hover {
	color: var(--schnack-theme);
}

/* Call-to-action Button im Header */
.navbar .menu-cta a,
.navbar .menu-cta button {
	background-color: var(--schnack-secondary);
	border-color: var(--schnack-secondary);
	color: #ffffff;
	font-family: "Barlow Condensed", sans-serif;
	font-weight: 600;
	text-transform: uppercase;
}

.navbar .menu-cta a:hover,
.navbar .menu-cta button:hover {
	background-color: var(--schnack-theme);
	border-color: var(--schnack-theme);
}

/* Featured/Hero-Bereich leicht abdunkeln, damit es zum neuen Farbschema passt */
.featured-content {
	color: #ffffff;
}

.featured-content .entry-title {
	color: #ffffff;
	font-family: "Barlow Condensed", sans-serif;
	text-transform: uppercase;
}

/* Startseiten-Hero im Schnack-Stil
   Hinweis: Das Episoden-Cover kommt als Hintergrundbild aus dem Parent-Theme.
   Wir legen nur Typo/Abstände und lassen das Cover sichtbar. */
body.home #featured.featured-content {
	color: #ffffff;
	padding-top: 4rem;
	padding-bottom: 4rem;
}

body.home #featured .latest-episode {
	max-width: 720px;
}

body.home #featured .latest-episode p.big {
	font-family: "Barlow Condensed", sans-serif;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #cc00aa;
	margin-bottom: 0.5rem;
}

body.home #featured .latest-episode .entry-title {
	font-size: 3.2rem;
	line-height: 1.1;
	color: #ffffff;
	margin-bottom: 0.75rem;
}

@media (min-width: 992px) {
	body.home #featured .latest-episode .entry-title {
		font-size: 3.6rem;
	}
}

body.home #featured .latest-episode p {
	color: rgba(255, 255, 255, 0.9);
}

body.home #featured .latest-episode a.button,
body.home #featured .latest-episode .wp-block-button__link {
	background-color: #cc00aa;
	border-color: #cc00aa;
	border-radius: 999px;
	padding: 0.75rem 1.75rem;
	font-family: "Barlow Condensed", sans-serif;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

body.home #featured .latest-episode a.button:hover,
body.home #featured .latest-episode .wp-block-button__link:hover {
	background-color: var(--schnack-secondary);
}

/* Footer im Schnack-Stil */
#footer {
	background-color: #050816;
	color: rgba(255, 255, 255, 0.85);
}

#footer .widget-title {
	color: #ffffff;
	font-family: "Barlow Condensed", sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 0.95rem;
}

#footer a {
	color: rgba(255, 255, 255, 0.85);
}

#footer a:hover {
	color: var(--schnack-secondary);
}

#footer .copyright {
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	margin-top: 2.5rem;
	padding-top: 1.5rem;
	font-size: 0.8rem;
	color: rgba(255, 255, 255, 0.6);
}

/* Einzelne Episoden – Header im Schnack-Stil angleichen.
   Das Episoden-Cover wird als Hintergrundbild verwendet,
   wir kümmern uns nur um Typografie und Abstände. */
body.single-episode #featured.featured-content {
	color: #ffffff;
	padding-top: 3.5rem;
	padding-bottom: 3.5rem;
}

body.single-episode #featured .entry-title {
	font-family: "Barlow Condensed", sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #ffffff;
}

body.single-episode #featured .meta-entry,
body.single-episode #featured .meta-entry a {
	color: rgba(255, 255, 255, 0.8);
}

/* Blog-Artikel: Hero-Bereich anpassen */
body.single-post #featured.featured-content {
	background-color: #1a1a2e;
	background-blend-mode: multiply;
	color: #ffffff;
	padding-top: 3.5rem;
	padding-bottom: 3.5rem;
}

body.single-post #featured .entry-title {
	font-family: "Barlow Condensed", sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #ffffff;
	font-size: 2.3rem;
	line-height: 1.2;
}

@media (min-width: 992px) {
	body.single-post #featured .entry-title {
		font-size: 2.6rem;
	}
}

body.single-post #featured .entry-meta,
body.single-post #featured .entry-meta a {
	color: rgba(255, 255, 255, 0.8);
}

/* ========================================
   Startseite – Episodenliste (Cards)
======================================== */

body.home .episodes-listing {
	margin-top: 3rem;
}

body.home .episodes-listing .entry.entry-episode {
	background-color: #ffffff;
	border-radius: 18px;
	padding: 1.75rem 1.75rem;
	box-shadow: 0 18px 45px rgba(3, 10, 26, 0.12);
	margin-bottom: 2.25rem;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

body.home .episodes-listing .entry.entry-episode:hover {
	transform: translateY(-4px);
	box-shadow: 0 26px 60px rgba(3, 10, 26, 0.18);
}

body.home .episodes-listing .entry.entry-episode .entry-media.entry-image {
	border-radius: 16px;
	overflow: hidden;
}

body.home
	.episodes-listing
	.entry.entry-episode
	.entry-media.entry-image
	img {
	display: block;
	width: 100%;
	height: auto;
	transform: scale(1);
	transition: transform 0.35s ease;
}

body.home
	.episodes-listing
	.entry.entry-episode:hover
	.entry-media.entry-image
	img {
	transform: scale(1.03);
}

body.home .episodes-listing .entry.entry-episode .entry-header {
	margin-bottom: 0.75rem;
}

body.home .episodes-listing .entry.entry-episode .entry-header .entry-title {
	font-family: "Barlow Condensed", sans-serif;
	font-size: 1.4rem;
	line-height: 1.25;
	text-transform: none;
	color: var(--schnack-title);
	margin-bottom: 0.35rem;
}

body.home
	.episodes-listing
	.entry.entry-episode
	.entry-header
	.entry-title
	a {
	color: inherit;
	text-decoration: none;
}

body.home
	.episodes-listing
	.entry.entry-episode
	.entry-header
	.entry-title
	a:hover {
	color: var(--schnack-theme);
}

body.home .episodes-listing .entry.entry-episode .entry-meta {
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: rgba(13, 19, 33, 0.55);
	margin-bottom: 0.5rem;
}

body.home .episodes-listing .entry.entry-episode .entry-content p {
	margin-bottom: 0;
	color: #5a6475;
}

body.home .episodes-listing .pagination-load-more {
	text-align: center;
	margin-top: 1.5rem;
}

body.home .episodes-listing .pagination-load-more .button.button-filled {
	border-radius: 999px;
	padding-inline: 2.5rem;
	font-family: "Barlow Condensed", sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

@media (max-width: 767.98px) {
	body.home .episodes-listing .entry.entry-episode {
		padding: 1.4rem 1.4rem;
	}

	body.home .episodes-listing .entry.entry-episode .row > div {
		margin-bottom: 1rem;
	}
}

/* ========================================
   Startseite – Latest News Section
======================================== */

body.home .latest-news {
	background-image: linear-gradient(
			135deg,
			rgba(25, 18, 52, 0.98),
			rgba(225, 48, 108, 0.95)
		);
	color: #ffffff;
}

body.home .latest-news .add-separator span {
	font-family: "Barlow Condensed", sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	font-size: 0.9rem;
	color: rgba(255, 255, 255, 0.8);
}

body.home .latest-news .entry-title a {
	color: #ffffff;
	text-decoration: none;
}

body.home .latest-news .entry-title a:hover {
	color: #ffe7f2;
}

body.home .latest-news .entry-meta,
body.home .latest-news .entry-meta a {
	color: rgba(255, 255, 255, 0.8);
}

body.home .latest-news .entry-content p {
	color: rgba(255, 255, 255, 0.9);
}

body.home .latest-news .entry-content .read-more {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	font-family: "Barlow Condensed", sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.16em;
	font-size: 0.78rem;
	color: #ffffff;
}

body.home .latest-news .entry-content .read-more:hover {
	color: #ffe7f2;
}

/* ========================================
   Episoden-Archiv / Episoden-Seiten
======================================== */

/* Karten-Layout auch auf Episoden-Archivseite verwenden */
.post-type-archive-episode .episodes-listing .entry.entry-episode,
.page-template-template-episodes .episodes-listing .entry.entry-episode {
	background-color: #ffffff;
	border-radius: 18px;
	padding: 1.75rem 1.75rem;
	box-shadow: 0 18px 45px rgba(3, 10, 26, 0.12);
	margin-bottom: 2.25rem;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.post-type-archive-episode .episodes-listing .entry.entry-episode:hover,
.page-template-template-episodes .episodes-listing .entry.entry-episode:hover {
	transform: translateY(-4px);
	box-shadow: 0 26px 60px rgba(3, 10, 26, 0.18);
}

.post-type-archive-episode .episodes-listing .entry.entry-episode .entry-header .entry-title,
.page-template-template-episodes
	.episodes-listing
	.entry.entry-episode
	.entry-header
	.entry-title {
	font-family: "Barlow Condensed", sans-serif;
	font-size: 1.4rem;
	line-height: 1.25;
	text-transform: none;
	color: var(--schnack-title);
}

.post-type-archive-episode
	.episodes-listing
	.entry.entry-episode
	.entry-header
	.entry-title
	a,
.page-template-template-episodes
	.episodes-listing
	.entry.entry-episode
	.entry-header
	.entry-title
	a {
	color: inherit;
	text-decoration: none;
}

.post-type-archive-episode
	.episodes-listing
	.entry.entry-episode
	.entry-header
	.entry-title
	a:hover,
.page-template-template-episodes
	.episodes-listing
	.entry.entry-episode
	.entry-header
	.entry-title
	a:hover {
	color: var(--schnack-theme);
}

/* ========================================
   Blog / Archiv – Beitragskarten
======================================== */

.blog .entry.entry-post,
.archive.category .entry.entry-post {
	background-color: #ffffff;
	border-radius: 18px;
	padding: 1.5rem 1.5rem;
	box-shadow: 0 16px 40px rgba(3, 10, 26, 0.08);
	margin-bottom: 2rem;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.blog .entry.entry-post:hover,
.archive.category .entry.entry-post:hover {
	transform: translateY(-3px);
	box-shadow: 0 22px 55px rgba(3, 10, 26, 0.16);
}

.blog .entry.entry-post .entry-title,
.archive.category .entry.entry-post .entry-title {
	font-family: "Barlow Condensed", sans-serif;
	font-size: 1.6rem;
	line-height: 1.25;
	color: var(--schnack-title);
}

.blog .entry.entry-post .entry-title a,
.archive.category .entry.entry-post .entry-title a {
	color: inherit;
	text-decoration: none;
}

.blog .entry.entry-post .entry-title a:hover,
.archive.category .entry.entry-post .entry-title a:hover {
	color: var(--schnack-theme);
}

.blog .entry.entry-post .entry-meta,
.blog .entry.entry-post .entry-meta a,
.archive.category .entry.entry-post .entry-meta,
.archive.category .entry.entry-post .entry-meta a {
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: rgba(13, 19, 33, 0.55);
}

.blog .entry.entry-post .entry-content p,
.archive.category .entry.entry-post .entry-content p {
	color: #5a6475;
}

/* ========================================
   Single Post / Seite – Lesbarkeit
======================================== */

.single-post .entry.entry-post .entry-title,
.page .entry.entry-page .entry-title {
	font-family: "Barlow Condensed", sans-serif;
	font-size: 2.2rem;
	line-height: 1.2;
	color: var(--schnack-title);
}

.single-post .entry.entry-post .entry-content,
.page .entry.entry-page .entry-content {
	font-size: 1.02rem;
	line-height: 1.8;
	color: #333a48;
}

.single-post .entry.entry-post .entry-content a,
.page .entry.entry-page .entry-content a {
	color: var(--schnack-theme);
}

.single-post .entry.entry-post .entry-content a:hover,
.page .entry.entry-page .entry-content a:hover {
	color: var(--schnack-secondary);
}

/* ========================================
   Hero-Overlays: Episoden-Cover sichtbar lassen
======================================== */

/* Auf Startseite und Einzel-Episoden das Overlay deutlich transparenter,
   damit das jeweilige Cover im Hintergrund gut zu erkennen ist. */
body.home .featured-content:after,
body.single-episode .featured-content:after {
	opacity: 0.25;
}

/* ========================================
   Blog-Seite (/blog/) – Karten & Read-More
   (Seite mit Template "template-posts.php")
======================================== */

/* Kartenlayout analog zu Blog-/Kategorie-Archiv */
.page-template-template-posts .entry.entry-post {
	background-color: #ffffff;
	border-radius: 18px;
	padding: 1.5rem 1.5rem;
	box-shadow: 0 16px 40px rgba(3, 10, 26, 0.08);
	margin-bottom: 2rem;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.page-template-template-posts .entry.entry-post:hover {
	transform: translateY(-3px);
	box-shadow: 0 22px 55px rgba(3, 10, 26, 0.16);
}

.page-template-template-posts .entry.entry-post .entry-title {
	font-family: "Barlow Condensed", sans-serif;
	font-size: 1.6rem;
	line-height: 1.25;
	color: var(--schnack-title);
}

.page-template-template-posts .entry.entry-post .entry-title a {
	color: inherit;
	text-decoration: none;
}

.page-template-template-posts .entry.entry-post .entry-title a:hover {
	color: var(--schnack-theme);
}

.page-template-template-posts .entry.entry-post .entry-meta,
.page-template-template-posts .entry.entry-post .entry-meta a {
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: rgba(13, 19, 33, 0.55);
}

.page-template-template-posts .entry.entry-post .entry-content p {
	color: #5a6475;
}

/* Read-More-Link optisch wie kleiner CTA */
.page-template-template-posts .entry.entry-post .entry-content .read-more {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	font-family: "Barlow Condensed", sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.16em;
	font-size: 0.78rem;
	color: var(--schnack-theme);
	text-decoration: none;
}

.page-template-template-posts .entry.entry-post .entry-content .read-more:hover {
	color: var(--schnack-secondary);
}

/* Hero-Bereich der Blog-Seite etwas kräftiger, wie bei Single-Posts */
body.page-template-template-posts #featured.featured-content {
	background-color: #1a1a2e;
	background-blend-mode: multiply;
	color: #ffffff;
	padding-top: 3.5rem;
	padding-bottom: 3.5rem;
}

body.page-template-template-posts #featured .entry-title {
	font-family: "Barlow Condensed", sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #ffffff;
	font-size: 2.1rem;
	line-height: 1.2;
}
