/*
Theme Name:   CITSK Theme
Theme URI:    https://citsk.de
Description:  Professionelles IT-Systemhaus Theme für CITSK
Author:       CITSK IT-Systemhaus
Template:     twentytwentyfive
Version:      1.0.1
Text Domain:  citsk-theme
*/

/* ===================================================
   CITSK Single-Post Layout Fix
   =================================================== */

/* Post-Content: Padding links/rechts damit Text nicht am Rand klebt */
.single .wp-block-post-content,
.single .entry-content,
.wp-block-post-content {
	padding-left: max(20px, env(safe-area-inset-left));
	padding-right: max(20px, env(safe-area-inset-right));
}

/* Auf groesseren Screens zentriert mit max-width */
@media (min-width: 600px) {
	.single .wp-block-post-content,
	.single .entry-content {
		padding-left: clamp(24px, 5vw, 48px);
		padding-right: clamp(24px, 5vw, 48px);
	}
}

/* Post-Titel ebenfalls padden */
.single .wp-block-post-title,
.single h1.wp-block-post-title {
	padding-left: clamp(20px, 5vw, 48px);
	padding-right: clamp(20px, 5vw, 48px);
}

/* Post-Meta (Verfasst von ...) - muss auch Padding haben */
.single .wp-block-group .wp-block-post-author,
.single .entry-meta,
.single .wp-block-group:not([class*="alignfull"]) {
	padding-left: clamp(20px, 5vw, 48px);
	padding-right: clamp(20px, 5vw, 48px);
}

/* 'Verfasst von' Flex-Gruppe - hat kein global-padding */
.single .wp-block-group.is-layout-flex:not([class*="alignfull"]),
.single .wp-block-group.has-small-font-size.is-layout-flex {
	padding-left: clamp(20px, 5vw, 48px);
	padding-right: clamp(20px, 5vw, 48px);
}

/* ===================================================
   Typografie: H2 in Blog-Posts
   =================================================== */

.single .wp-block-post-content h2 {
	font-size: clamp(1.25rem, 2.5vw, 1.6rem);
	font-weight: 700;
	color: #191e2d;
	margin-top: 2rem;
	margin-bottom: 0.75rem;
}

.single .wp-block-post-content h3 {
	font-size: clamp(1.1rem, 2vw, 1.3rem);
	font-weight: 600;
	color: #2372e1;
	margin-top: 1.5rem;
	margin-bottom: 0.5rem;
}

.single .wp-block-post-content p {
	line-height: 1.8;
	color: #3a3f52;
	margin-bottom: 1.1rem;
}

.single .wp-block-post-content ul,
.single .wp-block-post-content ol {
	padding-left: 1.5rem;
	margin-bottom: 1rem;
	line-height: 1.8;
	color: #3a3f52;
}

.single .wp-block-post-content strong {
	color: #191e2d;
}

/* Call-to-Action Boxen in Posts */
.single .wp-block-post-content .cta-box,
.single .wp-block-post-content [style*="background"] {
	border-radius: 8px;
}

/* ===================================================
   Weitere Artikel / Related Posts Section (native blocks)
   =================================================== */

/* Native block related section */
.citsk-related-section,
.citsk-related-section.wp-block-group {
	background: #f4f6fb !important;
	background-color: #f4f6fb !important;
}

.citsk-related-inner > h2,
.citsk-related-inner .wp-block-heading {
	color: #191e2d !important;
	margin-bottom: 2rem;
	text-align: center;
}

/* Add pre-label via pseudo before heading */
.citsk-related-inner .wp-block-heading::before {
	content: 'Weitere Artikel';
	display: block;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #ff5019;
	margin-bottom: 10px;
}

.citsk-related-card,
.citsk-related-card.wp-block-group {
	box-shadow: 0 2px 16px rgba(25,30,45,0.09) !important;
	transition: box-shadow 0.2s, transform 0.2s;
	background: #fff !important;
	background-color: #fff !important;
	border-radius: 12px !important;
}

