/*
Theme Name: BetterState
Template: twentytwentyfive
Description: BetterState child theme: dark navy palette, Inter / JetBrains Mono, landing page blocks.
Version: 1.0.0
Text Domain: betterstate
*/

/* =====================================================================
   Header, footer and the blog listing (parts/*.html, templates/home.html).
   Page content (landing page) is built with Kadence Blocks and styled in
   each block's own settings, so it needs nothing from this file.
   ===================================================================== */

body {
	-webkit-font-smoothing: antialiased;
}

/* In-page links (#oferta, #kontakt) land below the sticky header */
html {
	scroll-behavior: smooth;
	scroll-padding-top: 5rem;
}

/* --- Header / footer --- */
/* The template part wrapper is the element that can stick to the viewport */
.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0);
	z-index: 50;
}

.bs-header {
	background: rgba(11, 26, 43, 0.8);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border-bottom: 1px solid var(--wp--preset--color--border);
	padding-top: 1rem;
	padding-bottom: 1rem;
}

.bs-brand {
	margin: 0;
	font-size: 1.125rem;
	font-weight: 700;
}

.bs-brand a {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: var(--wp--preset--color--foreground);
	text-decoration: none;
}

/* Logo tile (::before) with the book icon masked on top (::after) */
.bs-brand a::before {
	content: "";
	width: 2rem;
	height: 2rem;
	border-radius: 0.5rem;
	background: rgba(47, 210, 54, 0.1);
}

.bs-brand a::after {
	content: "";
	position: absolute;
	left: 0.5rem;
	top: 50%;
	width: 1rem;
	height: 1rem;
	transform: translateY(-50%);
	background: var(--wp--preset--color--accent);
	-webkit-mask: url("assets/icons/book-open.svg") center / contain no-repeat;
	mask: url("assets/icons/book-open.svg") center / contain no-repeat;
}

.bs-brand--small {
	font-size: 1rem;
	font-weight: 600;
}

.bs-nav {
	gap: 1.5rem;
	font-size: 0.875rem;
	font-weight: 500;
}

.bs-nav a {
	color: var(--wp--preset--color--muted);
	text-decoration: none;
}

.bs-nav a:hover {
	color: var(--wp--preset--color--foreground);
}

.bs-nav .bs-nav-cta a {
	border-radius: 9999px;
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--background);
	padding: 0.5rem 1.25rem;
	font-weight: 600;
}

.bs-nav .bs-nav-cta a:hover {
	background: #4AE852;
	color: var(--wp--preset--color--background);
}

.bs-nav .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--background);
	color: var(--wp--preset--color--foreground);
}

.bs-footer {
	margin-top: 0;
	border-top: 1px solid var(--wp--preset--color--border);
	background: var(--wp--preset--color--footer-bg);
	padding-top: 3rem;
	padding-bottom: 3rem;
	font-size: 0.75rem;
	color: var(--wp--preset--color--muted-dim);
}

.bs-footer__links {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	margin: 0;
	font-size: 0.875rem;
}

.bs-footer a {
	color: var(--wp--preset--color--muted-dim);
	text-decoration: none;
}

.bs-footer a:hover {
	color: var(--wp--preset--color--muted);
}

.bs-footer .bs-brand a {
	color: var(--wp--preset--color--foreground);
}

.bs-footer__company {
	line-height: 1.7;
}

.bs-footer__company strong {
	color: var(--wp--preset--color--muted);
}

.bs-footer__company a {
	color: var(--wp--preset--color--accent);
}

.bs-footer__rule {
	border: 0;
	border-top: 1px solid var(--wp--preset--color--border);
	opacity: 1;
	margin: 2rem 0;
}

.bs-footer__copyright {
	text-align: center;
	margin: 0;
}

/* --- Sections --- */
.bs-main {
	margin-top: 0;
}

.bs-main .wp-block-post-content > * {
	margin-block-start: 0;
}

.bs-section {
	padding-top: 6rem;
	padding-bottom: 6rem;
}

@media (min-width: 768px) {
	.bs-section {
		padding-top: 8rem;
		padding-bottom: 8rem;
	}
}

.bs-section h2 {
	font-size: clamp(1.875rem, 4vw, 2.25rem);
	font-weight: 700;
	letter-spacing: -0.025em;
	line-height: 1.2;
}

.bs-section h3 {
	font-size: 1.25rem;
	font-weight: 700;
	letter-spacing: normal;
	margin-top: 0.25rem;
}

.bs-center {
	text-align: center;
}

.bs-lead,
.bs-card .bs-lead {
	max-width: 42rem;
	margin-left: auto !important;
	margin-right: auto !important;
	font-size: 1.125rem;
	line-height: 1.65;
	color: var(--wp--preset--color--muted);
}

.bs-head {
	margin-bottom: 4rem;
}

/* --- Cards --- */
.bs-card {
	height: 100%;
	box-sizing: border-box;
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 1.5rem;
	background: rgba(26, 46, 69, 0.5);
	padding: 2rem;
}

.bs-card > :first-child {
	margin-top: 0;
}

.bs-card p {
	font-size: 0.875rem;
	line-height: 1.65;
	color: var(--wp--preset--color--muted);
}

.bs-card h3 {
	color: var(--wp--preset--color--foreground);
}

/* --- Blog listing (templates/home.html) --- */
.bs-blog-title {
	font-size: clamp(2.25rem, 5vw, 3rem);
	font-weight: 800;
	letter-spacing: -0.03em;
}

.bs-blog__grid {
	gap: 1.5rem;
}

.bs-blog__card {
	display: flex;
	flex-direction: column;
}

.bs-blog__card .bs-blog__date {
	font-size: 0.75rem;
	color: var(--wp--preset--color--muted-dim);
}

.bs-blog__card .bs-blog__card-title {
	margin-top: 0.5rem;
	font-size: 1.25rem;
	line-height: 1.3;
}

.bs-blog__card .bs-blog__card-title a {
	color: var(--wp--preset--color--foreground);
	text-decoration: none;
}

.bs-blog__card .bs-blog__card-title a:hover {
	color: var(--wp--preset--color--accent);
}

.bs-blog__card .wp-block-post-excerpt__excerpt {
	font-size: 0.875rem;
	line-height: 1.65;
	color: var(--wp--preset--color--muted);
}

.bs-blog__card .wp-block-post-excerpt__more-link {
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--wp--preset--color--accent);
	text-decoration: none;
}

.bs-blog .wp-block-query-pagination {
	margin-top: 3rem;
}
