/* ==========================================================================
   Nia Modern — inner pages (loaded after nia.css)
   ========================================================================== */
.phero {
	position: relative; overflow: hidden; isolation: isolate;
	background:
		radial-gradient(50% 80% at 92% 0%, rgba(44, 106, 155, .5), transparent 65%),
		var(--ink);
	padding: calc(92px + clamp(40px, 6vw, 80px)) 0 clamp(48px, 6vw, 80px);
}
.phero::after { content: ""; position: absolute; inset: auto 0 0 0; height: 1px; background: var(--line); }
.phero__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(32px, 5vw, 72px); align-items: end; }
.phero--img .phero__grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); align-items: center; }
.phero--plain .phero__grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); }
.phero--plain .display { margin-bottom: 0; }
.phero__lead { border-inline-start: 2px solid var(--amber); padding-inline-start: 22px; margin-bottom: 8px; }
.phero__media { position: relative; margin-inline-end: 14px; }
.phero__media::before { content: ""; position: absolute; inset: 14px -14px -14px 14px; border: 1px solid var(--amber); border-radius: var(--r); opacity: .7; }
[dir="rtl"] .phero__media::before { inset: 14px 14px -14px -14px; }
.phero__media figcaption { position: absolute; inset-inline-start: 0; bottom: 0; background: var(--amber); color: var(--ink); padding: 9px 14px; border-start-end-radius: var(--r); }
.phero .display { margin: 0 0 26px; max-width: 14em; }
.phero .actions { margin-top: 32px; }
.phero__ph { aspect-ratio: 4 / 2.9; }
.phero__ph::after { content: ""; position: absolute; inset: 0; box-shadow: inset 0 0 0 1px rgba(245, 241, 232, .14); border-radius: var(--r); }
.crumbs { display: flex; flex-wrap: wrap; gap: 10px; font: 500 12px/1.4 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--fg-soft); margin-bottom: 30px; }
[lang="ar"] .crumbs { font-size: 14px; letter-spacing: 0; }
.crumbs a:hover { color: var(--amber); }
.crumbs > span:last-child { color: var(--amber); }

.blk--areanav { padding-block: 0; position: sticky; top: 72px; z-index: 20; border-bottom: 1px solid var(--line); }
.areanav { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; margin-inline: calc(var(--gut) * -1); padding-inline: var(--gut); }
.areanav::-webkit-scrollbar { display: none; }
.areanav a { flex: none; padding: 18px 14px; font-size: 15px; font-weight: 500; color: var(--fg-soft); border-bottom: 2px solid transparent; transition: color .2s, border-color .2s; }
.areanav a:hover { color: var(--fg); }
.areanav a[aria-current] { color: var(--fg); border-color: var(--em); }
.areanav .areanav__all { font-family: var(--f-mono); font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase; }
[lang="ar"] .areanav .areanav__all { font-size: 15px; letter-spacing: 0; }

