:root {
  --navy: #173452;
  --navy-deep: #102a45;
  --teal: #3f9c8f;
  --teal-soft: #e8f6f2;
  --cream: #faf8f2;
  --card: #fbf8f1;
  --text: #2d3c4f;
  --muted: #68798b;
  --line: #e6e0d6;
  --white: #fff;
  --max: 1860px;
  --page-pad: clamp(24px, 4vw, 80px);
  --shadow: 0 8px 30px rgba(20, 44, 70, .08);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: Inter, sans-serif; color: var(--text); background: var(--white); }
a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; }
.container {
  width: 100%;
  max-width: var(--max);
  margin-inline: auto;
  padding-inline: var(--page-pad);
}

.site-header { position: sticky; top: 0; z-index: 100; background: rgba(255,255,255,.96); border-top: 3px solid #222; border-bottom: 1px solid #eee9e1; backdrop-filter: blur(10px); }
.nav-wrap {
  min-height: 84px;
  display: grid;
  grid-template-columns: minmax(330px, 420px) 1fr auto;
  align-items: center;
  gap: clamp(24px, 3vw, 60px);
}
.brand {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
  color: var(--navy);
}
.brand-logo {
  width: clamp(170px, 11vw, 215px);
  height: auto;
  flex: 0 0 auto;
}
.brand-divider {
  width: 1px;
  height: 38px;
  background: #d9dfe3;
  flex: 0 0 1px;
}
.brand-project {
  font-family: "Source Serif 4", serif;
  font-weight: 700;
  font-size: clamp(23px, 1.55vw, 31px);
  letter-spacing: -.03em;
  color: var(--navy-deep);
  white-space: nowrap;
}
.main-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: clamp(22px, 2.15vw, 42px);
  font-size: clamp(13px, .82vw, 15px);
  font-weight: 600;
  color: var(--navy-deep);
  white-space: nowrap;
}
.main-nav a { min-height: 84px; display: grid; place-items: center; border-bottom: 2px solid transparent; }
.main-nav a.active { color: var(--teal); border-color: var(--teal); }
.nav-actions { display: flex; align-items: center; justify-content: flex-end; gap: 18px; flex: 0 0 auto; min-width: max-content; }
.language-switch { display: inline-flex; flex: 0 0 auto; gap: 6px; align-items: center; font-size: 11px; white-space: nowrap; }
.language-switch button { border: 0; padding: 0; background: transparent; color: #9aa6b1; cursor: pointer; flex: 0 0 auto; min-width: 22px; white-space: nowrap; overflow-wrap: normal; word-break: normal; }
.language-switch span { flex: 0 0 auto; white-space: nowrap; }
.language-switch .current { color: var(--navy-deep); font-weight: 700; }
.login-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; flex: 0 0 auto; min-width: max-content; white-space: nowrap; background: var(--navy-deep); color: #fff; font-weight: 600; font-size: 13px; line-height: 1.15; padding: 10px 16px; border-radius: 4px; }
.login-btn span { display: inline-block; white-space: nowrap; }

.hero { position: relative; overflow: hidden; background: var(--cream); padding: clamp(70px, 5.2vw, 112px) 0 clamp(78px, 5.5vw, 116px); }
.dot-grid { position: absolute; inset: 0; opacity: .22; background-image: radial-gradient(#9a9a87 1px, transparent 1px); background-size: 18px 18px; }
.hero-grid {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: clamp(64px, 6vw, 130px);
  align-items: center;
}
.hero-copy { max-width: 690px; }
.eyebrow { display: inline-flex; background: #ddf3ec; color: #2f8e81; border-radius: 999px; padding: 7px 14px; font-size: 11px; font-weight: 700; letter-spacing: .13em; }
h1, h2, h3 { margin-top: 0; color: var(--navy-deep); }
h1, h2 { font-family: "Source Serif 4", serif; }
h1 { margin: 20px 0 18px; font-size: clamp(48px, 4.15vw, 78px); line-height: 1.04; letter-spacing: -.035em; }
h1 span { color: var(--teal); }
.hero-copy > p { max-width: 650px; font-size: clamp(15px, .95vw, 18px); line-height: 1.72; color: #536477; }
.hero-actions { display: flex; gap: 12px; margin-top: 34px; }
.btn { min-height: 48px; padding: 0 24px; display: inline-flex; align-items: center; justify-content: center; border-radius: 4px; font-weight: 700; font-size: 14px; }
.btn.primary { background: var(--navy-deep); color: #fff; }
.btn.secondary { border: 1px solid #748697; background: rgba(255,255,255,.55); }
.hero-visual { position: relative; }
.hero-visual img { height: clamp(430px, 31vw, 590px); object-fit: cover; border-radius: 16px; box-shadow: var(--shadow); }
.stat { position: absolute; background: white; border: 1px solid #ded8ce; border-radius: 12px; padding: 14px 18px; box-shadow: var(--shadow); min-width: 138px; display: flex; flex-direction: column; }
.stat small { color: #7e878f; font-size: 11px; }
.stat strong { font-family: "Source Serif 4", serif; color: var(--navy-deep); font-size: 20px; margin: 4px 0 2px; }
.stat span { color: var(--teal); font-size: 10px; }
.stat-top { top: -18px; right: -16px; }
.stat-bottom { bottom: -18px; left: -18px; }

.section { padding: clamp(64px, 4.5vw, 92px) 0; }
.section h2, .audience-section h2, .why-section h2 { font-size: 32px; margin-bottom: 34px; }
.card-grid { display: grid; gap: 22px; }
.card-grid.three { grid-template-columns: repeat(3, 1fr); }
.card-grid.four { grid-template-columns: repeat(4, 1fr); }
.info-card { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: clamp(26px, 2vw, 38px); min-height: 200px; }
.info-card .icon { font-size: 30px; margin-bottom: 16px; }
.info-card h3 { color: var(--teal); margin-bottom: 10px; }
.info-card p { margin: 0; font-size: 14px; line-height: 1.65; color: #5d6b78; }

.why-section { background: var(--navy); padding: 74px 0; color: #c7d9eb; }
.why-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(60px, 6vw, 128px); align-items: center; }
.why-section h2 { color: white; }
.reason { display: flex; gap: 16px; margin: 24px 0; }
.reason-icon { width: 42px; height: 42px; flex: 0 0 42px; border-radius: 50%; background: #274c70; display: grid; place-items: center; }
.reason h3 { color: #58baaa; margin: 0 0 4px; }
.reason p { margin: 0; color: #a9c1d7; font-size: 14px; line-height: 1.55; }
.why-image img { height: clamp(390px, 28vw, 540px); object-fit: cover; border-radius: 12px; }

.audience-section { padding: 60px 0; background: #e5f5f1; text-align: center; }
.audience-card { min-height: 132px; background: #fff; border: 1px solid #cfe2dc; box-shadow: 0 3px 10px rgba(24,59,73,.05); border-radius: 10px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; color: var(--navy-deep); }
.audience-card span { font-size: 28px; }
.audience-card strong { font-size: 13px; }

.section-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.section-head a, .text-link, .news-card a { color: var(--teal); font-weight: 700; font-size: 13px; }
.news-card { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: white; }
.news-card > img { height: 190px; object-fit: cover; }
.news-body { padding: 18px 20px 20px; }
.meta { display: flex; align-items: center; gap: 10px; color: #89949d; font-size: 10px; }
.tag { display: inline-flex; background: #e5f5f1; color: var(--teal); border-radius: 999px; padding: 5px 8px; font-weight: 700; }
.tag.beige { background: #f0ebe0; color: #9f8052; }
.news-card h3 { margin: 13px 0 9px; font-family: "Source Serif 4", serif; font-size: 18px; }
.news-card p { margin: 0 0 17px; font-size: 13px; line-height: 1.65; color: #63707d; }

.partners-strip { background: var(--cream); padding: 46px 0; text-align: center; border-top: 1px solid #ece6dc; }
.kicker { font-size: 10px; letter-spacing: .22em; color: #8a8176; font-weight: 700; margin-bottom: 28px; }
.partner-list { display: flex; justify-content: center; flex-wrap: wrap; gap: 16px; margin-bottom: 24px; }
.partner-list span { background: #fff; border: 1px solid #ded8cf; border-radius: 6px; padding: 11px 22px; min-width: 88px; font-size: 12px; font-weight: 700; color: var(--navy-deep); }

.eu-bar { background: #0f2a47; color: #fff; border-bottom: 1px solid #35506b; }
.eu-bar-inner { min-height: 70px; display: grid; grid-template-columns: 42px auto 1fr; gap: 14px; align-items: center; }
.eu-mark { width: 38px; height: 38px; border-radius: 50%; background: #2472bb; display: grid; place-items: center; font-size: 12px; }
.eu-bar strong { font-size: 12px; }
.eu-bar p { margin: 0; color: #8398ad; font-size: 11px; }

.site-footer { background: var(--navy); color: #a8bbce; }
.footer-grid { display: grid; grid-template-columns: 1.25fr repeat(3, 1fr); gap: 76px; padding: 48px 0 58px; }
.footer-brand { font-family: "Source Serif 4", serif; color: #fff; font-size: 25px; font-weight: 700; }
.site-footer p { font-size: 12px; line-height: 1.7; }
.site-footer h4 { color: #718aa3; text-transform: uppercase; letter-spacing: .14em; font-size: 10px; margin: 5px 0 18px; }
.site-footer a { display: block; font-size: 12px; margin: 10px 0; }
.socials { display: flex; gap: 8px; }
.socials a { width: 30px; height: 30px; display: grid; place-items: center; background: #2b4c6c; border-radius: 3px; color: white; }
.footer-bottom { border-top: 1px solid #35506b; color: #667f98; font-size: 10px; }
.footer-bottom .container { height: 56px; display: flex; justify-content: space-between; align-items: center; }

@media (max-width: 1180px) {
  .nav-wrap { grid-template-columns: 1fr auto; }
  .main-nav { display: none; }
  .hero-grid, .why-grid { grid-template-columns: 1fr; gap: 42px; }
  .hero-copy { max-width: none; }
  .card-grid.three { grid-template-columns: 1fr; }
  .card-grid.four { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: repeat(2, 1fr); gap: 40px; }
}

@media (max-width: 640px) {
  :root { --page-pad: 18px; }
  .site-header { position: static; }
  .nav-wrap { height: auto; min-height: 76px; padding-top: 10px; padding-bottom: 10px; grid-template-columns: 1fr auto; }
  .brand { gap: 9px; }
  .brand-logo { width: 138px; }
  .brand-divider { height: 30px; }
  .brand-project { font-size: 21px; }
  .language-switch { display: none; }
  .login-btn span { display: none; }
  .hero { padding: 54px 0 72px; }
  h1 { font-size: 42px; }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .hero-visual img { height: 330px; }
  .stat-top { right: 8px; }
  .stat-bottom { left: 8px; }
  .card-grid.four, .footer-grid { grid-template-columns: 1fr; }
  .section-head { align-items: flex-start; flex-direction: column; }
  .eu-bar-inner { grid-template-columns: 42px 1fr; padding: 14px 0; }
  .eu-bar p { grid-column: 1 / -1; }
  .footer-bottom .container { height: auto; padding: 18px 0; align-items: flex-start; gap: 12px; flex-direction: column; }
}


/* =========================================
   OVER MATER
   ========================================= */
.about-inner {
  width: min(100%, 1500px);
  margin-inline: auto;
}

.about-hero {
  background: var(--navy);
  color: #b9cee1;
  padding: clamp(64px, 5.5vw, 112px) 0;
}

.about-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  align-items: center;
  gap: clamp(60px, 7vw, 140px);
}

.about-hero-copy {
  max-width: 690px;
}

.eyebrow-dark {
  color: #62c1b0;
  background: rgba(78, 177, 159, .15);
}

.about-hero h1 {
  color: #fff;
  margin: 18px 0 24px;
  font-size: clamp(46px, 4vw, 74px);
  line-height: 1.02;
}

.about-hero p {
  margin: 0;
  max-width: 680px;
  color: #a9c0d5;
  font-size: clamp(15px, .95vw, 18px);
  line-height: 1.9;
}

.about-hero-image img {
  height: clamp(370px, 27vw, 520px);
  object-fit: cover;
  object-position: center;
  border-radius: 14px;
  box-shadow: 0 18px 50px rgba(4, 22, 40, .18);
}

.about-overview {
  background: var(--cream);
  padding: clamp(58px, 4.5vw, 92px) 0;
}

.about-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 26px;
}

.about-card {
  min-height: 205px;
  padding: clamp(26px, 2.2vw, 42px);
  background: #fff;
  border: 1px solid #ddd8cf;
  border-radius: 12px;
  box-shadow: 0 3px 14px rgba(27, 50, 73, .035);
}

.about-card p {
  margin: 18px 0 0;
  font-size: 14px;
  line-height: 1.9;
  color: #5d6c7c;
}

.mini-label {
  display: inline-flex;
  padding: 6px 11px;
  border-radius: 4px;
  font-size: 10px;
  line-height: 1;
  letter-spacing: .08em;
  font-weight: 800;
}

.label-blue { background: #e3f0f8; color: #337ca8; }
.label-green { background: #e2f5ef; color: #318c7f; }
.label-sand { background: #f4eee2; color: #987744; }
.label-coral { background: #fae9e5; color: #c57667; }

.workpackages-section {
  padding: clamp(70px, 5vw, 110px) 0;
  background: #fff;
}

.workpackages-section h2,
.budget-section h2 {
  font-size: clamp(30px, 2vw, 38px);
  margin-bottom: 44px;
}

.wp-timeline {
  position: relative;
  max-width: 1050px;
}

.wp-timeline::before {
  content: "";
  position: absolute;
  top: 26px;
  bottom: 28px;
  left: 26px;
  width: 1px;
  background: #cdd9d6;
}

.wp-item {
  position: relative;
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 26px;
  align-items: start;
  padding-bottom: 34px;
}

.wp-item:last-child { padding-bottom: 0; }

.wp-badge {
  position: relative;
  z-index: 2;
  width: 54px;
  height: 54px;
  border: 2px solid var(--teal);
  background: #fff;
  color: var(--teal);
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 11px;
  font-weight: 800;
}

.wp-copy {
  padding-top: 4px;
}

.wp-copy h3 {
  margin: 0 0 7px;
  font-family: "Source Serif 4", serif;
  font-size: 20px;
}

.wp-copy p {
  margin: 0;
  color: #637282;
  font-size: 13px;
  line-height: 1.65;
}

.budget-section {
  background: #e5f5f1;
  padding: clamp(60px, 4.5vw, 88px) 0;
}

.budget-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
}

.budget-card {
  min-height: 118px;
  background: #fff;
  border: 1px solid #c9ded9;
  border-radius: 11px;
  padding: 25px 27px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.budget-card span {
  color: #7f898f;
  font-size: 10px;
  letter-spacing: .045em;
  font-weight: 700;
  margin-bottom: 10px;
}

.budget-card strong {
  color: var(--navy-deep);
  font-family: "Source Serif 4", serif;
  font-size: clamp(17px, 1vw, 21px);
  line-height: 1.3;
}

@media (max-width: 1180px) {
  .about-hero-grid {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .about-hero-copy {
    max-width: 820px;
  }

  .about-card-grid {
    grid-template-columns: 1fr;
  }

  .budget-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .about-hero {
    padding: 54px 0 64px;
  }

  .about-hero h1 {
    font-size: 44px;
  }

  .about-hero-image img {
    height: 310px;
  }

  .about-card {
    padding: 24px;
    min-height: 0;
  }

  .wp-item {
    gap: 18px;
  }

  .wp-copy h3 {
    font-size: 18px;
  }

  .budget-grid {
    grid-template-columns: 1fr;
  }
}


/* =========================================
   PARTNERS
   ========================================= */
.partners-inner {
  width: min(100%, 1500px);
  margin-inline: auto;
}

.partners-intro {
  background: var(--cream);
  padding: clamp(68px, 5vw, 112px) 0 clamp(64px, 4.8vw, 102px);
}

.partners-intro h1 {
  margin: 22px 0 25px;
  color: var(--navy-deep);
  font-size: clamp(48px, 4vw, 72px);
  line-height: 1.02;
}

.partners-intro p {
  max-width: 810px;
  margin: 0;
  color: #607284;
  font-size: clamp(15px, .92vw, 18px);
  line-height: 1.9;
}

.project-partners-section {
  background: #fff;
  padding: clamp(62px, 4.7vw, 96px) 0 clamp(76px, 5vw, 110px);
}

.project-partners-section h2,
.associated-section h2 {
  margin: 0 0 38px;
  color: var(--navy-deep);
  font-size: clamp(29px, 2vw, 38px);
}

.project-partners-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.partner-card {
  min-height: 174px;
  display: grid;
  grid-template-columns: 58px 1fr;
  gap: 22px;
  padding: 28px 30px 25px;
  background: var(--cream);
  border: 1px solid #ddd8cf;
  border-radius: 12px;
  box-shadow: 0 3px 14px rgba(27, 50, 73, .025);
}

.partner-number {
  width: 54px;
  height: 54px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  background: var(--navy-deep);
  color: #fff;
  font-weight: 700;
  font-size: 15px;
}

.partner-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 9px;
}

.partner-title-row h3 {
  margin: 0;
  color: var(--navy-deep);
  font-family: "Source Serif 4", serif;
  font-size: clamp(17px, 1.05vw, 21px);
  line-height: 1.3;
}

.partner-code {
  padding: 4px 7px;
  border-radius: 4px;
  background: #e7e5df;
  color: #708090;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 9px;
  font-weight: 600;
}

.partner-country {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 17px;
  font-size: 11px;
  color: #6a7988;
}

.partner-country strong {
  color: var(--navy-deep);
  font-size: 10px;
}

.partner-content p {
  margin: 0 0 10px;
  color: #667687;
  font-size: 12px;
  line-height: 1.55;
}

.partner-budget {
  color: var(--teal);
  font-size: 11px;
  font-weight: 700;
}

.associated-section {
  background: var(--cream);
  padding: clamp(64px, 4.5vw, 94px) 0 clamp(70px, 5vw, 106px);
}

.associated-section h2 {
  margin-bottom: 12px;
}

.associated-intro {
  margin: 0 0 38px;
  color: #8a8178;
  font-size: 14px;
}

.associated-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.associated-card {
  min-height: 96px;
  display: flex;
  align-items: flex-start;
  gap: 17px;
  padding: 24px 25px;
  background: #fff;
  border: 1px solid #ddd8cf;
  border-radius: 10px;
}

.associated-card span {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  margin-top: 2px;
  border-radius: 50%;
  background: var(--teal);
}

.associated-card p {
  margin: 0;
  color: var(--navy-deep);
  font-size: 13px;
  line-height: 1.5;
}

@media (max-width: 1100px) {
  .project-partners-grid {
    grid-template-columns: 1fr;
  }

  .associated-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .partners-intro h1 {
    font-size: 46px;
  }

  .partner-card {
    grid-template-columns: 46px 1fr;
    gap: 17px;
    padding: 22px 20px;
  }

  .partner-number {
    width: 44px;
    height: 44px;
  }

  .associated-grid {
    grid-template-columns: 1fr;
  }

  .associated-card {
    min-height: 0;
  }
}


/* =========================================
   SHARED INNER PAGE LAYOUT
   ========================================= */
.content-inner {
  width: min(100%, 1500px);
  margin-inline: auto;
}

.page-hero-dark {
  background: var(--navy);
  color: #fff;
  padding: clamp(62px, 5vw, 108px) 0;
}

.page-hero-dark h1 {
  margin: 20px 0 0;
  color: #fff;
  font-size: clamp(46px, 4vw, 72px);
  line-height: 1.03;
}

.contact-hero p {
  max-width: 610px;
  margin: 22px 0 0;
  color: #a9c0d5;
  line-height: 1.7;
  font-size: 15px;
}

/* =========================================
   NEWS & ACTIVITIES
   ========================================= */
.news-list-section {
  background: var(--cream);
  padding: clamp(46px, 4vw, 80px) 0 44px;
}

.news-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 38px;
}

.filter-btn {
  appearance: none;
  border: 1px solid #d9d4ca;
  background: #fff;
  color: var(--navy-deep);
  border-radius: 999px;
  padding: 11px 20px;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: .18s ease;
}

.filter-btn:hover,
.filter-btn.active {
  background: var(--navy-deep);
  border-color: var(--navy-deep);
  color: #fff;
}

.news-page-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
}

.news-page-card {
  overflow: hidden;
  background: #fff;
  border: 1px solid #dcd8d0;
  border-radius: 10px;
  box-shadow: 0 2px 10px rgba(25, 49, 73, .025);
}

.news-page-card[hidden] {
  display: none;
}

.news-page-card img {
  width: 100%;
  height: clamp(190px, 15vw, 270px);
  object-fit: cover;
  display: block;
}

.news-page-body {
  padding: 22px 22px 25px;
}

.news-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  color: #7a8187;
  font-size: 10px;
  margin-bottom: 14px;
}

.news-tag {
  padding: 5px 8px;
  border-radius: 999px;
  font-weight: 700;
}

.tag-research { background: #e7f3fb; color: #4085aa; }
.tag-workshop { background: #f6efe0; color: #a17c38; }
.tag-dashboard { background: #e6f5ee; color: #3b947b; }

.news-page-body h2 {
  margin: 0 0 13px;
  font-size: 18px;
  line-height: 1.35;
}

.news-page-body p {
  margin: 0 0 18px;
  color: #657585;
  font-size: 12px;
  line-height: 1.75;
}

.news-page-body a {
  color: var(--teal);
  font-size: 11px;
  font-weight: 700;
}

.social-cta {
  margin-top: 48px;
  padding: 38px 24px;
  text-align: center;
  background: #fff;
  border: 1px solid #dad6ce;
  border-radius: 10px;
}

.social-cta h2 {
  margin: 0 0 9px;
  font-size: 22px;
}

.social-cta p {
  margin: 0 0 22px;
  color: #657585;
  font-size: 12px;
}

.linkedin-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 20px;
  border-radius: 5px;
  background: #1768b7;
  color: #fff !important;
  font-size: 12px;
  font-weight: 700;
}

/* =========================================
   CONTACT
   ========================================= */
.contact-section {
  background: var(--cream);
  padding: clamp(52px, 4.5vw, 88px) 0 clamp(70px, 5vw, 110px);
}

.contact-inner {
  width: min(100%, 1300px);
  margin-inline: auto;
  display: grid;
  grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr);
  gap: 38px;
  align-items: start;
}

.contact-side {
  display: grid;
  gap: 20px;
}

.contact-info-card,
.contact-form {
  background: #fff;
  border: 1px solid #d9d5cc;
  border-radius: 10px;
}

.contact-info-card {
  padding: 28px;
}

.contact-info-card h2 {
  margin: 0 0 24px;
  font-size: 19px;
}

.contact-line {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  margin: 17px 0;
  color: var(--navy-deep);
}

.contact-line:hover {
  color: var(--teal);
}

.contact-icon {
  flex: 0 0 20px;
  width: 20px;
  color: #806b99;
  text-align: center;
}

.contact-line div {
  display: grid;
  gap: 3px;
}

.contact-line strong,
.contact-line span {
  font-size: 12px;
}

.contact-line small {
  color: #8a9199;
  font-size: 10px;
}

.social-card h2 {
  margin-bottom: 16px;
}

.contact-socials {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.contact-socials a {
  margin: 0;
  padding: 10px 14px;
  border-radius: 4px;
  background: #1768b7;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
}

.contact-form {
  padding: clamp(28px, 2.5vw, 42px);
}

.contact-form label {
  display: grid;
  gap: 8px;
  margin-bottom: 21px;
}

.contact-form label > span {
  color: var(--navy-deep);
  font-size: 11px;
  font-weight: 700;
}

.form-two {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.contact-form input,
.contact-form textarea {
  width: 100%;
  border: 1px solid #d7d4cd;
  border-radius: 6px;
  background: #fff;
  color: var(--navy-deep);
  font: inherit;
  font-size: 14px;
  padding: 12px 13px;
  outline: none;
  transition: border-color .16s ease, box-shadow .16s ease;
}

.contact-form input {
  min-height: 45px;
}

.contact-form textarea {
  resize: vertical;
  min-height: 150px;
}

.contact-form input:focus,
.contact-form textarea:focus {
  border-color: var(--teal);
  box-shadow: 0 0 0 3px rgba(55, 151, 136, .1);
}

.contact-submit {
  width: 100%;
  min-height: 48px;
  border: 0;
  border-radius: 6px;
  background: var(--navy-deep);
  color: #fff;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.contact-submit:hover {
  filter: brightness(1.08);
}

.form-note {
  margin: 12px 0 0;
  min-height: 18px;
  color: #687887;
  font-size: 10px;
  line-height: 1.5;
}

@media (max-width: 1050px) {
  .news-page-grid {
    grid-template-columns: 1fr;
  }

  .news-page-card {
    display: grid;
    grid-template-columns: minmax(240px, .9fr) minmax(0, 1.1fr);
  }

  .news-page-card img {
    height: 100%;
    min-height: 260px;
  }

  .contact-inner {
    grid-template-columns: 1fr;
  }

  .contact-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .page-hero-dark h1 {
    font-size: 43px;
  }

  .news-page-card {
    display: block;
  }

  .news-page-card img {
    height: 220px;
    min-height: 0;
  }

  .contact-side,
  .form-two {
    grid-template-columns: 1fr;
  }
}


/* =========================================
   LOGIN
   ========================================= */
.login-page {
  min-height: 100vh;
  background: var(--cream);
}

.login-main {
  min-height: calc(100vh - 72px);
  background: var(--cream);
}

.login-shell {
  min-height: calc(100vh - 72px);
  display: grid;
  place-items: center;
  padding: clamp(58px, 8vh, 110px) 24px;
}

.login-content {
  width: min(100%, 520px);
  text-align: center;
}

.login-icon {
  width: 58px;
  height: 58px;
  margin: 0 auto 22px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: var(--navy-deep);
  color: #fff;
  font-size: 23px;
}

.login-content h1 {
  margin: 0 0 10px;
  color: var(--navy-deep);
  font-family: "Source Serif 4", serif;
  font-size: clamp(32px, 2.5vw, 40px);
}

.login-intro {
  width: min(100%, 430px);
  margin: 0 auto 30px;
  color: #687887;
  font-size: 13px;
  line-height: 1.7;
}

.login-form {
  width: min(100%, 440px);
  margin-inline: auto;
  padding: 30px;
  background: #fff;
  border: 1px solid #ddd8cf;
  border-radius: 12px;
  text-align: left;
  box-shadow: 0 3px 16px rgba(25, 49, 73, .035);
}

.login-form label {
  display: grid;
  gap: 8px;
  margin-bottom: 18px;
}

.login-form label > span {
  color: var(--navy-deep);
  font-size: 11px;
  font-weight: 700;
}

.login-form input {
  width: 100%;
  min-height: 46px;
  border: 1px solid #d7d3ca;
  border-radius: 6px;
  background: #fff;
  color: var(--navy-deep);
  font: inherit;
  font-size: 13px;
  padding: 12px 14px;
  outline: none;
}

.login-form input:focus {
  border-color: var(--teal);
  box-shadow: 0 0 0 3px rgba(55, 151, 136, .1);
}

.login-submit {
  width: 100%;
  min-height: 46px;
  border: 0;
  border-radius: 6px;
  background: var(--navy-deep);
  color: #fff;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.forgot-link {
  display: block;
  margin-top: 19px;
  text-align: center;
  color: #8a8f95;
  font-size: 10px;
}

.login-help {
  margin: 20px auto 0;
  color: #8a8f95;
  font-size: 10px;
  line-height: 1.6;
}

.login-help a {
  color: var(--teal);
  font-weight: 700;
}

.login-message {
  min-height: 16px;
  margin: 14px 0 0;
  color: #657585;
  font-size: 10px;
  line-height: 1.5;
  text-align: center;
}

.active-login {
  box-shadow: 0 0 0 2px rgba(55, 151, 136, .18);
}

@media (max-width: 700px) {
  .login-shell {
    place-items: start center;
    padding-top: 70px;
  }

  .login-form {
    padding: 24px 20px;
  }
}

.portal-page{background:#f5f2ec;min-height:100vh}.portal-layout{display:grid;grid-template-columns:270px 1fr;min-height:calc(100vh - 72px)}
.portal-sidebar{background:#193556;color:#fff;display:flex;flex-direction:column;min-height:calc(100vh - 72px)}
.portal-sidebar-brand{padding:24px;border-bottom:1px solid #ffffff20}.portal-sidebar-brand strong{font-family:"Source Serif 4",serif;font-size:22px;display:block}.portal-sidebar-brand span{color:#68c6b4;font-size:11px}
.portal-nav{padding:16px 0}.portal-nav a{display:flex;gap:12px;align-items:center;padding:14px 20px;color:#bed0e0;font-size:12px;border-left:3px solid transparent}.portal-nav a:hover,.portal-nav a.active{background:#ffffff12;color:#fff}.portal-nav a.active{border-left-color:#48b9a6;font-weight:700}
.portal-user{margin-top:auto;padding:18px;border-top:1px solid #ffffff20;display:grid;grid-template-columns:36px 1fr;gap:10px}.portal-avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#4eb8a6;font-weight:800}.portal-user strong,.portal-user span{display:block;font-size:10px}.portal-user span{color:#7fd3c3;margin-top:3px}.portal-logout{grid-column:1/-1;border:1px solid #ffffff25;color:#bed0e0;text-align:center;padding:9px;border-radius:5px;font-size:10px}
.portal-main{min-width:0}.portal-topbar{background:#fff;border-bottom:1px solid #dedbd4;padding:16px 34px;display:flex;justify-content:space-between;align-items:center}.portal-topbar span{font-size:9px;letter-spacing:.1em;color:#998f83;font-weight:800}.portal-topbar h1{font-size:17px;margin:5px 0 0}.secure-pill{background:#e5f5ef;color:#398b78;padding:8px 12px;border-radius:999px;font-size:10px}
.portal-content{width:min(100%,1320px);padding:28px 34px 60px}.portal-intro-card,.portal-panel,.portal-stats article{background:#fff;border:1px solid #ddd9d1;border-radius:12px}
.portal-intro-card{display:flex;gap:18px;padding:24px}.portal-intro-icon{width:54px;height:54px;border-radius:13px;background:#ebf8ef;display:grid;place-items:center;font-size:24px}.portal-intro-card h2{font-size:22px;margin:2px 0 8px}.portal-intro-card p{font-size:12px;color:#657585;line-height:1.7;margin:0}
.portal-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:18px 0}.portal-stats article{padding:16px 18px}.portal-stats span,.portal-stats strong{display:block}.portal-stats span{font-size:9px;color:#8a929a;text-transform:uppercase}.portal-stats strong{font-family:"Source Serif 4",serif;font-size:17px;margin-top:6px}
.portal-grid{display:grid;grid-template-columns:1fr 300px;gap:18px}.portal-panel{padding:22px}.portal-panel-head{display:flex;justify-content:space-between;gap:16px;margin-bottom:16px}.portal-panel-head h2{font-size:18px;margin:0 0 4px}.portal-panel-head p{font-size:10px;color:#8a929a;margin:0}.count-pill{background:#e9f8ec;color:#4ca268;border-radius:999px;padding:7px 10px;font-size:9px}
.document-row{display:grid;grid-template-columns:42px 1fr auto 28px;gap:12px;align-items:center;padding:15px 0;border-top:1px solid #eeeae3}.file-icon{width:38px;height:38px;border-radius:8px;display:grid;place-items:center;font-size:8px;font-weight:800}.file-icon.pdf{background:#fff0ed;color:#ca6e5e}.file-icon.doc{background:#eef3fb;color:#557eb4}.document-copy strong,.document-copy span{display:block}.document-copy strong{font-size:11px}.document-copy span{font-size:9px;color:#93999f;margin-top:4px}.doc-tag{background:#e8f5f0;color:#438f7f;border-radius:999px;padding:6px 9px;font-size:9px}.document-row button{border:0;background:none;color:#89929a}
.activity-list>div{display:grid;grid-template-columns:8px 1fr;gap:10px;margin:16px 0}.activity-list b{width:8px;height:8px;background:#4eb8a6;border-radius:50%;margin-top:5px}.activity-list p{margin:0}.activity-list strong,.activity-list span{display:block;font-size:10px}.activity-list span{font-size:8px;color:#979da3;margin-top:4px}
.upload-panel{margin-top:18px}.upload-dropzone{min-height:190px;border:2px dashed #d8d3cb;border-radius:10px;display:grid;place-items:center;align-content:center;gap:7px;text-align:center;cursor:pointer}.upload-dropzone.dragging,.upload-dropzone:hover{border-color:#4eb8a6;background:#f8fffc}.upload-icon{font-size:28px}.upload-dropzone strong{font-size:12px}.upload-dropzone>span:not(.upload-icon):not(.upload-button){font-size:9px;color:#92989e}.upload-button{margin-top:6px;padding:9px 14px;background:#fff;border:1px solid #d6d2ca;border-radius:6px;font-size:10px;font-weight:700}.upload-preview{display:grid;gap:8px;margin-top:10px}.upload-preview-item{padding:10px;background:#edf7f3;color:#4e7168;border-radius:6px;font-size:10px}
@media(max-width:1050px){.portal-layout{grid-template-columns:220px 1fr}.portal-grid{grid-template-columns:1fr}.activity-panel{display:none}}
@media(max-width:800px){.portal-layout{display:block}.portal-sidebar{min-height:auto}.portal-sidebar-brand,.portal-user{display:none}.portal-nav{display:flex;overflow-x:auto;padding:0}.portal-nav a{flex:0 0 auto;border-left:0;border-bottom:3px solid transparent;white-space:nowrap}.portal-nav a.active{border-bottom-color:#48b9a6}.portal-content{padding:22px 20px 50px}.portal-stats{grid-template-columns:1fr}}


/* Content verification additions */
.audience-card small {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 500;
}

.empty-news-state,
.news-empty-page {
  display: flex;
  align-items: center;
  gap: 22px;
  padding: 34px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--white);
}

.empty-news-icon,
.news-empty-page > span {
  font-size: 32px;
}

.empty-news-state h3,
.news-empty-page h2 {
  margin: 0 0 8px;
}

.empty-news-state p,
.news-empty-page p {
  margin: 0;
  color: var(--muted);
  line-height: 1.7;
}

.news-empty-page {
  grid-column: 1 / -1;
  display: block;
  text-align: center;
  padding: 52px 30px;
}

.news-empty-page > span {
  display: block;
  margin-bottom: 12px;
}

.project-identity-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
  margin-top: 22px;
}

.project-identity-grid .identity-wide {
  grid-column: 1 / -1;
}

.identity-card {
  min-height: 132px;
}

.contact-pending {
  margin-top: 20px;
  padding: 14px;
  border-radius: 8px;
  background: var(--cream);
}

.contact-pending strong {
  font-size: 12px;
}

.contact-pending p,
.pending-channels {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.6;
}

@media (max-width: 700px) {
  .project-identity-grid {
    grid-template-columns: 1fr;
  }
  .project-identity-grid .identity-wide {
    grid-column: auto;
  }
  .empty-news-state {
    align-items: flex-start;
  }
}


/* =========================================
   MULTILINGUAL SWITCH
   ========================================= */
.language-switch button {
  border: 0;
  background: transparent;
  color: #98a2ab;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  padding: 4px 3px;
  flex: 0 0 auto;
  min-width: 22px;
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
  transition: color .15s ease;
}

.language-switch button:hover {
  color: var(--teal);
}

.language-switch button.current {
  color: var(--navy-deep);
  font-weight: 800;
}


/* =========================================
   COMPLETE MULTILINGUAL LAYOUT
   ========================================= */
html[lang="fr"] .main-nav,
html[lang="en"] .main-nav {
  gap: clamp(16px, 1.7vw, 28px);
}

html[lang="fr"] .main-nav a,
html[lang="en"] .main-nav a {
  white-space: nowrap;
}

html[lang="fr"] .hero-copy h1,
html[lang="en"] .hero-copy h1 {
  max-width: 760px;
}

@media (max-width: 1180px) {
  html[lang="fr"] .main-nav a,
  html[lang="en"] .main-nav a {
    font-size: 12px;
  }
}

/* =========================================
   HEADER PROJECT LOGO
   The project logo is used as supplied and is not altered.
   ========================================= */
.mater-brand-logo {
  width: clamp(125px, 8.6vw, 168px);
  height: auto;
  max-height: 58px;
  display: block;
  flex: 0 0 auto;
}

@media (max-width: 980px) {
  .brand-logo { width: 150px; }
  .mater-brand-logo { width: 118px; }
}

@media (max-width: 640px) {
  .brand-logo { width: 108px; }
  .mater-brand-logo { width: 88px; max-height: 44px; }
  .brand-divider { height: 30px; }
}


/* =========================================
   RESPONSIVE NAVIGATION + PARTNER LOGOS
   ========================================= */
body { overflow-wrap: anywhere; }
button, input, textarea, select { font: inherit; }

.mobile-menu-toggle,
.mobile-nav-panel { display: none; }

.partner-card {
  position: relative;
  grid-template-columns: minmax(145px, 180px) minmax(0, 1fr);
  align-items: stretch;
  min-height: 230px;
  overflow: hidden;
  background: #fff;
  padding: 0;
  gap: 0;
}

.partner-number {
  position: absolute;
  z-index: 2;
  top: 14px;
  right: 14px;
  width: 34px;
  height: 34px;
  border-radius: 9px;
  font-size: 11px;
  box-shadow: 0 4px 14px rgba(16,42,69,.12);
}

.partner-logo {
  min-height: 230px;
  display: grid;
  place-items: center;
  padding: 28px 22px;
  background: #fff;
  border-right: 1px solid var(--line);
  overflow: hidden;
}

.partner-logo img {
  width: 100%;
  height: 112px;
  object-fit: contain;
  object-position: center;
}

.partner-logo-fallback {
  display: none;
  min-width: 90px;
  min-height: 62px;
  padding: 12px;
  place-items: center;
  text-align: center;
  border-radius: 8px;
  background: var(--teal-soft);
  color: var(--navy-deep);
  font-weight: 800;
  font-size: 14px;
}

.partner-logo.logo-load-failed img { display: none; }
.partner-logo.logo-load-failed .partner-logo-fallback { display: grid; }

.partner-content {
  min-width: 0;
  padding: 30px 30px 26px;
  display: flex;
  flex-direction: column;
}

.partner-title-row { padding-right: 34px; }
.partner-title-row h3 a:hover { color: var(--teal); }
.partner-content p { font-size: 13px; line-height: 1.65; }

.partner-card-footer {
  margin-top: auto;
  padding-top: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.partner-website-link {
  color: var(--navy-deep);
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.partner-website-link:hover { color: var(--teal); }

.partner-logo-note {
  margin: 22px 0 0;
  max-width: 900px;
  color: #7a8793;
  font-size: 11px;
  line-height: 1.65;
}

/* Fluid media and content everywhere. */
iframe, video, svg { max-width: 100%; }
input, textarea, select { max-width: 100%; }
.hero-grid > *, .why-grid > *, .about-hero-grid > *, .contact-inner > *,
.project-partners-grid > *, .footer-grid > * { min-width: 0; }

@media (max-width: 1180px) {
  .site-header { position: sticky; }
  .nav-wrap {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    min-height: 78px;
  }
  .main-nav { display: none; }
  .nav-actions { gap: 12px; }
  .mobile-menu-toggle {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 10px;
    border: 1px solid #dfe4e8;
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
  }
  .mobile-menu-toggle span {
    display: block;
    width: 21px;
    height: 2px;
    margin: 2px 0;
    border-radius: 999px;
    background: var(--navy-deep);
    transition: transform .18s ease, opacity .18s ease;
  }
  .mobile-menu-toggle.is-open span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .mobile-menu-toggle.is-open span:nth-child(2) { opacity: 0; }
  .mobile-menu-toggle.is-open span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

  .mobile-nav-panel {
    display: block;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    max-height: calc(100dvh - 78px);
    overflow-y: auto;
    padding: 12px var(--page-pad) 22px;
    border-top: 1px solid #eee9e1;
    border-bottom: 1px solid #dfe5e8;
    background: rgba(255,255,255,.99);
    box-shadow: 0 16px 34px rgba(16,42,69,.12);
  }
  .mobile-nav-panel[hidden] { display: none !important; }
  .mobile-main-nav { display: grid; }
  .mobile-main-nav a {
    display: flex;
    align-items: center;
    min-height: 50px;
    padding: 8px 4px;
    border-bottom: 1px solid #edf0f2;
    color: var(--navy-deep);
    font-weight: 700;
    font-size: 14px;
  }
  .mobile-main-nav a.active { color: var(--teal); }
  .mobile-nav-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 14px;
    padding-top: 18px;
  }
  .mobile-nav-actions .language-switch { display: flex !important; font-size: 12px; }
  .mobile-nav-actions .login-btn { display: inline-flex !important; }
  .mobile-nav-actions .login-btn span { display: inline !important; }
  body.mobile-nav-lock { overflow: hidden; }

  .project-partners-grid { grid-template-columns: 1fr; }
  .partner-card { grid-template-columns: minmax(150px, 190px) minmax(0,1fr); }
}

@media (max-width: 900px) {
  :root { --page-pad: clamp(20px, 4.5vw, 40px); }
  .brand-logo { width: 145px; }
  .mater-brand-logo { width: 110px; }
  .brand { gap: 10px; }
  .nav-actions > .language-switch { display: none; }

  .hero-grid, .why-grid, .about-hero-grid, .contact-inner { grid-template-columns: 1fr; }
  .hero-copy, .about-hero-copy { max-width: none; }
  .hero-visual { max-width: 760px; width: 100%; margin-inline: auto; }
  .why-image { max-width: 760px; width: 100%; margin-inline: auto; }
  .about-hero-image { max-width: 760px; width: 100%; margin-inline: auto; }
  .footer-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 36px; }

  .associated-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .budget-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .news-page-grid { grid-template-columns: 1fr; }
  .news-page-card { display: grid; grid-template-columns: minmax(220px,.8fr) minmax(0,1.2fr); }
  .news-page-card img { height: 100%; min-height: 260px; }
}

@media (max-width: 640px) {
  :root { --page-pad: 16px; }
  html { scroll-padding-top: 76px; }
  .site-header { position: sticky; }
  .nav-wrap { min-height: 72px; padding-top: 8px; padding-bottom: 8px; }
  .brand-logo { width: 96px; }
  .mater-brand-logo { width: 76px; max-height: 40px; }
  .brand-divider { height: 28px; }
  .nav-actions > .login-btn { display: none; }
  .mobile-menu-toggle { width: 42px; height: 42px; }
  .mobile-nav-panel { max-height: calc(100dvh - 72px); }

  h1 { font-size: clamp(38px, 12vw, 48px); overflow-wrap: normal; }
  .page-hero-dark h1, .partners-intro h1, .about-hero h1 { font-size: clamp(38px, 11vw, 48px); }
  .section, .project-partners-section, .associated-section, .contact-section { padding-top: 50px; padding-bottom: 50px; }
  .hero { padding: 46px 0 62px; }
  .hero-actions { gap: 10px; }
  .btn { width: 100%; }
  .hero-visual img, .why-image img, .about-hero-image img { height: 300px; }
  .stat { min-width: 118px; padding: 11px 13px; }
  .stat strong { font-size: 17px; }

  .card-grid.three, .card-grid.four, .about-card-grid,
  .associated-grid, .budget-grid, .form-two, .contact-side { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: 26px; }

  .partner-card {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .partner-logo {
    min-height: 150px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
    padding: 22px 54px 18px 22px;
  }
  .partner-logo img { height: 92px; }
  .partner-content { padding: 22px 20px; }
  .partner-title-row { padding-right: 0; }
  .partner-card-footer { align-items: flex-start; flex-direction: column; gap: 8px; }
  .partner-number { top: 12px; right: 12px; }

  .associated-card { padding: 19px 18px; }
  .news-page-card { display: block; }
  .news-page-card img { height: 210px; min-height: 0; }
  .news-filters { gap: 8px; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 6px; scrollbar-width: thin; }
  .filter-btn { flex: 0 0 auto; }
  .contact-form, .contact-info-card { padding: 22px 18px; }
  .eu-bar-inner { grid-template-columns: 38px 1fr; }
  .footer-bottom .container { padding-inline: var(--page-pad); }
}

@media (max-width: 380px) {
  .brand-logo { width: 84px; }
  .mater-brand-logo { width: 66px; }
  .brand { gap: 7px; }
  .brand-divider { height: 24px; }
  .mobile-menu-toggle { width: 40px; height: 40px; }
  .nav-wrap { gap: 8px; }
  .partner-logo { padding-left: 16px; padding-right: 50px; }
}


/* =========================================
   INTERREG + SOCIAL + CONTACT BACKEND
   ========================================= */
.interreg-brand-link,
.mater-brand-link {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
}

.interreg-brand-link {
  border-radius: 6px;
  outline-offset: 4px;
}

.interreg-brand-link:hover .brand-logo,
.interreg-brand-link:focus-visible .brand-logo {
  opacity: .82;
}

.eu-program-link {
  justify-self: end;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.footer-socials {
  display: flex;
  gap: 8px;
  margin-top: 18px;
}

.footer-socials a {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 5px;
  background: #2b4c6c;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
}

.public-email-link {
  display: inline-block;
  margin-top: 8px;
  color: var(--teal);
  font-weight: 700;
  font-size: 12px;
}

.pending-channels {
  margin: 12px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.6;
}

.form-honeypot {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

.contact-submit:disabled {
  opacity: .62;
  cursor: wait;
}

@media (max-width: 980px) {
  .eu-program-link {
    grid-column: 1 / -1;
    justify-self: start;
  }
}


/* =========================================
   FINAL INTERREG + MOBILE SPACING FIX
   ========================================= */

/* Keep the Interreg CTA on one clean line on desktop. */
.eu-bar-inner {
  grid-template-columns: 42px auto minmax(0, 1fr) auto;
  column-gap: 16px;
  row-gap: 10px;
  padding-block: 12px;
}

.eu-program-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: end;
  width: max-content;
  max-width: 100%;
  min-height: 34px;
  padding: 8px 12px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 6px;
  color: #fff;
  background: rgba(255,255,255,.06);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s ease, border-color .15s ease, transform .15s ease;
}

.eu-program-link:hover,
.eu-program-link:focus-visible {
  color: #fff;
  background: rgba(255,255,255,.13);
  border-color: rgba(255,255,255,.38);
  transform: translateY(-1px);
}

/* Tablet: put the CTA on a dedicated line instead of squeezing it. */
@media (max-width: 980px) {
  .eu-bar-inner {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .eu-bar p,
  .eu-program-link {
    grid-column: 1 / -1;
  }

  .eu-program-link {
    justify-self: start;
  }
}

/* Phone spacing: keep content away from both screen edges. */
@media (max-width: 640px) {
  :root {
    --page-pad: 22px;
  }

  body {
    overflow-x: hidden;
  }

  .container {
    padding-inline: var(--page-pad);
  }

  .eu-bar-inner {
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 12px 14px;
    padding-top: 18px;
    padding-bottom: 18px;
  }

  .eu-mark {
    width: 40px;
    height: 40px;
  }

  .eu-bar strong {
    align-self: center;
    font-size: 12px;
    line-height: 1.4;
  }

  .eu-bar p {
    grid-column: 1 / -1;
    font-size: 11px;
    line-height: 1.6;
  }

  .eu-program-link {
    grid-column: 1 / -1;
    justify-self: start;
    min-height: 38px;
    padding: 10px 13px;
    font-size: 11px;
  }

  .footer-grid {
    padding-top: 38px;
    padding-bottom: 42px;
    gap: 30px;
  }

  .footer-grid > div {
    min-width: 0;
  }

  .site-footer p,
  .site-footer a {
    overflow-wrap: anywhere;
  }

  .site-footer h4 {
    margin-bottom: 14px;
  }

  .footer-bottom .container {
    padding: 18px var(--page-pad);
    gap: 10px;
  }
}

@media (max-width: 380px) {
  :root {
    --page-pad: 18px;
  }
}


/* =========================================
   ASSOCIATED PARTNER LOGO CARDS
   ========================================= */
.associated-card {
  min-height: 122px;
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  align-items: center;
  gap: 18px;
  padding: 18px 20px;
}

.associated-card > span {
  display: none;
}

.associated-logo {
  width: 96px;
  height: 72px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid #e6e1d9;
  border-radius: 9px;
  background: #fff;
}

.associated-logo img {
  display: block;
  width: 100%;
  height: 100%;
  padding: 7px;
  object-fit: contain;
}

.associated-copy {
  min-width: 0;
}

.associated-copy p {
  margin: 0 0 10px;
  color: var(--navy-deep);
  font-size: 13px;
  line-height: 1.5;
}

.associated-website-link {
  display: inline-flex;
  color: var(--teal);
  font-size: 10px;
  font-weight: 700;
}

@media (max-width: 700px) {
  .associated-card {
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 15px;
    padding: 16px;
  }

  .associated-logo {
    width: 82px;
    height: 64px;
  }

  .associated-copy p {
    font-size: 12px;
  }
}


/* =========================================
   DYNAMIC EXAMPLE NEWS
   ========================================= */
.news-page-card {
  overflow: hidden;
}

.news-page-card > img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: #eef3f2;
}

.news-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.example-badge {
  display: inline-flex;
  padding: 4px 7px;
  border-radius: 999px;
  background: #fff1df;
  color: #a46024;
  font-size: 9px;
  font-weight: 800;
}

.news-details {
  margin-top: 14px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.news-details summary {
  cursor: pointer;
  color: var(--teal);
  font-size: 11px;
  font-weight: 700;
}

.news-details p {
  margin-top: 10px;
}

/* Simple script-managed homepage news */
.home-news-grid {
  margin-top: 24px;
}

.home-news-empty {
  grid-column: 1 / -1;
}

/* =========================================
   FOOTER BOTTOM SAFE SPACING
   Keep the copyright bar away from the very bottom edge on all screens.
   ========================================= */
.footer-bottom {
  padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px));
}

@media (max-width: 640px) {
  .footer-bottom {
    padding-bottom: calc(22px + env(safe-area-inset-bottom, 0px));
  }
}


/* =========================================
   2026-10 MEDIA / LOGO PRESENTATION FIX
   Keep photographic subjects and partner logos fully visible.
   ========================================= */
.hero-visual,
.about-hero-image,
.why-image {
  min-width: 0;
}

.hero-visual img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  object-position: center;
}

.about-hero-image {
  width: 100%;
  max-width: 760px;
  justify-self: end;
}

.about-hero-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center;
}

.why-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  object-position: center;
}

/* Project partners: never crop a logo, regardless of source aspect ratio. */
.partner-logo {
  padding: 24px 18px;
  overflow: visible;
}

.partner-logo img {
  width: auto !important;
  height: auto !important;
  max-width: min(142px, 88%) !important;
  max-height: 104px !important;
  object-fit: contain !important;
  object-position: center !important;
}

/* Associated partners: give wordmarks and tall marks more breathing room. */
.associated-card {
  grid-template-columns: 122px minmax(0, 1fr);
  gap: 20px;
}

.associated-logo {
  width: 122px;
  height: 86px;
  padding: 10px;
  overflow: visible;
}

.associated-logo img {
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 64px !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
}

@media (max-width: 700px) {
  .hero-visual img,
  .about-hero-image img,
  .why-image img {
    aspect-ratio: 16 / 10;
  }

  .associated-card {
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 16px;
  }

  .associated-logo {
    width: 96px;
    height: 72px;
    padding: 8px;
  }

  .associated-logo img {
    max-height: 54px !important;
  }

  .partner-logo img {
    max-width: min(128px, 88%) !important;
    max-height: 92px !important;
  }
}


/* =========================================
   PEOPLE PAGE
   ========================================= */
.people-hero {
  background: var(--navy);
  color: #d6e4ef;
  padding: clamp(64px, 5vw, 96px) 0;
}
.people-hero-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(300px, .7fr);
  align-items: end;
  gap: clamp(42px, 6vw, 100px);
}
.people-hero h1 {
  color: #fff;
  margin: 18px 0 16px;
  font-size: clamp(46px, 4vw, 72px);
}
.people-hero p {
  max-width: 760px;
  margin: 0;
  color: #b9cad9;
  font-size: clamp(15px, 1vw, 18px);
  line-height: 1.75;
}
.people-hero-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.people-hero-facts > div {
  min-height: 124px;
  padding: 22px;
  border: 1px solid #365775;
  border-radius: 12px;
  background: rgba(255,255,255,.04);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.people-hero-facts strong {
  color: #fff;
  font-family: "Source Serif 4", serif;
  font-size: 34px;
  line-height: 1;
}
.people-hero-facts span {
  margin-top: 8px;
  color: #78c9bb;
  font-size: 11px;
  font-weight: 700;
}
.people-section {
  padding: clamp(64px, 5vw, 96px) 0;
  background: var(--cream);
}
.people-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 30px;
  margin-bottom: 34px;
}
.people-section-head h2 {
  margin: 5px 0 8px;
  font-size: clamp(30px, 2.4vw, 42px);
}
.people-section-head p {
  max-width: 780px;
  margin: 0;
  color: #6c7780;
  font-size: 14px;
  line-height: 1.7;
}
.people-kicker { margin-bottom: 0; text-align: left; }
.people-email-pill {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid #cfdcd7;
  border-radius: 999px;
  background: #fff;
  color: var(--teal);
  font-size: 12px;
  font-weight: 700;
}
.people-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}
.people-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(18,52,77,.045);
}
.people-photo {
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: #e8f1ef;
}
.people-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 22%;
}
.people-placeholder {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 70% 20%, rgba(75,168,151,.20), transparent 34%),
    linear-gradient(145deg, #e8f3f0, #f5f1e9);
}
.people-placeholder span {
  width: 92px;
  height: 92px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--navy);
  color: #fff;
  font-family: "Source Serif 4", serif;
  font-size: 28px;
  font-weight: 700;
  letter-spacing: .04em;
}
.people-card-body { padding: 22px 22px 24px; }
.people-organisation {
  min-height: 32px;
  margin: 0 0 9px;
  color: var(--teal);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
  line-height: 1.5;
}
.people-card h2 {
  margin: 0 0 16px;
  font-family: "Source Serif 4", serif;
  font-size: 23px;
  line-height: 1.15;
}
.people-role,
.people-function {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 8px;
  margin: 8px 0;
  color: #4f5f6e;
  font-size: 12px;
  line-height: 1.5;
}
.people-role span,
.people-function span {
  color: #8b969e;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.people-contact {
  display: inline-block;
  margin-top: 16px;
  color: var(--teal);
  font-size: 11px;
  font-weight: 700;
}
.people-photo-note {
  margin-top: 30px;
  padding: 18px 20px;
  border: 1px solid #d7e5e0;
  border-radius: 10px;
  background: #f4fbf8;
}
.people-photo-note strong {
  color: var(--navy-deep);
  font-size: 12px;
}
.people-photo-note p {
  margin: 6px 0 0;
  color: #6e7d78;
  font-size: 12px;
  line-height: 1.6;
}
.people-contact-band {
  padding: 52px 0;
  background: #e5f5f1;
}
.people-contact-band-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}
.people-contact-band h2 {
  margin: 6px 0 8px;
  font-size: clamp(28px, 2.2vw, 38px);
}
.people-contact-band p {
  margin: 0;
  color: #5f716e;
  font-size: 13px;
}
@media (max-width: 1040px) {
  .people-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .people-hero-inner { grid-template-columns: 1fr; }
  .people-hero-facts { max-width: 520px; }
}
@media (max-width: 640px) {
  .people-grid { grid-template-columns: 1fr; }
  .people-section-head,
  .people-contact-band-inner { align-items: flex-start; flex-direction: column; }
  .people-hero-facts { grid-template-columns: 1fr 1fr; width: 100%; }
  .people-hero-facts > div { min-height: 106px; }
  .people-photo { aspect-ratio: 4 / 3; }
  .people-photo img { object-position: center 20%; }
}


/* People/header v2: keep locale and login controls on one line. */
@media (min-width: 1181px) {
  .nav-wrap { grid-template-columns: minmax(300px, 400px) minmax(0, 1fr) max-content; gap: clamp(18px, 2.2vw, 42px); }
  .main-nav { min-width: 0; gap: clamp(14px, 1.55vw, 30px); }
  .nav-actions, .language-switch, .login-btn { white-space: nowrap; }
}


/* PEOPLE LAYOUT SAFETY OVERRIDES v6.2 */
.people-section .people-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 20px !important;
}
.people-section .people-card {
  display: block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  border-radius: 14px !important;
}
.people-section .people-photo {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  height: auto !important;
  overflow: hidden !important;
}
.people-section .people-photo > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center 22% !important;
}
.people-section .people-placeholder {
  width: 100% !important;
  height: 100% !important;
}
.people-section .people-card-body {
  padding: 22px 22px 24px !important;
}
@media (max-width: 1040px) {
  .people-section .people-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 640px) {
  .people-section .people-grid {
    grid-template-columns: 1fr !important;
  }
  .people-section .people-photo {
    aspect-ratio: 4 / 3 !important;
  }
}


/* FOOTER EDGE-SAFE SPACING v6.3 */
/*
  Footer content must always keep visible breathing room from the viewport.
  This deliberately overrides older desktop/mobile footer rules.
*/
.site-footer {
  box-sizing: border-box;
}

.site-footer > .container,
.site-footer .footer-bottom > .container {
  width: 100% !important;
  max-width: var(--max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: max(28px, env(safe-area-inset-left, 0px)) !important;
  padding-right: max(28px, env(safe-area-inset-right, 0px)) !important;
  box-sizing: border-box !important;
}

.footer-bottom {
  padding-top: 0 !important;
  padding-bottom: calc(28px + env(safe-area-inset-bottom, 0px)) !important;
}

.footer-bottom > .container {
  min-height: 72px !important;
  height: auto !important;
  padding-top: 22px !important;
  padding-bottom: 22px !important;
}

@media (max-width: 640px) {
  .site-footer > .container,
  .site-footer .footer-bottom > .container {
    padding-left: max(22px, env(safe-area-inset-left, 0px)) !important;
    padding-right: max(22px, env(safe-area-inset-right, 0px)) !important;
  }

  .footer-bottom {
    padding-bottom: calc(30px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .footer-bottom > .container {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
}

@media (max-width: 380px) {
  .site-footer > .container,
  .site-footer .footer-bottom > .container {
    padding-left: max(18px, env(safe-area-inset-left, 0px)) !important;
    padding-right: max(18px, env(safe-area-inset-right, 0px)) !important;
  }
}