/* =====================================================================
   Siyakhaya Motion — design tokens, motion states and helper classes
   ===================================================================== */
:root {
	--sk-ink: #09090b;          /* zinc-950 */
	--sk-ink-2: #18181b;        /* zinc-900 */
	--sk-paper: #fafafa;        /* zinc-50 */
	--sk-amber: #f59e0b;        /* amber-500 */
	--sk-amber-300: #fcd34d;
	--sk-amber-400: #fbbf24;
	--sk-amber-600: #d97706;
	--sk-amber-700: #b45309;
	--sk-zinc-200: #e4e4e7;
	--sk-zinc-300: #d4d4d8;
	--sk-zinc-400: #a1a1aa;
	--sk-zinc-500: #71717a;
	--sk-zinc-600: #52525b;
	--sk-zinc-700: #3f3f46;
	--sk-zinc-800: #27272a;
	--sk-display: "Anton", "Impact", "Arial Narrow", sans-serif;
	--sk-body: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
	--sk-ease: cubic-bezier(.22, 1, .36, 1);
	--sk-spring: cubic-bezier(.34, 1.56, .64, 1);
}

/* ---------------------------------------------------------------------
   1. Entrance motion (Advanced ▸ Siyakhaya Motion)
   Hidden only when JS is running and we are NOT inside the Elementor editor.
   --------------------------------------------------------------------- */
html.sk-motion body:not(.elementor-editor-active) [class*="sk-anim-"]:not(.sk-stagger-yes),
html.sk-motion body:not(.elementor-editor-active) .sk-stagger-yes > .e-con-inner > .elementor-element,
html.sk-motion body:not(.elementor-editor-active) .sk-stagger-yes.e-con > .elementor-element,
html.sk-motion body:not(.elementor-editor-active) .sk-stagger-yes > .elementor-widget-container > *,
html.sk-motion body:not(.elementor-editor-active) .sk-stagger-yes > .elementor-container > .elementor-column {
	opacity: 0;
}
html.sk-motion body:not(.elementor-editor-active) .sk-anim-reveal:not(.sk-stagger-yes),
html.sk-motion body:not(.elementor-editor-active) .sk-anim-load:not(.sk-stagger-yes) {
	transform: translate3d(0, var(--sk-distance, 28px), 0);
}
.sk-in {
	opacity: 1 !important;
	transform: none !important;
	transition:
		opacity var(--sk-d, .6s) var(--sk-ease) var(--sk-w, 0s),
		transform var(--sk-d, .6s) var(--sk-ease) var(--sk-w, 0s) !important;
}
.sk-done { opacity: 1 !important; transform: none !important; }
@media (prefers-reduced-motion: reduce) {
	html.sk-motion [class*="sk-anim-"],
	html.sk-motion .sk-stagger-yes * { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* ---------------------------------------------------------------------
   2. Hover effects
   --------------------------------------------------------------------- */
.sk-hover-lift,
.sk-hover-lift-sm {
	transition: transform .3s ease, border-color .3s ease, background-color .3s ease, box-shadow .3s ease !important;
}
.sk-hover-lift:hover { transform: translateY(-6px) !important; border-color: rgba(245, 158, 11, .4) !important; box-shadow: 0 20px 50px -20px rgba(245, 158, 11, .25); }
.sk-hover-lift.sk-card-dark:hover { background-color: rgba(255, 255, 255, .07) !important; }
.sk-hover-lift-sm { transition: transform .45s var(--sk-spring), border-color .3s ease !important; }
.sk-hover-lift-sm:hover { transform: translateY(-4px) !important; border-color: rgba(245, 158, 11, .5) !important; }
.sk-hover-lift-sm:hover .sk-arrow-chip { background: var(--sk-amber); border-color: var(--sk-amber); color: var(--sk-ink); }

.sk-hover-zoom { overflow: hidden; }
.sk-hover-zoom img,
.sk-hover-zoom .sk-zoom-layer { transition: transform .7s cubic-bezier(.4, 0, .2, 1); }
.sk-hover-zoom:hover img,
.sk-hover-zoom:hover .sk-zoom-layer { transform: scale(1.05); }

.sk-hover-glow .elementor-button,
a.sk-btn--amber { box-shadow: 0 0 20px rgba(245, 158, 11, .25); transition: all .3s ease; }
.sk-hover-glow .elementor-button:hover,
a.sk-btn--amber:hover { box-shadow: 0 0 30px rgba(245, 158, 11, .45); }

/* ---------------------------------------------------------------------
   3. Section backgrounds & layering
   --------------------------------------------------------------------- */
.sk-blueprint, .sk-blueprint-light, .sk-glow, .sk-hero-shade, .sk-feature-card { position: relative; isolation: isolate; }
.sk-blueprint::after,
.sk-blueprint-light::after {
	content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
	background-size: 44px 44px;
	background-image:
		linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px),
		linear-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px);
}
.sk-blueprint-light::after {
	background-image:
		linear-gradient(90deg, rgba(9, 9, 11, .04) 1px, transparent 1px),
		linear-gradient(rgba(9, 9, 11, .04) 1px, transparent 1px);
}
.sk-glow > .sk-glow-orb {
	position: absolute; z-index: 0; pointer-events: none;
	width: 520px; height: 520px; border-radius: 50%;
	right: -120px; top: -160px;
	background: rgba(245, 158, 11, .10); filter: blur(110px);
}
.sk-hero-shade::after {
	content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
	background:
		linear-gradient(to top, var(--sk-ink) 0%, transparent 45%, rgba(9, 9, 11, .6) 100%),
		linear-gradient(90deg, rgba(255, 255, 255, .02) 1px, transparent 1px) 0 0 / 44px 44px,
		linear-gradient(rgba(255, 255, 255, .02) 1px, transparent 1px) 0 0 / 44px 44px;
}
/* keep content above decorative layers */
.sk-blueprint > .e-con-inner, .sk-blueprint > .elementor-element,
.sk-blueprint-light > .e-con-inner, .sk-blueprint-light > .elementor-element,
.sk-glow > .e-con-inner, .sk-glow > .elementor-element,
.sk-hero-shade > .e-con-inner, .sk-hero-shade > .elementor-element,
.sk-feature-card > .e-con-inner, .sk-feature-card > .elementor-element { position: relative; z-index: 2; }

