:root {
  --olive:#929560;
  --olive-dark:#6f7843;
  --olive-soft:#b7b590;
  --green:#2f8b45;
  --gold:#d8c85b;
  --cream:#fbfaf4;
  --cream-2:#f3f0e5;
  --ink:#293029;
  --muted:#62685f;
  --line:#d8d4c5;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.48}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
.wrap{width:min(var(--max),calc(100% - 32px));margin:auto}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif;font-weight:normal;margin:0}
p{margin:0}
nav{background:#fff;border-top:1px solid #eee9dc;border-bottom:1px solid var(--line)}
nav .wrap{display:flex;justify-content:center;gap:0;overflow:auto}
nav a{padding:14px 24px;white-space:nowrap;font-family:Georgia,serif;font-size:.96rem}
nav a:hover,nav a.active{background:var(--olive);color:#fff}
.hero{
  background:linear-gradient(90deg,rgba(255,255,255,.97) 0 39%,rgba(255,255,255,.4) 55%,rgba(255,255,255,0) 75%),
             url("../images/asset_01.jpg") center/cover;
  min-height:430px;display:flex;align-items:center;border-bottom:1px solid var(--line);
}
.hero .copy{width:min(470px,92%);padding:56px 0}
.hero h1{font-size:clamp(2.7rem,5vw,4.7rem);line-height:.98;color:#355a2b;letter-spacing:-.03em}
.hero p{font-family:Georgia,serif;font-size:1.14rem;margin-top:20px;max-width:460px}
.section{padding:54px 0}
.section.alt{background:#fff}
.section-title{
  position:relative;display:flex;align-items:center;gap:12px;background:var(--olive);color:#fff;
  padding:8px 18px 8px 62px;margin-bottom:20px;min-height:47px;
}
.section-title:before{
  content:"";position:absolute;left:10px;top:50%;transform:translateY(-50%);
  width:34px;height:44px;background:url("../images/asset_02.png") center/contain no-repeat;
}
.section-title h2{font-size:1.75rem}
.section-title .aside{margin-left:auto;font-family:Georgia,serif;font-style:italic;color:#f5f0d5;font-size:.95rem}
.about-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:32px}
.lead{font-size:1.12rem;color:#465047}
.quick{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.quick div{background:var(--cream-2);border:1px solid var(--line);padding:18px}
.quick strong{display:block;color:var(--olive-dark);font-size:1.45rem;font-family:Georgia,serif}
.programmes{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.program-card{background:#fff;border:1px solid var(--line);text-align:center}
.program-card img{width:100%;height:165px;object-fit:cover}
.program-card h3{font-size:1rem;padding:12px 9px;line-height:1.2}
.readiness-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.ready{background:#fff;border:1px solid var(--line);border-top:4px solid var(--olive);padding:18px}
.ready h3{font-size:1.05rem;margin-bottom:7px;color:#5b603e}
.ready p{font-size:.92rem;color:var(--muted)}
.impact-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 32px}
.impact-col + .impact-col{border-left:1px dotted #a7a186;padding-left:32px}
.impact-group{margin-bottom:28px}
.impact-group h3{font-family:Arial,Helvetica,sans-serif;font-size:1rem;font-weight:700;color:#c9b12e;background:#f3efdd;padding:5px 7px;margin-bottom:9px}
.impact-group ul{list-style:none;margin:0;padding:0}
.impact-group li{position:relative;padding:0 0 8px 31px;font-size:.93rem;color:#4d514b}
.impact-group li:before{
  content:"";position:absolute;left:0;top:1px;width:20px;height:25px;
  background:url("../images/asset_02.png") center/contain no-repeat;
}
.impact-group strong{color:#272c28}
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.phase{background:#fff;border:1px solid var(--line);padding:18px;border-bottom:4px solid var(--gold)}
.phase .year{color:#b6991e;font-weight:700}
.phase h3{font-size:1.03rem;margin:5px 0 7px}
.phase p{font-size:.9rem;color:var(--muted)}
.partners{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.partner{height:82px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;padding:14px;text-align:center;font-weight:700;color:#5d6357}
.cta{background:var(--olive);color:#fff;padding:34px;display:flex;justify-content:space-between;gap:30px;align-items:center}
.cta h2{font-size:2rem}
.cta p{max-width:680px;color:#f5f2e3;margin-top:8px}
.cta a{background:#fff;color:#565c38;padding:12px 18px;font-weight:700}
footer{border-top:1px solid var(--line);padding:25px 0 36px;color:#666b62;font-size:.86rem;background:#fff}
.footer-grid{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
@media(max-width:950px){
      .programmes{grid-template-columns:repeat(3,1fr)}
  .readiness-grid,.timeline{grid-template-columns:repeat(2,1fr)}
  .partners{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:700px){
        .hero{background:linear-gradient(rgba(255,255,255,.9),rgba(255,255,255,.92)),url("../images/asset_01.jpg") center/cover}
  .about-grid,.impact-grid{grid-template-columns:1fr}
  .impact-col + .impact-col{border-left:0;padding-left:0}
  .programmes{grid-template-columns:repeat(2,1fr)}
  .readiness-grid,.timeline,.partners{grid-template-columns:1fr 1fr}
  .section-title{padding-left:54px} .section-title h2{font-size:1.35rem}
  .section-title .aside{display:none}
  .cta{display:block} .cta a{display:inline-block;margin-top:18px}
}
@media(max-width:430px){
  nav a{padding:12px 15px}
  .programmes,.readiness-grid,.timeline,.partners{grid-template-columns:1fr}
}

.logo-header{
  background:#fff;
  border-bottom:1px solid var(--line);
  padding:12px 0 10px;
}
.logo-header .wrap{
  display:flex;
  align-items:center;
  justify-content:flex-start;
}
.logo-header img{
  width:175px;
  height:auto;
  object-fit:contain;
}
@media(max-width:700px){
  .logo-header .wrap{justify-content:center}
  .logo-header img{width:150px}
}


.combined-header{
  background:#fff;
  border-bottom:1px solid var(--line);
  position:sticky;
  top:0;
  z-index:100;
}
.header-row{
  display:flex;
  align-items:center;
  gap:34px;
  min-height:112px;
}
.header-logo{
  flex:0 0 155px;
  display:flex;
  align-items:center;
}
.header-logo img{
  width:145px;
  height:auto;
  object-fit:contain;
}
.header-nav{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:2px;
  overflow-x:auto;
  background:transparent;
  border:0;
}
.header-nav a{
  padding:13px 16px;
  white-space:nowrap;
  font-family:Georgia,"Times New Roman",serif;
  font-size:.95rem;
}
.header-nav a:hover,
.header-nav a.active{
  background:var(--olive);
  color:#fff;
}
@media(max-width:900px){
  .header-row{gap:15px;min-height:94px}
  .header-logo{flex-basis:120px}
  .header-logo img{width:112px}
  .header-nav{justify-content:flex-start}
  .header-nav a{padding:11px 12px;font-size:.87rem}
}
@media(max-width:650px){
  .header-row{display:block;padding-top:8px}
  .header-logo{justify-content:center}
  .header-logo img{width:120px}
  .header-nav{margin-top:5px;justify-content:flex-start}
}


/* Keep anchored section titles fully visible below the sticky header */
html{
  scroll-padding-top:130px;
}
section[id]{
  scroll-margin-top:130px;
}
@media(max-width:900px){
  html{scroll-padding-top:112px}
  section[id]{scroll-margin-top:112px}
}
@media(max-width:650px){
  html{scroll-padding-top:155px}
  section[id]{scroll-margin-top:155px}
}


/* Updated high-resolution Fouadi leaf bullet */
.section-title:before,
.impact-group li:before {
  background-image:url("../images/asset_03.png") !important;
  background-color:transparent !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
  background-size:contain !important;
}
.section-title:before {
  width:38px !important;
  height:48px !important;
}
.impact-group li:before {
  width:20px !important;
  height:26px !important;
}


/* Cleaner Programme Areas cards */
.programmes{
  display:grid;
  grid-template-columns:repeat(3,1fr) !important;
  gap:22px !important;
  align-items:stretch;
}
.program-card{
  display:grid;
  grid-template-rows:auto 96px;
  background:#fff !important;
  border:1px solid var(--line) !important;
  overflow:hidden;
  text-align:center;
  min-width:0;
}
.program-card img{
  width:100% !important;
  aspect-ratio:4 / 3;
  height:auto !important;
  object-fit:cover !important;
  object-position:center;
  display:block;
}
.program-card h3{
  margin:0 !important;
  min-height:96px;
  padding:15px 14px !important;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#f5f1e5;
  border-top:1px solid #ded8c7;
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.02rem !important;
  line-height:1.25 !important;
  color:#30352e;
}
@media(min-width:1100px){
  .programmes{
    grid-template-columns:repeat(3,1fr) !important;
  }
}
@media(max-width:760px){
  .programmes{
    grid-template-columns:repeat(2,1fr) !important;
    gap:14px !important;
  }
  .program-card{
    grid-template-rows:auto 92px;
  }
  .program-card h3{
    min-height:92px;
    font-size:.94rem !important;
    padding:12px 9px !important;
  }
}
@media(max-width:460px){
  .programmes{
    grid-template-columns:1fr !important;
  }
  .program-card{
    grid-template-rows:auto 78px;
  }
  .program-card h3{
    min-height:78px;
  }
}


/* Programme Areas: image-only cards */
.program-card{
  display:block !important;
  background:transparent !important;
  border:0 !important;
  overflow:hidden;
  border-radius:8px;
  box-shadow:0 2px 10px rgba(50,55,45,.08);
}
.program-card img{
  width:100% !important;
  aspect-ratio:4 / 3 !important;
  height:auto !important;
  object-fit:cover !important;
  object-position:center !important;
  display:block !important;
}
.program-card h3{
  display:none !important;
}


/* HD programme photographs with title incorporated into bottom of photo */
.programmes{
 display:grid!important;grid-template-columns:repeat(3,1fr)!important;
 gap:20px!important;align-items:stretch
}
.program-card{
 position:relative!important;display:block!important;overflow:hidden!important;
 border-radius:9px!important;border:0!important;background:#ddd!important;
 aspect-ratio:4/3!important;box-shadow:0 4px 16px rgba(45,50,40,.10)
}
.program-card img{
 width:100%!important;height:100%!important;aspect-ratio:auto!important;
 object-fit:cover!important;object-position:center!important;display:block!important
}
.program-overlay{
 position:absolute;left:0;right:0;bottom:0;min-height:82px;
 padding:22px 18px 14px;display:flex;align-items:flex-end;justify-content:center;
 text-align:center;color:#fff;font-family:Georgia,"Times New Roman",serif;
 font-size:1.08rem;line-height:1.2;text-shadow:0 1px 3px rgba(0,0,0,.55);
 background:linear-gradient(to top,rgba(42,47,37,.92) 0%,rgba(42,47,37,.72) 55%,rgba(42,47,37,0) 100%)
}
/* Institutional Readiness headings */
.readiness-grid .ready h3{
 font-family:Arial,Helvetica,sans-serif!important;
 font-weight:700!important;color:#343a31!important
}
@media(max-width:760px){
 .programmes{grid-template-columns:repeat(2,1fr)!important;gap:14px!important}
 .program-overlay{font-size:.98rem}
}
@media(max-width:460px){
 .programmes{grid-template-columns:1fr!important}
}


/* Larger top Fouadi logo */
.header-logo{
  flex:0 0 190px !important;
}
.header-logo img{
  width:180px !important;
}
@media(max-width:900px){
  .header-logo{flex-basis:150px !important}
  .header-logo img{width:140px !important}
}
@media(max-width:650px){
  .header-logo img{width:145px !important}
}

/* Institutional Readiness icon badges */
.readiness-grid .ready{
  position:relative;
  padding-top:52px !important;
}
.ready-icon{
  position:absolute;
  top:14px;
  left:18px;
  width:34px;
  height:34px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#f1eedf;
  color:#667045;
  font-weight:700;
  font-size:18px;
  line-height:1;
}
.readiness-grid .ready h3{
  font-weight:700 !important;
}

/* Partner labels */
.partners .partner{
  font-weight:700;
}


/* Larger, friendlier Institutional Readiness icons */
.readiness-grid .ready{
  padding-top:76px !important;
}
.ready-icon{
  top:14px !important;
  left:18px !important;
  width:52px !important;
  height:52px !important;
  border-radius:50% !important;
  background:#f3efdc !important;
  color:#6b7548 !important;
  box-shadow:0 2px 8px rgba(83,88,62,.10);
}
.ready-icon svg{
  width:31px;
  height:31px;
  display:block;
  fill:currentColor;
}
.readiness-grid .ready h3{
  font-size:1.08rem !important;
  font-weight:700 !important;
}
@media(max-width:700px){
  .readiness-grid .ready{padding-top:72px !important}
  .ready-icon{width:48px !important;height:48px !important}
  .ready-icon svg{width:29px;height:29px}
}


/* Main Fouadi logo enlarged by more than 50% */
.header-row{
  min-height:150px !important;
}
.header-logo{
  flex:0 0 295px !important;
}
.header-logo img{
  width:280px !important;
  max-width:none !important;
}
@media(max-width:1000px){
  .header-row{min-height:125px !important}
  .header-logo{flex-basis:220px !important}
  .header-logo img{width:210px !important}
}
@media(max-width:650px){
  .header-row{min-height:auto !important}
  .header-logo img{width:205px !important}
}

/* Progressive interaction enhancements */
html{scroll-behavior:smooth}

.combined-header{
  transition:box-shadow .25s ease, background-color .25s ease;
}
.combined-header.is-scrolled{
  box-shadow:0 8px 24px rgba(64,67,47,.10);
}

/* Accessible mobile navigation button */
.nav-toggle{
  display:none;
  width:44px;
  height:44px;
  border:1px solid var(--line);
  background:#fff;
  border-radius:6px;
  cursor:pointer;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px;
  margin-left:auto;
}
.nav-toggle span{
  display:block;
  width:22px;
  height:2px;
  background:var(--olive);
  transition:transform .2s ease, opacity .2s ease;
}
.nav-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.is-open span:nth-child(2){opacity:0}
.nav-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.reveal-on-scroll{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .55s ease, transform .55s ease;
}
.reveal-on-scroll.is-visible{
  opacity:1;
  transform:none;
}
.program-card.reveal-on-scroll:nth-child(2),
.ready.reveal-on-scroll:nth-child(2){transition-delay:.06s}
.program-card.reveal-on-scroll:nth-child(3),
.ready.reveal-on-scroll:nth-child(3){transition-delay:.12s}
.program-card.reveal-on-scroll:nth-child(4),
.ready.reveal-on-scroll:nth-child(4){transition-delay:.18s}
.program-card.reveal-on-scroll:nth-child(5){transition-delay:.24s}
.program-card.reveal-on-scroll:nth-child(6){transition-delay:.30s}

.program-card{
  transition:transform .25s ease, box-shadow .25s ease;
}
.program-card:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 28px rgba(75,78,55,.14);
}
.program-card img{
  transition:transform .45s ease;
}
.program-card:hover img{
  transform:scale(1.025);
}

@media(max-width:650px){
  .header-row{
    display:flex !important;
    flex-wrap:wrap;
    padding-top:8px;
    padding-bottom:8px;
  }
  .header-logo{
    justify-content:flex-start !important;
    flex:1 1 auto !important;
  }
  .nav-toggle{display:flex}
  .header-nav{
    display:none !important;
    width:100%;
    flex:0 0 100%;
    flex-direction:column;
    align-items:stretch;
    margin:0 !important;
    padding:7px 0 4px;
    overflow:visible;
  }
  .header-nav.is-open{display:flex !important}
  .header-nav a{
    width:100%;
    padding:12px 14px !important;
    border-radius:4px;
  }
  html{scroll-padding-top:110px}
  section[id]{scroll-margin-top:110px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  .reveal-on-scroll{
    opacity:1 !important;
    transform:none !important;
  }
}


/* More visible section-by-section entrance on downward scroll */
.reveal-on-scroll{
  opacity:0;
  transform:translateY(42px);
  filter:blur(2px);
  transition:
    opacity .85s ease,
    transform .85s cubic-bezier(.2,.65,.25,1),
    filter .7s ease;
  will-change:opacity,transform;
}
.reveal-on-scroll.is-visible{
  opacity:1;
  transform:translateY(0);
  filter:blur(0);
}

/* Whole sections arrive with a gentle lift, while cards retain their stagger. */
.section.reveal-on-scroll{
  transform:translateY(54px);
}
.section.reveal-on-scroll.is-visible{
  transform:translateY(0);
}

.program-card.reveal-on-scroll:nth-child(2),
.ready.reveal-on-scroll:nth-child(2){transition-delay:.10s}
.program-card.reveal-on-scroll:nth-child(3),
.ready.reveal-on-scroll:nth-child(3){transition-delay:.18s}
.program-card.reveal-on-scroll:nth-child(4),
.ready.reveal-on-scroll:nth-child(4){transition-delay:.26s}
.program-card.reveal-on-scroll:nth-child(5){transition-delay:.34s}
.program-card.reveal-on-scroll:nth-child(6){transition-delay:.42s}

@media(prefers-reduced-motion:reduce){
  .reveal-on-scroll{
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
  }
}


/* ===== Reliable scroll reveal, 2026-09-13 ===== */
.js-enabled main > section.scroll-reveal-section{
  opacity:0;
  transform:translateY(64px);
  transition:
    opacity 1.05s ease,
    transform 1.05s cubic-bezier(.19,.72,.27,1);
}
.js-enabled main > section.scroll-reveal-section.scroll-reveal-visible{
  opacity:1;
  transform:translateY(0);
}

/* Children gently follow the section entrance */
.js-enabled main > section.scroll-reveal-section .program-card,
.js-enabled main > section.scroll-reveal-section .ready,
.js-enabled main > section.scroll-reveal-section .impact-group,
.js-enabled main > section.scroll-reveal-section .phase{
  transition:
    transform .75s ease,
    opacity .75s ease,
    box-shadow .25s ease;
}
.js-enabled main > section.scroll-reveal-section:not(.scroll-reveal-visible) .program-card,
.js-enabled main > section.scroll-reveal-section:not(.scroll-reveal-visible) .ready,
.js-enabled main > section.scroll-reveal-section:not(.scroll-reveal-visible) .impact-group,
.js-enabled main > section.scroll-reveal-section:not(.scroll-reveal-visible) .phase{
  opacity:.35;
  transform:translateY(22px);
}

/* Prevent old reveal rules from competing with the new section reveal */
.reveal-on-scroll{
  opacity:1 !important;
  transform:none !important;
  filter:none !important;
}

/* Counter values get a little visual emphasis while animating */
.count-up{
  font-variant-numeric:tabular-nums;
  display:inline-block;
  min-width:4ch;
}

@media (prefers-reduced-motion: reduce){
  .js-enabled main > section.scroll-reveal-section{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
}


/* Hover expansion for Institutional Readiness, Evolution of Programming, and Partners */
.ready,
.phase,
.partner{
  transition:
    transform .26s ease,
    box-shadow .26s ease,
    border-color .26s ease;
  transform-origin:center;
  will-change:transform;
  position:relative;
  z-index:1;
}

.ready:hover,
.phase:hover,
.partner:hover{
  transform:scale(1.055);
  box-shadow:0 14px 30px rgba(72,76,52,.16);
  z-index:5;
}

.ready:hover{
  border-color:rgba(146,149,96,.55);
}

.phase:hover{
  border-color:rgba(201,177,46,.6);
}

.partner:hover{
  border-color:rgba(146,149,96,.5);
}

/* Keep hover effect graceful on touch devices */
@media (hover:none){
  .ready:hover,
  .phase:hover,
  .partner:hover{
    transform:none;
    box-shadow:none;
  }
}


/* Crisp hover effect: visually enlarge the box without scaling its text */
.ready,
.phase,
.partner{
  transform:none !important;
  backface-visibility:visible;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

.ready:hover,
.phase:hover,
.partner:hover{
  transform:translateY(-3px) !important;
  z-index:5;
}

/* Use a spread shadow so the card appears larger while text remains 1:1 and sharp */
.ready:hover{
  box-shadow:
    0 0 0 5px #fff,
    0 14px 30px rgba(72,76,52,.16) !important;
}

.phase:hover{
  box-shadow:
    0 0 0 5px #fff,
    0 14px 30px rgba(72,76,52,.16) !important;
}

.partner:hover{
  box-shadow:
    0 0 0 5px #fff,
    0 14px 30px rgba(72,76,52,.16) !important;
}

/* On touch devices, keep cards static */
@media (hover:none){
  .ready:hover,
  .phase:hover,
  .partner:hover{
    transform:none !important;
    box-shadow:none !important;
  }
}

.program-link{display:block;position:relative;text-decoration:none;color:inherit;border-radius:8px;overflow:hidden}.program-link .program-card{height:100%}.program-explore{position:absolute;right:14px;bottom:12px;z-index:5;background:#fff;color:#646742;padding:7px 11px;border-radius:20px;font-size:12px;font-weight:800;opacity:0;transition:.2s}.program-link:hover .program-explore,.program-link:focus .program-explore{opacity:1}
.detail-hero{position:relative;min-height:440px;display:flex;align-items:flex-end;background:#333;overflow:hidden}.detail-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.58}.detail-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent,rgba(25,28,18,.82))}.detail-inner,.detail-wrap{width:min(1120px,calc(100% - 40px));margin:auto}.detail-inner{position:relative;z-index:2;color:#fff;padding:80px 0 55px}.detail-kicker{font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#f0df77}.detail-hero h1{font:700 clamp(2.3rem,5vw,4.4rem)/1.03 Georgia,serif;margin:10px 0 16px;max-width:900px}.detail-hero p{max-width:780px;font-size:1.08rem;line-height:1.7}.detail-overview{display:grid;grid-template-columns:1.3fr .7fr;gap:40px;padding:60px 0}.detail-overview h2,.detail-section h2{font:700 2rem Georgia,serif;color:#666943}.detail-overview p,.detail-section li{line-height:1.7}.stats{display:grid;grid-template-columns:1fr 1fr;gap:12px}.stat{background:#f4f1e6;padding:20px;border:1px solid #e5dfcc;border-radius:8px}.stat b{display:block;font:700 1.75rem Georgia,serif;color:#666943}.stat span{font-size:.84rem}.detail-section{padding:46px 0}.detail-section.alt{background:#f8f7f1}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.project{background:#fff;border:1px solid #e2ded1;border-radius:8px;padding:24px}.project h3{font:700 1.2rem Georgia,serif;color:#666943;margin-top:0}.meta{font-size:.8rem;font-weight:800;color:#777}.project li{margin:7px 0}.gallery{display:grid;grid-template-columns:2fr 1fr 1fr;grid-auto-rows:220px;gap:12px}.gallery figure{margin:0;position:relative;overflow:hidden;border-radius:8px}.gallery figure:first-child{grid-row:span 2}.gallery img{width:100%;height:100%;object-fit:cover}.gallery figcaption{position:absolute;left:8px;bottom:8px;background:rgba(255,255,255,.9);padding:5px 8px;font-size:11px;border-radius:4px}.return{display:inline-block;margin:40px 0 70px;background:#929560;color:#fff;padding:12px 17px;border-radius:5px;text-decoration:none;font-weight:800}@media(max-width:760px){.detail-overview,.project-grid{grid-template-columns:1fr}.gallery{grid-template-columns:1fr 1fr}.gallery figure:first-child{grid-row:auto;grid-column:span 2}}


/* ===== Compact header for programme detail pages ===== */
.detail-page .combined-header{
  position:sticky;
  top:0;
  z-index:1000;
  background:#fff;
  border-bottom:1px solid var(--line);
  box-shadow:0 2px 10px rgba(60,65,45,.06);
}

.detail-page .header-row{
  min-height:86px !important;
  height:auto !important;
  max-width:1180px;
  margin:0 auto;
  padding:8px 24px !important;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
}

.detail-page .header-logo{
  flex:0 0 auto !important;
  width:auto !important;
  height:auto !important;
  display:flex;
  align-items:center;
  padding:0 !important;
}

.detail-page .header-logo img{
  width:155px !important;
  height:auto !important;
  max-height:70px !important;
  object-fit:contain;
  display:block;
}

.detail-page .header-nav{
  flex:1 1 auto;
  justify-content:flex-end;
  margin:0 !important;
  gap:2px;
}

.detail-page .header-nav a{
  padding:10px 12px !important;
  font-size:.9rem !important;
}

/* Keep programme hero substantial, but not oversized */
.detail-page .detail-hero{
  min-height:390px;
  max-height:500px;
}

.detail-page .detail-hero > img{
  height:100%;
  min-height:390px;
  max-height:500px;
  object-fit:cover;
}

@media(max-width:900px){
  .detail-page .header-row{
    min-height:76px !important;
    padding:7px 18px !important;
    gap:15px;
  }
  .detail-page .header-logo img{
    width:135px !important;
    max-height:60px !important;
  }
  .detail-page .header-nav a{
    padding:9px 8px !important;
    font-size:.82rem !important;
  }
}

@media(max-width:650px){
  .detail-page .header-row{
    min-height:70px !important;
    flex-wrap:wrap;
  }
  .detail-page .header-logo img{
    width:125px !important;
  }
  .detail-page .header-nav{
    width:100%;
    flex:0 0 100%;
    overflow-x:auto;
    justify-content:flex-start;
    padding-bottom:3px;
  }
  .detail-page .detail-hero,
  .detail-page .detail-hero > img{
    min-height:320px;
  }
}


/* ===== Consistent Fouadi header across ALL pages ===== */
.combined-header{
  position:sticky;
  top:0;
  z-index:1000;
  background:#fff;
  border-bottom:1px solid var(--line);
  box-shadow:0 2px 10px rgba(60,65,45,.06);
}

.header-row,
.detail-page .header-row{
  min-height:86px !important;
  height:auto !important;
  max-width:1180px;
  margin:0 auto;
  padding:8px 24px !important;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
}

.header-logo,
.detail-page .header-logo{
  flex:0 0 auto !important;
  width:auto !important;
  height:auto !important;
  display:flex;
  align-items:center;
  padding:0 !important;
}

.header-logo img,
.detail-page .header-logo img{
  width:155px !important;
  height:auto !important;
  max-height:70px !important;
  object-fit:contain;
  display:block;
}

.header-nav,
.detail-page .header-nav{
  flex:1 1 auto;
  justify-content:flex-end;
  margin:0 !important;
  gap:2px;
}

.header-nav a,
.detail-page .header-nav a{
  padding:10px 12px !important;
  font-size:.9rem !important;
}

/* Anchor positioning now matches the compact header */
html{
  scroll-padding-top:105px !important;
}
section[id]{
  scroll-margin-top:105px !important;
}

@media(max-width:900px){
  .header-row,
  .detail-page .header-row{
    min-height:76px !important;
    padding:7px 18px !important;
    gap:15px;
  }
  .header-logo img,
  .detail-page .header-logo img{
    width:135px !important;
    max-height:60px !important;
  }
  .header-nav a,
  .detail-page .header-nav a{
    padding:9px 8px !important;
    font-size:.82rem !important;
  }
  html{
    scroll-padding-top:92px !important;
  }
  section[id]{
    scroll-margin-top:92px !important;
  }
}

@media(max-width:650px){
  .header-row,
  .detail-page .header-row{
    min-height:70px !important;
    padding:7px 16px !important;
  }
  .header-logo img,
  .detail-page .header-logo img{
    width:125px !important;
    max-height:56px !important;
  }
}


/* =========================================================
   Fouadi shared header — enlarged logo, consistent everywhere
   ========================================================= */
.header-row,
.detail-page .header-row,
.about-page .header-row{
  min-height:110px !important;
  max-width:1180px;
  margin:0 auto;
  padding:8px 24px !important;
  gap:26px;
}

.header-logo img,
.detail-page .header-logo img,
.about-page .header-logo img{
  width:233px !important; /* +50% from 155px */
  max-height:94px !important;
  height:auto !important;
  object-fit:contain;
}

.header-nav a,
.detail-page .header-nav a,
.about-page .header-nav a{
  padding:10px 10px !important;
  font-size:.88rem !important;
}

html{ scroll-padding-top:128px !important; }
section[id]{ scroll-margin-top:128px !important; }

@media(max-width:900px){
  .header-row,
  .detail-page .header-row,
  .about-page .header-row{
    min-height:94px !important;
    padding:7px 18px !important;
    gap:14px;
  }
  .header-logo img,
  .detail-page .header-logo img,
  .about-page .header-logo img{
    width:185px !important;
    max-height:78px !important;
  }
  .header-nav a,
  .detail-page .header-nav a,
  .about-page .header-nav a{
    padding:8px 7px !important;
    font-size:.8rem !important;
  }
  html{scroll-padding-top:108px !important}
  section[id]{scroll-margin-top:108px !important}
}

@media(max-width:650px){
  .header-row,
  .detail-page .header-row,
  .about-page .header-row{
    min-height:82px !important;
    padding:6px 15px !important;
  }
  .header-logo img,
  .detail-page .header-logo img,
  .about-page .header-logo img{
    width:165px !important;
    max-height:70px !important;
  }
}

/* ============================
   About Fouadi dedicated page
   ============================ */
.about-page main{background:#fff}
.about-hero{
  position:relative;
  min-height:500px;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
  background:#545a39;
}
.about-hero img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(.86) contrast(.96);
}
.about-hero:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(34,38,23,.82) 0%,rgba(34,38,23,.57) 42%,rgba(34,38,23,.20) 72%,rgba(34,38,23,.10) 100%);
}
.about-hero-copy{
  position:relative;
  z-index:2;
  width:min(1180px,calc(100% - 48px));
  margin:0 auto;
  padding:84px 0 70px;
  color:#fff;
}
.about-hero-copy .eyebrow{
  font-size:.85rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-weight:800;
  color:#e3cf55;
  margin-bottom:16px;
}
.about-hero-copy h1{
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(3rem,6vw,5.8rem);
  line-height:.92;
  margin:0;
  max-width:800px;
}
.about-hero-copy p{
  max-width:730px;
  margin:24px 0 0;
  font-size:1.22rem;
  line-height:1.65;
  color:rgba(255,255,255,.92);
}

.about-shell{
  width:min(1180px,calc(100% - 48px));
  margin:0 auto;
}
.about-section{
  padding:78px 0;
}
.about-section.alt{background:#f7f5eb}
.about-intro{
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:54px;
  align-items:start;
}
.about-intro .lead{
  font-size:1.32rem;
  line-height:1.75;
  color:#333526;
}
.about-intro p{
  font-size:1.02rem;
  line-height:1.78;
  color:var(--muted);
}
.about-facts{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.about-fact{
  background:#f7f5eb;
  border:1px solid #e9e3c9;
  border-radius:14px;
  padding:23px 20px;
}
.about-fact strong{
  display:block;
  color:var(--olive-dark);
  font-size:1.6rem;
  margin-bottom:4px;
}
.about-fact span{color:var(--muted);font-size:.92rem;line-height:1.45}

.statement-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}
.statement-card{
  border-radius:18px;
  padding:36px;
  background:#fff;
  border:1px solid #e6e1ca;
  box-shadow:0 10px 30px rgba(74,78,50,.07);
}
.statement-card.vision{
  background:#777c4f;
  color:#fff;
  border-color:#777c4f;
}
.statement-card .label{
  text-transform:uppercase;
  font-weight:800;
  letter-spacing:.13em;
  font-size:.78rem;
  color:#b69c1f;
  margin-bottom:12px;
}
.statement-card.vision .label{color:#f1da63}
.statement-card h2{
  font-family:Georgia,"Times New Roman",serif;
  font-size:2.1rem;
  margin:0 0 18px;
}
.statement-card p{font-size:1.06rem;line-height:1.72;margin:0}
.statement-card.vision p{color:rgba(255,255,255,.94)}

.mission-detail{
  margin-top:28px;
  border-left:4px solid #c4aa2b;
  padding:6px 0 6px 26px;
}
.mission-detail p{font-size:1.08rem;line-height:1.75;color:#3f4132}
.mission-list{
  margin:26px 0 0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.mission-item{
  position:relative;
  padding:22px 22px 22px 52px;
  border-radius:14px;
  background:#fff;
  border:1px solid #e6e1ca;
  line-height:1.62;
  color:#4a4d3b;
}
.mission-item:before{
  content:"";
  position:absolute;
  left:18px;
  top:22px;
  width:22px;
  height:22px;
  background:url("../images/asset_03.png") center/contain no-repeat;
}

.journey-intro{text-align:center;max-width:760px;margin:0 auto 45px}
.journey-intro h2{
  font-family:Georgia,"Times New Roman",serif;
  color:var(--olive-dark);
  font-size:2.8rem;
  margin:0 0 10px;
}
.journey-intro p{font-style:italic;color:#73765c;font-size:1.18rem;line-height:1.55}
.journey-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}
.journey-card{
  background:#fff;
  border:1px solid #e6e1ca;
  border-radius:18px;
  padding:26px 22px;
  transition:box-shadow .25s ease, transform .25s ease;
}
.journey-card:hover{transform:translateY(-4px);box-shadow:0 14px 32px rgba(72,76,52,.12)}
.journey-year{
  display:inline-block;
  color:#fff;
  background:var(--olive);
  padding:7px 12px;
  border-radius:999px;
  font-weight:800;
  font-size:.82rem;
  margin-bottom:18px;
}
.journey-card h3{
  font-family:Georgia,"Times New Roman",serif;
  color:#484c2f;
  font-size:1.4rem;
  line-height:1.2;
  margin:0 0 12px;
}
.journey-card p{color:var(--muted);line-height:1.65;font-size:.94rem}
.journey-card ul{padding-left:18px;color:var(--muted);line-height:1.55;font-size:.92rem}
.journey-card li+li{margin-top:7px}

.about-gallery{
  display:grid;
  grid-template-columns:1.3fr .7fr .7fr;
  grid-template-rows:240px 240px;
  gap:12px;
  margin-top:34px;
}
.about-gallery figure{
  margin:0;
  position:relative;
  overflow:hidden;
  border-radius:14px;
  min-height:0;
}
.about-gallery figure:first-child{grid-row:1 / span 2}
.about-gallery figure:nth-child(4){grid-column:2 / span 2}
.about-gallery img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .35s ease;
}
.about-gallery figure:hover img{transform:scale(1.035)}
.about-gallery figcaption{
  position:absolute;
  left:0;right:0;bottom:0;
  padding:34px 14px 11px;
  background:linear-gradient(transparent,rgba(26,28,18,.68));
  color:#fff;
  font-size:.78rem;
}
.about-photo-note{
  margin:16px 0 0;
  color:#777a61;
  font-size:.88rem;
  text-align:center;
}

.partner-statement{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:42px;
  align-items:center;
}
.partner-statement h2{
  font-family:Georgia,"Times New Roman",serif;
  color:var(--olive-dark);
  font-size:2.6rem;
  margin:0;
}
.partner-statement p{
  font-size:1.08rem;
  line-height:1.8;
  color:#555843;
}
.about-cta{
  background:#696e45;
  color:#fff;
  border-radius:20px;
  padding:36px;
}
.about-cta h3{
  font-family:Georgia,"Times New Roman",serif;
  font-size:2rem;
  margin:0 0 12px;
}
.about-cta p{color:rgba(255,255,255,.9);margin:0 0 22px}
.about-cta a{
  display:inline-block;
  background:#e0c451;
  color:#353821;
  text-decoration:none;
  font-weight:800;
  padding:12px 18px;
  border-radius:999px;
}

@media(max-width:900px){
  .about-intro,.statement-grid,.partner-statement{grid-template-columns:1fr}
  .journey-grid{grid-template-columns:1fr 1fr}
  .mission-list{grid-template-columns:1fr}
}
@media(max-width:650px){
  .about-hero{min-height:430px}
  .about-hero-copy{width:calc(100% - 32px);padding:70px 0 50px}
  .about-hero-copy h1{font-size:3.1rem}
  .about-shell{width:calc(100% - 32px)}
  .about-section{padding:58px 0}
  .about-facts{grid-template-columns:1fr}
  .journey-grid{grid-template-columns:1fr}
  .about-gallery{
    grid-template-columns:1fr 1fr;
    grid-template-rows:210px 170px 170px;
  }
  .about-gallery figure:first-child{grid-column:1 / span 2;grid-row:auto}
  .about-gallery figure:nth-child(4){grid-column:auto}
}


/* ===== About Fouadi direct subsection navigation ===== */
.about-subnav{
  width:min(1120px,calc(100% - 48px));
  margin:34px auto 4px;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
}
.about-subnav a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:10px 18px;
  border:1px solid rgba(111,120,67,.36);
  border-radius:999px;
  background:#fff;
  color:var(--olive-dark);
  text-decoration:none;
  font-size:.91rem;
  font-weight:750;
  box-shadow:0 4px 12px rgba(72,76,52,.055);
  transition:transform .2s ease,background-color .2s ease,color .2s ease,
             border-color .2s ease,box-shadow .2s ease;
}
.about-subnav a::after{
  content:"›";
  margin-left:8px;
  font-size:1.08em;
}
.about-subnav a:hover,
.about-subnav a:focus-visible{
  transform:translateY(-2px);
  background:var(--olive-dark);
  color:#fff;
  border-color:var(--olive-dark);
  box-shadow:0 8px 18px rgba(72,76,52,.13);
}
#who-we-are,#our-vision,#our-mission,#our-journey,#work-in-pictures{
  scroll-margin-top:138px !important;
}
@media(max-width:900px){
  #who-we-are,#our-vision,#our-mission,#our-journey,#work-in-pictures{
    scroll-margin-top:118px !important;
  }
}
@media(max-width:650px){
  .about-subnav{
    width:calc(100% - 32px);
    gap:8px;
  }
  .about-subnav a{
    flex:1 1 calc(50% - 8px);
    padding:9px 11px;
    font-size:.84rem;
  }
}


/* ==========================================================
   Final header logo enlargement: +50% from current 233px
   Keep header controlled by allowing the wordmark to extend
   visually without adding equivalent empty header height.
   ========================================================== */
.header-logo img,
.detail-page .header-logo img,
.about-page .header-logo img{
  width:350px !important;
  max-width:350px !important;
  max-height:108px !important;
  height:auto !important;
  object-fit:contain;
}

.header-logo,
.detail-page .header-logo,
.about-page .header-logo{
  width:350px !important;
  flex:0 0 350px !important;
}

.header-row,
.detail-page .header-row,
.about-page .header-row{
  min-height:116px !important;
}

/* ==========================================================
   Homepage About Fouadi — vertically balanced content
   ========================================================== */
#index-about-fix-placeholder{display:none}

/* The homepage's About section: reduce unnecessary vertical
   whitespace and keep its inner content visually centred. */
#about{
  padding-top:54px !important;
  padding-bottom:54px !important;
}

#about > .wrap,
#about > .container,
#about .section-inner{
  min-height:0 !important;
}

/* Balance the common two-column About layout vertically. */
#about .about-grid,
#about .split,
#about .two-col,
#about .about-content{
  align-items:center !important;
}

/* Tighten text rhythm so buttons sit naturally beneath copy. */
#about h2{
  margin-top:0 !important;
}
#about p:last-of-type{
  margin-bottom:18px !important;
}
#about .about-subnav{
  margin-top:22px !important;
  margin-bottom:0 !important;
}

/* Remove accidental oversized min-heights from inherited rules. */
#about,
#about .wrap,
#about .container,
#about .section-inner,
#about .about-grid,
#about .about-content{
  min-height:unset !important;
}

/* Tablet: still substantially larger, without crushing nav. */
@media(max-width:1050px){
  .header-logo,
  .detail-page .header-logo,
  .about-page .header-logo{
    width:255px !important;
    flex-basis:255px !important;
  }
  .header-logo img,
  .detail-page .header-logo img,
  .about-page .header-logo img{
    width:255px !important;
    max-width:255px !important;
    max-height:90px !important;
  }
}

/* Mobile header remains practical. */
@media(max-width:650px){
  .header-logo,
  .detail-page .header-logo,
  .about-page .header-logo{
    width:200px !important;
    flex-basis:200px !important;
  }
  .header-logo img,
  .detail-page .header-logo img,
  .about-page .header-logo img{
    width:200px !important;
    max-width:200px !important;
    max-height:76px !important;
  }
  .header-row,
  .detail-page .header-row,
  .about-page .header-row{
    min-height:88px !important;
  }
  #about{
    padding-top:42px !important;
    padding-bottom:42px !important;
  }
}
