/* =========================
   Page Header (internal)
========================= */
.page-header .section-eyebrow{
  background:rgba(255,255,255,.15);
  color:#fff;
  border:1px solid rgba(255,255,255,.25);
}

/* =========================
   Mission / Vision / Values
========================= */
.mission-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:26px;
}
.mission-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:36px 30px;
  transition:var(--transition);
  position:relative;
  overflow:hidden;
}
.mission-card::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:4px;
  background:linear-gradient(90deg,var(--primary),var(--secondary));
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .4s ease;
}
.mission-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-lg);
  border-color:transparent;
}
.mission-card:hover::before{transform:scaleX(1)}
.mission-icon{
  width:64px;height:64px;
  border-radius:18px;
  background:linear-gradient(135deg,var(--primary-light),#fff);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--primary);
  font-size:1.6rem;
  margin-bottom:20px;
  border:1px solid var(--border);
}
.mission-card:nth-child(2) .mission-icon{
  background:linear-gradient(135deg,var(--secondary-light),#fff);
  color:var(--secondary);
}
.mission-card h3{font-size:1.3rem;margin-bottom:12px}
.mission-card p{color:var(--text-muted);font-size:.95rem;line-height:1.7}

/* =========================
   Context
========================= */
.context-grid{
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:60px;
  align-items:center;
}
.context-grid p{
  color:var(--text-muted);
  margin-bottom:18px;
  font-size:1.02rem;
  line-height:1.7;
}
.context-grid p strong{color:var(--text)}
.context-badges{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:28px;
}
.badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 16px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:999px;
  font-size:.85rem;
  font-weight:600;
  color:var(--text);
  transition:var(--transition);
}
.badge:hover{
  border-color:var(--secondary);
  color:var(--secondary);
  transform:translateY(-2px);
}
.badge i{color:var(--secondary)}

.context-visual{
  display:flex;
  flex-direction:column;
  gap:20px;
}
.eu-card{
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  color:#fff;
  padding:36px;
  border-radius:var(--radius-lg);
  text-align:center;
  box-shadow:var(--shadow-lg);
}
.eu-card .eu-flag{margin-bottom:16px}
.eu-card h4{color:#fff;font-size:1.2rem;margin-bottom:10px}
.eu-card p{opacity:.9;font-size:.92rem;line-height:1.6}

.stats-mini{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
}
.stats-mini div{
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  padding:18px 10px;
  text-align:center;
  transition:var(--transition);
}
.stats-mini div:hover{
  border-color:var(--secondary);
  transform:translateY(-3px);
}
.stats-mini span{
  display:block;
  font-size:1.8rem;
  font-weight:800;
  color:var(--primary);
  line-height:1;
  margin-bottom:4px;
}
.stats-mini div:nth-child(even) span{color:var(--secondary)}
.stats-mini div{
  font-size:.78rem;
  color:var(--text-muted);
  font-weight:500;
}

/* =========================
   Leadership
========================= */
.leader-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
  max-width:900px;
  margin:0 auto;
}
.leader-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:36px;
  display:flex;
  gap:24px;
  align-items:center;
  transition:var(--transition);
}
.leader-card:hover{
  transform:translateY(-5px);
  box-shadow:var(--shadow-lg);
  border-color:var(--primary);
}
.leader-avatar{
  width:80px;height:80px;
  border-radius:50%;
  background:var(--primary-light);
  color:var(--primary);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:2rem;
  flex-shrink:0;
}
.leader-role{
  display:inline-block;
  font-size:.75rem;
  font-weight:600;
  letter-spacing:1px;
  text-transform:uppercase;
  color:var(--primary);
  margin-bottom:6px;
}
.leader-info h3{font-size:1.3rem;margin-bottom:8px}
.leader-info p{color:var(--text-muted);font-size:.92rem;line-height:1.6}

/* =========================
   Pillars
========================= */
.pillars-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
}
.pillar-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:32px 26px;
  position:relative;
  transition:var(--transition);
  overflow:hidden;
}
.pillar-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-lg);
  border-color:transparent;
}
.pillar-number{
  position:absolute;
  top:18px;right:22px;
  font-size:2.4rem;
  font-weight:800;
  color:var(--border);
  line-height:1;
  transition:var(--transition);
}
.pillar-card:hover .pillar-number{color:var(--secondary-light)}
.pillar-icon{
  width:58px;height:58px;
  border-radius:16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:1.5rem;
  margin-bottom:18px;
}
.pillar-icon.primary{background:var(--primary-light);color:var(--primary)}
.pillar-icon.secondary{background:var(--secondary-light);color:var(--secondary)}
.pillar-card h3{font-size:1.15rem;margin-bottom:10px}
.pillar-card p{color:var(--text-muted);font-size:.9rem;line-height:1.65}

