:root {
  --bg: #151415;
  --ivory: #FDFBDA;
  --text: #F2F0EA;
  --muted: rgba(242,240,234,.64);
  --copper: #9B5008;
  --gold: #B79A55;
  --line: rgba(253,251,218,.18);
  --pad: clamp(22px, 5vw, 76px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--text);font-family:"Inter",sans-serif;font-weight:300;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button{font:inherit}
::selection{background:var(--gold);color:var(--bg)}

.intro{position:fixed;inset:0;z-index:1000;background:var(--bg);display:grid;place-items:center;transition:opacity .65s ease,visibility .65s ease}
.intro.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
.intro__content{text-align:center;width:min(82vw,570px)}
.intro__logo{width:min(76vw,410px);margin:0 auto;opacity:0;animation:introLogo .8s .15s ease forwards}
.intro__line{margin:0;opacity:0;letter-spacing:.025em}
.intro__line--one{margin-top:24px;font-size:clamp(14px,2vw,18px);color:var(--muted);animation:introText .55s .75s ease forwards}
.intro__line--two{margin-top:7px;color:var(--ivory);font-family:"Cormorant Garamond",serif;font-size:clamp(27px,4vw,42px);font-weight:500;animation:introText .55s 1.18s ease forwards}
.intro__arabic{width:min(170px,44vw);margin:18px auto 0;opacity:0;filter:grayscale(1) sepia(.16);animation:introText .55s 1.55s ease forwards}
@keyframes introLogo{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
@keyframes introText{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}

.site-header{position:fixed;z-index:40;left:0;right:0;top:0;height:92px;padding:18px var(--pad);display:flex;align-items:center;justify-content:space-between;background:linear-gradient(to bottom,rgba(21,20,21,.78),transparent);pointer-events:none}
.brand,.menu-button{pointer-events:auto}
.brand img{width:clamp(145px,18vw,220px)}
.menu-button{width:48px;height:48px;border:0;background:transparent;display:grid;align-content:center;gap:7px;cursor:pointer;padding:10px}
.menu-button span{display:block;height:1px;background:var(--ivory);transition:.25s ease}.menu-button span:last-child{width:70%;justify-self:end}
.menu{position:fixed;z-index:80;inset:0;background:rgba(21,20,21,.985);opacity:0;visibility:hidden;transition:.35s ease;display:grid;place-items:center}
.menu.is-open{opacity:1;visibility:visible}.menu__close{position:absolute;right:var(--pad);top:22px;background:none;border:0;color:var(--ivory);font-size:42px;font-weight:200;cursor:pointer}
.menu__inner{width:min(880px,82vw);display:flex;flex-direction:column}
.menu__inner a{font-family:"Cormorant Garamond",serif;font-size:clamp(34px,6vw,72px);line-height:1.03;padding:7px 0;border-bottom:1px solid var(--line);transition:.25s ease}
.menu__inner a:hover{color:var(--gold);padding-left:12px}.menu__inner span{font-family:"Inter",sans-serif;font-size:11px;color:var(--gold);margin-right:22px;vertical-align:middle}

.eyebrow,.section-index,.event__meta{font-size:11px;text-transform:uppercase;letter-spacing:.22em;color:var(--gold)}
h1,h2,h3,blockquote{font-family:"Cormorant Garamond",serif;font-weight:500;margin:0;color:var(--ivory)}

.hero{min-height:100svh;position:relative;display:flex;align-items:flex-end;padding:140px var(--pad) 10vh;overflow:hidden;background:var(--bg)}
.hero__image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 45%;transform:scale(1.015)}
.hero__shade{position:absolute;inset:0;background:
  linear-gradient(to top,rgba(10,9,10,.88) 0%,rgba(10,9,10,.23) 55%,rgba(10,9,10,.48) 100%),
  linear-gradient(to right,rgba(10,9,10,.55),rgba(10,9,10,.02) 65%)}
.hero__grain{position:absolute;inset:0;opacity:.10;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.2'/%3E%3C/svg%3E")}
.hero__content{position:relative;z-index:2;max-width:1050px}
h1{font-size:clamp(70px,12vw,168px);line-height:.74;letter-spacing:-.05em;text-shadow:0 2px 28px rgba(0,0,0,.22)}
.hero__tagline{margin:28px 0 0;color:rgba(255,255,255,.76);letter-spacing:.08em;font-size:clamp(13px,1.4vw,18px)}
.scroll-hint{position:absolute;z-index:3;right:var(--pad);bottom:7vh;color:rgba(255,255,255,.72);font-size:12px;letter-spacing:.12em;text-transform:uppercase}.scroll-hint span{color:var(--ivory);margin-left:8px}
.photo-credit{position:absolute;right:18px;bottom:18px;z-index:3;margin:0;font-size:9px;letter-spacing:.08em;color:rgba(255,255,255,.62);writing-mode:vertical-rl;transform:rotate(180deg)}

.section{padding:110px var(--pad);border-top:1px solid var(--line)}
.about{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(320px,.75fr);gap:clamp(48px,8vw,130px);align-items:center;min-height:90vh}
.about__copy h2{font-size:clamp(64px,9vw,126px);line-height:.79;letter-spacing:-.045em}
.about__lead{font-family:"Cormorant Garamond",serif;color:var(--ivory);font-size:clamp(25px,3vw,42px);line-height:1.1;margin:48px 0 22px;max-width:820px}
.about__body{color:var(--muted);max-width:680px;line-height:1.72;font-size:15px}
.about__visual{margin:0;align-self:end}.about__visual img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center;border:1px solid var(--line)}
.about__visual figcaption{color:var(--muted);font-size:11px;line-height:1.5;margin-top:12px}

.manifesto{position:relative;min-height:92vh;display:flex;align-items:flex-end;overflow:hidden;padding:120px var(--pad)}
.manifesto__image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.manifesto__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,8,9,.92) 0%,rgba(9,8,9,.72) 48%,rgba(9,8,9,.28) 100%),linear-gradient(to top,rgba(9,8,9,.55),transparent 60%)}
.manifesto__content{position:relative;z-index:2;max-width:1050px}
.manifesto blockquote{font-size:clamp(48px,7vw,100px);line-height:.95;letter-spacing:-.035em}
.manifesto__content>p:last-child{max-width:650px;color:rgba(255,255,255,.74);line-height:1.7;margin:30px 0 0;font-size:15px}
.photo-credit--manifesto{bottom:26px}

