/*
Theme Name: KetoArab 2026
Theme URI: https://ketoarab.com
Author: KetoArab
Author URI: https://ketoarab.com
Description: Modern Arabic-first FSE block theme for KetoArab — full RTL, six color modes (avocado, Claude-sepia, ketodietapp-blue — each in light & dark), PWA-ready, IntersectionObserver scroll reveals, and a token-driven design system in theme.json.
Requires at least: 6.7
Tested up to: 7.0
Requires PHP: 8.1
Version: 0.3.21
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ketoarab2026
Tags: blog, news, food-and-drink, full-site-editing, block-patterns, translation-ready, rtl-language-support
*/

/* ----- base resets — design tokens live in theme.json ----- */
html {
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

img {
	max-width: 100%;
	height: auto;
}

::selection {
	background-color: var(--wp--preset--color--primary-soft);
	color: var(--wp--preset--color--primary-strong);
}

:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
}

/* ----- sticky header ----- */
.ka-header {
	position: sticky;
	top: 0;
	z-index: 50;
}

/* brand logo — white chip behind it in dark modes (via --ka-logo-chip) */
.ka-logo {
	display: inline-flex;
	align-items: center;
	background: var(--ka-logo-chip);
	border-radius: 10px;
	padding: 3px 8px;
	transition: background-color var(--wp--custom--transition--base) var(--wp--custom--transition--ease);
}
.ka-logo img {
	height: 46px;
	width: auto;
	display: block;
}

/* ----- post card (used in index / archive / search loops) ----- */
.ka-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	background-color: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--lg);
	box-shadow: var(--wp--custom--shadow--soft);
	transition:
		transform var(--wp--custom--transition--base) var(--wp--custom--transition--ease),
		box-shadow var(--wp--custom--transition--base) var(--wp--custom--transition--ease);
}

.ka-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--wp--custom--shadow--strong);
}

.ka-card .wp-block-post-featured-image {
	margin: 0;
}

.ka-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 0.6rem;
	padding: var(--wp--preset--spacing--40);
}

.ka-card__body .wp-block-post-title {
	margin: 0;
	line-height: 1.4;
}

.ka-card__body .wp-block-post-excerpt {
	margin: 0;
	color: var(--wp--preset--color--contrast-muted);
}

.ka-card__body .wp-block-post-date {
	margin-top: auto;
	padding-top: 0.4rem;
}

.ka-card__cat a {
	text-decoration: none;
}

@media (prefers-reduced-motion: reduce) {
	.ka-card,
	.ka-card:hover {
		transform: none;
		transition: none;
	}
}

/* ----- recipe-card block ----- */
.ka-recipe-card {
	background-color: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--lg);
	box-shadow: var(--wp--custom--shadow--soft);
	overflow: hidden;
	padding: var(--wp--preset--spacing--40);
}

.ka-recipe-card__media {
	margin: calc(-1 * var(--wp--preset--spacing--40)) calc(-1 * var(--wp--preset--spacing--40)) var(--wp--preset--spacing--40);
}

.ka-recipe-card__img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.ka-recipe-card__title {
	margin: 0 0 var(--wp--preset--spacing--30);
}

.ka-recipe-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--30);
	margin: 0 0 var(--wp--preset--spacing--40);
	padding: var(--wp--preset--spacing--30);
	list-style: none;
	background-color: var(--wp--preset--color--surface-2);
	border-radius: var(--wp--custom--radius--md);
}

.ka-recipe-card__meta-item {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}

.ka-recipe-card__meta-label {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--contrast-muted);
}

.ka-recipe-card__meta-value {
	font-weight: 800;
	color: var(--wp--preset--color--contrast);
}

.ka-recipe-card__nutrition {
	margin-top: var(--wp--preset--spacing--40);
}

/* ----- nutrition-facts block (standalone + embedded) ----- */
.ka-nutrition {
	background-color: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--md);
	padding: var(--wp--preset--spacing--40);
}

.ka-nutrition__title {
	margin: 0 0 var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--large);
}

.ka-nutrition__table {
	width: 100%;
	border-collapse: collapse;
}

.ka-nutrition__table th,
.ka-nutrition__table td {
	padding: 0.7rem 0;
	border-bottom: 1px solid var(--wp--preset--color--border);
	text-align: start;
}

.ka-nutrition__table tr:last-child th,
.ka-nutrition__table tr:last-child td {
	border-bottom: 0;
}