.citsk-related-card:hover {
	box-shadow: 0 6px 24px rgba(25,30,45,0.15) !important;
	transform: translateY(-3px);
}

.citsk-related-card .wp-block-post-title a {
	color: #191e2d !important;
	text-decoration: none;
}

.citsk-related-card .wp-block-post-title a:hover {
	color: #ff5019 !important;
}

.citsk-related-card .wp-block-read-more {
	color: #ff5019 !important;
	font-weight: 700;
	text-decoration: none;
	margin-top: auto;
}

.citsk-related-card .wp-block-post-date {
	color: #8a91a8 !important;
	font-size: 0.78rem !important;
}

.citsk-related-card .wp-block-post-excerpt__excerpt {
	color: #5a6070 !important;
	font-size: 0.88rem !important;
	line-height: 1.6;
}

/* Alle Artikel lesen button */
.citsk-related-inner .wp-block-buttons {
	margin-top: 2rem;
}

.citsk-related-inner .wp-block-button__link {
	background: #ff5019 !important;
	color: #fff !important;
	border-radius: 8px !important;
	font-weight: 700 !important;
	padding: 14px 36px !important;
	transition: background 0.2s;
}

.citsk-related-inner .wp-block-button__link:hover {
	background: #c93e10 !important;
}

/* Legacy JS-based section (kept for compatibility) */
.citsk-more-posts-wrapper {
	background: #f4f6fb;
	padding: 64px 0;
	margin-top: 48px;
}

.citsk-more-posts-inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 clamp(20px, 5vw, 48px);
}

.citsk-more-posts-header {
	text-align: center;
	margin-bottom: 40px;
}

.citsk-more-posts-pre {
	display: block;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #ff5019;
	margin-bottom: 10px;
}

.citsk-more-posts-title {
	font-size: clamp(1.4rem, 3vw, 1.9rem);
	font-weight: 800;
	color: #191e2d;
	margin: 0;
}

.citsk-more-posts-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

@media (max-width: 768px) {
	.citsk-more-posts-grid {
		grid-template-columns: 1fr;
	}
}

@media (min-width: 769px) and (max-width: 1024px) {
	.citsk-more-posts-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

.citsk-more-post-card {
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 2px 12px rgba(25,30,45,0.07);
	transition: box-shadow 0.2s, transform 0.2s;
	overflow: hidden;
}

.citsk-more-post-card:hover {
	box-shadow: 0 6px 24px rgba(25,30,45,0.13);
	transform: translateY(-3px);
}

.citsk-more-post-card__body {
	padding: 24px 28px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.citsk-more-post-card__date {
	font-size: 0.78rem;
	color: #8a91a8;
	font-weight: 500;
}

.citsk-more-post-card__title {
	font-size: 1rem;
	font-weight: 700;
	color: #191e2d;
	margin: 0;
	line-height: 1.4;
}

.citsk-more-post-card__title a {
	color: inherit;
	text-decoration: none;
}

.citsk-more-post-card__title a:hover {
	color: #ff5019;
}

.citsk-more-post-card__excerpt {
	font-size: 0.88rem;
	color: #5a6070;
	line-height: 1.6;
	margin: 0;
}

.citsk-more-post-card__link {
	display: inline-block;
	margin-top: 8px;
	font-size: 0.85rem;
	font-weight: 700;
	color: #ff5019;
	text-decoration: none;
	letter-spacing: 0.01em;
}

.citsk-more-post-card__link:hover {
	color: #c93e10;
}

.citsk-more-posts-cta {
	text-align: center;
	margin-top: 40px;
}

.citsk-more-posts-btn {
	display: inline-block;
	background: #ff5019;
	color: #fff;
	padding: 14px 36px;
	border-radius: 8px;
	font-weight: 700;
	font-size: 0.95rem;
	text-decoration: none;
	transition: background 0.2s;
	letter-spacing: 0.01em;
}

.citsk-more-posts-btn:hover {
	background: #c93e10;
	color: #fff;
}