.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:50px;margin-bottom:70px}
.section-heading .section-index{margin:0 0 28px}
.section-heading h2,.placeholder h2,.contact h2{font-size:clamp(62px,9vw,124px);line-height:.8;letter-spacing:-.045em}
.events{min-height:auto}
.events__intro{max-width:390px;color:var(--muted);line-height:1.7;font-size:14px;margin:0 0 8px}

.event-card{border-top:1px solid var(--line);padding:62px 0;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(330px,.85fr);gap:clamp(35px,6vw,90px);align-items:end}
.event-card:last-child{border-bottom:1px solid var(--line)}
.event-card--reverse .event-card__visual{order:2}.event-card--reverse .event-card__copy{order:1}
.event-card__visual{position:relative;overflow:hidden;background:#0e0d0e}
.event-card__visual img{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.event-card:hover .event-card__visual img{transform:scale(1.025)}
.photo-credit--card{bottom:10px;right:10px}
.event-card__copy{padding-bottom:12px}
.event-card__copy--wide{grid-column:1/-1;max-width:900px}
.event__number{display:block;font-family:"Cormorant Garamond",serif;font-size:clamp(52px,7vw,90px);color:var(--copper);line-height:1;margin-bottom:34px}
.event-card h3{font-size:clamp(52px,7vw,92px);line-height:.88;letter-spacing:-.035em}
.event-card__copy>p:last-child{color:var(--muted);margin:18px 0 0;max-width:560px;line-height:1.65;font-size:14px}

.placeholder{min-height:70vh}.placeholder p:not(.section-index){max-width:620px;color:var(--muted);font-size:16px;line-height:1.7;margin-top:40px}
.contact{min-height:65vh}.contact__mail{display:inline-block;margin-top:60px;font-family:"Cormorant Garamond",serif;font-size:clamp(28px,5vw,64px);color:var(--ivory);border-bottom:1px solid var(--gold)}.contact__note{color:var(--muted);font-size:13px;margin-top:20px}
.footer{padding:64px var(--pad);border-top:1px solid var(--line);display:grid;grid-template-columns:1.1fr 1fr auto;align-items:end;gap:32px;color:var(--muted);font-size:12px}.footer img{width:190px}.footer p{margin:4px 0}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .85s ease,transform .85s ease}.reveal.is-visible{opacity:1;transform:none}

@media (max-width:900px){
  .about{grid-template-columns:1fr;min-height:auto}.about__visual{width:min(82vw,620px);justify-self:end}.about__visual img{aspect-ratio:4/3}
  .event-card{grid-template-columns:1fr}.event-card--reverse .event-card__visual,.event-card--reverse .event-card__copy{order:initial}
  .section-heading{display:block}.events__intro{margin-top:32px}
}
@media (max-width:700px){
  .site-header{height:76px}.brand img{width:140px}
  .hero{padding:120px var(--pad) 12vh}.hero__image{object-position:52% center}.hero__shade{background:linear-gradient(to top,rgba(10,9,10,.92) 0%,rgba(10,9,10,.30) 68%,rgba(10,9,10,.48) 100%)}
  h1{font-size:clamp(62px,20vw,102px);line-height:.78}.scroll-hint{left:var(--pad);right:auto}.photo-credit{right:9px;bottom:16px}
  .section{padding-top:82px;padding-bottom:82px}.section-index{margin-bottom:34px}
  .about__copy h2{font-size:clamp(60px,18vw,92px)}.about__visual{width:100%}.about__visual img{aspect-ratio:4/5}
  .manifesto{min-height:85vh;padding:90px var(--pad)}.manifesto__image{object-position:58% center}.manifesto__shade{background:linear-gradient(to top,rgba(9,8,9,.94) 0%,rgba(9,8,9,.58) 72%,rgba(9,8,9,.25) 100%)}
  .manifesto blockquote{font-size:clamp(46px,14vw,72px)}
  .section-heading h2{margin-top:22px}.event-card{padding:48px 0}.event-card__visual img{aspect-ratio:4/3}
  .footer{grid-template-columns:1fr}.footer img{width:155px}.intro__arabic{width:125px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.intro__logo,.intro__line,.intro__arabic{animation:none;opacity:1}.reveal{opacity:1;transform:none;transition:none}.event-card__visual img{transition:none}}


/* ---------- Shared text links ---------- */
.text-link{
  display:inline-flex;align-items:center;gap:14px;margin-top:26px;
  color:var(--ivory);font-size:12px;text-transform:uppercase;letter-spacing:.14em;
  border-bottom:1px solid var(--gold);padding-bottom:7px;transition:.25s ease
}
.text-link:hover{color:var(--gold);gap:20px}

/* ---------- Mémoire Gnawa inner page ---------- */
.site-header--solid{background:linear-gradient(to bottom,rgba(21,20,21,.96),rgba(21,20,21,.48),transparent)}
.inner-page{background:var(--bg)}
.inner-hero{
  min-height:100svh;padding:150px var(--pad) 80px;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.72fr);
  gap:clamp(45px,8vw,130px);align-items:end;border-bottom:1px solid var(--line)
}
.inner-hero__copy{padding-bottom:4vh}
.inner-hero h1{font-size:clamp(82px,13vw,184px);line-height:.72}
.inner-hero__lead{
  max-width:680px;margin:42px 0 0;font-family:"Cormorant Garamond",serif;
  color:var(--ivory);font-size:clamp(25px,3vw,42px);line-height:1.08
}
.inner-hero__visual{align-self:stretch;min-height:580px;position:relative;overflow:hidden}
.inner-hero__visual img{width:100%;height:100%;object-fit:cover;object-position:center}

.story-grid{
  display:grid;grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr);
  gap:clamp(55px,10vw,150px);align-items:start
}
.story-grid__title h2,.mission h2,.milestones h2,.association-cta h2{
  font-size:clamp(62px,9vw,124px);line-height:.8;letter-spacing:-.045em
}
.story-grid__text{padding-top:64px;max-width:780px}
.story-grid__text p{color:var(--muted);line-height:1.75;font-size:15px;margin:0 0 22px}
.story-grid__text .story-grid__lead{
  color:var(--ivory);font-family:"Cormorant Garamond",serif;
  font-size:clamp(28px,3.4vw,46px);line-height:1.12;margin-bottom:32px
}

