/* Styles of the site's first design. Every page now uses Design A
   (global.css, sections.css, programs.css, pages.css); what is left here
   serves content written with the first design's blocks: the "older
   sections" patterns (sections-legacy.php), text migrated from the old site
   (card grids, tables, galleries, video, file links, FAQ details) and
   core blocks editors may still add. Delete a rule once nothing uses it.
   Logical properties only (inline/block), so Arabic mirrors automatically. */

:root {
	--ka-radius-sm: var(--wp--custom--radius--sm);
	--ka-radius: var(--wp--custom--radius--md);
	--ka-radius-lg: var(--wp--custom--radius--lg);
	--ka-shadow: var(--wp--preset--shadow--card);
	/* Gold is too light for text or focus rings on white: use the darker
	   shade on light backgrounds and the brand gold on navy ones. */
	--ka-gold-text: #8a6100;
	--ka-focus: var(--wp--preset--color--secondary);
}
:where(.has-primary-background-color, .ka-hero, .ka-page-header, .site-footer) {
	--ka-gold-text: var(--wp--preset--color--accent);
	--ka-focus: var(--wp--preset--color--accent);
}

/* Page header (title band) ---------------------------------------------------- */
.ka-page-header {
	background: var(--wp--preset--gradient--navy-glow);
	color: #fff;
	overflow: hidden;
	position: relative;
}
.ka-page-header::after {
	background: radial-gradient(circle, rgb(240 181 0 / 35%), transparent 60%);
	block-size: 28rem;
	content: "";
	inline-size: 28rem;
	inset-block-start: -14rem;
	inset-inline-end: -8rem;
	pointer-events: none;
	position: absolute;
}
.ka-page-header :where(h1, h2, p) { color: inherit; position: relative; z-index: 1; }
.ka-page-header h1 { font-size: var(--wp--preset--font-size--xx-large); text-wrap: balance; }
.ka-page-header p { font-size: var(--wp--preset--font-size--large); opacity: 0.9; text-wrap: pretty; }
.ka-page-header .ka-chips,
.ka-page-header .ka-badge { position: relative; z-index: 1; }
.ka-kicker {
	color: var(--ka-gold-text);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}
:lang(ar) .ka-kicker { font-size: 1rem; letter-spacing: 0; }

/* Hero ------------------------------------------------------------------------ */
.ka-hero {
	background: var(--wp--preset--gradient--navy-glow);
	color: #fff;
	overflow: hidden;
	position: relative;
}
.ka-hero::before {
	background:
		radial-gradient(circle at 15% 110%, rgb(27 197 201 / 28%), transparent 40%),
		radial-gradient(circle at 95% -10%, rgb(240 181 0 / 30%), transparent 35%);
	content: "";
	inset: 0;
	pointer-events: none;
	position: absolute;
}
.ka-hero > * { position: relative; }
.ka-hero :where(h1, h2, p) { color: inherit; }
.ka-hero h1 { font-size: var(--wp--preset--font-size--huge); max-width: 16ch; }
.ka-hero p { font-size: var(--wp--preset--font-size--large); max-width: 34rem; opacity: 0.92; }
.ka-hero .wp-block-image img { aspect-ratio: 4 / 3.4; border-radius: var(--ka-radius-lg); box-shadow: 0 30px 60px rgb(0 0 0 / 35%); object-fit: cover; }
.ka-hero__media { position: relative; }
.ka-hero__media::after {
	background: var(--wp--preset--color--accent);
	block-size: 40%;
	border-radius: var(--ka-radius-lg);
	content: "";
	inline-size: 40%;
	inset-block-end: -1rem;
	inset-inline-start: -1rem;
	position: absolute;
	z-index: -1;
}

