/*
Theme Name: Zakra Child — Krediidilimiit.ee
Template: zakra
Description: Kohandatud tütartema Zakra põhjal - krediidilimiit.ee jaoks. Premium gold-beige palett, kaasaegne disain, Polylang ET/RU tugi.
Author: Krediidilimiit.ee
Version: 3.0.0
*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root {
	/* PREMIUM GOLD-BEIGE palette */
	--kl-primary: #b8a95f;
	--kl-primary-dark: #9a8c45;
	--kl-primary-light: #d4c98a;
	--kl-primary-50: #faf7ed;
	--kl-primary-100: #f0eacf;
	--kl-accent: #198754;
	--kl-accent-dark: #146c43;
	--kl-text: #212529;
	--kl-text-soft: #495057;
	--kl-muted: #6c757d;
	--kl-bg: #ffffff;
	--kl-bg-soft: #f8f7f3;
	--kl-border: #e9ecef;
	--kl-border-strong: #ced4da;
	--kl-warn: #f0ad4e;
	--kl-shadow-sm: 0 1px 3px rgba(33,37,41,.06);
	--kl-shadow: 0 4px 14px rgba(33,37,41,.08);
	--kl-shadow-lg: 0 18px 40px rgba(33,37,41,.10);
	--kl-radius-sm: 8px;
	--kl-radius: 14px;
	--kl-radius-lg: 22px;
	--kl-header-h: 64px;
	--kl-quickbar-h: 50px;
}

/* ============ Global ============ */
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--kl-header-h) + var(--kl-quickbar-h) + 8px); }
body { font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; font-size: 16px; line-height: 1.65; color: var(--kl-text); background: var(--kl-bg); -webkit-font-smoothing: antialiased; }
a { color: var(--kl-primary-dark); text-decoration: none; transition: color .15s ease; }
a:hover { color: var(--kl-primary); }
h1, h2, h3, h4, h5, h6 { color: var(--kl-text); line-height: 1.25; font-weight: 700; letter-spacing: -.01em; }
h1 { font-size: clamp(1.85rem, 1.4rem + 1.6vw, 2.6rem); }
h2 { font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); margin-top: 1.6em; }
h3 { font-size: clamp(1.2rem, 1.05rem + .5vw, 1.4rem); margin-top: 1.3em; }
img { max-width: 100%; height: auto; }
::selection { background: var(--kl-primary-100); color: var(--kl-primary-dark); }

