/* ============================================================================
   NIMR HOMEPAGE  —  approved mockup v7 layout
   Persistent two-column page grid (main content + sticky side rail) below the
   existing site header. Header/footer are untouched — rendered by the Header
   Footer Elementor templates as before.
   ========================================================================== */

/* --- Neutralise Astra's content container on the front page ---------------- */
.home #content.site-content { padding: 0; }
.home #content .ast-container {
	max-width: 100%;
	padding-left: 0;
	padding-right: 0;
	display: block;
}
.home .ast-container > .ast-row { margin: 0; }

.nimr-home {
	font-family: var(--font-body);
	color: var(--color-text);
	font-size: var(--step-0);
	line-height: var(--leading-normal);
	background: var(--surface-page);
}
.nimr-home *,
.nimr-home *::before,
.nimr-home *::after { box-sizing: border-box; }
.nimr-home h1, .nimr-home h2, .nimr-home h3, .nimr-home h4 {
	font-family: var(--font-display);
	color: var(--color-heading);
	line-height: var(--leading-tight);
	letter-spacing: var(--tracking-tight);
	margin: 0;
}
.nimr-home a { color: inherit; text-decoration: none; }
.nimr-home img { max-width: 100%; display: block; }
.nimr-home button { font: inherit; cursor: pointer; }

.nimr-eyebrow {
	font-size: var(--step--1);
	letter-spacing: var(--tracking-wide);
	text-transform: uppercase;
	font-weight: 700;
	color: var(--nimr-700);
	margin: 0 0 var(--space-2xs);
}

/* ============================= PAGE GRID =================================== */
.nimr-page-grid {
	max-width: var(--container-wide);
	margin: 0 auto;
	padding: var(--space-m) var(--gutter) var(--space-xl);
	display: grid;
	grid-template-columns: 1fr 340px;
	gap: var(--space-l);
	align-items: start;
}
.nimr-main-col { min-width: 0; display: flex; flex-direction: column; gap: var(--space-xl); }
.nimr-side-col { display: flex; flex-direction: column; gap: var(--space-s); position: sticky; top: var(--space-s); }

/* ============================= HERO SLIDER ================================= */
.nimr-hero {
	position: relative;
	border-radius: var(--radius-xl);
	overflow: hidden;
	min-height: clamp(480px, 68vh, 680px);
	background: var(--nimr-900);
}
.nimr-hero-slides { position: relative; min-height: clamp(480px, 68vh, 680px); }
.nimr-hero-slide {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--dur-slow) var(--ease-in-out);
}
.nimr-hero-slide.is-active { opacity: 1; visibility: visible; z-index: 1; }
.nimr-hero-slide.no-thumb { background-image: linear-gradient(120deg, var(--nimr-300), var(--nimr-600)); }
.nimr-hero-content {
	position: relative; z-index: 2;
	background: rgba(21, 90, 148, 0.92); /* brand navy, solid caption bar */
	padding: var(--space-m) var(--space-l);
}
.nimr-hero .nimr-hero-title { display: block; color: #fff; font-size: var(--step-3); font-weight: 700; max-width: 54rem; line-height: 1.28; margin: 0; }
.nimr-hero-slide:hover .nimr-hero-title,
.nimr-hero-slide:focus-visible .nimr-hero-title { text-decoration: underline; text-decoration-color: var(--nimr-500); }

.nimr-hero-dots { position: absolute; z-index: 3; bottom: var(--space-s); right: var(--space-l); display: flex; gap: 0.45rem; }
.nimr-hero-dot { width: 0.5rem; height: 0.5rem; border-radius: 50%; background: rgba(255, 255, 255, .45); border: 0; padding: 0; }
.nimr-hero-dot.is-active { background: var(--nimr-500); width: 1.35rem; border-radius: var(--radius-sm); }

.nimr-hero-rail { position: absolute; z-index: 3; top: var(--space-s); right: var(--space-s); display: flex; gap: 0.5rem; }
.nimr-hero-rail-item {
	width: 3.25rem; height: 2.35rem; border-radius: 6px; overflow: hidden; padding: 0;
	border: 2px solid rgba(255, 255, 255, .35); opacity: .7; background: none;
}
.nimr-hero-rail-item.is-active { border-color: var(--nimr-500); opacity: 1; }
.nimr-hero-rail-item img { width: 100%; height: 100%; object-fit: cover; }

/* ============================= SECTION HEADS ================================ */
.nimr-shead { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-s); margin-bottom: var(--space-s); }
.nimr-shead h2 { font-size: var(--step-2); font-weight: 700; }
.nimr-shead.center { display: block; text-align: center; }
.nimr-more { color: var(--nimr-700); font-weight: 700; font-size: var(--step--1); white-space: nowrap; }