.e-con.sk-glow, .sk-glow { overflow: hidden !important; overflow: clip !important; }
.sk-glass { -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px); }

/* Photo cards: background moved to a zoomable layer by JS */
.sk-feature-card { overflow: hidden; }
.sk-feature-card > .sk-zoom-layer { position: absolute; inset: 0; z-index: 0; background-size: cover; background-position: center; }
.sk-feature-card > .sk-feature-shade {
	position: absolute; inset: 0; z-index: 1; pointer-events: none;
	background: linear-gradient(to top, rgba(9, 9, 11, .95) 0%, rgba(9, 9, 11, .4) 50%, transparent 100%);
}

/* Masonry gallery (CSS columns) */
.sk-masonry.e-con, .sk-masonry > .e-con-inner { display: block !important; column-count: 3; column-gap: 20px; }
.sk-masonry .sk-filter-item { break-inside: avoid; margin-bottom: 20px !important; width: 100% !important; display: block; }
@media (max-width: 1024px) { .sk-masonry.e-con, .sk-masonry > .e-con-inner { column-count: 2; } }
@media (max-width: 640px)  { .sk-masonry.e-con, .sk-masonry > .e-con-inner { column-count: 1; } }

/* ---------------------------------------------------------------------
   4. Typography helpers (used inside Heading / Text Editor HTML)
   --------------------------------------------------------------------- */
.sk-amber { color: var(--sk-amber); }
.sk-amber-600 { color: var(--sk-amber-600); }
.sk-outline {
	display: block; margin-top: .15em; font-size: .62em; line-height: 1.05;
	color: transparent; -webkit-text-stroke: 1.5px rgba(255, 255, 255, .22);
}
.sk-eyebrow .elementor-heading-title,
.sk-eyebrow p {
	display: inline-flex; align-items: center; gap: 10px;
}
.sk-eyebrow .elementor-heading-title::before { content: ""; width: 32px; height: 1px; background: var(--sk-amber); display: inline-block; }

