:root {
  --iee-blue: #2f379d;
  --iee-blue-dark: #222a82;
  --ink: #121528;
  --muted: #626a7e;
  --azure: #5685e8;
  --ribbon-mid: #5365b8;
  --ribbon-bright: #2380d8;
  --ribbon-pale: #b9c6ed;
  --sage: #819b8b;
  --ice: #f1f4f7;
  --line: #d8deea;
  --white: #ffffff;
  --page: min(1380px, calc(100vw - 64px));
  --shadow: 0 28px 70px rgba(18, 21, 40, 0.1);
  --font: "Myriad Pro", Myriad, "Segoe UI", Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: hidden; overflow-x: clip; }

body {
  margin: 0;
  color: var(--ink);
  background: var(--white);
  font-family: var(--font);
  font-size: 18px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
  overflow-x: clip;
}

body.menu-open { overflow: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; }
button, input, textarea { font: inherit; }

.skip-link {
  position: fixed;
  z-index: 1000;
  top: 12px;
  left: 12px;
  transform: translateY(-160%);
  padding: 10px 14px;
  color: var(--white);
  background: var(--iee-blue);
}
.skip-link:focus { transform: translateY(0); }

.site-header {
  position: sticky;
  z-index: 100;
  top: 0;
  background: rgba(255, 255, 255, 0.96);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(16px);
}

.header-inner {
  width: var(--page);
  min-height: 104px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 34px;
}

.brand {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 18px;
  text-decoration: none;
}

.brand img { width: 68px; height: 68px; flex: 0 0 auto; }

.brand-name,
.org-title {
  color: var(--iee-blue);
  font-family: var(--font);
  font-weight: 600;
  line-height: 1.12;
  letter-spacing: 0.012em;
  text-decoration-line: underline;
  text-decoration-thickness: 3px;
  text-underline-offset: 8px;
  text-transform: uppercase;
}

.brand-name { font-size: clamp(16px, 1.52vw, 25px); }

/* Give underlined institutional titles enough breathing room when they wrap. */
.org-title { line-height: 1.42; }

.site-nav { display: flex; align-items: center; gap: clamp(18px, 2.2vw, 38px); }
.site-nav a {
  position: relative;
  padding: 10px 0;
  color: var(--ink);
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
}
.site-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  transform: scaleX(0);
  transform-origin: right;
  background: var(--iee-blue);
  transition: transform 180ms ease;
}
.site-nav a:hover::after,
.site-nav a:focus-visible::after,
.site-nav a[aria-current="page"]::after { transform: scaleX(1); transform-origin: left; }

.nav-toggle {
  display: none;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid var(--line);
  background: var(--white);
  color: var(--ink);
  cursor: pointer;
}
.nav-toggle span,
.nav-toggle::before,
.nav-toggle::after {
  content: "";
  display: block;
  width: 22px;
  height: 2px;
  margin: 5px auto;
  background: currentColor;
  transition: transform 180ms ease, opacity 180ms ease;
}
.menu-open .nav-toggle span { opacity: 0; }
.menu-open .nav-toggle::before { transform: translateY(7px) rotate(45deg); }
.menu-open .nav-toggle::after { transform: translateY(-7px) rotate(-45deg); }

main { overflow: hidden; }
.container { width: var(--page); margin-inline: auto; }
.section { padding: clamp(82px, 9vw, 148px) 0; }
.section-tight { padding: clamp(60px, 7vw, 104px) 0; }
.section-ice { background: var(--ice); }
.section-ink { background: var(--ink); color: var(--white); }

.display-title, .page-title, .section-title, .project-title {
  margin: 0;
  font-family: var(--font);
  font-weight: 600;
  letter-spacing: -0.042em;
}
.display-title { max-width: 850px; font-size: clamp(58px, 7.3vw, 124px); line-height: 0.94; }
.page-title { font-size: clamp(58px, 7vw, 112px); line-height: 0.96; }
.project-title { max-width: 760px; font-size: clamp(54px, 6.2vw, 104px); line-height: 0.96; }
.section-title { font-size: clamp(38px, 4.5vw, 72px); line-height: 1.02; }