.prose { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.prose > div:first-child { position: sticky; top: 104px; }
.side-ph { aspect-ratio: 16 / 10.5; margin-top: clamp(24px, 3vw, 40px); }
.prose__body .side-ph { width: 100%; aspect-ratio: 16 / 9; margin-top: 10px; }
.prose__body { display: grid; gap: 22px; justify-items: start; }
.prose__body > p { font-size: clamp(18px, 1.5vw, 21px); line-height: 1.6; color: var(--fg); }
[lang="ar"] .prose__body > p { line-height: 1.9; }
.prose__body > p + p { color: var(--fg-soft); }
.prose__link { margin-top: 28px; }
.sec .note { font-size: 15px; line-height: 1.6; color: var(--fg-soft); border-inline-start: 2px solid var(--em); padding-inline-start: 16px; max-width: 46em; }
.note a { text-decoration: underline; text-underline-offset: 3px; }
.ticks { display: grid; width: 100%; border-top: 1px solid var(--line); }
.ticks li { padding: 14px 0; border-bottom: 1px solid var(--line); display: flex; gap: 14px; align-items: baseline; font-weight: 500; }
.ticks li::before { content: ""; width: 8px; height: 8px; background: var(--em); flex: none; transform: translateY(-1px); }

.grid { display: grid; gap: clamp(16px, 2vw, 28px); }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.card { display: flex; flex-direction: column; gap: 12px; padding: clamp(22px, 2.4vw, 34px); background: var(--tile); border: 1px solid var(--line); border-radius: var(--r); color: var(--fg); transition: background .3s, border-color .3s, transform .35s var(--ease); }
.sec--paper .card { background: var(--white); }
.sec--white .card { background: var(--paper); }
.card h3 { font-size: clamp(20px, 1.8vw, 24px); font-weight: 500; letter-spacing: -.015em; line-height: 1.2; }
[lang="ar"] .card h3, [lang="ar"] .area h3 { letter-spacing: 0; line-height: 1.5; font-weight: 600; }
.card p { color: var(--fg-soft); font-size: 16px; }
.card .num, .card .label { margin-bottom: 14px; }
.card--big { padding: clamp(28px, 3.4vw, 48px); min-height: 280px; }
.card--big h3 { font-size: clamp(26px, 2.8vw, 38px); letter-spacing: -.025em; line-height: 1.1; }
.card--big p { font-size: 17.5px; max-width: 30em; }
.card__more { margin-top: auto; padding-top: 22px; display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 15.5px; }
a.card:hover { border-color: var(--brand); transform: translateY(-4px); }
a.card:hover .card__more, .area:hover .card__more { color: var(--em); }
a.card:hover .arr, .area:hover .arr { transform: translate(3px, -3px); }
[dir="rtl"] a.card:hover .arr, [dir="rtl"] .area:hover .arr { transform: scaleX(-1) translate(3px, -3px); }

.area { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); background: var(--white); border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; color: var(--fg); transition: border-color .3s, transform .35s var(--ease); }
.sec--white .area { background: var(--paper); }
.area:hover { border-color: var(--brand); transform: translateY(-4px); }
.area .ph { border-radius: 0; min-height: 240px; }
.area:hover .ph img { transform: scale(1.05); }
.area__body { display: flex; flex-direction: column; gap: 10px; padding: clamp(20px, 2.4vw, 32px); }
.area h3 { font-size: clamp(21px, 1.9vw, 27px); font-weight: 500; letter-spacing: -.02em; line-height: 1.15; }
.area p { color: var(--fg-soft); font-size: 16px; }

.duo { padding: clamp(28px, 3.4vw, 48px); border: 1px solid var(--line); border-radius: var(--r); background: var(--tile); }
.duo .label { margin-bottom: 20px; }
.duo p { font-size: clamp(20px, 2vw, 28px); line-height: 1.35; letter-spacing: -.015em; }
[lang="ar"] .duo p { letter-spacing: 0; line-height: 1.75; }

.steps--static li > div { display: grid; grid-template-columns: 52px 1fr; gap: 14px; align-items: baseline; padding: 26px 8px; border-bottom: 1px solid var(--line); }

.faq { border-top: 1px solid var(--line); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 24px 4px; font-size: clamp(19px, 1.7vw, 23px); font-weight: 500; letter-spacing: -.01em; }
[lang="ar"] .faq summary { letter-spacing: 0; font-weight: 600; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary i { position: relative; width: 16px; height: 16px; flex: none; }
.faq summary i::before, .faq summary i::after { content: ""; position: absolute; inset: 7px 0 auto 0; height: 2px; background: var(--em); transition: transform .3s var(--ease); }
.faq summary i::after { transform: rotate(90deg); }
.faq details[open] summary i::after { transform: rotate(0); }
.faq details p { padding: 0 4px 26px; color: var(--fg-soft); max-width: 38em; }

.story__lead { color: var(--fg-soft); font-size: 16px; }

.article { max-width: 44em; margin-inline: auto; display: grid; gap: 26px; }
.article p { font-size: clamp(18px, 1.5vw, 21px); line-height: 1.7; color: var(--fg); }
[lang="ar"] .article p { line-height: 2; }
.article .article__meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-bottom: 20px; border-bottom: 1px solid var(--line); font-size: 14px; color: var(--fg-soft); }

.gallery { columns: 3 280px; column-gap: 16px; margin-bottom: 32px; }
.gallery .ph { display: block; margin-bottom: 16px; break-inside: avoid; cursor: zoom-in; }
.gallery .ph:hover img { transform: scale(1.04); }
.lightbox { position: fixed; inset: 0; z-index: 90; background: rgba(6, 26, 46, .95); display: grid; place-items: center; padding: 24px; cursor: zoom-out; }
.lightbox img { max-width: 100%; max-height: calc(100vh - 48px); border-radius: var(--r); }