:where(.ka-hero, .ka-page-header, .has-primary-background-color) .wp-block-button.is-style-outline > .wp-block-button__link { color: #fff; }
:where(.ka-hero, .ka-page-header, .has-primary-background-color) .wp-block-button.is-style-outline > .wp-block-button__link:hover { background: rgb(255 255 255 / 12%); color: #fff; }

/* Dark sections: headings and links follow the text colour. */
.has-primary-background-color :where(h1, h2, h3, h4, h5, h6),
.has-secondary-background-color :where(h1, h2, h3, h4, h5, h6),
.has-teal-background-color :where(h1, h2, h3, h4, h5, h6) { color: inherit; }
.has-primary-background-color a:not(.wp-block-button__link),
.has-secondary-background-color a:not(.wp-block-button__link) { color: inherit; }

/* Stats ----------------------------------------------------------------------- */
.ka-stats { gap: 1rem !important; }
.ka-stat {
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--ka-radius);
	padding: 1.5rem;
	position: relative;
}
.ka-stat::before {
	background: var(--wp--preset--color--accent);
	block-size: 4px;
	border-radius: 0 0 4px 4px;
	content: "";
	inline-size: 2.5rem;
	inset-block-start: 0;
	inset-inline-start: 1.5rem;
	position: absolute;
}
.ka-stat__value { color: var(--wp--preset--color--primary); font-family: var(--wp--preset--font-family--heading); font-size: clamp(1.75rem, 2.6vw, 2.5rem); font-weight: 700; line-height: 1; margin: 0 0 0.5rem; white-space: nowrap; }
.ka-stat p:last-child { margin: 0; }
.has-primary-background-color .ka-stat { background: rgb(255 255 255 / 6%); border-color: rgb(255 255 255 / 16%); }
.has-primary-background-color .ka-stat__value { color: var(--wp--preset--color--accent); }

/* Announcement ---------------------------------------------------------------- */
.ka-announcement {
	background: var(--wp--preset--color--accent);
	border-radius: var(--ka-radius-lg);
	color: var(--wp--preset--color--primary);
	overflow: hidden;
	position: relative;
}
.ka-announcement :where(h2, h3, p) { color: inherit; margin: 0; }
.ka-announcement::after {
	border: 28px solid rgb(255 255 255 / 25%);
	border-radius: 50%;
	block-size: 14rem;
	content: "";
	inline-size: 14rem;
	inset-block-start: -6rem;
	inset-inline-end: -4rem;
	position: absolute;
}

/* Cards ----------------------------------------------------------------------- */
.wp-block-group.is-style-card {
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--ka-radius-lg);
	box-shadow: var(--ka-shadow);
	padding: clamp(1.25rem, 3vw, 2rem);
}
.ka-feature { height: 100%; }
.ka-feature h3 { font-size: var(--wp--preset--font-size--large); }

/* Program cards (Query Loop) ---------------------------------------------------- */
.ka-program-grid .wp-block-post { display: flex; }
.ka-program-card {
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--ka-radius-lg);
	display: flex;
	flex-direction: column;
	overflow: hidden;
	position: relative;
	transition: box-shadow 0.2s, translate 0.2s;
	width: 100%;
}
.ka-program-card:hover,
.ka-program-card:focus-within { box-shadow: 0 18px 40px rgb(0 38 76 / 14%); translate: 0 -3px; }
.ka-program-card .wp-block-post-featured-image { margin: 0; }
.ka-program-card .wp-block-post-featured-image img { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; }
.ka-program-card__body { display: flex; flex: 1; flex-direction: column; gap: 0.6rem; padding: 1.25rem 1.4rem 1.5rem; }
.ka-program-card .wp-block-post-title { font-size: var(--wp--preset--font-size--large); margin: 0; }
.ka-program-card .wp-block-post-title a { color: var(--wp--preset--color--primary); text-decoration: none; }
.ka-program-card .wp-block-post-title a::after { content: ""; inset: 0; position: absolute; }
.ka-program-card .wp-block-post-excerpt { color: var(--wp--preset--color--muted); font-size: 0.9875rem; margin: 0; }
.ka-program-card .wp-block-post-excerpt__excerpt { margin: 0; }
.ka-program-card .ka-badge { align-self: flex-start; position: relative; z-index: 1; }
.ka-program-card .wp-block-post-terms { font-size: var(--wp--preset--font-size--small); font-weight: 600; }
.ka-program-card .wp-block-post-terms a { color: var(--wp--preset--color--secondary); position: relative; text-decoration: none; z-index: 1; }