.mission__list{margin-top:65px;border-top:1px solid var(--line)}
.mission__item{
  display:grid;grid-template-columns:100px minmax(250px,.55fr) minmax(320px,1fr);
  gap:clamp(25px,5vw,75px);align-items:baseline;
  padding:34px 0;border-bottom:1px solid var(--line)
}
.mission__item>span{font-family:"Cormorant Garamond",serif;color:var(--copper);font-size:42px}
.mission__item h3{font-size:clamp(38px,5vw,66px);line-height:.9}
.mission__item p{margin:0;color:var(--muted);line-height:1.65;font-size:14px;max-width:650px}

.association-manifesto{
  min-height:90vh;position:relative;display:flex;align-items:flex-end;
  padding:110px var(--pad);overflow:hidden
}
.association-manifesto>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.association-manifesto__shade{
  position:absolute;inset:0;background:
    linear-gradient(to right,rgba(7,7,7,.92),rgba(7,7,7,.56) 60%,rgba(7,7,7,.18)),
    linear-gradient(to top,rgba(7,7,7,.72),transparent 58%)
}
.association-manifesto__copy{position:relative;z-index:2;max-width:1100px}
.association-manifesto blockquote{
  font-size:clamp(52px,7.8vw,112px);line-height:.91;letter-spacing:-.04em
}

