/*
Theme Name: Billardspielen
Theme URI: https://www.billardspielen.at/
Description: Block-Theme für billardspielen.at – Billardhalle bei Nacht. Selbst gehostete Schriften (Inter, Barlow Condensed).
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: billardspielen
*/

/* ---------- Grundgerüst ---------- */
body { -webkit-font-smoothing: antialiased; }
.wp-site-blocks > main { margin-block-start: 0; }
:where(.wp-site-blocks) > * { margin-block-start: 0; }
img { height: auto; }

.bs-eyebrow,
.bs-eyebrow a,
.wp-block-post-terms.taxonomy-category,
.wp-block-post-terms.taxonomy-category a {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 600;
	font-size: 16px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--brass);
	text-decoration: none;
}

.bs-meta { gap: 12px !important; align-items: baseline; }
.wp-block-post-date { color: var(--wp--preset--color--muted); font-size: 14px; }
.wp-block-post-date a { color: inherit; text-decoration: none; }

.wp-block-post-title a { color: inherit; text-decoration: none; }
.wp-block-post-title a:hover { color: var(--wp--preset--color--brass); }

.wp-block-post-featured-image img {
	border-radius: 6px;
	border: 1px solid var(--wp--preset--color--line);
	object-fit: cover;
	width: 100%;
	background: var(--wp--preset--color--felt);
}

/* ---------- Header ---------- */
.bs-header { border-bottom: 1px solid var(--wp--preset--color--line); padding: 22px 24px; }
.bs-header__inner { gap: 20px; align-items: center; }
.bs-brand { gap: 14px; align-items: center; }
.bs-ball { display: block; line-height: 0; }
.bs-brand__text { gap: 0 !important; }
.bs-brand .wp-block-site-title {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700; font-size: 30px; line-height: 1.05;
	letter-spacing: .02em; text-transform: uppercase; margin: 0;
}
.bs-brand .wp-block-site-title a { color: var(--wp--preset--color--text); text-decoration: none; }
.bs-brand .wp-block-site-tagline { font-size: 13px; color: var(--wp--preset--color--muted); margin: 0; line-height: 1.3; }

.bs-nav-wrap { gap: 8px 26px; align-items: center; }
.bs-nav {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 600; font-size: 19px; letter-spacing: .04em; text-transform: uppercase;
	gap: 4px 26px;
}
.bs-nav a { color: var(--wp--preset--color--text); text-decoration: none; }
.bs-nav a:hover, .bs-nav .current-menu-item a { color: var(--wp--preset--color--brass); }
.bs-nav .wp-block-navigation__responsive-container.is-menu-open { background: var(--wp--preset--color--ink); color: var(--wp--preset--color--text); padding: 24px; }
.bs-nav .wp-block-navigation__responsive-container-open,
.bs-nav .wp-block-navigation__responsive-container-close { color: var(--wp--preset--color--text); min-width: 44px; min-height: 44px; }

.bs-search .wp-block-search__button {
	width: 44px; height: 44px; padding: 0; border-radius: 22px;
	background: transparent; border: 1px solid var(--wp--preset--color--line);
	color: var(--wp--preset--color--text);
}
.bs-search .wp-block-search__button:hover { border-color: var(--wp--preset--color--brass); color: var(--wp--preset--color--brass); }
.bs-search .wp-block-search__input {
	background: var(--wp--preset--color--surface); color: var(--wp--preset--color--text);
	border: 1px solid var(--wp--preset--color--line); border-radius: 22px; padding: 10px 16px;
}