.section-label { margin: 0 0 24px; color: var(--iee-blue); font-size: 14px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; }
.section-label::before {
  content: "\2192";
  display: inline-block;
  width: 46px;
  height: 20px;
  margin-right: 14px;
  color: currentColor;
  font-family: Arial, sans-serif;
  font-size: 28px;
  font-weight: 300;
  line-height: 14px;
  letter-spacing: 0;
  vertical-align: -4px;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 700ms cubic-bezier(.2,.75,.2,1);
}
.section-label.is-arrow-visible::before { transform: scaleX(1); }
.lead { max-width: 780px; margin: 28px 0 0; color: var(--muted); font-size: clamp(20px, 2vw, 30px); line-height: 1.48; }
.section-ink .lead, .section-ink .body-copy { color: #c6cde0; }
.body-copy { color: var(--muted); }
.body-copy p:first-child { margin-top: 0; }
.body-copy p:last-child { margin-bottom: 0; }
.text-link { display: inline-flex; align-items: center; gap: 15px; margin-top: 34px; color: var(--iee-blue); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }
.text-link svg { width: 22px; transition: transform 180ms ease; }
.text-link:hover svg { transform: translateX(5px); }

.home-panorama-hero {
  position: relative;
  min-height: calc(100svh - 104px);
  padding-bottom: 0;
  background: var(--white);
  overflow: hidden;
}
.panorama-media {
  position: relative;
  height: clamp(620px, 66vw, 760px);
  overflow: hidden;
}
.panorama-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(24, 34, 112, .98) 0%, rgba(31, 46, 132, .91) 18%, rgba(37, 52, 145, .63) 34%, rgba(47, 55, 157, .2) 49%, rgba(47, 55, 157, 0) 64%);
  pointer-events: none;
}
.panorama-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 48%;
}
.panorama-heading {
  position: absolute;
  z-index: 2;
  top: clamp(120px, 10vw, 160px);
  left: max(42px, calc((100vw - min(1380px, calc(100vw - 64px))) / 2));
  width: min(560px, 42vw);
  transform: none;
  color: var(--white);
}
.panorama-heading h1 {
  margin: 0;
  font-family: var(--font);
  font-size: clamp(58px, 5.15vw, 84px);
  font-weight: 600;
  line-height: 1.02;
  letter-spacing: -0.034em;
  text-wrap: balance;
}
.panorama-panel {
  position: relative;
  z-index: 3;
  isolation: isolate;
  width: calc(100% - max(42px, calc((100vw - min(1380px, calc(100vw - 64px))) / 2)));
  margin: -96px 0 0 max(42px, calc((100vw - min(1380px, calc(100vw - 64px))) / 2));
  padding: clamp(34px, 3.7vw, 58px) clamp(34px, 4.3vw, 66px) clamp(38px, 4.5vw, 68px);
  border-top: 7px solid var(--iee-blue);
  background: var(--white);
  box-shadow: 0 20px 55px rgba(18, 21, 40, .11);
  overflow: hidden;
}
.panorama-panel::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: 50%;
  right: clamp(-94px, -5vw, -48px);
  width: clamp(390px, 37vw, 570px);
  aspect-ratio: 1;
  transform: translateY(-50%);
  background: url("../img/iee-logo.png") center / contain no-repeat;
  filter: grayscale(1);
  opacity: .045;
  pointer-events: none;
}
.panorama-panel > * { position: relative; z-index: 1; }
.panorama-panel::after {
  content: "";
  position: absolute;
  top: 218px;
  left: 100%;
  width: 100vw;
  height: 1px;
  background: var(--iee-blue);
}
.panorama-panel .org-title {
  margin: 0;
  font-size: clamp(25px, 2.3vw, 37px);
}
.panorama-statement {
  max-width: min(880px, 74%);
  margin: 30px 0 0;
  color: var(--ink);
  font-size: clamp(21px, 2vw, 30px);
  line-height: 1.38;
}
.panorama-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  margin-top: 34px;
}
.hero-action {
  min-width: 232px;
  padding: 18px 28px;
  border: 2px solid var(--iee-blue);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.15;
  text-align: center;
  text-decoration: none;
  transition: color 180ms ease, background-color 180ms ease;
}
.hero-action-primary { color: var(--white); background: var(--iee-blue); }
.hero-action-primary:hover, .hero-action-primary:focus-visible { background: var(--iee-blue-dark); }
.hero-action-secondary { color: var(--iee-blue); background: var(--white); }
.hero-action-secondary:hover, .hero-action-secondary:focus-visible { color: var(--white); background: var(--iee-blue); }

@media (min-width: 901px) {
  .home-panorama-hero { background: var(--iee-blue); }
  .panorama-media {
    width: 68%;
    height: clamp(620px, 45.6vw, 700px);
    margin-left: auto;
  }
  .panorama-media::after {
    inset: 0 auto 0 0;
    width: clamp(90px, 8vw, 130px);
    background: linear-gradient(90deg, var(--iee-blue) 0%, rgba(47, 55, 157, .72) 34%, rgba(47, 55, 157, 0) 100%);
  }
  .panorama-heading { width: min(420px, 30vw); }
}

.mission-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.mission-item { padding: 46px 48px 52px 0; }
.mission-item + .mission-item { padding-left: 48px; border-left: 1px solid var(--line); }
.mission-icon { display: block; width: 58px; height: 58px; margin-bottom: 38px; object-fit: contain; filter: brightness(0) saturate(100%) invert(22%) sepia(47%) saturate(2605%) hue-rotate(224deg) brightness(80%) contrast(91%); }
.mission-item h3 { margin: 0 0 18px; color: var(--iee-blue); font-size: 26px; font-weight: 600; }
.mission-item p { margin: 0; color: var(--muted); }

.split-feature { position: relative; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(360px, 0.95fr); align-items: stretch; overflow: hidden; }
.split-feature.reverse { grid-template-columns: minmax(360px, 0.95fr) minmax(0, 1.05fr); }
.split-feature.reverse .feature-media { order: 2; }
.feature-media { min-height: 620px; }
.feature-media img { width: 100%; height: 100%; object-fit: cover; }
.feature-copy { position: relative; display: flex; flex-direction: column; justify-content: center; padding: clamp(60px, 8vw, 130px); }
.section-ink .feature-copy { isolation: isolate; overflow: hidden; }
.section-ink .feature-copy > * { position: relative; z-index: 1; }
.section-ink .feature-copy::after { content: ""; position: absolute; z-index: 0; right: -24%; bottom: -8%; left: -24%; height: 190px; opacity: .34; background: url("../img/institutional-ribbon-light.svg") center / 100% 100% no-repeat; transform: rotate(-3deg); }