.sk-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.sk-tag {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 4px 10px; border-radius: 999px;
	font: 700 10px/1.4 var(--sk-body); letter-spacing: .12em; text-transform: uppercase;
	border: 1px solid rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .05); color: var(--sk-zinc-300);
}
.sk-tags--light .sk-tag { border-color: var(--sk-zinc-200); background: #fff; color: var(--sk-zinc-600); }
.sk-tag.sk-tag--amber { border-color: rgba(245, 158, 11, .3); background: rgba(245, 158, 11, .1); color: var(--sk-amber-700); }
.sk-tag.sk-tag--green { border-color: rgba(16, 185, 129, .3); background: rgba(16, 185, 129, .1); color: #047857; }
.sk-tag.sk-tag--blue { border-color: rgba(59, 130, 246, .3); background: rgba(59, 130, 246, .1); color: #1d4ed8; }
.sk-pill {
	display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border-radius: 999px;
	font: 700 12px/1.3 var(--sk-body); letter-spacing: .08em; text-transform: uppercase;
	border: 1px solid var(--sk-zinc-300); background: #fff; color: var(--sk-zinc-800);
}
.sk-pill--dark { border-color: rgba(245, 158, 11, .25); background: rgba(245, 158, 11, .08); color: rgba(252, 211, 77, .9); }
.sk-pill--hero { padding: 6px 14px; font-size: 11px; letter-spacing: .22em; border-color: rgba(245, 158, 11, .3); background: rgba(245, 158, 11, .1); color: var(--sk-amber-400); }
.sk-pill--hero-muted { padding: 6px 14px; font-size: 11px; letter-spacing: .22em; border-color: rgba(255, 255, 255, .15); background: rgba(255, 255, 255, .05); color: var(--sk-zinc-300); }
.sk-pill svg, .sk-tag svg { flex: none; width: 14px; height: 14px; color: var(--sk-amber-600); }
.sk-pill--hero svg, .sk-pill--dark svg { color: inherit; }

.sk-ghost-num { position: absolute; top: 14px; right: 18px; font: 400 64px/1 var(--sk-display); color: rgba(255, 255, 255, .05); pointer-events: none; transition: color .3s; }
.sk-hover-lift:hover .sk-ghost-num { color: rgba(245, 158, 11, .12); }
.sk-avatar {
	display: inline-flex; align-items: center; justify-content: center; flex: none;
	width: 52px; height: 52px; border-radius: 12px; font: 400 16px/1 var(--sk-display); color: var(--sk-ink); letter-spacing: .04em;
}
.sk-avatar--lg { width: 64px; height: 64px; font-size: 20px; background: var(--sk-amber); }
.sk-arrow-chip {
	display: inline-flex; width: 40px; height: 40px; align-items: center; justify-content: center;
	border-radius: 999px; border: 1px solid var(--sk-zinc-200); color: var(--sk-zinc-400); transition: all .3s;
}
.sk-stars { color: var(--sk-amber); letter-spacing: 2px; font-size: 14px; }
.sk-chips { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.sk-chip {
	padding: 8px 16px; border-radius: 8px; border: 1px solid rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .04);
	font: 700 12px/1.3 var(--sk-body); letter-spacing: .1em; text-transform: uppercase; color: var(--sk-zinc-300);
}
.sk-list-clean { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.sk-list-clean li { display: flex; gap: 10px; align-items: flex-start; }
.sk-list-clean li::before { content: ""; flex: none; width: 6px; height: 6px; margin-top: .55em; border-radius: 2px; background: var(--sk-amber); }

/* ---------------------------------------------------------------------
   5. Buttons (used by shortcodes; Elementor buttons are styled in-widget)
   --------------------------------------------------------------------- */
.sk-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	height: 52px; padding: 0 32px; border: 1px solid transparent; border-radius: 0;
	font: 700 14px/1 var(--sk-body); letter-spacing: .05em; text-transform: uppercase; text-decoration: none; cursor: pointer;
}
.sk-btn .sk-i { width: 16px; height: 16px; }
.sk-btn--amber { background: var(--sk-amber); color: var(--sk-ink) !important; }
.sk-btn--amber:hover { background: var(--sk-amber-400); }
.sk-btn--sm { height: 36px; padding: 0 16px; font-size: 13px; }
.sk-btn--block { width: 100%; }
.sk-btn[disabled] { opacity: .6; pointer-events: none; }

/* ---------------------------------------------------------------------
   6. Header  [siyakhaya_header]
   --------------------------------------------------------------------- */
.sk-i { width: 18px; height: 18px; flex: none; }
.sk-header {
	position: fixed; inset: 0 0 auto 0; z-index: 999; font-family: var(--sk-body);
	transition: background-color .3s ease, border-color .3s ease, -webkit-backdrop-filter .3s ease, backdrop-filter .3s ease;
	border-bottom: 1px solid transparent;
}
body.admin-bar .sk-header { top: 32px; }
@media (max-width: 782px) { body.admin-bar .sk-header { top: 46px; } }
.sk-header.is-solid,
.sk-header.is-scrolled {
	background: rgba(9, 9, 11, .85); border-bottom-color: rgba(255, 255, 255, .1);
	-webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px);
}
.sk-header-spacer { height: 80px; background: var(--sk-ink); }
.sk-header__bar { max-width: 1280px; margin: 0 auto; height: 80px; padding: 0 32px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
@media (max-width: 640px) { .sk-header__bar { padding: 0 16px; } }

.sk-logo { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.sk-logo__mark {
	display: flex; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 8px;
	background: var(--sk-amber); color: var(--sk-ink); box-shadow: 0 0 24px rgba(245, 158, 11, .35);
}
.sk-logo__mark .sk-i { width: 22px; height: 22px; }
.sk-logo__text { display: flex; flex-direction: column; line-height: 1; }
.sk-logo__name { font: 400 18px/1 var(--sk-display); letter-spacing: .03em; text-transform: uppercase; color: #fff; }
.sk-logo__sub { margin-top: 4px; font: 700 9px/1 var(--sk-body); letter-spacing: .32em; text-transform: uppercase; color: var(--sk-amber-400); }

.sk-nav { display: none; align-items: center; gap: 24px; }
@media (min-width: 1024px) { .sk-nav { display: flex; } }
.sk-nav__link {
	position: relative; display: inline-flex; align-items: center; gap: 4px; padding: 8px 0; border: 0; background: none; cursor: pointer;
	font: 600 13px/1 var(--sk-body); letter-spacing: .12em; text-transform: uppercase; color: var(--sk-zinc-300); text-decoration: none;
	transition: color .2s;
}
.sk-nav__link .sk-i { width: 14px; height: 14px; transition: transform .2s; }
.sk-nav__link:hover { color: #fff; }
.sk-nav__link.is-active { color: var(--sk-amber-400); }
.sk-nav__link::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; background: var(--sk-amber);
	transform: scaleX(0); transform-origin: left; transition: transform .3s var(--sk-ease);
}
.sk-nav__link.is-active::after { transform: scaleX(1); }
.sk-nav__group { position: relative; }
.sk-nav__group:hover .sk-nav__link .sk-i { transform: rotate(180deg); }
.sk-nav__drop {
	position: absolute; left: 0; top: 100%; width: 240px; padding-top: 16px;
	opacity: 0; visibility: hidden; transform: translateY(8px); transition: all .2s ease;
}
.sk-nav__group:hover .sk-nav__drop,
.sk-nav__group:focus-within .sk-nav__drop { opacity: 1; visibility: visible; transform: translateY(0); }
.sk-nav__dropinner {
	overflow: hidden; padding: 8px 0; border-radius: 12px; border: 1px solid rgba(255, 255, 255, .1);
	background: rgba(9, 9, 11, .95); box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .6);
	-webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px);
}
.sk-nav__sublink {
	display: block; padding: 10px 20px; font: 700 12px/1.2 var(--sk-body); letter-spacing: .12em; text-transform: uppercase;
	color: var(--sk-zinc-400); text-decoration: none; transition: color .2s, background-color .2s;
}
.sk-nav__sublink:hover { background: rgba(255, 255, 255, .05); color: var(--sk-amber-400); }
.sk-nav__sublink.is-active { background: rgba(255, 255, 255, .05); color: var(--sk-amber-400); }

.sk-header__actions { display: flex; align-items: center; gap: 12px; }
.sk-header__cta { display: none; }
@media (min-width: 640px) { .sk-header__cta { display: inline-flex; } }
.sk-burger {
	display: inline-flex; width: 36px; height: 36px; align-items: center; justify-content: center; cursor: pointer;
	border-radius: 6px; border: 1px solid rgba(255, 255, 255, .2); background: rgba(255, 255, 255, .05); color: #fff;
}
@media (min-width: 1024px) { .sk-burger { display: none; } }

.sk-sheet { position: fixed; inset: 0; z-index: 1000; visibility: hidden; overflow: hidden; font-family: var(--sk-body); }
.sk-sheet.is-open { visibility: visible; }
.sk-sheet__scrim { position: absolute; inset: 0; background: rgba(0, 0, 0, .6); opacity: 0; transition: opacity .3s; }
.sk-sheet.is-open .sk-sheet__scrim { opacity: 1; }
.sk-sheet__panel {
	position: absolute; top: 0; right: 0; bottom: 0; width: 320px; max-width: 86vw; overflow-y: auto; padding: 24px;
	border-left: 1px solid rgba(255, 255, 255, .1); background: rgba(9, 9, 11, .95);
	-webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px);
	transform: translateX(100%); transition: transform .4s var(--sk-ease);
	display: flex; flex-direction: column; gap: 28px;
}
.sk-sheet.is-open .sk-sheet__panel { transform: none; }
.sk-sheet__close { align-self: flex-end; background: none; border: 0; color: var(--sk-zinc-400); cursor: pointer; }
.sk-sheet__nav { display: flex; flex-direction: column; gap: 2px; }
.sk-sheet__link, .sk-sheet__sublink {
	padding: 12px 12px; border-radius: 8px; text-decoration: none;
	font: 700 14px/1.2 var(--sk-body); letter-spacing: .1em; text-transform: uppercase; color: var(--sk-zinc-300);
}
.sk-sheet__sublink { padding-left: 24px; font-size: 12px; color: var(--sk-zinc-400); }
.sk-sheet__link:hover, .sk-sheet__sublink:hover, .sk-sheet__link.is-active, .sk-sheet__sublink.is-active { background: rgba(255, 255, 255, .05); color: var(--sk-amber-400); }
.sk-sheet__label { padding: 12px 12px 4px; font: 700 11px/1 var(--sk-body); letter-spacing: .24em; text-transform: uppercase; color: var(--sk-zinc-500); }
.sk-sheet .sk-header__cta { display: inline-flex; }

/* ---------------------------------------------------------------------
   7. Footer  [siyakhaya_footer]
   --------------------------------------------------------------------- */
.sk-footer { border-top: 1px solid rgba(255, 255, 255, .1); background: #070708; color: var(--sk-zinc-400); font-family: var(--sk-body); }
.sk-footer__grid { max-width: 1280px; margin: 0 auto; padding: 64px 32px; display: grid; gap: 48px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .sk-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .sk-footer__grid { grid-template-columns: 1.4fr 1fr 1fr 1.4fr; } }
.sk-footer__brand p { margin: 20px 0; max-width: 320px; font-size: 14px; line-height: 1.7; }
.sk-footer__social {
	display: inline-flex; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 8px;
	border: 1px solid rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .05); color: var(--sk-zinc-400); transition: all .3s;
}
.sk-footer__social:hover { border-color: rgba(245, 158, 11, .4); color: var(--sk-amber-400); }
.sk-footer__title { margin: 0 0 20px; font: 400 14px/1 var(--sk-display) !important; letter-spacing: .12em; text-transform: uppercase; color: #fff !important; }
.sk-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.sk-footer__col a { color: var(--sk-zinc-400); font-size: 14px; text-decoration: none; transition: color .2s; }
.sk-footer__col a:hover { color: var(--sk-amber-400); }
.sk-footer__contact li { display: flex; gap: 12px; font-size: 14px; }
.sk-footer__contact .sk-i { width: 16px; height: 16px; margin-top: 2px; color: var(--sk-amber); }
.sk-footer__contact div { display: flex; flex-direction: column; gap: 3px; }
.sk-footer__contact strong { color: var(--sk-zinc-200); font-weight: 600; }
.sk-footer__bottom { border-top: 1px solid rgba(255, 255, 255, .1); }
.sk-footer__bottominner { max-width: 1280px; margin: 0 auto; padding: 24px 32px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; }
.sk-footer__bottominner p { margin: 0; font-size: 12px; color: var(--sk-zinc-500); }
.sk-footer__tag { font-weight: 700; letter-spacing: .24em; text-transform: uppercase; color: rgba(245, 158, 11, .8) !important; }
.sk-footer__top {
	display: inline-flex; width: 36px; height: 36px; align-items: center; justify-content: center; border-radius: 8px;
	border: 1px solid rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .05); color: var(--sk-zinc-400); transition: all .3s;
}
.sk-footer__top:hover { border-color: rgba(245, 158, 11, .4); color: var(--sk-amber-400); }

/* ---------------------------------------------------------------------
   8. Filter / tabs  [sk_filter]
   --------------------------------------------------------------------- */
.sk-filter { display: inline-flex; flex-wrap: wrap; gap: 6px; padding: 6px; border-radius: 12px; font-family: var(--sk-body); }
.sk-filter__btn {
	padding: 10px 20px; border-radius: 8px; border: 1px solid transparent; cursor: pointer;
	font: 700 12px/1 var(--sk-body); letter-spacing: .08em; text-transform: uppercase; transition: all .25s ease;
}
.sk-filter--light { border: 1px solid var(--sk-zinc-200); background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .05); }
.sk-filter--light .sk-filter__btn { background: transparent; color: var(--sk-zinc-600); }
.sk-filter--light .sk-filter__btn:hover { color: var(--sk-ink); }
.sk-filter--light .sk-filter__btn.is-active { background: var(--sk-ink); color: var(--sk-amber-400); }
.sk-filter--pills { gap: 8px; padding: 0; justify-content: center; }
.sk-filter--pills .sk-filter__btn { border-radius: 999px; border-color: var(--sk-zinc-200); background: #fff; color: var(--sk-zinc-600); }
.sk-filter--pills .sk-filter__btn.is-active { background: var(--sk-ink); border-color: var(--sk-ink); color: var(--sk-amber-400); }
.sk-filter--tabs,
.sk-filter--dark { border: 1px solid rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .04); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.sk-filter--tabs .sk-filter__btn,
.sk-filter--dark .sk-filter__btn { background: transparent; color: var(--sk-zinc-400); padding: 10px 20px; }
.sk-filter--tabs .sk-filter__btn:hover,
.sk-filter--dark .sk-filter__btn:hover { color: #fff; }
.sk-filter--tabs .sk-filter__btn.is-active,
.sk-filter--dark .sk-filter__btn.is-active { background: var(--sk-amber); color: var(--sk-ink); }
.sk-filter-item.sk-is-hidden { display: none !important; }
.sk-filter-item.sk-is-leaving { opacity: 0 !important; transform: scale(.96) !important; transition: opacity .25s ease, transform .25s ease !important; }
.sk-filter-item.sk-is-entering { opacity: 0 !important; transform: translateY(16px) !important; transition: none !important; }
.sk-filter-item.sk-is-entered { opacity: 1 !important; transform: none !important; transition: opacity .35s ease var(--sk-fd, 0s), transform .35s ease var(--sk-fd, 0s) !important; }

/* ---------------------------------------------------------------------
   9. Quote form  [siyakhaya_quote_form]
   --------------------------------------------------------------------- */
.sk-form {
	padding: 36px; border-radius: 16px; border: 1px solid var(--sk-zinc-200); background: #fff;
	box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .5); font-family: var(--sk-body); color: var(--sk-ink);
}
@media (max-width: 640px) { .sk-form { padding: 28px; } }
.sk-form__title { margin: 0; font: 400 24px/1.1 var(--sk-display) !important; letter-spacing: .03em; text-transform: uppercase; color: var(--sk-ink) !important; }
.sk-form__lead { margin: 6px 0 0; font-size: 14px; color: var(--sk-zinc-500); }
.sk-form__grid { margin: 28px 0 24px; display: grid; gap: 20px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .sk-form__grid { grid-template-columns: 1fr 1fr; } }
.sk-field { display: flex; flex-direction: column; gap: 8px; margin: 0; }
.sk-field span { font-size: 13px; font-weight: 600; color: var(--sk-zinc-800); }
.sk-field--wide { grid-column: 1 / -1; }
.sk-field input, .sk-field select, .sk-field textarea {
	width: 100%; min-height: 44px; padding: 10px 12px; border-radius: 6px; border: 1px solid var(--sk-zinc-200); background: transparent;
	font: 400 14px/1.5 var(--sk-body); color: var(--sk-ink); box-shadow: 0 1px 2px rgba(0, 0, 0, .04); transition: border-color .2s, box-shadow .2s;
}
.sk-field input:focus, .sk-field select:focus, .sk-field textarea:focus { outline: none; border-color: var(--sk-amber); box-shadow: 0 0 0 3px rgba(245, 158, 11, .2); }
.sk-field.is-invalid input, .sk-field.is-invalid textarea { border-color: #dc2626; }
.sk-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.sk-form__status { margin: 14px 0 0; font-size: 14px; min-height: 1.4em; }
.sk-form__status.is-ok { color: #047857; }
.sk-form__status.is-err { color: #dc2626; }

/* ---------------------------------------------------------------------
   10. Tidy text-editor spacing inside Siyakhaya layouts
   --------------------------------------------------------------------- */
.e-con .elementor-widget-text-editor p:last-child,
.e-con .elementor-widget-text-editor ul:last-child { margin-bottom: 0; }
.e-con .elementor-widget-text-editor p:first-child { margin-top: 0; }
.sk-glass .elementor-counter { flex-direction: column; align-items: center; text-align: center; }
.sk-glass .elementor-counter-title { text-align: center; }