/* ============================= NEWS + PUBLICATIONS =========================== */
.nimr-twocol { display: grid; grid-template-columns: 1.15fr 1fr; gap: var(--space-m); align-items: start; }

.nimr-newslist { display: flex; flex-direction: column; gap: var(--space-s); }
.nimr-newsrow { display: flex; gap: var(--space-s); background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-md); overflow: hidden; transition: box-shadow var(--dur) var(--ease-out); }
.nimr-newsrow:hover { box-shadow: var(--shadow-sm); }
.nimr-newsrow .thumb { flex: none; width: 110px; background: linear-gradient(135deg, var(--nimr-200), var(--nimr-500)); background-size: cover; background-position: center; }
.nimr-newsrow .body { padding: var(--space-xs) var(--space-xs) var(--space-xs) 0; min-width: 0; }
.nimr-newsrow .d { color: var(--nimr-700); font-weight: 700; font-size: var(--step--1); }
.nimr-newsrow h3 { font-size: var(--step-0); margin: 0.2em 0 0; line-height: 1.35; font-weight: 700; }

.nimr-pubcol { background: var(--surface-warm); border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); padding: 6px; }
.nimr-pubitem { display: flex; gap: var(--space-s); padding: var(--space-s); border-bottom: 1px dashed #ddd3bd; }
.nimr-pubitem:last-child { border-bottom: 0; }
.nimr-pubitem .doc { flex: none; width: 2.5rem; height: 2.5rem; border-radius: 9px; background: var(--nimr-700); color: #fff; display: grid; place-items: center; }
.nimr-pubitem .doc svg { width: 1.2rem; height: 1.2rem; }
.nimr-pubitem .tag {
	display: inline-block; font-size: var(--step--1); font-weight: 700; text-transform: uppercase; letter-spacing: var(--tracking-wide);
	color: var(--nimr-700); background: var(--nimr-100); padding: 0.15em 0.6em; border-radius: var(--radius-pill); margin-bottom: 0.3em;
}
.nimr-pubitem h4 { font-size: var(--step--1); line-height: 1.35; margin-bottom: 0.2em; }
.nimr-pubitem .meta { font-size: 0.78rem; color: var(--color-muted); font-style: italic; }
.nimr-pubitem .go { margin-left: auto; flex: none; align-self: center; color: var(--nimr-700); }
.nimr-pubitem .go svg { width: 1.1rem; height: 1.1rem; }

/* ============================= VISION / MISSION / MOTTO ====================== */
.nimr-vmm-cards { display: grid; grid-template-columns: 1fr 1.2fr 1fr; gap: var(--space-s); }
.nimr-vmm-card { position: relative; background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); padding: var(--space-l) var(--space-m); text-align: center; overflow: hidden; }
.nimr-vmm-card::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, var(--nimr-300), var(--nimr-500)); }
.nimr-vmm-icon { width: 3rem; height: 3rem; border-radius: 50%; background: var(--nimr-100); color: var(--nimr-700); display: grid; place-items: center; margin: 0 auto var(--space-s); }
.nimr-vmm-icon svg { width: 1.4rem; height: 1.4rem; }
.nimr-vmm-card h3 { font-size: var(--step--1); text-transform: uppercase; letter-spacing: var(--tracking-wide); color: var(--nimr-700); margin-bottom: var(--space-2xs); }
.nimr-vmm-card p { color: var(--color-muted); font-size: var(--step-0); margin: 0; }
.nimr-vmm-card.motto { background: var(--nimr-100); border-color: var(--nimr-200); display: flex; flex-direction: column; justify-content: center; }
.nimr-vmm-card.motto .qm { font-family: Georgia, serif; font-size: 2.8rem; color: var(--nimr-600); opacity: .35; line-height: .4; display: block; height: 1.3rem; }
.nimr-vmm-card.motto p.big { font-family: var(--font-display); font-weight: 700; font-size: var(--step-1); color: var(--color-heading); font-style: italic; line-height: 1.35; margin: 0; }