.project-preview-section { position: relative; isolation: isolate; overflow: hidden; }
.project-preview-section > .container { position: relative; z-index: 1; }
.project-preview { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr); gap: clamp(42px, 7vw, 110px); align-items: center; }
.project-preview-media { position: relative; isolation: isolate; margin: 24px 22px 24px 18px; }
.project-preview-media::before, .project-preview-media::after { content: ""; position: absolute; z-index: -1; pointer-events: none; }
.project-preview-media::before { inset: -22px 22% 22px -22px; background: rgba(185,198,237,.3); }
.project-preview-media::after { inset: 20px -20px -20px 20%; background: rgba(47,55,157,.08); }
.project-preview-media img { position: relative; z-index: 1; display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.activity-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.activity-strip a { color: inherit; text-decoration: none; }
.activity-strip figure { margin: 0; }
.activity-strip img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.activity-strip figcaption { padding: 16px 0 0; color: var(--iee-blue); font-size: 15px; font-weight: 600; }
.activity-strip a img { transition: transform 280ms ease, filter 280ms ease; }
.activity-strip a:hover img, .activity-strip a:focus-visible img { transform: translateY(-6px); filter: saturate(1.08); }

.page-hero { position: relative; padding: clamp(76px, 10vw, 154px) 0 clamp(66px, 8vw, 120px); border-bottom: 1px solid var(--line); overflow: hidden; }
.page-hero::after { content: ""; position: absolute; right: -12%; bottom: -12%; width: 70%; height: 220px; opacity: .74; pointer-events: none; background: url("../img/institutional-ribbon.svg") center / 100% 100% no-repeat; transform: rotate(-4deg); }
.page-hero > .container { position: relative; z-index: 1; }
.page-hero-grid { position: relative; z-index: 1; }
.page-hero-grid { display: grid; grid-template-columns: minmax(0, 0.78fr) minmax(500px, 1.22fr); gap: clamp(48px, 8vw, 120px); align-items: center; }
.page-hero-media { position: relative; box-shadow: 22px 22px 0 rgba(185, 198, 237, .28); }
.page-hero-media::before { content: ""; position: absolute; inset: -24px 26% 24px -24px; z-index: -1; background: var(--ice); }
.page-hero-media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.about-page-hero { color: var(--white); background: var(--iee-blue); border-bottom-color: rgba(255,255,255,.18); }
.about-page-hero .lead { color: #d9def2; }

.about-rail { border-top: 1px solid var(--line); }
.about-section { position: relative; z-index: 0; isolation: isolate; display: grid; grid-template-columns: 110px minmax(0, 0.95fr) minmax(360px, 0.8fr); gap: clamp(34px, 5vw, 78px); padding: clamp(68px, 8vw, 118px) 0; border-bottom: 1px solid var(--line); }
.about-section-image-contain .about-image { align-self: center; }
.about-section-image-contain .about-image img { height: auto; min-height: 0; aspect-ratio: 4 / 3; object-fit: contain; }
.about-number { color: var(--iee-blue); font-size: 46px; font-weight: 400; line-height: 1; }
.about-number::after { content: "\2192"; display: block; width: 52px; height: 24px; margin-top: 19px; font-family: Arial, sans-serif; font-size: 31px; font-weight: 300; line-height: 18px; transform: scaleX(0); transform-origin: left center; transition: transform 700ms cubic-bezier(.2,.75,.2,1); }
.about-number.is-arrow-visible::after { transform: scaleX(1); }
.about-content h2 { margin: 0 0 28px; color: var(--iee-blue); font-size: clamp(30px, 3vw, 48px); font-weight: 600; line-height: 1.08; }
.about-content p { margin: 0 0 22px; color: var(--muted); }
.about-content p:last-child { margin-bottom: 0; }
.open-list { margin: 0; padding: 0; list-style: none; }
.open-list li { position: relative; padding: 16px 12px 16px 34px; border-top: 1px solid var(--line); color: var(--muted); transition: transform 220ms ease, color 220ms ease, background-color 220ms ease; }
.open-list li::before { content: ""; position: absolute; top: 19px; left: 2px; width: 22px; height: 22px; background: url("../img/icons/arrow-right.svg") center / contain no-repeat; filter: brightness(0) saturate(100%) invert(22%) sepia(47%) saturate(2605%) hue-rotate(224deg) brightness(80%) contrast(91%); transition: transform 220ms ease; }
.open-list li > span { display: block; transition: transform 220ms ease; }
.open-list li:hover { color: var(--iee-blue); background: rgba(47,55,157,.035); }
.open-list li:hover > span { transform: translateX(9px); }
.open-list li:hover::before { transform: translateX(4px); }
.open-list li:last-child { border-bottom: 1px solid var(--line); }
.about-image { position: relative; }
.about-image::after { content: ""; position: absolute; inset: 14px -14px -14px 14px; z-index: -1; border-right: 4px solid var(--ribbon-mid); border-bottom: 4px solid var(--ribbon-bright); opacity: .62; }
.about-image img { width: 100%; height: 100%; min-height: 360px; object-fit: cover; }
.about-image.short img { min-height: 280px; max-height: 430px; }
.country-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 32px; }
.country-row span { position: relative; padding: 13px 20px; border: 1px solid var(--line); color: var(--iee-blue); background: var(--white); font-size: 14px; font-weight: 600; box-shadow: 0 5px 16px rgba(27,35,95,.04); transition: transform 220ms ease, color 220ms ease, border-color 220ms ease, box-shadow 220ms ease; }
.country-row span:hover { color: var(--white); border-color: var(--iee-blue); background: var(--iee-blue); box-shadow: 0 12px 24px rgba(47,55,157,.16); transform: translateY(-4px); }

.project-hero { position: relative; display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(520px, 1.1fr); min-height: 740px; color: var(--white); border-bottom: 1px solid rgba(255,255,255,.18); background: var(--iee-blue); overflow: hidden; }
.project-hero::after { content: ""; position: absolute; z-index: 3; right: -12%; bottom: -7%; width: 70%; height: 230px; pointer-events: none; background: url("../img/institutional-ribbon.svg") center / 100% 100% no-repeat; transform: rotate(-4deg); }
.project-hero-copy { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: center; padding: clamp(70px, 8vw, 140px) max(40px, calc((100vw - min(1380px, calc(100vw - 64px))) / 2)); }
.project-hero-copy .lead, .project-hero-copy .body-copy { color: #d9def2; }
.project-hero-media { position: relative; min-height: 620px; }
.project-hero-media::before { content: ""; position: absolute; z-index: 1; inset: 0 auto 0 0; width: clamp(100px, 13vw, 220px); background: linear-gradient(90deg, var(--iee-blue) 0%, rgba(47,55,157,.82) 28%, rgba(47,55,157,0) 100%); pointer-events: none; }
.project-hero-media img { width: 100%; height: 100%; object-fit: cover; }
.route-section { border-bottom: 1px solid var(--line); background: var(--white); overflow: hidden; }
.route-axis { display: grid; grid-template-columns: 1fr minmax(170px, 280px) 1fr; gap: 24px; align-items: center; padding: 38px 0 32px; color: var(--iee-blue); font-size: clamp(24px, 3vw, 42px); font-weight: 600; }
.route-axis > span:first-child { text-align: right; }
.route-ribbon { position: relative; height: 56px; overflow: hidden; }
.route-ribbon i { position: absolute; inset: 5px -42px; opacity: .72; background: url("../img/institutional-ribbon.svg") center / 100% 100% no-repeat; animation: routeRibbonFlow 4.6s ease-in-out infinite alternate; }
.route-traveler { position: absolute; z-index: 2; top: 14px; left: 0; width: 28px; height: 28px; filter: brightness(0) saturate(100%) invert(22%) sepia(47%) saturate(2605%) hue-rotate(224deg) brightness(80%) contrast(91%); opacity: 0; animation: studentJourney 9s cubic-bezier(.45,.05,.55,.95) infinite; }
.route-traveler-one { animation-delay: 0s; }
.route-traveler-two { animation-delay: -3s; }
.route-traveler-three { animation-delay: -6s; }
@keyframes routeRibbonFlow { from { transform: translateX(-18px) rotate(-1deg); } to { transform: translateX(18px) rotate(1deg); } }
@keyframes studentJourney { 0% { left: 0; opacity: 0; transform: translateY(5px); } 4% { opacity: 1; } 27% { left: calc(100% - 28px); opacity: 1; transform: translateY(-5px); } 31%, 100% { left: calc(100% - 28px); opacity: 0; transform: translateY(-5px); } }
.overview-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(380px, 0.9fr); gap: clamp(54px, 8vw, 120px); align-items: start; }
.facts { margin: 40px 0 0; }
.fact { display: grid; grid-template-columns: 200px 1fr; gap: 32px; padding: 24px 0; border-top: 1px solid var(--line); }
.fact:last-child { border-bottom: 1px solid var(--line); }
.fact dt { color: var(--iee-blue); font-weight: 600; }
.fact dd { margin: 0; color: var(--muted); }
.project-overview-section { position: relative; isolation: isolate; overflow: hidden; }
.project-overview-section::after { content: ""; position: absolute; z-index: 0; right: -18%; bottom: -70px; left: 54%; height: 210px; opacity: .42; pointer-events: none; background: url("../img/institutional-ribbon.svg") center / 100% 100% no-repeat; transform: rotate(-6deg); }
.project-overview-section > .container { position: relative; z-index: 1; }
.overview-photo { position: sticky; z-index: 0; top: 132px; margin: 0; }
.overview-photo img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: left center; }
.overview-photo figcaption { margin-top: 14px; color: var(--muted); font-size: 14px; }
.project-story { position: relative; overflow: hidden; background: var(--white); }
.project-story-intro { display: grid; grid-template-columns: minmax(0, .82fr) minmax(420px, 1.18fr); column-gap: clamp(54px, 8vw, 124px); align-items: end; }
.project-story-intro .section-label { grid-column: 1 / -1; }
.project-story-intro .lead { margin: 0; }
.project-story-flow { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(28px, 4vw, 62px) 24px; align-items: center; margin-top: clamp(70px, 9vw, 132px); }
.story-copy { color: var(--muted); font-size: clamp(18px, 1.45vw, 22px); }
.story-copy p { margin: 0 0 24px; }
.story-copy p:last-child { margin-bottom: 0; }
.story-copy-a { grid-column: 1 / span 5; }
.story-image-a { grid-column: 7 / -1; }
.story-image-b { grid-column: 1 / span 5; }
.story-copy-b { grid-column: 7 / -1; }
.story-copy-c { grid-column: 1 / span 5; }
.story-image-c { grid-column: 7 / -1; margin-top: 18px; }
.story-image { position: relative; isolation: isolate; margin: 0; overflow: visible; }
.story-image::after { content: ""; position: absolute; z-index: 0; inset: 18px -18px -18px 18px; border-right: 4px solid var(--ribbon-mid); border-bottom: 4px solid var(--ribbon-bright); opacity: .55; pointer-events: none; }
.story-image img { position: relative; z-index: 1; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.story-image figcaption { position: relative; z-index: 1; display: flex; justify-content: space-between; gap: 20px; padding-top: 16px; color: var(--iee-blue); background: var(--white); font-weight: 600; }
.story-image small { color: var(--muted); font-size: 13px; font-weight: 400; }
.partner-experience { display: block; }
.partner-experience > div { max-width: 1180px; }
.partner-list { margin-inline: clamp(10px, 1.5vw, 24px); border-top: 1px solid var(--line); }
.partner-row { display: grid; grid-template-columns: 104px minmax(0, 1fr) 28px; grid-template-areas: "country name icon" "images images images"; gap: 0 28px; align-items: center; padding: 26px clamp(14px, 1.6vw, 24px); border-bottom: 1px solid var(--line); color: inherit; text-decoration: none; transition: color 180ms ease, background-color 180ms ease; }
.partner-row span { grid-area: country; color: var(--muted); font-size: 14px; letter-spacing: 0.12em; text-transform: uppercase; }
.partner-row strong { grid-area: name; font-size: clamp(22px, 2.4vw, 34px); font-weight: 500; text-decoration: underline transparent; text-decoration-thickness: 1px; text-underline-offset: 7px; transition: color 180ms ease, text-decoration-color 180ms ease; }
.partner-row i { grid-area: icon; color: var(--iee-blue); font-style: normal; opacity: .55; transition: transform 180ms ease, opacity 180ms ease; }
.partner-row i svg { display: block; width: 22px; height: 22px; }
.partner-row:hover, .partner-row:focus-visible { background: rgba(86,133,232,.11); outline: none; }
.partner-row.is-active { color: var(--white); background: var(--iee-blue); outline: none; }
.partner-row.is-active span { color: #dfe3ff; }
.partner-row.is-active i { color: var(--white); }
.partner-row:hover i, .partner-row:focus-visible i, .partner-row.is-active i { transform: translate(3px,-3px); opacity: 1; }
.partner-row.is-expanded strong { text-decoration-color: currentColor; }
.partner-row.is-expanded:hover strong, .partner-row.is-expanded:focus-visible strong { color: var(--iee-blue); text-decoration-color: var(--iee-blue); }
.partner-row.is-active:hover strong, .partner-row.is-active:focus-visible strong { color: var(--white); text-decoration-color: var(--white); }
.partner-row-images { grid-area: images; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; max-height: 0; margin-top: 0; overflow: hidden; opacity: 0; transition: max-height 480ms cubic-bezier(.2,.75,.2,1), margin-top 320ms ease, opacity 260ms ease; }
.partner-row-images img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; background: #1a1e38; }
.partner-row.is-expanded .partner-row-images { max-height: 520px; margin-top: 28px; opacity: 1; }
.campus-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 42px 24px; margin-top: 54px; }
.campus-card { position: relative; z-index: 0; isolation: isolate; overflow: hidden; margin: 0; }
.campus-card > * { position: relative; z-index: 1; }
.campus-card:nth-child(3n + 1)::after { content: ""; position: absolute; z-index: 0; right: -18%; bottom: 54px; left: -18%; height: 74px; opacity: .24; background: url("../img/institutional-ribbon.svg") center / 100% 100% no-repeat; }
.campus-card img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; background: var(--ice); }
.campus-card figcaption { display: flex; justify-content: space-between; gap: 24px; padding-top: 16px; color: var(--iee-blue); font-weight: 600; }
.campus-card small { color: var(--muted); font-size: 13px; font-weight: 400; }
.credits { margin-top: 50px; color: var(--muted); font-size: 13px; }
.credits summary { color: var(--iee-blue); cursor: pointer; font-weight: 600; }
.credits p { max-width: 980px; }