/* ---------- Startseite: Aufmacher ---------- */
.bs-hero { padding: 64px 24px 56px; }
.bs-hero__row { gap: 48px; align-items: center; }
.bs-hero__text { flex: 1 1 440px; min-width: 0; gap: 20px; }
.bs-hero__media { flex: 1 1 520px; min-width: 0; }
.bs-hero .wp-block-post-title { font-size: clamp(44px, 6vw, 68px); line-height: .98; margin: 0; }
.bs-hero .wp-block-post-excerpt { color: var(--wp--preset--color--soft); font-size: 19px; max-width: 560px; margin: 0; }
.bs-hero .wp-block-post-excerpt__more-text { margin-top: 24px; }
.bs-hero .wp-block-post-excerpt__more-link,
.bs-button a {
	display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 24px;
	background: var(--wp--preset--color--brass); color: var(--wp--preset--color--ink);
	border-radius: 24px; font-weight: 600; font-size: 16px; text-decoration: none;
}
.bs-hero .wp-block-post-excerpt__more-link:hover { background: var(--wp--preset--color--text); color: var(--wp--preset--color--ink); }
.bs-hero ul.wp-block-post-template { margin: 0; padding: 0; }

/* ---------- Kategorie-Leiste ---------- */
.bs-catbar-wrap {
	background: var(--wp--preset--color--surface);
	border-top: 1px solid var(--wp--preset--color--line);
	border-bottom: 1px solid var(--wp--preset--color--line);
	padding: 0 24px;
}
.bs-catbar { list-style: none; margin: 0 auto !important; padding: 0; display: flex; flex-wrap: wrap; counter-reset: bscat; max-width: var(--wp--style--global--wide-size); }
.bs-catbar li { flex: 1 1 200px; counter-increment: bscat; border-right: 1px solid var(--wp--preset--color--line); }
.bs-catbar li:last-child { border-right: 0; }
.bs-catbar a {
	display: flex; align-items: baseline; gap: 12px; padding: 26px 24px;
	font-family: var(--wp--preset--font-family--display); font-weight: 600; font-size: 24px;
	letter-spacing: .03em; text-transform: uppercase; color: var(--wp--preset--color--text); text-decoration: none;
}
.bs-catbar li:first-child a { padding-left: 0; }
.bs-catbar a::before { content: counter(bscat, decimal-leading-zero); font-weight: 700; font-size: 15px; color: var(--wp--preset--color--brass); }
.bs-catbar a:hover { color: var(--wp--preset--color--brass); }

/* ---------- Beitragsraster ---------- */
.bs-section { padding: 72px 24px; }
.bs-section__head { justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 36px; }
.bs-section__head h2 { font-size: 44px; margin: 0; }
.bs-grid .wp-block-post-template { gap: 48px 32px; }
.bs-card { gap: 16px; }
.bs-card .wp-block-post-title { font-size: 32px; line-height: 1.05; margin: 0; }
.bs-card .wp-block-post-excerpt { color: var(--wp--preset--color--soft); margin: 0; }
.bs-card .wp-block-post-excerpt__excerpt { margin: 0; }
.bs-card--small .wp-block-post-title { font-size: 28px; }

.wp-block-query-pagination { margin-top: 48px; gap: 16px; font-weight: 500; }
.wp-block-query-pagination a { color: var(--wp--preset--color--brass); text-decoration: none; }

/* ---------- Intro & Ressourcen ---------- */
.bs-intro-wrap { background: var(--wp--preset--color--surface); border-top: 1px solid var(--wp--preset--color--line); padding: 72px 24px; }
.bs-intro { gap: 48px; }
.bs-intro__text { flex: 1 1 380px; min-width: 0; }
.bs-intro__text h2 { font-size: 44px; line-height: 1; margin: 0 0 16px; }
.bs-intro__text p { color: var(--wp--preset--color--soft); margin: 0; }
.bs-intro__links { flex: 1 1 520px; min-width: 0; }
.bs-linklist { display: flex; flex-direction: column; }
.bs-linklist a {
	display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 24px 0;
	border-top: 1px solid var(--wp--preset--color--line-strong); color: var(--wp--preset--color--text); text-decoration: none;
}
.bs-linklist a:last-child { border-bottom: 1px solid var(--wp--preset--color--line-strong); }
.bs-linklist strong { display: block; font-family: var(--wp--preset--font-family--display); font-weight: 700; font-size: 28px; text-transform: uppercase; }
.bs-linklist small { color: var(--wp--preset--color--muted); font-size: 15px; }
.bs-linklist a:hover strong, .bs-linklist a:hover svg { color: var(--wp--preset--color--brass); }