/* ============================= IMPACT (no colour — plain cards) ============== */
.nimr-impact-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-m); }
.nimr-impact-card {
	background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-lg);
	padding: var(--space-l) var(--space-m); text-align: center; display: flex; flex-direction: column; gap: var(--space-2xs);
}
.nimr-impact-card .num { font-family: var(--font-display); font-weight: 700; font-size: clamp(2rem, 1.5rem + 2vw, 2.75rem); line-height: 1; color: var(--color-heading); }
.nimr-impact-card .num--text { font-size: clamp(1.4rem, 1.1rem + 1.4vw, 1.9rem); }
.nimr-impact-card .label { color: var(--color-muted); font-size: var(--step--1); font-weight: 500; }
/* Revealed one card at a time by JS as the grid scrolls into view. */
.nimr-js .nimr-impact-card { opacity: 0; transform: translateY(18px); transition: opacity .5s var(--ease-out), transform .5s var(--ease-out); }
.nimr-js .nimr-impact-card.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	.nimr-js .nimr-impact-card { opacity: 1 !important; transform: none !important; }
}

/* ============================= SIDE PANELS =================================== */
.nimr-panel { background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-md); overflow: hidden; }
.nimr-panel-head {
	padding: var(--space-xs) var(--space-s); border-bottom: 1px solid var(--border-subtle);
	font-family: var(--font-display); font-weight: 700; color: var(--nimr-600);
	display: flex; align-items: center; gap: 0.5em; font-size: var(--step-0);
}
.nimr-panel-head svg { width: 1rem; height: 1rem; color: var(--nimr-700); }

.nimr-dg-panel { text-align: center; }
.nimr-dg-photowrap { display: flex; justify-content: center; }
.nimr-dg-photowrap img { width: 100%; height: auto; display: block; border-radius: var(--radius-md) var(--radius-md) 0 0; }
.nimr-dg-info { padding: var(--space-s) var(--space-m) var(--space-m); }
.nimr-dg-role { font-size: var(--step--1); color: var(--nimr-700); font-weight: 700; text-transform: uppercase; letter-spacing: var(--tracking-wide); }
.nimr-dg-info h4 { font-size: var(--step-0); margin: 0.15em 0 var(--space-s); }