.form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; background: var(--white); border: 1px solid var(--line); border-radius: var(--r); padding: clamp(22px, 3vw, 44px); }
.sec--white .form { background: var(--paper); }
.form__wide { grid-column: 1 / -1; }
.form label { display: grid; gap: 8px; }
.form label > span { font: 500 12px/1.4 var(--f-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--fg-soft); }
[lang="ar"] .form label > span { font-size: 14.5px; letter-spacing: 0; }
.form input, .form select, .form textarea { width: 100%; font: inherit; color: var(--fg); background: transparent; border: 0; border-bottom: 1.5px solid rgba(13, 61, 107, .35); border-radius: 0; padding: 10px 2px 12px; transition: border-color .2s; }
.form textarea { resize: vertical; min-height: 130px; }
.form input:focus, .form select:focus, .form textarea:focus { outline: 0; border-color: var(--clay); }
.form__foot { display: flex; flex-wrap: wrap; gap: 20px 28px; align-items: center; margin-top: 8px; }
.form__foot .note { flex: 1 1 260px; border: 0; padding: 0; }
.form button { border: 0; padding: 0; }
.form__intro { margin: 20px 0 28px; }
.contact { display: grid; border-top: 1px solid var(--line); margin: 0 0 26px; }
.contact > div { padding: 18px 0; border-bottom: 1px solid var(--line); display: grid; gap: 6px; }
.contact dd { margin: 0; font-size: 20px; font-weight: 500; }
.contact dd a { display: inline-flex; align-items: center; gap: 8px; }
.contact dd a:hover { color: var(--em); }

.cta { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(28px, 5vw, 80px); align-items: end; }
.cta .display { font-size: clamp(36px, 4.8vw, 68px); }
.cta__side { display: grid; gap: 28px; }
.cta .actions { display: flex; flex-wrap: wrap; gap: 20px 28px; align-items: center; }

@media (max-width: 1020px) {
	.phero--img .phero__grid, .phero--plain .phero__grid, .prose, .cta { grid-template-columns: minmax(0, 1fr); }
	.prose > div:first-child { position: static; }
	.side-ph { max-width: 560px; }
	.phero__media { max-width: 560px; }
	.grid--3, .grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.area { grid-template-columns: minmax(0, 1fr); }
	.area .ph { aspect-ratio: 16 / 9; min-height: 0; }
}
@media (max-width: 640px) {
	.grid--2, .grid--3, .grid--4, .form { grid-template-columns: minmax(0, 1fr); }
	.card--big { min-height: 0; }
}

/* WordPress post content */
.wp-content > * { margin: 0; }
.wp-content h2, .wp-content h3 { font-weight: 500; letter-spacing: -.02em; line-height: 1.2; color: var(--fg); margin-top: 12px; }
.wp-content h2 { font-size: clamp(26px, 2.6vw, 34px); }
.wp-content h3 { font-size: clamp(21px, 2vw, 26px); }
.wp-content a { color: var(--clay); text-decoration: underline; text-underline-offset: 3px; }
.wp-content ul, .wp-content ol { padding-inline-start: 1.3em; list-style: revert; font-size: 19px; }
.wp-content img { border-radius: var(--r); }
.wp-content blockquote { margin: 0; padding-inline-start: 20px; border-inline-start: 2px solid var(--clay); font-family: var(--f-serif); font-size: 26px; line-height: 1.35; }
.wp-pager { margin-top: 48px; }
.wp-pager .nav-links { display: flex; gap: 8px; }
.wp-pager .page-numbers { padding: 10px 14px; border: 1px solid var(--line); border-radius: var(--r); font-weight: 600; }
.wp-pager .page-numbers.current { background: var(--brand); color: var(--paper); border-color: var(--brand); }

