/* ============================================================
   LUCAS TOOLS — Design System
   Kleurenpalet: leisteen · goud · teal · warm wit
   Typografie: Playfair Display (koppen) + Inter (body)
   ============================================================ */

/* ── Custom properties ─────────────────────────────────────── */
:root {
	/* Kleuren */
	--lt-bg:           #faf9f7;
	--lt-bg-alt:       #f2f0ec;
	--lt-bg-dark:      #1a2332;
	--lt-bg-dark-2:    #253348;
	--lt-primary:      #1a2332;
	--lt-accent:       #c9a84c;
	--lt-accent-hover: #b8943d;
	--lt-accent-light: #f5e9c6;
	--lt-teal:         #4a7c7e;
	--lt-teal-light:   #e8f4f5;
	--lt-text:         #2d3748;
	--lt-text-muted:   #718096;
	--lt-border:       #e2ddd6;
	--lt-white:        #ffffff;

	/* Schaduwen */
	--lt-shadow:    0 1px 3px rgba(0,0,0,.07), 0 4px 16px rgba(0,0,0,.05);
	--lt-shadow-lg: 0 4px 8px rgba(0,0,0,.07), 0 16px 40px rgba(0,0,0,.10);

	/* Typografie */
	--lt-font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
	--lt-font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

	/* Afstand */
	--lt-space-xs:  0.375rem;
	--lt-space-sm:  0.625rem;
	--lt-space-md:  1rem;
	--lt-space-lg:  1.5rem;
	--lt-space-xl:  2rem;
	--lt-space-2xl: 3rem;
	--lt-space-3xl: 4rem;
	--lt-space-4xl: 6rem;

	/* Borders */
	--lt-radius-sm:   4px;
	--lt-radius-md:   8px;
	--lt-radius-lg:   16px;
	--lt-radius-full: 9999px;

	/* Breedte */
	--lt-max-width: 1200px;

	/* Animatie */
	--lt-transition: 180ms ease;
}

/* ── Reset ──────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html                   { scroll-behavior: smooth; font-size: 16px; }
body {
	font-family:            var(--lt-font-body);
	font-size:              1rem;
	line-height:            1.65;
	color:                  var(--lt-text);
	background-color:       var(--lt-bg);
	-webkit-font-smoothing: antialiased;
}
img, video { max-width: 100%; height: auto; display: block; }
a          { color: inherit; text-decoration: none; }
button     { cursor: pointer; border: none; background: none; font: inherit; }
ul, ol     { list-style: none; }
input, textarea, select { font: inherit; }

/* ── Typografie ─────────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--lt-font-display);
	line-height: 1.2;
	color:       var(--lt-primary);
}
h1 { font-size: clamp(1.875rem, 5vw,  3.25rem); font-weight: 700; }
h2 { font-size: clamp(1.375rem, 3vw,  2.125rem); font-weight: 600; }
h3 { font-size: clamp(1.125rem, 2vw,  1.375rem); font-weight: 600; }
h4 { font-size: 1.0625rem;                        font-weight: 600; }
p  { margin-bottom: var(--lt-space-md); }
p:last-child { margin-bottom: 0; }

/* ── Container ──────────────────────────────────────────────── */
.lt-container {
	width:      100%;
	max-width:  var(--lt-max-width);
	margin:     0 auto;
	padding:    0 var(--lt-space-xl);
}