/* =========================
   SDGs
========================= */
.sdgs-wrapper{
  background:linear-gradient(135deg,#0d1b2a,#1a2e44);
  border-radius:var(--radius-lg);
  padding:60px;
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:50px;
  align-items:center;
  color:#fff;
  overflow:hidden;
  position:relative;
}
.sdgs-wrapper::before{
  content:"";
  position:absolute;
  top:-100px;right:-100px;
  width:300px;height:300px;
  background:radial-gradient(circle,rgba(0,168,107,.25),transparent 70%);
  border-radius:50%;
}
.sdgs-text{position:relative;z-index:2}
.sdgs-text .section-eyebrow{
  background:rgba(255,255,255,.1);
  color:#7de0b5;
  border:1px solid rgba(125,224,181,.3);
}
.sdgs-text h2{
  color:#fff;
  font-size:clamp(1.6rem,3vw,2.2rem);
  margin-bottom:18px;
  line-height:1.25;
}
.sdgs-text p{
  color:rgba(255,255,255,.8);
  margin-bottom:26px;
  font-size:1rem;
  line-height:1.7;
}
.sdgs-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  position:relative;
  z-index:2;
}
.sdg-item{
  aspect-ratio:1;
  border-radius:var(--radius-md);
  padding:14px 10px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  color:#fff;
  transition:var(--transition);
  cursor:default;
}
.sdg-item:hover{
  transform:scale(1.05);
  box-shadow:0 10px 25px rgba(0,0,0,.3);
}
.sdg-num{
  font-size:1.8rem;
  font-weight:800;
  line-height:1;
  margin-bottom:4px;
}
.sdg-label{
  font-size:.65rem;
  font-weight:600;
  letter-spacing:.3px;
  line-height:1.2;
  opacity:.95;
}

/* =========================
   Impact
========================= */
.impact-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}
.impact-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  padding:30px 26px;
  transition:var(--transition);
}
.impact-card:hover{
  transform:translateY(-5px);
  box-shadow:var(--shadow-md);
  border-color:var(--secondary);
}
.impact-icon{
  width:52px;height:52px;
  border-radius:14px;
  background:var(--secondary-light);
  color:var(--secondary);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:1.3rem;
  margin-bottom:16px;
}
.impact-card:nth-child(even) .impact-icon{
  background:var(--primary-light);
  color:var(--primary);
}
.impact-card h3{font-size:1.1rem;margin-bottom:8px}
.impact-card p{color:var(--text-muted);font-size:.9rem;line-height:1.6}

/* =========================
   CTA Final
========================= */
.cta-final{padding:60px 0 100px}
.cta-box{
  background:linear-gradient(135deg,var(--primary),var(--secondary));
  border-radius:var(--radius-lg);
  padding:60px 40px;
  text-align:center;
  color:#fff;
  position:relative;
  overflow:hidden;
}
.cta-box::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 20% 30%, rgba(255,255,255,.15), transparent 50%),
    radial-gradient(circle at 80% 70%, rgba(255,255,255,.1), transparent 50%);
}
.cta-box > *{position:relative;z-index:2}
.cta-box h2{color:#fff;font-size:clamp(1.6rem,3vw,2.2rem);margin-bottom:12px}
.cta-box p{opacity:.9;margin-bottom:28px;font-size:1.05rem}
.cta-buttons{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.cta-box .btn-outline{border-color:rgba(255,255,255,.5);color:#fff}
.cta-box .btn-outline:hover{background:#fff;color:var(--primary);border-color:#fff}

/* =========================
   Responsive
========================= */
@media (max-width: 992px){
  .mission-grid{grid-template-columns:1fr 1fr}
  .mission-card:last-child{grid-column:1/-1;max-width:500px;margin:0 auto}
  .context-grid{grid-template-columns:1fr;gap:40px}
  .pillars-grid{grid-template-columns:repeat(2,1fr)}
  .sdgs-wrapper{grid-template-columns:1fr;padding:40px;gap:30px}
  .sdgs-grid{grid-template-columns:repeat(4,1fr)}
  .impact-grid{grid-template-columns:repeat(2,1fr)}
  .leader-grid{grid-template-columns:1fr}
}
@media (max-width: 768px){
  .mission-grid{grid-template-columns:1fr}
  .mission-card:last-child{max-width:none}
  .pillars-grid{grid-template-columns:1fr}
  .sdgs-grid{grid-template-columns:repeat(2,1fr)}
  .impact-grid{grid-template-columns:1fr}
  .stats-mini{grid-template-columns:repeat(2,1fr)}
  .leader-card{flex-direction:column;text-align:center;padding:30px}
  .cta-box{padding:40px 24px}
  .cta-buttons{flex-direction:column}
  .cta-buttons .btn{width:100%;justify-content:center}
}
@media (max-width: 480px){
  .sdgs-wrapper{padding:30px 20px}
  .sdg-num{font-size:1.4rem}
  .sdg-label{font-size:.6rem}
}