/* news */
.newslist { display: grid; gap: clamp(16px, 2vw, 24px); }
.newsitem { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: clamp(18px, 2.4vw, 32px); align-items: center; padding: 14px; background: var(--white); border: 1px solid var(--line); border-radius: var(--r); color: var(--fg); transition: border-color .3s, transform .35s var(--ease); }
.newsitem:hover { border-color: var(--brand); transform: translateY(-3px); }
.newsitem .ph { aspect-ratio: 4 / 3; }
.newsitem:hover .ph img { transform: scale(1.05); }
.newsitem > div { display: grid; gap: 8px; padding-block: 6px; padding-inline-end: 10px; }
.newsitem h3 { font-size: clamp(20px, 1.9vw, 26px); font-weight: 500; letter-spacing: -.02em; line-height: 1.2; }
[lang="ar"] .newsitem h3 { letter-spacing: 0; line-height: 1.5; font-weight: 600; }
.newsitem p:not(.label) { color: var(--fg-soft); font-size: 16px; }
.newsitem:hover .story__more { color: var(--clay); }
.article__back { margin-top: 12px; }
@media (max-width: 640px) {
	.newsitem { grid-template-columns: minmax(0, 1fr); }
}

/* news article */
.newsart { display: grid; grid-template-columns: minmax(0, .34fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
.newsart__aside { position: sticky; top: 104px; display: grid; gap: 10px; justify-items: start; padding-top: 18px; border-top: 2px solid var(--em); }
.newsart__date { font-size: clamp(22px, 2vw, 28px); font-weight: 500; letter-spacing: -.02em; line-height: 1.2; color: var(--fg); margin-bottom: 18px; }
[lang="ar"] .newsart__date { letter-spacing: 0; line-height: 1.5; font-weight: 600; }
.newsart__body { display: grid; gap: 24px; max-width: 820px; }
.newsart__body > p { font-size: clamp(18px, 1.45vw, 20px); line-height: 1.75; color: var(--fg-soft); }
[lang="ar"] .newsart__body > p { line-height: 2; }
.newsart__body > .newsart__first { font-size: clamp(22px, 2.1vw, 29px); line-height: 1.4; letter-spacing: -.015em; color: var(--fg); }
[lang="ar"] .newsart__body > .newsart__first { letter-spacing: 0; line-height: 1.75; }
.newsart__wide { display: block; aspect-ratio: 16 / 9; margin-block: 10px; cursor: zoom-in; }
.newsart__h { margin-top: 20px; padding-top: 22px; border-top: 1px solid var(--line); }
.newsart__grid { display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.newsart__grid--1 { grid-template-columns: minmax(0, 1fr); }
.newsart__grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.newsart__grid .ph { display: block; aspect-ratio: 4 / 3; cursor: zoom-in; }
.newsart .ph:hover img { transform: scale(1.04); }
@media (max-width: 1020px) {
	.newsart { grid-template-columns: minmax(0, 1fr); }
	.newsart__aside { position: static; }
}
@media (max-width: 640px) {
	.newsart__grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* phone refinements */
@media (max-width: 640px) {
	.phero { padding: calc(92px + 28px) 0 44px; }
	.phero .display { margin-bottom: 18px; }
	.phero__media { margin-inline-end: 10px; }
	.phero__media::before { inset: 10px -10px -10px 10px; }
	[dir="rtl"] .phero__media::before { inset: 10px 10px -10px -10px; }
	.phero__lead { padding-inline-start: 16px; }
	.crumbs { margin-bottom: 20px; }
	.card, .card--big, .duo { padding: 22px; }
	.card--big h3 { font-size: 24px; }
	.grid--3, .grid--4 { grid-template-columns: minmax(0, 1fr); }
	.area .ph { aspect-ratio: 16 / 10; }
	.steps--static li > div, .steps a { grid-template-columns: 36px 1fr; padding: 20px 0; }
	.steps a .arr { display: none; }
	.faq summary { padding: 18px 0; }
	.form { padding: 20px; gap: 16px; }
	.form__foot { flex-direction: column; align-items: stretch; }
	.form__foot .note { flex: none; }
	.cta .actions { flex-direction: column; align-items: stretch; }
	.cta .actions .tlink { align-self: flex-start; }
	.newsitem { padding: 12px; gap: 14px; }
	.newsitem > div { padding: 0 4px 8px; }
	.newsart__body { gap: 18px; }
	.newsart__aside { grid-auto-flow: row; }
	.gallery { columns: 1; }
	.blk--areanav { top: 72px; }
}