/* ── Knoppen ────────────────────────────────────────────────── */
.lt-btn {
	display:         inline-flex;
	align-items:     center;
	justify-content: center;
	gap:             0.4375rem;
	padding:         0.625rem 1.25rem;
	border-radius:   var(--lt-radius-md);
	font-family:     var(--lt-font-body);
	font-size:       0.9375rem;
	font-weight:     500;
	line-height:     1;
	transition:      all var(--lt-transition);
	white-space:     nowrap;
	text-decoration: none;
	border:          2px solid transparent;
}
.lt-btn--primary {
	background: var(--lt-accent);
	color:      var(--lt-primary);
	border-color: var(--lt-accent);
}
.lt-btn--primary:hover {
	background:   var(--lt-accent-hover);
	border-color: var(--lt-accent-hover);
	transform:    translateY(-1px);
	box-shadow:   0 4px 14px rgba(201,168,76,.35);
}
.lt-btn--secondary {
	background:   var(--lt-primary);
	color:        var(--lt-white);
	border-color: var(--lt-primary);
}
.lt-btn--secondary:hover {
	background:   var(--lt-bg-dark-2);
	border-color: var(--lt-bg-dark-2);
	transform:    translateY(-1px);
}
.lt-btn--outline {
	background:   transparent;
	color:        var(--lt-primary);
	border-color: var(--lt-border);
}
.lt-btn--outline:hover {
	border-color: var(--lt-primary);
	background:   var(--lt-bg-alt);
}
.lt-btn--outline-light {
	background:   transparent;
	color:        var(--lt-white);
	border-color: rgba(255,255,255,.4);
}
.lt-btn--outline-light:hover {
	border-color: rgba(255,255,255,.8);
	background:   rgba(255,255,255,.1);
}
.lt-btn--ghost { background: transparent; color: var(--lt-text); }
.lt-btn--ghost:hover { background: var(--lt-bg-alt); }
.lt-btn--light { color: rgba(255,255,255,.75); }
.lt-btn--light:hover { background: rgba(255,255,255,.1); color: var(--lt-white); }
.lt-btn--sm  { padding: 0.4375rem 0.875rem; font-size: 0.875rem; }
.lt-btn--lg  { padding: 0.75rem 1.625rem;   font-size: 1rem; }