/* ============ Header (sticky) ============ */
.kl-header {
	position: sticky; top: 0; z-index: 1000;
	background: rgba(255,255,255,.96);
	backdrop-filter: saturate(160%) blur(10px);
	-webkit-backdrop-filter: saturate(160%) blur(10px);
	border-bottom: 1px solid var(--kl-border);
}
.kl-header__inner { max-width: 1200px; margin: 0 auto; padding: 0 18px; height: var(--kl-header-h); display: flex; align-items: center; gap: 18px; }
.kl-header__logo { display: flex; align-items: center; gap: 10px; font-weight: 800; font-size: 1.15rem; color: var(--kl-text); letter-spacing: -.02em; }
.kl-header__logo:hover { text-decoration: none; color: var(--kl-primary-dark); }
.kl-header__logo img { height: 36px; width: auto; }
.kl-header__brand-mark { display: inline-flex; width: 36px; height: 36px; border-radius: 8px; background: linear-gradient(135deg, var(--kl-primary), var(--kl-primary-dark)); color: #fff; align-items: center; justify-content: center; font-weight: 800; }
.kl-header__nav { margin-left: auto; display: flex; align-items: center; gap: 4px; }
.kl-header__nav a { padding: 8px 12px; border-radius: 8px; color: var(--kl-text-soft); font-weight: 500; font-size: .95rem; }
.kl-header__nav a:hover { background: var(--kl-primary-50); color: var(--kl-primary-dark); text-decoration: none; }
.kl-header__nav a.is-active { color: var(--kl-primary-dark); background: var(--kl-primary-50); }
.kl-header__nav a.kl-header__cta {
	margin-left: 8px;
	padding: 10px 18px !important;
	background: linear-gradient(135deg, var(--kl-primary), var(--kl-primary-dark)) !important;
	color: #fff !important;
	border-radius: 10px;
	font-weight: 700 !important;
	box-shadow: var(--kl-shadow-sm);
}
.kl-header__nav a.kl-header__cta:hover { transform: translateY(-1px); box-shadow: var(--kl-shadow); color: #fff !important; }
.kl-langswitch { display: flex; gap: 4px; margin-right: 6px; }
.kl-langswitch a { padding: 4px 8px !important; font-size: .75rem !important; font-weight: 700 !important; color: var(--kl-muted) !important; text-transform: uppercase; }
.kl-langswitch a.is-current { color: var(--kl-primary-dark) !important; background: var(--kl-primary-50) !important; }
.kl-burger { display: none; margin-left: auto; width: 44px; height: 44px; border: 1px solid var(--kl-border); border-radius: 10px; background: #fff; cursor: pointer; padding: 0; position: relative; }
.kl-burger span { position: absolute; left: 11px; right: 11px; height: 2px; background: var(--kl-text); border-radius: 2px; transition: all .25s ease; }
.kl-burger span:nth-child(1) { top: 14px; }
.kl-burger span:nth-child(2) { top: 21px; }
.kl-burger span:nth-child(3) { top: 28px; }
.kl-burger.is-open span:nth-child(1) { top: 21px; transform: rotate(45deg); }
.kl-burger.is-open span:nth-child(2) { opacity: 0; }
.kl-burger.is-open span:nth-child(3) { top: 21px; transform: rotate(-45deg); }

/* ============ Quickbar ============ */
.kl-quickbar {
	position: sticky; top: var(--kl-header-h); z-index: 999;
	background: linear-gradient(135deg, var(--kl-primary) 0%, var(--kl-primary-dark) 100%);
	color: #fff; min-height: var(--kl-quickbar-h); display: flex; align-items: center;
	overflow: visible;
}
.kl-quickbar__inner { max-width: 1200px; margin: 0 auto; padding: 0 18px; width: 100%; display: flex; align-items: center; gap: 8px; }
@media (max-width: 720px) {
	.kl-quickbar__inner { overflow-x: auto; scrollbar-width: none; }
	.kl-quickbar__inner::-webkit-scrollbar { display: none; }
}
.kl-quickbar__pill {
	flex: 0 0 auto;
	display: inline-flex; align-items: center; gap: 6px;
	padding: 7px 14px;
	background: rgba(255,255,255,.16);
	color: #fff !important;
	border-radius: 999px;
	font-size: .86rem; font-weight: 600;
	white-space: nowrap;
	transition: background .15s ease, transform .15s ease;
}
.kl-quickbar__pill:hover { background: rgba(255,255,255,.28); text-decoration: none; transform: translateY(-1px); }
.kl-quickbar__pill--cta { background: var(--kl-accent); }
.kl-quickbar__pill--cta:hover { background: var(--kl-accent-dark); }
.kl-quickbar__group { position: relative; flex: 0 0 auto; }
.kl-quickbar__chev { font-size: .7rem; opacity: .8; margin-left: 2px; }

/* Quickbar dropdown */
.kl-quickbar__dd {
	position: absolute; top: calc(100% + 6px); left: 0;
	min-width: 280px; background: #fff;
	border: 1px solid var(--kl-border); border-radius: var(--kl-radius);
	box-shadow: var(--kl-shadow-lg);
	padding: 10px; z-index: 1050;
	opacity: 0; visibility: hidden; transform: translateY(-4px);
	transition: opacity .15s, transform .15s, visibility .15s;
}
.kl-quickbar__group:hover .kl-quickbar__dd,
.kl-quickbar__group:focus-within .kl-quickbar__dd { opacity: 1; visibility: visible; transform: translateY(0); }
.kl-quickbar__dd-head { font-size: .76rem; color: var(--kl-muted); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 8px 12px 10px; border-bottom: 1px solid var(--kl-border); margin-bottom: 6px; }
.kl-quickbar__dd-item { display: flex !important; flex-direction: column; padding: 10px 12px !important; border-radius: 8px !important; background: transparent !important; color: var(--kl-text) !important; white-space: normal !important; }
.kl-quickbar__dd-item:hover { background: var(--kl-primary-50) !important; transform: none !important; text-decoration: none !important; }
.kl-quickbar__dd-name { font-weight: 700; color: var(--kl-text) !important; font-size: .94rem; }
.kl-quickbar__dd-meta { font-size: .8rem; color: var(--kl-muted) !important; margin-top: 2px; font-weight: 400; }
.kl-quickbar__dd-all { display: block !important; padding: 10px 12px !important; margin-top: 4px !important; border-top: 1px solid var(--kl-border); color: var(--kl-primary-dark) !important; font-weight: 700 !important; font-size: .9rem !important; }
.kl-quickbar__dd-all:hover { background: var(--kl-primary-50) !important; }
@media (max-width: 720px) { .kl-quickbar__dd, .kl-quickbar__chev { display: none !important; } }

/* ============ Drawer (mobile menu) ============ */
.kl-drawer { position: fixed; inset: 0; z-index: 1100; display: none; background: rgba(33,37,41,.55); backdrop-filter: blur(2px); }
.kl-drawer.is-open { display: block; animation: drawerFade .2s ease; }
@keyframes drawerFade { from { opacity: 0; } to { opacity: 1; } }
.kl-drawer__panel { position: absolute; top: 0; right: 0; width: min(360px, 88%); height: 100%; background: #fff; display: flex; flex-direction: column; box-shadow: var(--kl-shadow-lg); animation: drawerSlide .25s ease; }
@keyframes drawerSlide { from { transform: translateX(100%); } to { transform: translateX(0); } }
.kl-drawer__head { padding: 16px 18px; border-bottom: 1px solid var(--kl-border); display: flex; align-items: center; justify-content: space-between; }
.kl-drawer__title { font-weight: 800; font-size: 1.1rem; }
.kl-drawer__close { width: 36px; height: 36px; border-radius: 10px; border: 1px solid var(--kl-border); background: #fff; cursor: pointer; font-size: 1.4rem; line-height: 1; }
.kl-drawer__nav { flex: 1; overflow-y: auto; padding: 8px 12px 20px; }
.kl-drawer__nav a { display: block; padding: 13px 14px; border-radius: 10px; color: var(--kl-text); font-weight: 600; }
.kl-drawer__nav a:hover { background: var(--kl-primary-50); color: var(--kl-primary-dark); text-decoration: none; }
.kl-drawer__nav details { margin: 2px 0; }
.kl-drawer__nav summary { list-style: none; padding: 13px 14px; border-radius: 10px; cursor: pointer; font-weight: 700; color: var(--kl-text); display: flex; justify-content: space-between; align-items: center; }
.kl-drawer__nav summary::after { content: '⌄'; font-size: 1.2rem; opacity: .5; transition: transform .2s; }
.kl-drawer__nav details[open] summary::after { transform: rotate(180deg); }
.kl-drawer__nav summary:hover { background: var(--kl-primary-50); }
.kl-drawer__nav details a { padding-left: 28px; font-weight: 500; color: var(--kl-text-soft); }
.kl-drawer__cta { padding: 14px 18px; border-top: 1px solid var(--kl-border); display: flex; gap: 10px; }
.kl-drawer__cta .kl-btn { flex: 1; }
body.kl-drawer-open { overflow: hidden; }

/* ============ Buttons ============ */
.kl-btn, .entry-content a.kl-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	padding: 12px 22px;
	background: linear-gradient(135deg, var(--kl-primary), var(--kl-primary-dark));
	color: #fff !important; border-radius: 10px;
	font-weight: 700; font-size: 1rem; border: 0; cursor: pointer;
	transition: transform .15s ease, box-shadow .15s ease;
	box-shadow: var(--kl-shadow-sm);
	text-decoration: none !important;
}
.kl-btn:hover { transform: translateY(-1px); box-shadow: var(--kl-shadow); color: #fff !important; }
.kl-btn--accent { background: linear-gradient(135deg, var(--kl-accent), var(--kl-accent-dark)); }
.kl-btn--ghost { background: #fff; color: var(--kl-primary-dark) !important; border: 1.5px solid var(--kl-primary); box-shadow: none; }
.kl-btn--ghost:hover { background: var(--kl-primary-50); color: var(--kl-primary-dark) !important; }
.kl-btn--lg { padding: 16px 28px; font-size: 1.08rem; }
.kl-btn--block { display: flex; width: 100%; }

/* ============ Hero ============ */
.kl-hero {
	background: radial-gradient(800px 400px at 80% -10%, rgba(184,169,95,.18), transparent 60%),
	            radial-gradient(600px 300px at -5% 110%, rgba(184,169,95,.10), transparent 60%),
	            linear-gradient(180deg, var(--kl-bg-soft) 0%, #ffffff 100%);
	padding: 56px 18px 64px;
	border-bottom: 1px solid var(--kl-border);
}
.kl-hero__inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.1fr .9fr; gap: 48px; align-items: center; }
.kl-hero__title { margin: 0 0 16px; font-size: clamp(2rem, 1.4rem + 2.4vw, 3rem); line-height: 1.15; font-weight: 800; padding-bottom: 0; }
.kl-hero__lead { font-size: 1.1rem; color: var(--kl-text-soft); margin-bottom: 24px; max-width: 56ch; }
.kl-hero__cta { display: flex; gap: 12px; flex-wrap: wrap; }
.kl-hero__trust { margin-top: 20px; font-size: .9rem; color: var(--kl-muted); display: flex; gap: 18px; flex-wrap: wrap; }
.kl-hero__trust span { display: inline-flex; align-items: center; gap: 6px; }
.kl-hero__trust span::before { content: '✓'; color: var(--kl-accent); font-weight: 800; }
.kl-hero__visual {
	background: linear-gradient(135deg, var(--kl-primary) 0%, var(--kl-primary-dark) 100%);
	border-radius: var(--kl-radius-lg); padding: 28px;
	color: #fff; box-shadow: var(--kl-shadow-lg); position: relative; overflow: hidden;
}
.kl-hero__visual::after { content: ''; position: absolute; right: -60px; top: -60px; width: 220px; height: 220px; border-radius: 50%; background: rgba(255,255,255,.08); }
.kl-hero__visual h3 { color: #fff; margin: 0 0 6px; }
.kl-hero__visual p { opacity: .92; margin: 0 0 18px; font-size: .96rem; }
.kl-hero__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; position: relative; z-index: 1; }
.kl-hero__stat { background: #fff; color: var(--kl-primary-dark); border-radius: 14px; padding: 14px 12px; text-align: center; box-shadow: 0 6px 18px rgba(0,0,0,.18); }
.kl-hero__stat strong { display: block; font-size: 1.45rem; line-height: 1.1; margin-bottom: 4px; color: var(--kl-primary-dark); font-weight: 800; }
.kl-hero__stat span { font-size: .82rem; color: var(--kl-text-soft); display: block; line-height: 1.3; }

/* ============ Cards ============ */
.kl-grid { display: grid; gap: 18px; }
.kl-grid--cards { grid-template-columns: 1fr; align-items: stretch; grid-auto-rows: 1fr; }
@media (min-width: 600px) { .kl-grid--cards { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (min-width: 900px) { .kl-grid--cards { grid-template-columns: repeat(3, minmax(0,1fr)); } }
.kl-card {
	background: var(--kl-bg); border: 1px solid var(--kl-border); border-radius: var(--kl-radius);
	padding: 24px 22px; height: 100%; min-height: 220px;
	display: flex; flex-direction: column;
	transition: transform .18s, box-shadow .18s, border-color .18s;
	box-sizing: border-box;
}
.kl-card:hover { transform: translateY(-3px); border-color: var(--kl-primary-light); box-shadow: var(--kl-shadow); }
.kl-card *, .kl-card { text-decoration: none !important; }
.kl-card__icon { flex: 0 0 44px; width: 44px; height: 44px; border-radius: 10px; background: var(--kl-primary-50); color: var(--kl-primary-dark); display: inline-flex; align-items: center; justify-content: center; font-size: 1.4rem; margin-bottom: 14px; line-height: 1; }
.kl-card h3 { margin: 0 0 8px; font-size: 1.15rem; line-height: 1.3; min-height: 2.6em; display: flex; align-items: flex-start; color: var(--kl-text); padding-bottom: 0; }
.kl-card h3::after { display: none !important; }
.kl-card p { color: var(--kl-text-soft); margin: 0 0 16px; font-size: .94rem; line-height: 1.5; flex: 1 1 auto; }
.kl-card__cta { color: var(--kl-primary-dark); font-weight: 700; display: inline-flex; align-items: center; gap: 4px; margin-top: auto; font-size: .94rem; }
.kl-card__cta::after { content: '→'; transition: transform .15s; }
.kl-card:hover .kl-card__cta::after { transform: translateX(3px); }

/* ============ Comparison cards (offers) ============ */
.kl-cmp-grid { display: grid; grid-template-columns: 1fr; grid-auto-rows: 1fr; gap: 18px; margin: 24px 0; }
@media (min-width: 600px) { .kl-cmp-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (min-width: 1000px) { .kl-cmp-grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }
.kl-cmp-card { background: #fff; border: 1px solid var(--kl-border); border-radius: var(--kl-radius); padding: 22px; display: flex; flex-direction: column; transition: transform .18s, box-shadow .18s, border-color .18s; height: 100%; box-sizing: border-box; }
.kl-cmp-card:hover { transform: translateY(-3px); border-color: var(--kl-primary-light); box-shadow: var(--kl-shadow); }
.kl-cmp-card *, .kl-cmp-card a { text-decoration: none !important; }
.kl-cmp-card__head { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.kl-cmp-card__logo { width: 56px; height: 56px; border-radius: 10px; background: var(--kl-bg-soft); display: flex; align-items: center; justify-content: center; flex: 0 0 56px; border: 1px solid var(--kl-border); overflow: hidden; }
.kl-cmp-card__logo img { max-width: 80%; max-height: 80%; object-fit: contain; }
.kl-cmp-card__name { font-weight: 800; font-size: 1.15rem; color: var(--kl-text); line-height: 1.2; }
.kl-cmp-card__tags { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 6px; }
.kl-cmp-card__tag { font-size: .72rem; padding: 3px 9px; background: var(--kl-primary-50); color: var(--kl-primary-dark); border-radius: 999px; font-weight: 600; line-height: 1.5; }
.kl-cmp-card__details { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 6px 0 14px; padding: 14px; background: var(--kl-bg-soft); border-radius: 10px; }
.kl-cmp-card__detail-label { color: var(--kl-muted); display: block; margin-bottom: 2px; font-weight: 500; font-size: .78rem; }
.kl-cmp-card__detail-value { font-weight: 700; color: var(--kl-text); font-size: .96rem; line-height: 1.3; }
.kl-cmp-card__perks { font-size: .9rem; color: var(--kl-text-soft); margin: 0 0 16px; line-height: 1.5; flex: 1; }
.kl-cmp-card__cta { display: flex !important; align-items: center; justify-content: center; padding: 13px 18px; background: linear-gradient(135deg, var(--kl-accent), var(--kl-accent-dark)) !important; color: #fff !important; border-radius: 10px; font-weight: 700; box-shadow: var(--kl-shadow-sm); transition: transform .15s; margin-top: auto; }
.kl-cmp-card__cta:hover { transform: translateY(-1px); }
.kl-cmp-card.is-hidden { display: none; }
/* Filter pills */
.kl-cmp-filters { display: flex; gap: 8px; flex-wrap: wrap; margin: 18px 0 28px; }
.kl-cmp-filters button { padding: 9px 18px; border: 1.5px solid var(--kl-border); background: #fff; color: var(--kl-text); border-radius: 999px; cursor: pointer; font-weight: 600; font-size: .9rem; font-family: inherit; transition: all .15s; }
.kl-cmp-filters button:hover { border-color: var(--kl-primary); color: var(--kl-primary-dark); }
.kl-cmp-filters button.is-active { background: linear-gradient(135deg, var(--kl-primary), var(--kl-primary-dark)); border-color: var(--kl-primary); color: #fff; }

/* ============ Disclaimer ============ */
.kl-disclaimer { max-width: 1200px; margin: 14px auto 18px; padding: 11px 16px; background: #fff7e6; border-left: 3px solid var(--kl-warn); border-radius: 8px; font-size: .85rem; line-height: 1.5; color: var(--kl-text-soft); box-sizing: border-box; }
.kl-disclaimer strong { color: var(--kl-text); }
.kl-disclaimer a { color: var(--kl-primary-dark); font-weight: 600; white-space: nowrap; }

/* ============ Cathead (category banner) ============ */
.kl-cathead { display: flex; align-items: center; gap: 22px; margin: 28px auto; padding: 24px 28px; background: linear-gradient(135deg, var(--kl-primary-50) 0%, #ffffff 100%); border-radius: var(--kl-radius-lg); border: 1px solid var(--kl-primary-100); max-width: 1100px; box-sizing: border-box; }
.kl-cathead__icon { flex: 0 0 64px; width: 64px; height: 64px; border-radius: 14px; background: linear-gradient(135deg, var(--kl-primary), var(--kl-primary-dark)); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 1.8rem; box-shadow: var(--kl-shadow); }
.kl-cathead__body { flex: 1; min-width: 0; }
.kl-cathead__body h2 { margin: 0 0 4px; font-size: 1.25rem; padding-bottom: 0; line-height: 1.3; }
.kl-cathead__body h2::after { display: none; }
.kl-cathead__body p { margin: 0; color: var(--kl-text-soft); font-size: .95rem; line-height: 1.5; }
.kl-cathead__cta { flex: 0 0 auto; }
@media (max-width: 720px) { .kl-cathead { flex-direction: column; text-align: center; padding: 20px 18px; gap: 14px; } .kl-cathead__cta .kl-btn { width: 100%; } }

/* ============ FAQ accordion ============ */
.kl-faq { display: flex; flex-direction: column; gap: 10px; margin: 28px 0; max-width: 760px; margin-left: auto; margin-right: auto; }
.kl-faq__item { background: #fff; border: 1px solid var(--kl-border); border-radius: var(--kl-radius); transition: border-color .15s; }
.kl-faq__item[open] { border-color: var(--kl-primary-light); box-shadow: var(--kl-shadow-sm); }
.kl-faq__q { list-style: none; padding: 18px 22px; cursor: pointer; font-weight: 700; color: var(--kl-text); font-size: 1.05rem; display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.kl-faq__q::-webkit-details-marker { display: none; }
.kl-faq__q::after { content: '+'; flex: 0 0 28px; width: 28px; height: 28px; line-height: 26px; text-align: center; border-radius: 50%; background: var(--kl-primary-50); color: var(--kl-primary-dark); font-weight: 700; transition: transform .2s; }
.kl-faq__item[open] .kl-faq__q::after { content: '−'; transform: rotate(180deg); }
.kl-faq__a { padding: 0 22px 18px; color: var(--kl-text-soft); font-size: .98rem; line-height: 1.7; }

/* ============ Sections ============ */
.kl-section { padding: 56px 18px; }
.kl-section--soft { background: var(--kl-bg-soft); }
.kl-section__inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; box-sizing: border-box; }
.kl-section__head { text-align: center; max-width: 720px; margin: 0 auto 32px; }
.kl-section__head h2 { margin: 0 0 10px; padding-bottom: 0; }
.kl-section__head h2::after { display: none; }
.kl-section__head p { color: var(--kl-text-soft); font-size: 1.05rem; margin: 0; }
.kl-section__inner > p, .kl-section__inner > ul, .kl-section__inner > ol, .kl-section__inner > h2, .kl-section__inner > h3, .kl-section__inner > .kl-faq, .kl-section__inner > .kl-callout, .kl-section__inner > .kl-tldr, .kl-section__inner > blockquote { max-width: 760px; margin-left: auto; margin-right: auto; }

/* ============ Steps (vertical timeline) ============ */
.kl-steps { display: flex; flex-direction: column; gap: 14px; counter-reset: klstep; margin: 28px auto; padding: 0 24px; max-width: 800px; box-sizing: border-box; }
.kl-step { background: #fff; border: 1px solid var(--kl-border); border-radius: var(--kl-radius); padding: 22px 22px 22px 88px; position: relative; counter-increment: klstep; box-sizing: border-box; transition: border-color .18s, box-shadow .18s; }
.kl-step:hover { border-color: var(--kl-primary-light); box-shadow: var(--kl-shadow-sm); }
.kl-step::before { content: counter(klstep); position: absolute; top: 50%; left: 22px; transform: translateY(-50%); width: 46px; height: 46px; border-radius: 50%; background: linear-gradient(135deg, var(--kl-primary), var(--kl-primary-dark)); color: #fff; font-weight: 800; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 12px rgba(184,169,95,.32); font-size: 1.15rem; }
.kl-step::after { content: ''; position: absolute; left: 45px; top: 100%; width: 2px; height: 14px; background: linear-gradient(180deg, var(--kl-primary-light), transparent); }
.kl-step:last-child::after { display: none; }
.kl-step h3 { margin: 0 0 6px; font-size: 1.1rem; line-height: 1.3; padding-bottom: 0; }
.kl-step h3::after { display: none; }
.kl-step p { color: var(--kl-text-soft); margin: 0; font-size: .96rem; line-height: 1.6; }
@media (max-width: 480px) { .kl-step { padding: 64px 18px 18px; } .kl-step::before { top: 14px; left: 18px; transform: none; width: 40px; height: 40px; font-size: 1rem; } .kl-step::after { left: 38px; } }

/* ============ TLDR / callout ============ */
.kl-tldr { display: flex; gap: 14px; align-items: flex-start; padding: 18px 22px; background: #fff; border: 1px solid var(--kl-border); border-radius: var(--kl-radius); margin: 18px auto 26px; max-width: 760px; }
.kl-tldr__icon { width: 36px; height: 36px; border-radius: 10px; background: var(--kl-primary-50); color: var(--kl-primary-dark); display: inline-flex; align-items: center; justify-content: center; flex: 0 0 36px; font-weight: 800; }
.kl-tldr__body { color: var(--kl-text-soft); font-size: .96rem; }
.kl-tldr__body strong { color: var(--kl-text); }
.kl-callout { background: var(--kl-primary-50); border: 1px solid var(--kl-primary-100); border-radius: var(--kl-radius); padding: 22px 24px; margin: 26px auto; max-width: 760px; }
.kl-callout--accent { background: #e8f9f3; border-color: #b9ebd9; }
.kl-callout--warn { background: #fff7e6; border-color: #ffd9a3; }
.kl-callout strong { color: var(--kl-primary-dark); }

/* ============ Page CTA ============ */
.kl-page-cta { margin: 40px auto 24px; padding: 30px 28px; background: linear-gradient(135deg, var(--kl-primary), var(--kl-primary-dark)); border-radius: var(--kl-radius-lg); color: #fff; text-align: center; box-shadow: var(--kl-shadow-lg); max-width: 1200px; }
.kl-page-cta h3 { color: #fff; margin: 0 0 8px; font-size: 1.45rem; padding-bottom: 0; }
.kl-page-cta h3::after { display: none; }
.kl-page-cta p { color: rgba(255,255,255,.92); margin: 0 0 18px; }
.kl-page-cta .kl-btn { background: #fff !important; color: var(--kl-primary-dark) !important; }
.kl-page-cta .kl-btn:hover { background: var(--kl-primary-50) !important; }

/* ============ Prev/Next ============ */
.kl-prevnext { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 40px 0 0; max-width: 800px; margin-left: auto; margin-right: auto; }
.kl-prevnext a { display: flex; flex-direction: column; padding: 18px 22px; background: #fff; border: 1px solid var(--kl-border); border-radius: var(--kl-radius); text-decoration: none !important; transition: transform .18s, box-shadow .18s, border-color .18s; }
.kl-prevnext a:hover { transform: translateY(-2px); border-color: var(--kl-primary-light); box-shadow: var(--kl-shadow); }
.kl-prevnext__label { font-size: .8rem; color: var(--kl-muted); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 4px; }
.kl-prevnext__title { font-size: 1.05rem; color: var(--kl-text); font-weight: 700; }
.kl-prevnext__next { text-align: right; }
@media (max-width: 600px) { .kl-prevnext { grid-template-columns: 1fr; } .kl-prevnext__next { text-align: left; } }

/* ============ Meta ============ */
.kl-meta { display: flex; gap: 12px; align-items: center; color: var(--kl-muted); font-size: .9rem; margin: 4px 0 18px; max-width: 760px; margin-left: auto; margin-right: auto; padding: 0 24px; }
.kl-meta time { color: var(--kl-text-soft); font-weight: 500; }
.kl-meta__sep { width: 4px; height: 4px; background: var(--kl-border-strong); border-radius: 50%; }
body.has-kl-hero .wp-block-post-title,
body.has-kl-hero .entry-title,
body.has-kl-hero .tg-page-header,
body.has-kl-hero .tg-page-header__title,
body.has-kl-hero .has-page-header { display: none !important; }
body.has-kl-hero .kl-meta { max-width: 1200px; margin: 4px auto 0; padding: 8px 18px; background: rgba(255,255,255,.7); border: 1px solid var(--kl-border); border-radius: 999px; display: inline-flex; width: auto; font-size: .82rem; }

/* ============ Breadcrumbs ============ */
.kl-bc { font-size: .88rem; color: var(--kl-muted); padding: 14px 18px 0; max-width: 1200px; margin: 0 auto; }
.kl-bc a { color: var(--kl-text-soft); }
.kl-bc__sep { margin: 0 6px; opacity: .6; }

/* ============ Footer ============ */
.kl-footer { background: var(--kl-text); color: #ced4da; padding: 56px 18px 28px; margin-top: 64px; }
.kl-footer a { color: #ced4da; }
.kl-footer a:hover { color: #fff; text-decoration: none; }
.kl-footer__inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 32px; }
.kl-footer h4 { color: #fff; font-size: 1rem; margin: 0 0 14px; padding-bottom: 0; }
.kl-footer h4::after { display: none; }
.kl-footer ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.kl-footer__brand p { color: #adb5bd; font-size: .9rem; line-height: 1.6; }
.kl-footer__bottom { max-width: 1200px; margin: 36px auto 0; padding-top: 22px; border-top: 1px solid #495057; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; font-size: .85rem; color: #adb5bd; }
.kl-footer__warning { background: #2a2f34; border-radius: var(--kl-radius); padding: 18px 22px; margin: 22px auto 0; max-width: 1200px; font-size: .85rem; color: #ced4da; line-height: 1.6; }
.kl-footer__warning strong { color: #fff; }
.kl-footer__warning p { margin: 0 0 10px; }
.kl-footer__warning p:last-child { margin: 0; }
@media (max-width: 720px) { .kl-footer__inner { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .kl-footer__inner { grid-template-columns: 1fr; gap: 24px; } }

/* ============ Mobile bottom CTA ============ */
.kl-mcta { display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 998; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); background: rgba(255,255,255,.96); backdrop-filter: blur(10px); border-top: 1px solid var(--kl-border); box-shadow: 0 -6px 18px rgba(0,0,0,.06); }
.kl-mcta__inner { display: flex; gap: 8px; max-width: 600px; margin: 0 auto; }
.kl-mcta .kl-btn { flex: 1; padding: 12px 14px; font-size: .95rem; }
@media (max-width: 720px) { .kl-mcta { display: block; } body.has-kl-mcta { padding-bottom: 76px; } }

/* ============ 404 ============ */
.kl-404 { text-align: center; padding: 80px 18px; max-width: 720px; margin: 0 auto; }
.kl-404 h1 { font-size: clamp(3rem, 2rem + 4vw, 5rem); margin: 0 0 8px; color: var(--kl-primary-dark); letter-spacing: -.04em; }
.kl-404 p { font-size: 1.1rem; color: var(--kl-text-soft); margin: 0 0 28px; }
.kl-404__actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* ============ Article content layout ============ */
.entry-content, .wp-block-post-content { width: 100% !important; max-width: 1240px !important; margin: 0 auto !important; padding: 0 !important; box-sizing: border-box; }
.entry-content > p, .entry-content > ul, .entry-content > ol, .entry-content > blockquote, .entry-content > h2, .entry-content > h3, .entry-content > h4, .entry-content > figure, .entry-content > .kl-faq, .entry-content > .kl-callout, .entry-content > .kl-tldr { max-width: 760px !important; margin-left: auto !important; margin-right: auto !important; padding-left: 24px; padding-right: 24px; box-sizing: border-box; }
.entry-content > .kl-hero, .entry-content > .kl-section { max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; width: 100%; }
.entry-content > .kl-page-cta { max-width: 1200px !important; margin: 40px auto 24px !important; }
.entry-content > .kl-grid, .entry-content > .kl-cmp-grid, .entry-content > .kl-cmp-filters, .entry-content > .kl-trustbar, .entry-content > .kl-steps, .entry-content > .kl-disclaimer, .entry-content > .kl-prevnext, .entry-content > table { max-width: 1200px !important; margin-left: auto !important; margin-right: auto !important; padding-left: 24px; padding-right: 24px; box-sizing: border-box; }
.wp-block-post-title, .entry-title { max-width: 760px !important; margin: 24px auto 0 !important; padding: 0 24px !important; box-sizing: border-box; }

/* H2 with gradient underline */
.entry-content > h2 { margin-top: 2.5em; margin-bottom: .8em; font-size: 1.7rem; position: relative; padding-bottom: .3em; }
.entry-content > h2::after { content: ''; position: absolute; left: 24px; bottom: 0; width: 60px; height: 3px; background: linear-gradient(90deg, var(--kl-primary), var(--kl-primary-dark)); border-radius: 3px; }

/* Tables */
.entry-content > table { border-collapse: separate; border-spacing: 0; background: #fff; border-radius: var(--kl-radius); overflow: hidden; box-shadow: var(--kl-shadow-sm); border: 1px solid var(--kl-border); margin: 24px auto !important; }
.entry-content > table th { background: var(--kl-bg-soft); padding: 14px 16px; font-weight: 700; text-align: left; border-bottom: 2px solid var(--kl-border); }
.entry-content > table td { padding: 14px 16px; border-bottom: 1px solid var(--kl-border); }
.entry-content > table tr:last-child td { border-bottom: 0; }

/* Lists with colored markers */
.entry-content > ul li { margin: .35em 0; }
.entry-content > ul li::marker { color: var(--kl-primary-dark); }
.entry-content > ol li::marker { color: var(--kl-primary-dark); font-weight: 700; }

/* Images with rounded corners */
.entry-content img { border-radius: var(--kl-radius-sm); }

/* Override parent Zakra styles that break our layout */
.zakra-content-area, #content { padding: 0 !important; }
.tg-container { max-width: 100% !important; padding: 0 !important; }

/* Center legacy <div class="picm"><img></div> images */
.entry-content .picm { text-align: center; margin: 24px auto; max-width: 760px; padding: 0 24px; }
.entry-content .picm img { display: block; margin: 0 auto; max-width: 100%; height: auto; border-radius: var(--kl-radius-sm); }

/* Center any orphan <img> in entry-content too */
.entry-content > p > img,
.entry-content > img { display: block; margin: 16px auto; max-width: 100%; }

/* Show burger on mobile, hide nav on mobile */
@media (max-width: 980px) {
	.kl-header__nav { display: none !important; }
	.kl-burger { display: inline-block !important; }
	.kl-header__inner { gap: 0; }
	.kl-header__logo { flex: 1; }
}

/* Ensure NO horizontal scroll - aggressive overflow control */
html, body { overflow-x: hidden !important; max-width: 100vw !important; }
.kl-hero, .kl-section, .kl-quickbar, .kl-footer, .tg-page-header, .entry-content { max-width: 100% !important; box-sizing: border-box !important; }

/* Fix legacy progress-bar element */
.entry-content .progress-bar { position: relative; height: 30px; background: var(--kl-bg-soft); border-radius: 999px; margin: 24px auto; max-width: 600px; padding: 0 !important; }
.entry-content .progress-bar .progress { height: 100%; background: linear-gradient(90deg, var(--kl-primary), var(--kl-primary-dark)); border-radius: 999px; }
.entry-content .progress-bar .marker, .entry-content .progress-bar .min-value, .entry-content .progress-bar .max-value, .entry-content .progress-bar .current-value, .entry-content .progress-bar .tooltip { display: none; }

/* Legacy .maintab restyle (provider blocks on homepage) */
.entry-content .maintab { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 18px; margin: 24px auto; max-width: 1200px; padding: 0 24px; box-sizing: border-box; }
.entry-content .maintab .cell { background: #fff; border: 1px solid var(--kl-border); border-radius: var(--kl-radius); padding: 22px; box-sizing: border-box; }
.entry-content .maintab .labely { font-size: 1.15rem; color: var(--kl-text); font-weight: 700; padding-bottom: 0; margin-top: 0; }
.entry-content .maintab .labely::after { display: none; }
.entry-content .maintab .logo1 { max-width: 100px; max-height: 40px; height: auto; margin: 8px 0; }
.entry-content .maintab .medal { display: none; }

/* ============ Reduce motion ============ */
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; scroll-behavior: auto; } }

/* ============ Print ============ */
@media print { .kl-header, .kl-quickbar, .kl-mcta, .kl-footer, .kl-burger, .kl-drawer { display: none !important; } }