/* Testimonials slider (scroll-snap, no library) ---------------------------------- */
.ka-slider { position: relative; }
.ka-slider .wp-block-post-template {
	display: grid;
	gap: 1.25rem;
	grid-auto-columns: min(86%, 26rem);
	grid-auto-flow: column;
	list-style: none;
	margin: 0;
	overflow-x: auto;
	overflow-y: hidden; /* The row only scrolls sideways. */
	overscroll-behavior-x: contain;
	padding: 0.5rem 0.25rem 1.25rem;
	scroll-snap-type: x mandatory;
	scrollbar-width: thin;
}
.ka-slider .wp-block-post { scroll-snap-align: start; }
/* WordPress adds a top margin between stacked blocks; in a row it would make
   every card after the first shorter. */
.ka-slider .wp-block-post-template > * { margin-block: 0; }
.ka-quote {
	background: var(--wp--preset--color--base);
	box-sizing: border-box; /* Padding stays inside the card, so it never outgrows its row. */
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--ka-radius-lg);
	display: flex;
	flex-direction: column;
	height: 100%;
	justify-content: flex-start;
	padding: 1.75rem;
}
.ka-quote::before {
	color: var(--wp--preset--color--accent);
	content: "“";
	font: 700 4rem/0.6 Georgia, serif;
	margin-block-end: 0.5rem;
}
:lang(ar) .ka-quote::before { content: "”"; }
.ka-quote .wp-block-post-content { font-size: 1rem; line-height: 1.65; }
.ka-quote .wp-block-post-content p { margin-block: 0 0.75rem; }
.ka-quote__person { align-items: center; border-block-start: 1px solid var(--wp--preset--color--border); gap: 0.85rem; margin-block-start: auto !important; padding-block-start: 1rem; }
.ka-quote .wp-block-post-content { margin-block-end: 1rem; }
.ka-quote__person .wp-block-post-featured-image { flex: none; margin: 0; }
/* Student photo (sizes override the 56px saved on older pages). */
.ka-quote__person .wp-block-post-featured-image { block-size: 80px !important; inline-size: 80px !important; }
.ka-quote__person .wp-block-post-featured-image img { block-size: 80px !important; border: 3px solid var(--wp--preset--color--surface-2); border-radius: 50%; box-sizing: border-box; inline-size: 80px !important; object-fit: cover; }
.ka-quote__person .wp-block-post-title { font-size: 1rem; margin: 0; }
.ka-slider__nav { display: flex; gap: 0.5rem; justify-content: flex-end; margin-block-end: 0.5rem; }
.ka-slider__btn {
	align-items: center;
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 50%;
	color: var(--wp--preset--color--primary);
	cursor: pointer;
	display: inline-flex;
	height: 48px;
	justify-content: center;
	width: 48px;
}
.ka-slider__btn:hover { background: var(--wp--preset--color--primary); border-color: var(--wp--preset--color--primary); color: #fff; }
.ka-slider__btn:disabled { cursor: default; opacity: 0.4; }
.ka-slider__btn:disabled:hover { background: var(--wp--preset--color--base); color: var(--wp--preset--color--primary); }
[dir="rtl"] .ka-slider__btn svg { scale: -1 1; }

/* Text + image, lists ----------------------------------------------------------- */
.wp-block-image.is-style-soft img { border-radius: var(--ka-radius-lg); }
.wp-block-list.is-style-checklist { list-style: none; padding-inline-start: 0; }
.wp-block-list.is-style-checklist li { padding-inline-start: 2rem; position: relative; }
.wp-block-list.is-style-checklist li + li { margin-block-start: 0.6rem; }
.wp-block-list.is-style-checklist li::before {
	background: var(--wp--preset--color--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2300264c' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 14px no-repeat;
	block-size: 1.3rem;
	border-radius: 50%;
	content: "";
	inline-size: 1.3rem;
	inset-block-start: 0.2em;
	inset-inline-start: 0;
	position: absolute;
}
@media (max-width: 781px) {
	.wp-block-columns.is-style-reverse-mobile { flex-direction: column-reverse; }
}

/* Quote block: border on the reading start side. */
.wp-block-quote {
	border-inline-start: 4px solid var(--wp--preset--color--accent);
	padding-inline-start: 1.25rem;
}

/* FAQ --------------------------------------------------------------------------- */
.wp-block-details summary {
	cursor: pointer;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 600;
	list-style: none;
	padding-inline-end: 2.5rem;
	position: relative;
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after {
	color: var(--wp--preset--color--secondary);
	content: "+";
	font-size: 1.6rem;
	inset-block-start: 50%;
	inset-inline-end: 0.25rem;
	line-height: 1;
	position: absolute;
	translate: 0 -50%;
}
.wp-block-details[open] summary::after { content: "−"; }
.wp-block-details > :not(summary) { color: var(--wp--preset--color--muted); }

/* Partners ------------------------------------------------------------------------ */
.ka-partners { align-items: center; }
.ka-partners .wp-block-image { margin: 0; }
.ka-partners img { filter: grayscale(1); max-height: 64px; object-fit: contain; opacity: 0.75; transition: filter 0.2s, opacity 0.2s; width: auto; }
.ka-partners img:hover { filter: none; opacity: 1; }

/* Gallery & video ---------------------------------------------------------------- */
.wp-block-gallery.has-nested-images figure.wp-block-image img { border-radius: var(--ka-radius-sm); }
.wp-block-video video { background: #000; border-radius: var(--ka-radius); width: 100%; }
.wp-block-video figcaption { text-align: start; }
.wp-block-file:not(.wp-element-button) a:first-child { font-weight: 600; }
.wp-block-file .wp-block-file__button { border-radius: 999px; font-size: 0.875rem; padding: 0.5em 1.1em; }

/* Tables ---------------------------------------------------------------------------- */
.wp-block-table table { border-collapse: collapse; }
.wp-block-table th,
.wp-block-table td { border: 0; border-block-end: 1px solid var(--wp--preset--color--border); padding: 0.75rem; text-align: start; }
.wp-block-table thead th { background: var(--wp--preset--color--surface); color: var(--wp--preset--color--primary); }

/* Search / 404 --------------------------------------------------------------------- */
.wp-block-search__input { border: 1px solid #b9c3cf; border-radius: 999px; min-height: 48px; padding-inline: 1.25rem; }
.wp-block-search__button { margin-inline-start: 0.5rem; }


/* Full-width sections stack without white gaps between them. */
.is-layout-constrained > .alignfull + .alignfull,
.ka-landing .wp-block-post-content > .alignfull:first-child { margin-block-start: 0; }
.ka-landing .wp-block-post-content > .alignfull:last-child { margin-block-end: 0; }
main > .wp-block-post-content:last-child,
.ka-landing { margin-block-end: 0; }

/* Specialization buttons: outlined pills that wrap. */
.ka-pill-buttons .wp-block-button__link {
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--border);
	color: var(--wp--preset--color--primary);
	font-size: 0.9375rem;
	padding: 0.65em 1.2em;
}
.ka-pill-buttons .wp-block-button__link:hover { background: var(--wp--preset--color--primary); border-color: var(--wp--preset--color--primary); color: #fff; }
.ka-cta .wp-block-heading { margin-inline: auto; max-width: none; }
.ka-hero .wp-block-buttons { margin-block-start: var(--wp--preset--spacing--40); }

.ka-cards { gap: 1rem; }
.ka-cards .wp-block-group.is-style-card { box-shadow: none; }
.ka-card-icon img { height: 40px; width: auto; }

/* Numbers like "76%+" keep their reading order in Arabic. */
[dir="rtl"] .ka-stat__value,
[dir="rtl"] .ka-kpi__value { direction: ltr; text-align: right; unicode-bidi: isolate; }

/* English items shown on Arabic pages (until they are translated) read left to right. */
[dir="rtl"] .ka-lang-en :where(.wp-block-post-title, .wp-block-post-excerpt, .ka-open-program__title, .ka-open-program__excerpt, .wp-block-post-content) { direction: ltr; text-align: left; }