/*
Theme Name: Leeftijdloos
Theme URI: https://www.leeftijdloos.nl
Author: Leeftijdloos.nl
Description: Warm, rustig blokthema voor Leeftijdloos.nl: leven in het ritme van de natuur. Warmwit met olijfgroen en bordeauxrood.
Version: 1.0.0
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: leeftijdloos
*/

/* ---------- Lettertypelogo ---------- */
.ll-logo {
	display: inline-block;
	font-family: var(--wp--preset--font-family--fraunces);
	font-weight: 500;
	font-size: clamp(2.6rem, 7vw, 4.4rem);
	letter-spacing: -0.025em;
	line-height: 1;
	color: var(--wp--preset--color--olijf);
	text-decoration: none;
}
.ll-logo .ll-t {
	font-style: normal;
	font-weight: 500;
	color: var(--wp--preset--color--bordeaux);
}
.ll-logo .ll-nl {
	font-family: var(--wp--preset--font-family--bron);
	font-size: 0.26em;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--wp--preset--color--bordeaux);
	margin-left: 0.5em;
	vertical-align: 0.2em;
}
.ll-logo:hover,
.ll-logo:focus {
	text-decoration: none;
	opacity: 0.88;
}
.ll-logo--klein {
	font-size: 2rem;
}

/* ---------- Header ---------- */
.ll-header {
	text-align: center;
	padding-top: 2.25rem;
	padding-bottom: 0;
}
.ll-header .ll-nav {
	margin-top: 1.1rem;
	padding: 0.7rem 0;
	border-top: 1px solid var(--wp--preset--color--lijn);
	border-bottom: 1px solid var(--wp--preset--color--lijn);
	font-size: 0.95rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-weight: 600;
}
.ll-nav .wp-block-navigation-item a {
	text-decoration: none;
	color: var(--wp--preset--color--tekst);
}
.ll-nav .wp-block-navigation-item a:hover,
.ll-nav .current-menu-item > a {
	color: var(--wp--preset--color--bordeaux);
}

/* ---------- Hero ---------- */
.ll-hero {
	text-align: center;
	background:
		radial-gradient(ellipse at 20% 0%, rgba(255, 255, 255, 0.12), transparent 55%),
		linear-gradient(135deg, #67733a 0%, #4a5524 100%);
	color: var(--wp--preset--color--warmwit);
	padding: clamp(3.5rem, 9vw, 7rem) 1.5rem;
	border-radius: 4px;
}
.ll-hero .ll-hero__kicker {
	font-size: 0.85rem;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	opacity: 0.85;
	margin-bottom: 1rem;
}
.ll-hero h1 {
	color: var(--wp--preset--color--warmwit);
	font-style: italic;
	font-weight: 400;
	margin: 0 auto;
	max-width: 18ch;
}

/* ---------- Kaarten ---------- */
.ll-cards .wp-block-column {
	background: var(--wp--preset--color--zand);
	padding: 1.75rem 1.5rem 1.5rem;
	border-top: 4px solid var(--wp--preset--color--olijf);
}
.ll-cards .wp-block-column:nth-child(2) {
	border-top-color: var(--wp--preset--color--bordeaux);
}
.ll-cards h3 {
	margin-top: 0;
	margin-bottom: 0.4rem;
}
.ll-cards h3 a {
	text-decoration: none;
	color: var(--wp--preset--color--bordeaux);
}
.ll-cards h3 a:hover {
	text-decoration: underline;
}
.ll-cards p {
	margin-top: 0;
}
.ll-meer a {
	font-weight: 600;
	font-size: 0.9rem;
	letter-spacing: 0.04em;
	text-decoration: none;
	color: var(--wp--preset--color--olijf);
}
.ll-meer a:hover {
	text-decoration: underline;
}

/* ---------- Verhalen ---------- */
.ll-sectiekop {
	text-align: center;
}
.ll-sectiekop::after {
	content: "";
	display: block;
	width: 3.5rem;
	height: 2px;
	margin: 0.9rem auto 0;
	background: var(--wp--preset--color--bordeaux);
}
.ll-verhaal {
	padding: 1.25rem 0;
	border-bottom: 1px solid var(--wp--preset--color--lijn);
}
.ll-verhaal .wp-block-post-title {
	margin: 0 0 0.25rem;
}
.ll-verhaal .wp-block-post-title a {
	text-decoration: none;
	color: var(--wp--preset--color--tekst);
}
.ll-verhaal .wp-block-post-title a:hover {
	color: var(--wp--preset--color--bordeaux);
}
.ll-datum {
	color: var(--wp--preset--color--olijf);
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	margin: 0;
}

/* ---------- Footer ---------- */
.ll-footer {
	margin-top: 5rem;
	padding-top: 2.5rem;
	padding-bottom: 2.5rem;
	text-align: center;
	background: var(--wp--preset--color--zand);
	border-top: 1px solid var(--wp--preset--color--lijn);
}
.ll-footer p {
	margin: 0.5rem 0;
}
.ll-footer .ll-klein {
	font-size: 0.85rem;
	opacity: 0.75;
}