.milestones{display:grid;grid-template-columns:minmax(260px,.55fr) minmax(480px,1.15fr);gap:clamp(55px,10vw,150px)}
.milestones__heading h2{margin-top:38px}
.milestones__timeline{border-top:1px solid var(--line)}
.milestone{
  display:grid;grid-template-columns:100px 1fr;gap:34px;
  padding:34px 0;border-bottom:1px solid var(--line)
}
.milestone time{font-size:11px;letter-spacing:.2em;color:var(--gold)}
.milestone h3{font-size:clamp(34px,4vw,54px);margin-bottom:10px}
.milestone p{margin:0;color:var(--muted);line-height:1.65;font-size:14px}

.association-cta{min-height:68vh}
.association-cta h2{margin-top:30px}
.association-cta__links{display:flex;gap:34px;flex-wrap:wrap;margin-top:38px}
.association-cta__links .text-link{margin-top:0}

@media (max-width:900px){
  .inner-hero{grid-template-columns:1fr;padding-top:125px}
  .inner-hero__visual{min-height:0;aspect-ratio:4/3}
  .story-grid,.milestones{grid-template-columns:1fr}
  .story-grid__text{padding-top:0}
  .mission__item{grid-template-columns:70px 1fr}
  .mission__item p{grid-column:2}
}
@media (max-width:700px){
  .inner-hero{padding:115px var(--pad) 55px}
  .inner-hero h1{font-size:clamp(76px,24vw,112px)}
  .inner-hero__visual{aspect-ratio:4/5}
  .mission__item{grid-template-columns:50px 1fr;gap:18px;padding:28px 0}
  .mission__item>span{font-size:30px}
  .association-manifesto{min-height:78vh;padding:85px var(--pad)}
  .association-manifesto>img{object-position:56% center}
  .association-manifesto__shade{background:linear-gradient(to top,rgba(7,7,7,.94),rgba(7,7,7,.5) 75%,rgba(7,7,7,.18))}
  .milestone{grid-template-columns:70px 1fr;gap:18px}
}
