/*
Theme Name: Jörg & Kuster
Theme URI: https://joerg-kuster.ch/
Author: Jörg & Kuster AG
Description: Reduziertes Block-Theme für die Jörg & Kuster AG, Architektur, Bauleitung und Bauherrenberatung in Degersheim. Mit Projekt-Inhaltstyp, Kategorien und Projektfilter. Benötigt keine weiteren Plugins.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: joerg-kuster
*/

/* Kleine Ergänzungen, die sich in theme.json nicht ausdrücken lassen. */

html { scroll-behavior: smooth; }

.jk-label {
	font-size: 12px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.jk-rule {
	border-top: 1px solid var(--wp--preset--color--anthrazit);
	padding-top: 20px;
}

/* Textlink mit Goldunterstrich */
.is-style-jk-link a,
a.jk-link {
	text-decoration: none;
	border-bottom: 2px solid var(--wp--preset--color--gold);
	padding: 8px 0 4px;
	font-weight: 500;
}

/* Hauptnavigation: aktiver Menüpunkt */
.jk-header .wp-block-navigation-item.current-menu-item > a,
.jk-header .wp-block-navigation-item a[aria-current="page"] {
	border-bottom: 2px solid var(--wp--preset--color--gold);
	padding-bottom: 4px;
}
.jk-header .wp-block-navigation a { text-decoration: none; }
.jk-header .wp-block-navigation a:hover { color: var(--wp--preset--color--grau); }

/* Projektfilter */
.jk-filter {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 28px;
	border-top: 1px solid var(--wp--preset--color--anthrazit);
	padding-top: 12px;
	margin: 0;
}
.jk-filter a {
	display: inline-block;
	padding: 10px 0 6px;
	min-height: 28px;
	font-size: 15px;
	color: var(--wp--preset--color--grau);
	text-decoration: none;
	border-bottom: 2px solid transparent;
}
.jk-filter a:hover { color: var(--wp--preset--color--anthrazit); }
.jk-filter a[aria-current="page"] {
	color: var(--wp--preset--color--anthrazit);
	border-bottom-color: var(--wp--preset--color--gold);
}
.jk-filter .jk-filter__count {
	margin-left: auto;
	font-size: 13px;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--grau);
}

/* Projektkarten */
.jk-card .wp-block-post-featured-image img { background: var(--wp--preset--color--hellgrau); }
.jk-card .wp-block-post-title a { text-decoration: none; }
.jk-card .wp-block-post-terms a { color: inherit; text-decoration: none; pointer-events: none; }
.jk-card .jk-noimg {
	aspect-ratio: 4 / 3;
	background: var(--wp--preset--color--hellgrau);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--wp--preset--color--grau);
	font-size: 13px;
}

/* Laufende Projekte: Markierung in der Kategorieliste hervorheben */
.wp-block-post-terms a[href*="laufend"] { color: var(--wp--preset--color--gold-dunkel); }

/* Bilder in Rastern sauber beschneiden */
.jk-cover-img img { width: 100%; height: 100%; object-fit: cover; }

/* Liste mit Linien (Kernkompetenzen) */
.is-style-jk-lines {
	list-style: none;
	padding-left: 0;
	border-top: 1px solid var(--wp--preset--color--linie);
}
.is-style-jk-lines li {
	padding: 12px 0;
	border-bottom: 1px solid var(--wp--preset--color--linie);
}

/* Team */
.jk-team .wp-block-image img { aspect-ratio: 4 / 5; object-fit: cover; object-position: top; width: 100%; }
.jk-team .jk-portrait-leer {
	width: 100%;
	aspect-ratio: 4 / 5;
	background: var(--wp--preset--color--hellgrau);
}

/* Fusszeile */
.jk-footer a { text-decoration: none; }

@media (max-width: 781px) {
	.jk-hero-title { font-size: 56px !important; }
}

/* Bilder mit festem Seitenverhältnis füllen immer die ganze Breite */
.wp-block-image img[style*="aspect-ratio"] { width: 100%; }
.wp-block-column > .wp-block-image { width: 100%; }

/* Projektseite */
.jk-lead { max-width: 640px; }
.wp-block-post-navigation-link a { text-decoration: none; }
.wp-block-post-navigation-link .post-navigation-link__label { color: var(--wp--preset--color--grau); font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; margin-right: 16px; }
.wp-block-post-navigation-link a::after { content: " →"; }
.wp-block-post-terms__prefix { color: var(--wp--preset--color--grau); }