.contact-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(380px, .88fr); min-height: calc(100svh - 104px); overflow: hidden; }
.contact-grid::after { content: ""; position: absolute; z-index: 3; right: -18%; bottom: -5%; left: 46%; height: 235px; pointer-events: none; background: url("../img/institutional-ribbon-light.svg") center / 100% 100% no-repeat; transform: rotate(-4deg); }
.contact-intro { display: flex; flex-direction: column; justify-content: center; padding: clamp(70px, 8vw, 140px) max(40px, calc((100vw - min(1380px, calc(100vw - 64px))) / 2)); }
.contact-details { display: block; margin-top: 54px; border-top: 1px solid var(--line); }
.contact-block { padding: 26px 0; border-bottom: 1px solid var(--line); }
.contact-block:nth-child(even) { padding-left: 0; border-left: 0; }
.contact-block h2 { display: flex; align-items: center; gap: 12px; margin: 0 0 12px; color: var(--iee-blue); font-size: 16px; letter-spacing: 0.12em; text-transform: uppercase; }
.contact-icon { width: 24px; height: 24px; filter: brightness(0) saturate(100%) invert(22%) sepia(47%) saturate(2605%) hue-rotate(224deg) brightness(80%) contrast(91%); }
.contact-block p { margin: 0; }
.contact-block a { color: var(--ink); text-decoration: none; }
.contact-block a:hover { color: var(--iee-blue); }
.contact-block:last-child:nth-child(odd) { grid-column: 1 / -1; padding-right: 0; }
.contact-visual { position: relative; min-height: 720px; background: var(--ink); }
.contact-visual img { width: 100%; height: 100%; object-fit: cover; opacity: 0.84; }
.contact-visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--white) 0%, rgba(255,255,255,.88) 7%, rgba(255,255,255,0) 30%), linear-gradient(to top, rgba(18,21,40,0.58), transparent 55%); }
.contact-visual-note { position: absolute; z-index: 2; right: 54px; bottom: 48px; left: 54px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,0.48); color: var(--white); font-size: 14px; letter-spacing: 0.11em; text-transform: uppercase; }