/* ---------- Footer ---------- */
.bs-footer { border-top: 1px solid var(--wp--preset--color--line); padding: 40px 24px; font-size: 14px; color: var(--wp--preset--color--muted); }
.bs-footer__inner { justify-content: space-between; align-items: center; gap: 20px; }
.bs-footer a { color: var(--wp--preset--color--soft); text-decoration: none; }
.bs-footer a:hover { color: var(--wp--preset--color--brass); }
.bs-footer p { margin: 0; }
.wp-block-tag-cloud.bs-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.wp-block-tag-cloud.bs-tags a, .bs-posttags a {
	font-size: 14px !important; padding: 6px 12px; margin: 0;
	border: 1px solid var(--wp--preset--color--line-strong); border-radius: 16px;
	color: var(--wp--preset--color--soft); text-decoration: none;
}
.bs-posttags { display: flex; flex-wrap: wrap; gap: 8px; }
.bs-posttags .wp-block-post-terms__separator { display: none; }

/* ---------- Einzelbeitrag ---------- */
.bs-article-head { padding: 56px 24px 32px; }
.bs-article-head .wp-block-post-title { font-size: clamp(44px, 6.5vw, 72px); line-height: .96; margin: 0; }
.bs-crumbs { font-size: 14px; color: var(--wp--preset--color--muted); }
.bs-crumbs a { color: var(--wp--preset--color--muted); text-decoration: none; }
.bs-article-media { padding: 0 24px; }
.bs-article-body { padding: 56px 24px 24px; font-size: 18px; line-height: 1.75; color: var(--wp--preset--color--body); }
.bs-article-body h2 { font-size: 36px; line-height: 1.05; margin-top: 1.4em; color: var(--wp--preset--color--text); }
.bs-article-body h3 { font-size: 28px; margin-top: 1.2em; color: var(--wp--preset--color--text); }
.bs-article-body a { color: var(--wp--preset--color--brass); text-decoration: underline; text-underline-offset: 3px; }
.bs-article-body img { border-radius: 6px; }
.bs-article-foot { padding: 8px 24px 64px; border-bottom: 1px solid var(--wp--preset--color--line); }

/* ---------- Seiten, Archive, Suche ---------- */
.bs-page-head { padding: 56px 24px 8px; }
.bs-page-head h1, .bs-page-head .wp-block-query-title, .bs-page-head .wp-block-post-title { font-size: clamp(44px, 6vw, 64px); line-height: 1; margin: 0; }
.bs-page-head .wp-block-term-description { color: var(--wp--preset--color--soft); }

/* ---------- Kommentare ---------- */
.bs-comments { padding: 0 24px 64px; }
.bs-comments input, .bs-comments textarea {
	background: var(--wp--preset--color--surface); color: var(--wp--preset--color--text);
	border: 1px solid var(--wp--preset--color--line-strong); border-radius: 4px; padding: 10px 12px;
}

/* ---------- Fokus ---------- */
:where(a, button, input, textarea):focus-visible { outline: 2px solid var(--wp--preset--color--brass); outline-offset: 3px; }

@media (max-width: 781px) {
	.bs-catbar li { flex-basis: 50%; border-right: 0; border-bottom: 1px solid var(--wp--preset--color--line); }
	.bs-catbar a, .bs-catbar li:first-child a { padding: 18px 0; font-size: 21px; }
	.bs-hero { padding-top: 40px; }
	.bs-section, .bs-intro-wrap { padding-top: 56px; padding-bottom: 56px; }
}