.ka-nutrition__table th {
	font-weight: 600;
	color: var(--wp--preset--color--contrast-muted);
}

.ka-nutrition__table td {
	text-align: end;
	font-weight: 800;
	color: var(--wp--preset--color--contrast);
}

.ka-nutrition__unit {
	margin-inline-start: 0.3rem;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	color: var(--wp--preset--color--contrast-muted);
}

.ka-nutrition__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
	gap: var(--wp--preset--spacing--20);
}

.ka-nutrition__cell {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.2rem;
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--20);
	background-color: var(--wp--preset--color--surface-2);
	border-radius: var(--wp--custom--radius--sm);
	text-align: center;
}

.ka-nutrition__num {
	font-size: 1.4rem;
	font-weight: 900;
	line-height: 1;
	color: var(--wp--preset--color--primary);
}

.ka-nutrition__label {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--contrast-muted);
}

/* ============================================================
   Homepage components — mockup parity. All colors via preset/--ka
   vars so the 6 modes recolor everything; no orphan light/dark.
   ============================================================ */
.ka-section { padding-block: var(--wp--preset--spacing--section-y); }
.ka-eyebrow { display:inline-flex; align-items:center; gap:8px; font-size:.85rem; font-weight:600; color:var(--ka-eyebrow); background:var(--wp--preset--color--primary-soft); padding:7px 15px; border-radius:var(--wp--custom--radius--pill); }
.ka-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; font-weight:700; font-size:1.02rem; padding:.85rem 1.6rem; border-radius:var(--wp--custom--radius--pill); cursor:pointer; text-decoration:none; transition:transform var(--wp--custom--transition--base) var(--wp--custom--transition--ease), background-color var(--wp--custom--transition--base) var(--wp--custom--transition--ease); }
.ka-btn--primary { background:var(--wp--preset--color--primary); color:#fff; }
.ka-btn--primary:hover { background:var(--wp--preset--color--primary-strong); transform:translateY(-2px); }
.ka-btn--ghost { background:transparent; color:var(--wp--preset--color--primary); border:1.5px solid var(--wp--preset--color--border); }
.ka-btn--ghost:hover { background:var(--wp--preset--color--primary-soft); border-color:var(--wp--preset--color--accent); }

/* hero (split: text + featured recipe card — matches mockup) */
.ka-hero { position:relative; overflow:hidden; }
.ka-hero::before { content:""; position:absolute; inset:0; background:radial-gradient(900px 520px at 80% -15%, var(--ka-glow), transparent 60%); pointer-events:none; }
.ka-hero__grid { position:relative; display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(1.5rem,4vw,3.5rem); align-items:center; }
.ka-hero__title { font-family:var(--wp--preset--font-family--display); color:var(--wp--preset--color--heading); font-size:clamp(2.4rem,5.5vw,4rem); line-height:1.16; font-weight:700; margin:1rem 0 0; }
.ka-hero__title .hl { color:var(--wp--preset--color--primary); }
.ka-hero__lead { color:var(--wp--preset--color--contrast-muted); font-size:clamp(1.05rem,1.6vw,1.25rem); max-width:46ch; margin:1.2rem 0 1.8rem; }
.ka-hero__cta { display:flex; gap:.8rem; flex-wrap:wrap; }
.ka-hero__trust { display:flex; gap:2rem; flex-wrap:wrap; margin-top:2.4rem; }
.ka-hero__trust div { display:flex; flex-direction:column; }
.ka-hero__trust b { font-family:var(--wp--preset--font-family--display); font-variant-numeric:tabular-nums; font-size:1.6rem; color:var(--wp--preset--color--heading); font-weight:700; }
.ka-hero__trust span { font-size:.85rem; color:var(--wp--preset--color--contrast-muted); }
.ka-hero__card { position:relative; border-radius:var(--wp--custom--radius--lg); overflow:hidden; box-shadow:var(--wp--custom--shadow--strong); background:var(--wp--preset--color--surface-2); aspect-ratio:4/5; }
.ka-hero__card img { width:100%; height:100%; object-fit:cover; display:block; }
.ka-hero__badge { position:absolute; top:16px; inset-inline-start:16px; background:rgba(255,255,255,.94); color:#3f5417; font-weight:600; font-size:.82rem; padding:7px 14px; border-radius:var(--wp--custom--radius--pill); display:flex; align-items:center; gap:6px; }
.ka-hero__badge svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2; }
.ka-macro-float { position:absolute; bottom:16px; inset-inline-start:16px; inset-inline-end:16px; background:rgba(255,255,255,.96); border-radius:var(--wp--custom--radius--md); padding:13px; display:grid; grid-template-columns:repeat(4,1fr); gap:6px; }
.ka-macro { display:flex; flex-direction:column; align-items:center; gap:1px; text-align:center; }
.ka-macro b { font-family:var(--wp--preset--font-family--display); font-size:1.1rem; font-weight:700; color:#2A2419; }
.ka-macro span { font-size:.68rem; color:#6A7158; }
.ka-macro i { width:9px; height:9px; border-radius:50%; display:block; margin-bottom:4px; }
@media (max-width:880px){ .ka-hero__grid{ grid-template-columns:1fr; text-align:center; } .ka-hero__lead{ margin-inline:auto; } .ka-hero__cta, .ka-hero__trust{ justify-content:center; } .ka-hero__media{ max-width:400px; margin-inline:auto; order:-1; } }

/* dark panel + stats */
.ka-panel { background:var(--wp--preset--color--panel); color:var(--wp--preset--color--panel-text); }
.ka-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; text-align:center; }
.ka-stats b { display:block; font-family:var(--wp--preset--font-family--display); font-variant-numeric:tabular-nums; font-size:clamp(1.7rem,3vw,2.3rem); color:var(--wp--preset--color--accent); font-weight:700; }
.ka-stats span { font-size:.9rem; color:var(--wp--preset--color--panel-muted); }
@media (max-width:680px){ .ka-stats{ grid-template-columns:repeat(2,1fr); gap:1.6rem; } }

/* section heading */
.ka-sec-head { max-width:640px; margin:0 auto 2.4rem; text-align:center; }
.ka-sec-head h2 { font-family:var(--wp--preset--font-family--display); color:var(--wp--preset--color--heading); font-size:clamp(1.8rem,4vw,2.6rem); font-weight:700; margin:.6rem 0 0; }
.ka-sec-head p { color:var(--wp--preset--color--contrast-muted); margin-top:.5rem; }

/* grids */
.ka-grid { display:grid; gap:1.1rem; }
.ka-grid--3 { grid-template-columns:repeat(3,1fr); }
.ka-grid--6 { grid-template-columns:repeat(6,1fr); }
@media (max-width:900px){ .ka-grid--3{ grid-template-columns:repeat(2,1fr); } .ka-grid--6{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:560px){ .ka-grid--3{ grid-template-columns:1fr; } .ka-grid--6{ grid-template-columns:repeat(2,1fr); } }

/* feature card */
.ka-feature { background:var(--wp--preset--color--surface); border:1px solid var(--wp--preset--color--border); border-radius:var(--wp--custom--radius--md); padding:1.7rem; transition:transform var(--wp--custom--transition--base) var(--wp--custom--transition--ease), box-shadow var(--wp--custom--transition--base) var(--wp--custom--transition--ease); }
.ka-feature:hover { transform:translateY(-4px); box-shadow:var(--wp--custom--shadow--strong); }
.ka-feature__ic { display:inline-flex; width:52px; height:52px; align-items:center; justify-content:center; border-radius:15px; background:var(--wp--preset--color--primary-soft); color:var(--wp--preset--color--primary); margin-bottom:1rem; }
.ka-feature h3 { font-family:var(--wp--preset--font-family--display); color:var(--wp--preset--color--heading); font-size:1.2rem; font-weight:700; margin:0; }
.ka-feature p { color:var(--wp--preset--color--contrast-muted); margin:.4rem 0 0; font-size:.97rem; }

/* category tiles */
.ka-cat { display:flex; flex-direction:column; align-items:center; gap:.5rem; background:var(--wp--preset--color--surface); border:1px solid var(--wp--preset--color--border); border-radius:var(--wp--custom--radius--md); padding:1.4rem 1rem; text-align:center; text-decoration:none; color:inherit; transition:transform var(--wp--custom--transition--base) var(--wp--custom--transition--ease); }
.ka-cat:hover { transform:translateY(-4px); border-color:var(--wp--preset--color--accent); }
.ka-cat__ic { width:54px; height:54px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:var(--wp--preset--color--primary-soft); color:var(--wp--preset--color--primary); }
.ka-cat b { font-family:var(--wp--preset--font-family--display); color:var(--wp--preset--color--heading); font-weight:700; }
.ka-cat span { font-size:.82rem; color:var(--wp--preset--color--contrast-muted); }

/* latest recipes — image cards (matches mockup) */
.ka-rec-head { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:1.7rem; }
.ka-rec-head h2 { font-family:var(--wp--preset--font-family--display); color:var(--wp--preset--color--heading); font-size:clamp(1.7rem,3.5vw,2.3rem); font-weight:700; margin:.45rem 0 0; }
.ka-rec-head a { color:var(--wp--preset--color--primary); font-weight:600; font-size:.95rem; text-decoration:none; display:inline-flex; align-items:center; gap:5px; white-space:nowrap; }
.ka-rec-head a svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; }
.ka-rec-head a:hover { color:var(--wp--preset--color--primary-strong); }
.ka-rec-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; }
@media (max-width:900px){ .ka-rec-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .ka-rec-grid{ grid-template-columns:1fr; } }
.ka-rcard { min-width:0; background:var(--wp--preset--color--surface); border:1px solid var(--wp--preset--color--border); border-radius:var(--wp--custom--radius--lg); overflow:hidden; box-shadow:var(--wp--custom--shadow--soft); transition:transform .25s ease, box-shadow .25s ease; }
.ka-rcard:hover { transform:translateY(-6px); box-shadow:var(--wp--custom--shadow--strong); }
.ka-rcard__thumb { position:relative; aspect-ratio:16/11; background:var(--wp--preset--color--surface-2); overflow:hidden; }
.ka-rcard__thumb img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.ka-rcard:hover .ka-rcard__thumb img { transform:scale(1.06); }
.ka-rcard__cat { position:absolute; top:12px; inset-inline-start:12px; background:rgba(255,255,255,.93); color:#3f5417; font-weight:600; font-size:.78rem; padding:5px 12px; border-radius:var(--wp--custom--radius--pill); }
.ka-rcard__flag { position:absolute; top:12px; inset-inline-end:12px; font-size:.74rem; font-weight:700; padding:5px 11px; border-radius:var(--wp--custom--radius--pill); }
.ka-flag-new { background:#C2185B; color:#fff; }
.ka-flag-top { background:#FFF088; color:#5A4A00; }
.ka-rcard__body { padding:1.1rem 1.25rem 1.3rem; }
.ka-rcard__body h3 { font-family:var(--wp--preset--font-family--display); color:var(--wp--preset--color--heading); font-size:1.3rem; font-weight:700; margin:0; line-height:1.3; }
.ka-chips { display:flex; gap:6px; flex-wrap:wrap; margin:.9rem 0; }
.ka-chip { display:inline-flex; align-items:center; gap:5px; background:var(--wp--preset--color--primary-soft); color:var(--ka-chip); font-weight:600; font-size:.76rem; padding:5px 10px; border-radius:var(--wp--custom--radius--pill); }
.ka-chip i { width:8px; height:8px; border-radius:50%; display:inline-block; }
.ka-chip .num { font-variant-numeric:tabular-nums; }
.ka-rcard__meta { display:flex; gap:1.1rem; color:var(--wp--preset--color--contrast-muted); font-size:.85rem; border-top:1px solid var(--wp--preset--color--border); padding-top:.85rem; }
.ka-rcard__meta span { display:inline-flex; align-items:center; gap:5px; }
.ka-rcard__meta .num { font-variant-numeric:tabular-nums; }
.ka-rcard__meta svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2; }

/* newsletter band */
.ka-news { background:linear-gradient(160deg, var(--wp--preset--color--primary-strong), var(--wp--preset--color--primary) 60%, var(--ka-accent2)); border-radius:var(--wp--custom--radius--lg); padding:clamp(2.2rem,5vw,3.4rem); text-align:center; }
.ka-news h2 { color:#fff; font-family:var(--wp--preset--font-family--display); font-size:clamp(1.7rem,3.5vw,2.3rem); font-weight:700; margin:0; }
.ka-news p { color:rgba(255,255,255,.93); margin:.6rem auto 1.5rem; max-width:48ch; }
.ka-news form { display:flex; gap:.6rem; max-width:460px; margin-inline:auto; flex-wrap:wrap; justify-content:center; }
.ka-news input { flex:1; min-width:220px; padding:.85rem 1.2rem; border-radius:var(--wp--custom--radius--pill); border:0; font-family:inherit; font-size:1rem; }
.ka-news .ka-btn { background:#fff; color:var(--wp--preset--color--primary-strong); }

/* footer (matches mockup) */
.ka-footer { background:var(--wp--preset--color--panel); color:var(--wp--preset--color--panel-muted); padding:3.5rem 0 2rem; }
.ka-footer__wrap { max-width:1200px; margin:0 auto; padding:0 clamp(1.1rem,4vw,2.4rem); }
.ka-foot-grid { display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:2rem; }
@media (max-width:760px){ .ka-foot-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:460px){ .ka-foot-grid { grid-template-columns:1fr; } }
.ka-foot-logo { display:inline-block; background:#fff; border-radius:14px; padding:8px 12px; }
.ka-foot-logo img { height:40px; width:auto; display:block; }
.ka-foot-brand p { color:var(--wp--preset--color--panel-muted); font-size:.92rem; margin-top:.9rem; max-width:34ch; opacity:.9; }
.ka-foot-social { display:flex; gap:10px; margin-top:1.1rem; }
.ka-foot-social a { width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.08); display:grid; place-items:center; color:var(--wp--preset--color--panel-muted); }
.ka-foot-social a:hover { background:var(--wp--preset--color--primary); color:#fff; }
.ka-foot-social svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; }
.ka-foot-col h4 { color:var(--wp--preset--color--panel-text); font-family:var(--wp--preset--font-family--display); font-size:1.05rem; margin-bottom:.9rem; }
.ka-foot-col a { display:block; color:var(--wp--preset--color--panel-muted); padding:4px 0; font-size:.92rem; }
.ka-foot-col a:hover { color:var(--wp--preset--color--accent); }
.ka-foot-copy { border-top:1px solid rgba(255,255,255,.1); margin-top:2.4rem; padding-top:1.4rem; text-align:center; font-size:.85rem; opacity:.8; }
.ka-foot-copy .ka-num { font-variant-numeric:tabular-nums; }

/* recipe single (recipe-card block — matches mockup) */
.ka-recipe { color:var(--wp--preset--color--contrast); }
.ka-recipe__crumb { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; color:var(--wp--preset--color--contrast-muted); font-size:.85rem; margin-bottom:1.3rem; }
.ka-recipe__crumb a:hover { color:var(--wp--preset--color--primary); }
.ka-recipe__hero { display:grid; grid-template-columns:1fr .9fr; gap:clamp(1.5rem,4vw,2.6rem); align-items:start; }
.ka-recipe__title { font-family:var(--wp--preset--font-family--display); color:var(--wp--preset--color--heading); font-size:clamp(2rem,4.5vw,3rem); line-height:1.2; font-weight:700; margin:.7rem 0 0; }
.ka-recipe__lead { color:var(--wp--preset--color--contrast-muted); margin:1rem 0 0; line-height:1.9; }
.ka-recipe__metarow { display:flex; flex-wrap:wrap; gap:1.3rem; margin-top:1.3rem; }
.ka-recipe__mi { display:flex; align-items:center; gap:.6rem; }
.ka-recipe__mi-ic { width:42px; height:42px; flex:none; border-radius:12px; background:var(--wp--preset--color--primary-soft); color:var(--wp--preset--color--primary); display:grid; place-items:center; }
.ka-recipe__mi-ic svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.ka-recipe__mi b { display:block; color:var(--wp--preset--color--heading); font-size:1.05rem; font-family:var(--wp--preset--font-family--display); line-height:1.2; }
.ka-recipe__mi small { color:var(--wp--preset--color--contrast-muted); font-size:.78rem; }
.ka-recipe__actions { display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.4rem; }
.ka-recipe__img { width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--wp--custom--radius--lg); box-shadow:var(--wp--custom--shadow--strong); display:block; }
.ka-recipe__body { display:grid; grid-template-columns:1fr .42fr; gap:clamp(1.5rem,4vw,2.6rem); align-items:start; margin-top:clamp(2rem,5vw,3rem); }
.ka-recipe__content { min-width:0; }
.ka-recipe__content > ul { list-style:none; margin:0 0 1.6rem; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:.6rem; }
.ka-recipe__content > ul > li { position:relative; background:var(--wp--preset--color--surface); border:1px solid var(--wp--preset--color--border); border-radius:var(--wp--custom--radius--md); padding:.7rem 1rem; padding-inline-start:2.5rem; font-family:var(--wp--preset--font-family--sans); list-style:none; }
.ka-recipe__content > ul > li::before { content:""; position:absolute; inset-inline-start:.85rem; top:50%; transform:translateY(-50%); width:18px; height:18px; border-radius:5px; border:2px solid var(--wp--preset--color--primary); }
.ka-recipe__content > ol { list-style:none; counter-reset:kastep; margin:0 0 1.6rem; padding:0; display:grid; gap:1.05rem; }
.ka-recipe__content > ol > li { position:relative; padding-inline-start:3.2rem; line-height:1.95; min-height:2.4rem; list-style:none; }
.ka-recipe__content > ol > li::before { counter-increment:kastep; content:counter(kastep); position:absolute; inset-inline-start:0; top:0; width:2.3rem; height:2.3rem; border-radius:50%; background:var(--wp--preset--color--primary); color:#fff; display:grid; place-items:center; font-family:var(--wp--preset--font-family--display); font-weight:700; }
.ka-recipe__content h2, .ka-recipe__content h3 { font-family:var(--wp--preset--font-family--display); color:var(--wp--preset--color--heading); margin:1.7rem 0 .8rem; }
.ka-recipe__aside { min-width:0; }
.ka-nutri-panel { background:var(--wp--preset--color--surface); border:1px solid var(--wp--preset--color--border); border-radius:var(--wp--custom--radius--lg); padding:1.5rem; box-shadow:var(--wp--custom--shadow--soft); position:sticky; top:96px; }
.ka-nutri-panel__title { font-family:var(--wp--preset--font-family--display); color:var(--wp--preset--color--heading); font-size:1.2rem; margin:0; }
.ka-nutri-panel__per { color:var(--wp--preset--color--contrast-muted); font-size:.82rem; margin:.2rem 0 1.1rem; }
.ka-nutri-panel__ring-row { display:flex; gap:1.1rem; align-items:center; margin-bottom:1.1rem; }
.ka-nutri-ring { width:104px; height:104px; border-radius:50%; flex:none; display:grid; place-items:center; }
.ka-nutri-ring__in { width:74px; height:74px; border-radius:50%; background:var(--wp--preset--color--surface); display:grid; place-items:center; text-align:center; line-height:1.1; }
.ka-nutri-ring__in b { font-family:var(--wp--preset--font-family--display); font-size:1.3rem; color:var(--wp--preset--color--heading); }
.ka-nutri-ring__in span { font-size:.6rem; color:var(--wp--preset--color--contrast-muted); }
.ka-nutri-legend { flex:1; display:flex; flex-direction:column; gap:.5rem; font-size:.9rem; }
.ka-nutri-legend div { display:flex; align-items:center; justify-content:space-between; }
.ka-nutri-legend i { width:10px; height:10px; border-radius:3px; display:inline-block; margin-inline-end:7px; }
.ka-nutri-legend b { color:var(--wp--preset--color--heading); }
.ka-nutri-table div { display:flex; justify-content:space-between; padding:.55rem 0; border-top:1px solid var(--wp--preset--color--border); font-size:.92rem; color:var(--wp--preset--color--contrast-muted); }
.ka-nutri-table b { color:var(--wp--preset--color--heading); }
@media (max-width:880px){
	.ka-recipe__hero { grid-template-columns:1fr; }
	.ka-recipe__media { order:-1; }
	.ka-recipe__body { grid-template-columns:1fr; }
	.ka-recipe__aside { order:-1; }
	.ka-nutri-panel { position:static; }
}
@media (max-width:560px){
	.ka-recipe__content > ul { grid-template-columns:1fr; }
}

/* inline line-icons inside ka components */
.ka-feature__ic svg, .ka-cat__ic svg { width:26px; height:26px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

/* header polish + CTA fix (no wrapping blob) */
.ka-header .wp-block-button__link { padding:.55rem 1.1rem; font-size:.95rem; white-space:nowrap; }
.ka-header .wp-block-navigation { font-weight:500; }

/* ============================================================
   MOBILE HEADER + MENUS  (phone-first — ~90% of traffic)
   ============================================================ */
/* Brand the stock WP nav overlay (was unstyled white) + big tap targets */
/* Style the hamburger/close colour only — do NOT touch display (WP shows it
   <=600px and hides it above; overriding display broke the desktop header). */
.ka-header .wp-block-navigation__responsive-container-open,
.ka-header .wp-block-navigation__responsive-container-close {
	color: var(--wp--preset--color--contrast);
}
.ka-header .wp-block-navigation__responsive-container.is-menu-open {
	background-color: var(--wp--preset--color--surface);
	padding: clamp(1.25rem, 6vw, 2.5rem);
}
.ka-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	margin-top: 2.5rem;
}
.ka-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	border-bottom: 1px solid var(--wp--preset--color--border);
}
.ka-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	display: block;
	color: var(--wp--preset--color--heading);
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.35rem;
	font-weight: 700;
	padding: .9rem .25rem;
	text-align: start;
}
.ka-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--primary);
}

@media (max-width: 600px) {
	/* declutter the bar — newsletter CTA stays reachable via the menu + footer */
	.ka-header .wp-block-buttons { display: none; }
	.ka-logo img { height: 40px; }

	/* mode/font control → compact round icon trigger */
	.ka-mode-switch .ka-mode-toggle {
		width: 46px; height: 46px; padding: 0; gap: 0;
		justify-content: center; border-radius: 50%;
		font-size: 1.6rem;            /* enlarge the ◐ glyph */
		line-height: 1;
	}
	.ka-mode-switch .ka-mode-toggle [data-mode-label],
	.ka-mode-switch .ka-mode-toggle__caret { display: none; }
	/* ensure the hamburger is a comfortable tap target where WP shows it */
	.ka-header .wp-block-navigation__responsive-container-open { min-width: 46px; min-height: 46px; }

	/* keep the compact dropdown that was working; only guarantee it never spills
	   off-screen, and keep the buttons easy to tap */
	.ka-mode-switch .ka-mode-menu {
		max-width: calc(100vw - 20px);
		max-height: calc(100vh - 80px);
		overflow-y: auto;
	}
	.ka-mode-switch .ka-mode-menu .ka-mode-btn { min-height: 46px; }
	.ka-mode-switch .ka-mode-menu .ka-font-btn { min-height: 46px; }
}

/* latest-posts cards reuse .ka-card; tidy excerpt/title */
.ka-card .wp-block-post-title { font-family:var(--wp--preset--font-family--display); color:var(--wp--preset--color--heading); font-size:1.2rem; }

/* grid overflow safety (RTL): grid items must allow shrinking */
.ka-card, .ka-feature, .ka-cat { min-width: 0; }
.ka-grid { min-width: 0; }
.ka-card .wp-block-post-title, .ka-card .wp-block-post-excerpt { overflow-wrap: anywhere; }

/* homepage "latest" teaser: show first 6 only, hide pager (query perPage quirk) */
.ka-section .wp-block-post-template > li:nth-child(n+7),
.ka-section .wp-block-post-template > div:nth-child(n+7) { display: none; }
.ka-section .wp-block-query-pagination { display: none; }

/* latest posts (core/latest-posts) styled as cards */
.ka-latest { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.3rem; }
@media (max-width: 900px) { .ka-latest { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .ka-latest { grid-template-columns: 1fr; } }
.ka-latest > li { min-width: 0; margin: 0; background: var(--wp--preset--color--surface); border: 1px solid var(--wp--preset--color--border); border-radius: var(--wp--custom--radius--lg); padding: 1.3rem 1.4rem; transition: transform var(--wp--custom--transition--base) var(--wp--custom--transition--ease), box-shadow var(--wp--custom--transition--base) var(--wp--custom--transition--ease); }
.ka-latest > li:hover { transform: translateY(-6px); box-shadow: var(--wp--custom--shadow--strong); }
.ka-latest .wp-block-latest-posts__post-title { display: block; font-family: var(--wp--preset--font-family--display); color: var(--wp--preset--color--heading); font-size: 1.2rem; font-weight: 700; text-decoration: none; line-height: 1.45; }
.ka-latest .wp-block-latest-posts__post-title:hover { color: var(--wp--preset--color--primary); }
.ka-latest .wp-block-latest-posts__post-excerpt { color: var(--wp--preset--color--contrast-muted); font-size: 0.95rem; margin: 0.6rem 0 0; }
.ka-latest .wp-block-latest-posts__post-date { display: block; color: var(--wp--preset--color--contrast-muted); font-size: 0.82rem; margin-top: 0.8rem; }