.nimr-aitem {
	display: flex; align-items: center; gap: var(--space-s);
	margin: var(--space-2xs); padding: var(--space-xs) var(--space-s);
	border: 1px solid var(--border-subtle); border-radius: var(--radius-md);
	transition: transform var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out), border-color var(--dur) var(--ease-out);
}
.nimr-aitem:hover { transform: translateY(-2px); box-shadow: var(--shadow-sm); border-color: var(--nimr-200); }
.nimr-aitem .i {
	position: relative; flex: none; width: 2.5rem; height: 2.5rem; border-radius: var(--radius-md); color: #fff;
	display: grid; place-items: center; box-shadow: 0 6px 14px -6px rgba(0, 0, 0, .28);
}
.nimr-aitem .i svg { width: 1.25rem; height: 1.25rem; z-index: 1; }
.nimr-aitem--new .i { background: linear-gradient(135deg, #ff5a4e, #d6301f); }
.nimr-aitem--new .ping {
	position: absolute; inset: -4px; border-radius: inherit;
	border: 2px solid #ff5a4e; opacity: .8;
	animation: nimr-ping 1.8s cubic-bezier(0, 0, .2, 1) infinite;
}
@keyframes nimr-ping {
	0%   { transform: scale(1); opacity: .8; }
	80%  { transform: scale(1.5); opacity: 0; }
	100% { transform: scale(1.5); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
	.nimr-aitem--new .ping { animation: none; display: none; }
}
.nimr-aitem .txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 0.2em; }
.nimr-aitem .tt { font-weight: 700; color: var(--color-heading); font-size: var(--step--1); line-height: 1.3; }
.nimr-aitem .go { flex: none; width: 1rem; height: 1rem; color: var(--color-muted); transition: transform var(--dur) var(--ease-out), color var(--dur) var(--ease-out); }
.nimr-aitem:hover .go { transform: translateX(3px); color: var(--nimr-700); }

.nimr-qlink { display: flex; align-items: center; gap: var(--space-2xs); padding: var(--space-xs) var(--space-s); border-bottom: 1px solid var(--border-subtle); font-weight: 600; font-size: var(--step--1); color: var(--color-heading); }
.nimr-qlink:last-child { border-bottom: 0; }
.nimr-qlink:hover { background: var(--nimr-100); color: var(--nimr-700); }
.nimr-qlink svg { width: 1rem; height: 1rem; color: var(--nimr-600); flex: none; }
.nimr-qlink .ext { margin-left: auto; color: var(--color-muted); font-size: 0.7rem; }

/* Buttons reused across the side column */
.nimr-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 0.5em;
	padding: 0.75em 1.1em; border-radius: var(--radius-pill); font-weight: 700; font-size: var(--step--1);
	background: var(--nimr-500); color: var(--nimr-ink); width: 100%;
	transition: background-color var(--dur) var(--ease-out), transform var(--dur) var(--ease-out);
}
.nimr-btn:hover { background: var(--nimr-600); transform: translateY(-1px); }

/* ============================= DG MODAL ======================================= */
.nimr-modal { position: fixed; inset: 0; z-index: 1000; display: none; }
.nimr-modal.is-open { display: block; }
.nimr-modal-overlay { position: absolute; inset: 0; background: rgba(6, 15, 20, .6); }
.nimr-modal-dialog {
	position: relative; z-index: 1; margin: 4vh auto; width: min(640px, 92vw); max-height: 88vh; overflow-y: auto;
	background: #fff; border-radius: var(--radius-xl); box-shadow: var(--shadow-lg);
	padding: var(--space-l);
	opacity: 0; transform: translateY(16px) scale(.98);
	transition: opacity var(--dur) var(--ease-out), transform var(--dur) var(--ease-out);
}
.nimr-modal.is-open .nimr-modal-dialog { opacity: 1; transform: none; }
.nimr-modal-close {
	position: absolute; top: var(--space-s); right: var(--space-s); width: 2.25rem; height: 2.25rem;
	border-radius: 50%; background: var(--surface-subtle); color: var(--color-heading); border: 0; display: grid; place-items: center;
}
.nimr-modal-close:hover { background: var(--nimr-100); color: var(--nimr-700); }
.nimr-modal-close svg { width: 1.1rem; height: 1.1rem; }
.nimr-modal-header { display: flex; align-items: flex-start; gap: var(--space-m); margin-bottom: var(--space-m); padding-right: var(--space-xl); }
.nimr-modal-header img { width: 6rem; height: 7.5rem; object-fit: cover; object-position: top center; border-radius: var(--radius-md); flex: none; background: var(--nimr-100); }
.nimr-modal-header h2 { font-size: var(--step-2); margin: 0.1em 0 0; }
.nimr-modal-body { color: var(--color-text); }
.nimr-modal-body p { margin: 0 0 var(--space-s); }
.nimr-modal-body p:last-child { margin-bottom: 0; }
body.nimr-modal-open { overflow: hidden; }

/* ============================= REVEAL (optional polish) ====================== */
.nimr-js [data-reveal] { opacity: 0; transform: translateY(20px); transition: opacity .6s var(--ease-out), transform .6s var(--ease-out); }
.nimr-js [data-reveal].is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	.nimr-js [data-reveal] { opacity: 1 !important; transform: none !important; }
	.nimr-hero-slide { transition: none !important; }
}

/* ============================= RESPONSIVE ===================================== */
@media (max-width: 1100px) {
	.nimr-page-grid { grid-template-columns: 1fr; }
	.nimr-side-col { position: static; }
	.nimr-twocol { grid-template-columns: 1fr; }
	.nimr-vmm-cards { grid-template-columns: 1fr; }
	.nimr-impact-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
	.nimr-hero-title { font-size: var(--step-2); }
	.nimr-hero-rail { display: none; }
	.nimr-impact-grid { grid-template-columns: 1fr; }
}