/* ── Badges ─────────────────────────────────────────────────── */
.lt-badge {
	display:       inline-block;
	padding:       0.1875rem 0.625rem;
	border-radius: var(--lt-radius-full);
	font-size:     0.75rem;
	font-weight:   600;
	letter-spacing:.03em;
}
.lt-badge           { background: var(--lt-bg-alt);    color: var(--lt-text-muted); }
.lt-badge--teal     { background: var(--lt-teal-light); color: var(--lt-teal); }
.lt-badge--gold     { background: var(--lt-accent-light); color: #7a5c18; }

/* ── Header / Navigatie ─────────────────────────────────────── */
.lt-header {
	position:          sticky;
	top:               0;
	z-index:           100;
	background:        rgba(250,249,247,.96);
	backdrop-filter:   blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border-bottom:     1px solid var(--lt-border);
}
.lt-header__inner {
	display:     flex;
	align-items: center;
	gap:         var(--lt-space-lg);
	height:      64px;
}
.lt-header__logo {
	font-family:  var(--lt-font-display);
	font-size:    1.25rem;
	font-weight:  700;
	color:        var(--lt-primary);
	white-space:  nowrap;
	flex-shrink:  0;
	transition:   opacity var(--lt-transition);
}
.lt-header__logo:hover { opacity: .8; }

.lt-nav { flex: 1; }
.lt-nav__menu {
	display:     flex;
	gap:         2px;
	align-items: center;
}
.lt-nav__menu li a {
	display:       block;
	padding:       0.375rem 0.75rem;
	border-radius: var(--lt-radius-sm);
	font-size:     0.9375rem;
	color:         var(--lt-text);
	transition:    all var(--lt-transition);
}
.lt-nav__menu li a:hover,
.lt-nav__menu li.current-menu-item > a,
.lt-nav__menu li.current_page_item > a {
	color:      var(--lt-primary);
	background: var(--lt-bg-alt);
}
.lt-header__actions {
	margin-left:  auto;
	display:      flex;
	align-items:  center;
	gap:          var(--lt-space-sm);
	flex-shrink:  0;
}
.lt-header__user {
	font-size:  0.875rem;
	color:      var(--lt-text-muted);
}
.lt-kofi-nav-btn { letter-spacing: .01em; }
.lt-nav__kofi    { display: none; } /* shown only inside mobile hamburger dropdown */
.lt-nav__toggle {
	display:        none;
	flex-direction: column;
	gap:            5px;
	padding:        0.375rem;
	border-radius:  var(--lt-radius-sm);
}
.lt-nav__toggle span {
	display:       block;
	width:         22px;
	height:        2px;
	background:    var(--lt-text);
	border-radius: 2px;
	transition:    all var(--lt-transition);
}
.lt-nav__toggle[aria-expanded="true"] span:nth-child(1) { transform: rotate(45deg) translate(5px,5px); }
.lt-nav__toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.lt-nav__toggle[aria-expanded="true"] span:nth-child(3) { transform: rotate(-45deg) translate(5px,-5px); }

/* ── Hoofd (min-height) ─────────────────────────────────────── */
.lt-main { min-height: calc(100vh - 64px); }

/* ── Hero ───────────────────────────────────────────────────── */
.lt-hero {
	position:   relative;
	background: var(--lt-bg-dark);
	overflow:   hidden;
	padding:    var(--lt-space-4xl) 0;
	min-height: 500px;
	display:    flex;
	align-items: center;
}
.lt-hero::before {
	content:  '';
	position: absolute;
	inset:    0;
	background:
		radial-gradient(ellipse 80% 60% at 75% 50%, rgba(201,168,76,.13) 0%, transparent 65%),
		radial-gradient(ellipse 55% 45% at 15% 35%, rgba(74,124,126,.10)  0%, transparent 65%);
	pointer-events: none;
}
.lt-hero__content {
	position:  relative;
	z-index:   1;
	max-width: 660px;
}
.lt-hero__eyebrow {
	display:        inline-block;
	font-size:      0.8125rem;
	font-weight:    600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color:          var(--lt-accent);
	margin-bottom:  var(--lt-space-md);
}
.lt-hero h1,
.lt-hero__title { color: var(--lt-white); margin-bottom: var(--lt-space-lg); }
.lt-hero__subtitle {
	font-size:     1.0625rem;
	color:         rgba(255,255,255,.7);
	margin-bottom: var(--lt-space-2xl);
	max-width:     520px;
	line-height:   1.7;
}
.lt-hero__actions { display: flex; flex-wrap: wrap; gap: var(--lt-space-md); }

/* ── Sectie-header ──────────────────────────────────────────── */
.lt-section-header {
	text-align:    center;
	max-width:     540px;
	margin:        0 auto var(--lt-space-3xl);
}
.lt-section-header h2 { margin-bottom: var(--lt-space-sm); }
.lt-section-header p  { color: var(--lt-text-muted); font-size: 1.0625rem; }

/* ── Tools / Script cards ───────────────────────────────────── */
.lt-tools { padding: var(--lt-space-4xl) 0; }
.lt-tools__grid {
	display:               grid;
	grid-template-columns: repeat(auto-fill, minmax(300px,1fr));
	gap:                   var(--lt-space-xl);
}
.lt-no-tools {
	grid-column:   1 / -1;
	text-align:    center;
	color:         var(--lt-text-muted);
	padding:       var(--lt-space-3xl) 0;
	font-size:     0.9375rem;
}

.lt-script-card {
	background:    var(--lt-white);
	border:        1px solid var(--lt-border);
	border-radius: var(--lt-radius-lg);
	padding:       var(--lt-space-2xl);
	display:       flex;
	flex-direction:column;
	gap:           var(--lt-space-lg);
	transition:    all var(--lt-transition);
	box-shadow:    var(--lt-shadow);
}
.lt-script-card:hover {
	transform:    translateY(-3px);
	box-shadow:   var(--lt-shadow-lg);
	border-color: var(--lt-accent);
}
.lt-script-card__icon {
	width:         48px;
	height:        48px;
	background:    var(--lt-accent-light);
	border-radius: var(--lt-radius-md);
	display:       flex;
	align-items:   center;
	justify-content:center;
	font-size:     1.5rem;
	flex-shrink:   0;
}
.lt-script-card__title {
	font-family:   var(--lt-font-display);
	font-size:     1.3125rem;
	font-weight:   600;
	color:         var(--lt-primary);
	margin-bottom: var(--lt-space-xs);
}
.lt-script-card__desc  { color: var(--lt-text-muted); font-size: 0.9375rem; flex: 1; line-height: 1.6; }
.lt-script-card__tags  { display: flex; flex-wrap: wrap; gap: var(--lt-space-xs); }
.lt-script-card__actions { display: flex; gap: var(--lt-space-sm); flex-wrap: wrap; }

/* ── Over sectie ────────────────────────────────────────────── */
.lt-about {
	background: var(--lt-bg-alt);
	padding:    var(--lt-space-4xl) 0;
}
.lt-about__inner {
	max-width:  600px;
	margin:     0 auto;
	text-align: center;
}
.lt-about__avatar {
	width:          80px;
	height:         80px;
	border-radius:  var(--lt-radius-full);
	background:     var(--lt-accent-light);
	border:         3px solid var(--lt-accent);
	display:        flex;
	align-items:    center;
	justify-content:center;
	font-size:      2rem;
	margin:         0 auto var(--lt-space-xl);
	overflow:       hidden;
	flex-shrink:    0;
}
.lt-about__avatar--photo { background: none; }
.lt-about__avatar img    { width: 100%; height: 100%; object-fit: cover; display: block; }
.lt-about h2           { margin-bottom: var(--lt-space-md); }
.lt-about__text        { margin-bottom: var(--lt-space-xl); }
.lt-about__text p      { color: var(--lt-text-muted); font-size: 1.0625rem; margin-bottom: var(--lt-space-md); }
.lt-about__text p:last-child { margin-bottom: 0; }
.lt-about__text strong { color: var(--lt-text); font-weight: 600; }
.lt-about__text a      { color: var(--lt-teal); text-decoration: underline; }

/* ── Ko-Fi CTA sectie ───────────────────────────────────────── */
.lt-kofi-cta {
	background: var(--lt-primary);
	padding:    var(--lt-space-4xl) 0;
	text-align: center;
}
.lt-kofi-cta h2 { color: var(--lt-white); margin-bottom: var(--lt-space-md); }
.lt-kofi-cta p  {
	color:         rgba(255,255,255,.7);
	font-size:     1.0625rem;
	margin-bottom: var(--lt-space-2xl);
	max-width:     460px;
	margin-left:   auto;
	margin-right:  auto;
}

/* Ko-Fi blok (shortcode) */
.lt-kofi-block { display: inline-flex; align-items: center; }
.lt-kofi-btn {
	display:         inline-flex;
	align-items:     center;
	gap:             0.5rem;
	padding:         0.75rem 1.5rem;
	background:      var(--lt-accent);
	color:           var(--lt-primary);
	border-radius:   var(--lt-radius-md);
	font-weight:     600;
	font-size:       1rem;
	text-decoration: none;
	transition:      all var(--lt-transition);
	border:          2px solid var(--lt-accent);
}
.lt-kofi-btn:hover {
	background:  var(--lt-accent-hover);
	border-color:var(--lt-accent-hover);
	transform:   translateY(-1px);
	box-shadow:  0 4px 14px rgba(201,168,76,.4);
}
.lt-kofi-btn__icon { font-size: 1.125rem; }

/* Ko-Fi inline (in sidebar) */
.lt-kofi-block .lt-kofi-btn {
	width:           100%;
	justify-content: center;
}

/* ── Footer ─────────────────────────────────────────────────── */
.lt-footer {
	background: var(--lt-primary);
	color:      rgba(255,255,255,.65);
	padding:    var(--lt-space-3xl) 0 var(--lt-space-xl);
}
.lt-footer__inner {
	display:         flex;
	justify-content: space-between;
	gap:             var(--lt-space-2xl);
	margin-bottom:   var(--lt-space-2xl);
	padding-bottom:  var(--lt-space-2xl);
	border-bottom:   1px solid rgba(255,255,255,.1);
}
.lt-footer__logo {
	font-family:   var(--lt-font-display);
	font-size:     1.25rem;
	font-weight:   700;
	color:         var(--lt-white);
	display:       block;
	margin-bottom: var(--lt-space-sm);
}
.lt-footer__brand p { font-size: 0.9375rem; max-width: 260px; line-height: 1.6; }
.lt-footer__menu    { display: flex; flex-direction: column; gap: var(--lt-space-sm); }
.lt-footer__menu a  {
	color:      rgba(255,255,255,.65);
	font-size:  0.9375rem;
	transition: color var(--lt-transition);
}
.lt-footer__menu a:hover { color: var(--lt-white); }
.lt-footer__bottom {
	display:         flex;
	justify-content: space-between;
	align-items:     center;
	font-size:       0.875rem;
}
.lt-footer__kofi { color: var(--lt-accent); font-weight: 500; transition: opacity var(--lt-transition); }
.lt-footer__kofi:hover { opacity: .8; }

/* ── Standaard paginasjabloon ───────────────────────────────── */
.lt-page-hero {
	background:    var(--lt-bg-alt);
	padding:       var(--lt-space-3xl) 0;
	border-bottom: 1px solid var(--lt-border);
}
.lt-page-hero h1 { margin-bottom: var(--lt-space-xs); }
.lt-page-hero p  { color: var(--lt-text-muted); font-size: 1.0625rem; }
.lt-page-hero__meta { color: var(--lt-text-muted); font-size: 0.875rem; margin-bottom: var(--lt-space-sm) !important; }

.lt-page-content {
	padding:    var(--lt-space-3xl) 0;
	max-width:  740px;
	margin:     0 auto;
}
.lt-page-content h2  { margin-top: var(--lt-space-2xl); margin-bottom: var(--lt-space-md); }
.lt-page-content h3  { margin-top: var(--lt-space-xl);  margin-bottom: var(--lt-space-sm); }
.lt-page-content p   { color: var(--lt-text); }
.lt-page-content a:not([class])   { color: var(--lt-teal); text-decoration: underline; }
.lt-page-content ul,
.lt-page-content ol  { padding-left: var(--lt-space-xl); margin-bottom: var(--lt-space-md); }
.lt-page-content li  { margin-bottom: var(--lt-space-xs); }

/* WP blokken */
.lt-page-content blockquote {
	border-left:   3px solid var(--lt-accent);
	padding:       var(--lt-space-sm) var(--lt-space-lg);
	margin:        var(--lt-space-xl) 0;
	background:    var(--lt-accent-light);
	border-radius: 0 var(--lt-radius-md) var(--lt-radius-md) 0;
	font-style:    italic;
}
.lt-page-content code {
	font-family:   'JetBrains Mono', 'Courier New', monospace;
	font-size:     .875em;
	background:    var(--lt-bg-alt);
	padding:       .125em .375em;
	border-radius: 3px;
	border:        1px solid var(--lt-border);
}
.lt-page-content pre {
	background:    var(--lt-primary);
	color:         #e2e8f0;
	padding:       var(--lt-space-xl);
	border-radius: var(--lt-radius-md);
	overflow-x:    auto;
	font-size:     .875rem;
	margin:        var(--lt-space-xl) 0;
}
.lt-page-content pre code { background: none; border: none; padding: 0; color: inherit; font-size: inherit; }
.lt-page-content hr       { border: none; border-top: 1px solid var(--lt-border); margin: var(--lt-space-2xl) 0; }
.lt-page-content table    { width: 100%; border-collapse: collapse; margin: var(--lt-space-xl) 0; }
.lt-page-content th,
.lt-page-content td       { padding: .625rem .875rem; text-align: left; border-bottom: 1px solid var(--lt-border); }
.lt-page-content th       { font-weight: 600; background: var(--lt-bg-alt); }

.lt-post-nav {
	display:    flex;
	gap:        var(--lt-space-sm);
	margin-top: var(--lt-space-2xl);
	padding-top:var(--lt-space-2xl);
	border-top: 1px solid var(--lt-border);
}

/* ── Script landing pagina ──────────────────────────────────── */
.lt-landing__hero {
	background:    var(--lt-bg-dark);
	padding:       var(--lt-space-4xl) 0;
	overflow:      hidden;
	position:      relative;
}
.lt-landing__hero::before {
	content:  '';
	position: absolute;
	inset:    0;
	background: radial-gradient(ellipse 70% 60% at 70% 50%, rgba(201,168,76,.12) 0%, transparent 65%);
	pointer-events: none;
}
.lt-landing__hero-inner {
	position:  relative;
	z-index:   1;
	max-width: 680px;
}
.lt-landing__hero-inner h1 { color: var(--lt-white); margin-bottom: var(--lt-space-md); }
.lt-landing__hero-desc     { color: rgba(255,255,255,.88); font-size: 1.125rem; margin-bottom: var(--lt-space-xl); line-height: 1.7; }
.lt-landing__hero-desc p   { color: inherit; margin-bottom: 0; }
.lt-landing__tags          { display: flex; flex-wrap: wrap; gap: var(--lt-space-xs); margin-bottom: var(--lt-space-xl); }
.lt-landing__hero-actions  { display: flex; flex-wrap: wrap; gap: var(--lt-space-md); }

.lt-landing { padding: var(--lt-space-4xl) 0; }
.lt-landing__body {
	display:               grid;
	grid-template-columns: 2fr 1fr;
	gap:                   var(--lt-space-3xl);
	align-items:           start;
}
.lt-landing__body--full {
	grid-template-columns: 1fr;
	max-width:             740px;
	margin:                0 auto;
}

.lt-sidebar-card {
	background:    var(--lt-white);
	border:        1px solid var(--lt-border);
	border-radius: var(--lt-radius-lg);
	padding:       var(--lt-space-xl);
	box-shadow:    var(--lt-shadow);
	position:      sticky;
	top:           84px;
	display:       flex;
	flex-direction:column;
	gap:           var(--lt-space-sm);
}
.lt-sidebar-card h3      { margin-bottom: var(--lt-space-xs); font-size: 1.125rem; }
.lt-sidebar-card__version{ font-size: 0.8125rem; color: var(--lt-text-muted); }

/* ── App pagina ─────────────────────────────────────────────── */
.lt-app-body  { background: #f0f2f5; }
.lt-app-page  { min-height: 100vh; display: flex; flex-direction: column; }

.lt-app-page__header {
	background:    var(--lt-bg-dark);
	padding:       var(--lt-space-sm) 0;
	border-bottom: 1px solid rgba(255,255,255,.08);
	flex-shrink:   0;
}
.lt-app-page__header-inner {
	display:         flex;
	align-items:     center;
	justify-content: space-between;
	gap:             var(--lt-space-lg);
	height:          52px;
}
.lt-app-page__back {
	color:      rgba(255,255,255,.6);
	font-size:  0.875rem;
	display:    flex;
	align-items:center;
	gap:        0.375rem;
	transition: color var(--lt-transition);
	flex-shrink:0;
}
.lt-app-page__back:hover  { color: var(--lt-white); }
.lt-app-page__title {
	font-family: var(--lt-font-display);
	font-size:   1rem;
	font-weight: 600;
	color:       var(--lt-white);
	text-align:  center;
}
.lt-app-page__user {
	display:     flex;
	align-items: center;
	gap:         var(--lt-space-sm);
	flex-shrink: 0;
}
.lt-app-page__username { font-size: 0.875rem; color: rgba(255,255,255,.55); }
.lt-app-page__content  { flex: 1 1 auto; }

/* ── Login pagina ───────────────────────────────────────────── */
.lt-login-body { background: var(--lt-bg-dark); }
.lt-login-page {
	min-height:      100vh;
	display:         flex;
	align-items:     center;
	justify-content: center;
	padding:         var(--lt-space-xl);
	position:        relative;
}
.lt-login-page::before {
	content:  '';
	position: absolute;
	inset:    0;
	background:
		radial-gradient(ellipse 60% 50% at 30% 40%, rgba(201,168,76,.10) 0%, transparent 65%),
		radial-gradient(ellipse 50% 40% at 75% 65%, rgba(74,124,126,.08)  0%, transparent 65%);
	pointer-events: none;
}
.lt-login-card {
	position:      relative;
	z-index:       1;
	background:    var(--lt-white);
	border-radius: var(--lt-radius-lg);
	padding:       var(--lt-space-3xl);
	width:         100%;
	max-width:     420px;
	box-shadow:    0 20px 60px rgba(0,0,0,.3);
}
.lt-login-card__logo {
	text-align:    center;
	margin-bottom: var(--lt-space-2xl);
}
.lt-login-card__logo a {
	font-family: var(--lt-font-display);
	font-size:   1.5rem;
	font-weight: 700;
	color:       var(--lt-primary);
}
.lt-login-card h1 {
	font-size:  1.375rem;
	text-align: center;
	margin-bottom: var(--lt-space-xs);
}
.lt-login-card__sub {
	text-align:    center;
	color:         var(--lt-text-muted);
	font-size:     0.9375rem;
	margin-bottom: var(--lt-space-2xl);
}

/* WP login form styling */
.lt-login-card .login-username,
.lt-login-card .login-password { margin-bottom: var(--lt-space-lg); }
.lt-login-card label {
	display:       block;
	font-size:     0.875rem;
	font-weight:   500;
	color:         var(--lt-text);
	margin-bottom: 0.375rem;
}
.lt-login-card input[type="text"],
.lt-login-card input[type="password"] {
	width:         100%;
	padding:       .625rem .875rem;
	border:        1.5px solid var(--lt-border);
	border-radius: var(--lt-radius-md);
	font-size:     1rem;
	color:         var(--lt-text);
	background:    var(--lt-bg);
	transition:    border-color var(--lt-transition);
}
.lt-login-card input[type="text"]:focus,
.lt-login-card input[type="password"]:focus {
	outline:      none;
	border-color: var(--lt-accent);
	box-shadow:   0 0 0 3px rgba(201,168,76,.15);
}
.lt-login-card input[type="submit"] {
	width:         100%;
	padding:       .75rem;
	background:    var(--lt-accent);
	color:         var(--lt-primary);
	border:        2px solid var(--lt-accent);
	border-radius: var(--lt-radius-md);
	font-size:     1rem;
	font-weight:   600;
	cursor:        pointer;
	transition:    all var(--lt-transition);
	margin-top:    var(--lt-space-sm);
}
.lt-login-card input[type="submit"]:hover {
	background:   var(--lt-accent-hover);
	border-color: var(--lt-accent-hover);
	transform:    translateY(-1px);
}
.lt-login-card .forgetmenot {
	display:     flex;
	align-items: center;
	gap:         var(--lt-space-xs);
	font-size:   0.875rem;
	color:       var(--lt-text-muted);
	margin-bottom:var(--lt-space-md);
}
.lt-login-card__links {
	display:         flex;
	justify-content: space-between;
	gap:             var(--lt-space-sm);
	margin-top:      var(--lt-space-lg);
	font-size:       0.875rem;
}
.lt-login-card__links a { color: var(--lt-teal); }
.lt-login-card__links a:hover { text-decoration: underline; }

/* ── 404 pagina ─────────────────────────────────────────────── */
.lt-404 {
	text-align:  center;
	padding:     var(--lt-space-4xl) var(--lt-space-xl);
}
.lt-404__number {
	font-family:   var(--lt-font-display);
	font-size:     clamp(4rem, 15vw, 8rem);
	font-weight:   700;
	color:         var(--lt-accent);
	line-height:   1;
	margin-bottom: var(--lt-space-md);
}
.lt-404 h1 { margin-bottom: var(--lt-space-sm); }
.lt-404 p  { color: var(--lt-text-muted); margin-bottom: var(--lt-space-2xl); }

/* ── Paginering ─────────────────────────────────────────────── */
.lt-pagination { margin-top: var(--lt-space-2xl); }
.lt-pagination .nav-links { display: flex; gap: var(--lt-space-xs); align-items: center; }
.lt-pagination .page-numbers {
	display:       inline-flex;
	align-items:   center;
	justify-content:center;
	width:         2.25rem;
	height:        2.25rem;
	border-radius: var(--lt-radius-md);
	font-size:     0.9375rem;
	color:         var(--lt-text);
	background:    var(--lt-white);
	border:        1px solid var(--lt-border);
	transition:    all var(--lt-transition);
}
.lt-pagination .page-numbers:hover,
.lt-pagination .page-numbers.current {
	background:  var(--lt-primary);
	color:       var(--lt-white);
	border-color:var(--lt-primary);
}

/* ── WP align helpers ───────────────────────────────────────── */
.alignleft   { float: left; margin: 0 var(--lt-space-lg) var(--lt-space-md) 0; }
.alignright  { float: right; margin: 0 0 var(--lt-space-md) var(--lt-space-lg); }
.aligncenter { display: block; margin: 0 auto var(--lt-space-md); }
.wp-caption-text { font-size: .875rem; color: var(--lt-text-muted); text-align: center; margin-top: .375rem; }

/* ── Media queries ──────────────────────────────────────────── */
@media (max-width: 960px) {
	.lt-landing__body { grid-template-columns: 1fr; }
	.lt-sidebar-card  { position: static; }
}

@media (max-width: 768px) {
	.lt-container { padding: 0 var(--lt-space-lg); }

	/* Mobiel nav */
	.lt-nav__toggle { display: flex; }
	.lt-header__inner { position: relative; }
	.lt-nav {
		position:   absolute;
		top:        64px;
		left:       0;
		right:      0;
		background: var(--lt-white);
		border-bottom: 1px solid var(--lt-border);
		padding:    var(--lt-space-md);
		display:    none;
		box-shadow: 0 8px 24px rgba(0,0,0,.1);
		z-index:    99;
	}
	.lt-nav.is-open      { display: block; }
	.lt-nav__menu        { flex-direction: column; align-items: stretch; }
	.lt-nav__menu li a   { padding: var(--lt-space-sm) var(--lt-space-md); }
	.lt-header__user     { display: none; }

	/* Ko-fi button is too wide for the mobile header — move it into the nav dropdown */
	.lt-kofi-nav-btn { display: none; }

	/* Ko-fi link shown at the bottom of the hamburger dropdown (hidden on desktop) */
	.lt-nav__kofi {
		display:    block;
		padding:    var(--lt-space-sm) 0 0;
		margin-top: var(--lt-space-sm);
		border-top: 1px solid var(--lt-border);
	}
	.lt-nav__kofi .lt-btn { width: 100%; justify-content: center; }

	/* Hero */
	.lt-hero  { padding: var(--lt-space-3xl) 0; min-height: 360px; }

	/* Tools grid */
	.lt-tools__grid { grid-template-columns: 1fr; }

	/* Footer */
	.lt-footer__inner  { flex-direction: column; }
	.lt-footer__bottom { flex-direction: column; gap: var(--lt-space-sm); text-align: center; }

	/* App header */
	.lt-app-page__username { display: none; }
}

@media (max-width: 480px) {
	.lt-hero__actions,
	.lt-landing__hero-actions,
	.lt-script-card__actions { flex-direction: column; }
	.lt-hero__actions .lt-btn,
	.lt-landing__hero-actions .lt-btn,
	.lt-script-card__actions .lt-btn { width: 100%; }

	.lt-login-card { padding: var(--lt-space-2xl) var(--lt-space-lg); }
	.lt-login-card__links { flex-direction: column; text-align: center; }
}