.policy { position: relative; max-width: 900px; }
.policy h2 { margin: 62px 0 18px; color: var(--iee-blue); font-size: 30px; font-weight: 600; }
.policy p, .policy li { color: var(--muted); }
.policy ul { padding-left: 22px; }

.gallery-hero { position: relative; isolation: isolate; padding: clamp(68px, 8vw, 124px) 0; overflow: hidden; color: var(--white); background: var(--iee-blue-dark); }
.gallery-hero::after { content: ""; position: absolute; z-index: -1; right: -15%; bottom: -18%; width: 72%; height: 260px; opacity: .42; background: url("../img/institutional-ribbon-light.svg") center / 100% 100% no-repeat; transform: rotate(-5deg); }
.gallery-hero-grid { display: grid; grid-template-columns: 1fr auto; gap: 60px; align-items: center; }
.gallery-hero .lead { color: #d6dcf0; }
.gallery-hero-logo { width: clamp(230px, 27vw, 420px); height: auto; opacity: .08; transform: scale(1.12); }
.gallery-toolbar { display: flex; justify-content: space-between; gap: 48px; align-items: end; }
.gallery-filters { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.gallery-filters button { padding: 11px 16px; border: 1px solid var(--line); color: var(--muted); background: var(--white); font-size: 14px; cursor: pointer; transition: color 180ms ease, border-color 180ms ease, background-color 180ms ease; }
.gallery-filters button:hover, .gallery-filters button:focus-visible, .gallery-filters button.is-active { border-color: var(--iee-blue); color: var(--white); background: var(--iee-blue); outline: none; }
.gallery-carousel { position: relative; display: grid; grid-template-columns: 64px minmax(0, 1fr) 64px; gap: 22px; align-items: center; margin-top: 68px; }
.gallery-carousel:focus-visible { outline: 2px solid var(--iee-blue); outline-offset: 10px; }
.carousel-viewport { min-width: 0; overflow: hidden; background: var(--ice); box-shadow: var(--shadow); }
.carousel-track { position: relative; min-height: clamp(560px, 54vw, 760px); }
.gallery-slide { position: absolute; inset: 0; display: grid; grid-template-columns: 1fr; margin: 0; visibility: hidden; opacity: 0; transform: translateX(34px); transition: opacity 360ms ease, transform 420ms cubic-bezier(.2,.75,.2,1), visibility 0s linear 420ms; }
.gallery-slide[hidden] { display: none; }
.gallery-slide.is-active { position: relative; visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
.gallery-slide.is-leaving { visibility: visible; opacity: 0; transform: translateX(-34px); }
.gallery-slide-media { display: grid; place-items: center; height: clamp(520px, 49vw, 720px); min-height: 0; overflow: hidden; background: #e9edf5; }
.gallery-slide-media img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; object-position: center; }
.gallery-slide-portrait-fit .gallery-slide-media img { width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
.gallery-slide-fit-height .gallery-slide-media img { display: block; width: auto; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; object-position: center; }
.gallery-slide-align-center .gallery-slide-media img { object-position: center; }
.gallery-slide-align-top .gallery-slide-media img { object-position: center top; }
.gallery-slide-align-bottom .gallery-slide-media img { object-position: center bottom; }
.gallery-slide figcaption { position: relative; display: flex; align-items: center; min-height: 84px; padding: 22px clamp(26px, 4vw, 52px); color: var(--white); background: var(--iee-blue-dark); overflow: hidden; }
.gallery-slide figcaption::after { content: ""; position: absolute; right: -10%; bottom: -30px; width: 42%; height: 90px; opacity: .16; background: url("../img/institutional-ribbon-light.svg") center / 100% 100% no-repeat; }
.gallery-slide figcaption strong { position: relative; z-index: 1; font-size: clamp(22px, 2.4vw, 34px); font-weight: 600; line-height: 1.1; }
.carousel-arrow { display: grid; place-items: center; width: 64px; height: 64px; padding: 0; border: 1px solid var(--iee-blue); color: var(--iee-blue); background: var(--white); cursor: pointer; transition: color 180ms ease, background-color 180ms ease, transform 180ms ease; }
.carousel-arrow:hover, .carousel-arrow:focus-visible { color: var(--white); background: var(--iee-blue); outline: none; }
.carousel-arrow:active { transform: scale(.96); }
.carousel-arrow span { display: block; width: 30px; height: 22px; font-family: Arial, sans-serif; font-size: 31px; font-weight: 300; line-height: 19px; }
.carousel-arrow span::before { content: "\2192"; }
.carousel-arrow-prev span { transform: rotate(180deg); }
.carousel-status { grid-column: 2; display: grid; grid-template-columns: auto 1fr; gap: 24px; align-items: center; padding-top: 22px; color: var(--iee-blue); font-size: 13px; font-weight: 600; letter-spacing: .12em; }
.carousel-progress { height: 2px; overflow: hidden; background: var(--line); }
.carousel-progress i { display: block; width: 3.45%; height: 100%; background: var(--iee-blue); transform-origin: left; transition: width 420ms cubic-bezier(.2,.75,.2,1); }

.site-footer { color: var(--white); background: var(--ink); }
.footer-inner { width: var(--page); margin: 0 auto; display: grid; grid-template-columns: 1.25fr 0.9fr 0.55fr; gap: 54px; padding: 68px 0 46px; }
.footer-brand .brand-name { color: var(--white); text-decoration-color: var(--white); font-size: 18px; }
.footer-brand p { max-width: 430px; margin: 28px 0 0; color: #aeb7cf; font-size: 15px; }
.footer-title { margin: 0 0 18px; color: #aeb7cf; font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; }
.footer-list { margin: 0; padding: 0; list-style: none; }
.footer-list li + li { margin-top: 9px; }
.footer-contact-item { display: flex; align-items: center; gap: 10px; }
.footer-contact-item img { flex: 0 0 auto; width: 19px; height: 19px; filter: brightness(0) invert(1); opacity: .82; }
.footer-list a { color: var(--white); text-decoration: none; }
.footer-list a:hover { color: #aebcff; }
.footer-bottom { width: var(--page); margin: 0 auto; display: flex; justify-content: space-between; gap: 24px; padding: 22px 0 28px; border-top: 1px solid rgba(255,255,255,0.16); color: #919bb4; font-size: 13px; }

.reveal { opacity: 0; transform: translateY(28px); transition: opacity 650ms ease, transform 650ms ease; }
.reveal.is-visible { opacity: 1; transform: none; }

@media (max-width: 1120px) {
  :root { --page: min(100% - 44px, 1080px); }
  .header-inner { min-height: 92px; }
  .brand img { width: 58px; height: 58px; }
  .site-nav { gap: 22px; }
  .home-panorama-hero { min-height: calc(100svh - 92px); }
  .panorama-heading { width: min(520px, 48vw); }
  .panorama-panel { width: calc(100% - 42px); }
  .mission-item { padding-right: 28px; }
  .mission-item + .mission-item { padding-left: 28px; }
  .about-section { grid-template-columns: 78px 1fr 0.72fr; }
  .project-hero { grid-template-columns: 0.95fr 1.05fr; }
}

@media (max-width: 900px) {
  body { font-size: 17px; }
  .nav-toggle { display: block; }
  .site-nav { position: fixed; inset: 92px 0 auto; height: calc(100svh - 92px); display: flex; flex-direction: column; align-items: flex-start; gap: 0; padding: 34px 24px 60px; background: var(--white); visibility: hidden; pointer-events: none; transform: translateX(100%); transition: transform 220ms ease, visibility 0s linear 220ms; }
  .menu-open .site-nav { visibility: visible; pointer-events: auto; transform: none; transition-delay: 0s; }
  .site-nav a { width: 100%; padding: 20px 0; border-bottom: 1px solid var(--line); font-size: 24px; }
  .site-nav a::after { display: none; }
  .project-hero { grid-template-columns: 1fr; }
  .project-hero-copy { min-height: 560px; padding: 84px 28px; }
  .project-hero::after { right: -22%; bottom: -7%; left: -22%; width: auto; height: 190px; }
  .project-hero-media { min-height: 520px; }
  .project-hero-media::before { inset: 0 0 auto; width: auto; height: 120px; background: linear-gradient(180deg, var(--iee-blue) 0%, rgba(47,55,157,.58) 38%, rgba(47,55,157,0) 100%); }
  .home-panorama-hero { display: flex; flex-direction: column; padding-bottom: 78px; }
  .panorama-heading { position: relative; top: auto; left: auto; order: 1; width: auto; padding: 68px 28px; transform: none; background: var(--iee-blue-dark); }
  .panorama-heading h1 { font-size: clamp(54px, 9vw, 72px); }
  .panorama-media { order: 2; height: auto; aspect-ratio: 16 / 10; }
  .panorama-media::after { display: none; }
  .panorama-media img { object-position: center; }
  .panorama-panel { order: 3; width: calc(100% - 56px); margin: -44px 28px 0; padding: 38px 34px 46px; }
  .panorama-panel::after { display: none; }
  .mission-grid { grid-template-columns: 1fr; }
  .mission-item, .mission-item + .mission-item { padding: 36px 0; border-left: 0; }
  .mission-item + .mission-item { border-top: 1px solid var(--line); }
  .panorama-statement { max-width: 100%; }
  .split-feature, .split-feature.reverse, .project-preview, .page-hero-grid, .overview-grid, .contact-grid { grid-template-columns: 1fr; }
  .split-feature.reverse .feature-media { order: 0; }
  .feature-media { min-height: 460px; }
  .feature-copy { padding: 70px 28px; }
  .project-preview-media { margin: 22px 18px; }
  .project-preview-media img { aspect-ratio: 16 / 10; }
  .activity-strip { grid-template-columns: 1fr 1fr; }
  .about-section { grid-template-columns: 72px 1fr; }
  .about-image { grid-column: 2; }
  .about-image img { max-height: 500px; }
  .overview-photo { position: static; }
  .overview-photo img { aspect-ratio: 16 / 10; }
  .project-overview-section::after { right: -24%; bottom: 4%; left: 42%; height: 180px; }
  .project-story-intro { grid-template-columns: 1fr; }
  .project-story-intro .lead { margin-top: 28px; }
  .story-copy-a, .story-image-a, .story-image-b, .story-copy-b, .story-copy-c, .story-image-c { grid-column: 1 / -1; }
  .story-image-a { grid-row: 2; }
  .story-copy-a { grid-row: 1; }
  .story-image-b { grid-row: 3; }
  .story-copy-b { grid-row: 4; }
  .story-copy-c { grid-row: 5; }
  .story-image-c { grid-row: 6; }
  .partner-row { grid-template-columns: 92px minmax(0, 1fr) 24px; }
  .gallery-toolbar { align-items: flex-start; flex-direction: column; }
  .gallery-filters { justify-content: flex-start; }
  .gallery-carousel { grid-template-columns: 52px minmax(0, 1fr) 52px; gap: 14px; }
  .carousel-arrow { width: 52px; height: 52px; }
  .carousel-track { min-height: 0; }
  .gallery-slide { grid-template-columns: 1fr; }
  .gallery-slide-media { height: 480px; min-height: 0; }
  .gallery-slide figcaption { min-height: 82px; }
  .contact-intro { padding: 86px 28px; }
  .contact-visual { min-height: 520px; }
  .contact-visual::after { background: linear-gradient(180deg, var(--white) 0%, rgba(255,255,255,.86) 7%, rgba(255,255,255,0) 30%), linear-gradient(to top, rgba(18,21,40,0.58), transparent 55%); }
  .footer-inner { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
  :root { --page: calc(100% - 36px); }
  .header-inner { min-height: 78px; gap: 12px; }
  .brand { gap: 11px; }
  .brand img { width: 46px; height: 46px; }
  .site-header .brand-name {
    max-width: none;
    white-space: nowrap;
    font-size: clamp(8.5px, 2.65vw, 12px);
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
  }
  .site-footer .brand-name {
    max-width: none;
    white-space: nowrap;
    font-size: clamp(10px, 3.1vw, 13px);
    text-decoration-thickness: 2px;
    text-underline-offset: 5px;
  }
  .nav-toggle { width: 44px; height: 44px; }
  .site-nav { inset: 78px 0 auto; height: calc(100svh - 78px); }
  .section { padding: 76px 0; }
  .section-tight { padding: 58px 0; }
  .display-title { font-size: clamp(52px, 16vw, 76px); }
  .page-title, .project-title { font-size: clamp(48px, 14vw, 72px); }
  .section-title { font-size: 40px; }
  .lead { font-size: 20px; }
  .project-hero-copy { min-height: 530px; padding: 68px 18px; }
  .project-hero::after { right: -38%; bottom: -2%; left: -38%; width: auto; height: 145px; opacity: .82; }
  .project-hero-media { min-height: 360px; }
  .home-panorama-hero { padding-bottom: 58px; }
  .panorama-heading { padding: 50px 18px 46px; }
  .panorama-heading h1 { font-size: clamp(44px, 13vw, 60px); line-height: .99; }
  .panorama-media { aspect-ratio: 1.38 / 1; }
  .panorama-panel { width: calc(100% - 36px); margin: -28px 18px 0; padding: 30px 22px 34px; border-top-width: 5px; }
  .panorama-panel::before { right: -76px; width: 280px; opacity: .035; }
  .panorama-panel .org-title { font-size: clamp(21px, 6.8vw, 28px); line-height: 1.42; }
  .panorama-statement { margin-top: 26px; font-size: 20px; }
  .panorama-actions { flex-direction: column; gap: 14px; margin-top: 30px; }
  .hero-action { width: 100%; min-width: 0; padding: 16px 20px; font-size: 17px; }
  .feature-media { min-height: 350px; }
  .project-preview-media { margin: 18px 10px; }
  .project-preview-media::before { inset: -12px 24% 12px -12px; }
  .project-preview-media::after { inset: 12px -10px -10px 22%; }
  .activity-strip, .campus-grid { grid-template-columns: 1fr; }
  .page-hero-grid { gap: 54px; }
  .page-hero-media::before { inset: -14px 18% 14px -14px; }
  .page-hero::after { right: -38%; bottom: -24px; left: -38%; width: auto; height: 140px; opacity: .52; }
  .page-hero-media img { aspect-ratio: 4 / 3; }
  .about-section { grid-template-columns: 46px 1fr; gap: 22px; }
  .about-number { font-size: 30px; }
  .about-number::after { width: 28px; margin-top: 14px; }
  .about-image { grid-column: 1 / -1; }
  .about-image::after { inset: 10px -8px -8px 10px; border-width: 3px; }
  .country-row span { padding: 10px 12px; font-size: 12px; }
  .route-axis { grid-template-columns: 1fr 90px 1fr; gap: 12px; padding-block: 30px; font-size: 22px; }
  .route-ribbon { height: 50px; }
  .route-ribbon i { inset-inline: -26px; }
  .country-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fact { grid-template-columns: 1fr; gap: 7px; padding: 20px 0; }
  .partner-row { grid-template-columns: 1fr; gap: 8px; }
  .campus-card figcaption { flex-direction: column; gap: 4px; }
  .contact-details { grid-template-columns: 1fr; }
  .contact-block, .contact-block:nth-child(even) { padding: 24px 0; border-left: 0; }
  .contact-visual { min-height: 430px; }
  .project-overview-section::after { right: -38%; bottom: 3%; left: -38%; height: 150px; opacity: .36; }
  .project-story-flow { grid-template-columns: 1fr; gap: 48px; }
  .story-image::after { inset: 10px -8px -8px 10px; border-width: 3px; }
  .story-image figcaption { flex-direction: column; gap: 4px; }
  .partner-list { margin-inline: 8px; }
  .partner-row { grid-template-columns: 74px minmax(0, 1fr) 18px; gap: 0 14px; padding: 22px 12px; }
  .partner-row span { font-size: 11px; }
  .partner-row strong { font-size: 20px; line-height: 1.15; }
  .partner-row-images { grid-template-columns: 1fr; gap: 12px; }
  .partner-row.is-expanded .partner-row-images { max-height: 900px; margin-top: 22px; }
  .gallery-hero-grid { grid-template-columns: 1fr; gap: 44px; }
  .gallery-hero-logo { justify-self: end; width: min(68vw, 300px); margin-top: -24px; }
  .gallery-filters { gap: 8px; }
  .gallery-filters button { padding: 9px 11px; font-size: 12px; }
  .gallery-carousel { grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 48px; }
  .carousel-viewport { grid-column: 1 / -1; }
  .carousel-arrow-prev { grid-column: 1; grid-row: 2; justify-self: start; }
  .carousel-arrow-next { grid-column: 2; grid-row: 2; justify-self: end; }
  .carousel-status { grid-column: 1 / -1; grid-row: 3; padding-top: 8px; }
  .gallery-slide-media { height: 300px; min-height: 0; aspect-ratio: auto; }
  .gallery-slide figcaption { min-height: 76px; padding: 20px 24px; }
  .gallery-slide figcaption strong { font-size: 23px; }
  .contact-grid::after { right: -38%; bottom: 0; left: -38%; width: auto; height: 150px; opacity: .66; }
  .contact-visual-note { right: 22px; bottom: 24px; left: 22px; }
  .footer-inner { grid-template-columns: 1fr; gap: 38px; padding-top: 54px; }
  .footer-brand { grid-column: auto; }
  .footer-bottom { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  .reveal { opacity: 1; transform: none; }
  .section-label::before { transform: scaleX(1); }
  .about-number::after { transform: scaleX(1); }
  .route-ribbon i, .route-traveler { animation: none; }
}