/* v20 — photographic opening, a gallery of voices, and an exhibition-like rhythm. */
:root{--paper:#f4f0e7;--ink:#183834;--navy:#173d38;--muted:#5d665f;--terra:#925336;--gold:#dec69d;--line:#d5d1c6;--gutter:clamp(24px,5.5vw,100px)}
.site-header{height:86px;border-bottom:0;gap:24px}.brand .emb{color:var(--ink)}.desktop-nav{gap:23px}.header-cta{font-size:10px}.header-actions{gap:20px}
h2{font-size:clamp(46px,4.8vw,82px);line-height:1.04}.section{padding-top:110px;padding-bottom:110px}.section-label{font-size:10px;letter-spacing:.18em}.text-link{font-size:12px;transition:color .2s,border-color .2s}.text-link span{transition:transform .2s}.text-link:hover span{transform:translate(3px,-3px)}
/* One photographic plane, with text kept clear of the central entrance. */
.museum-hero{position:relative;display:grid;grid-template-columns:1fr;grid-template-rows:minmax(640px,calc(100svh - 144px)) auto;background:#18332e;color:#fffaf0;isolation:isolate}
.hero-architecture{grid-area:1/1;width:100%;height:100%;aspect-ratio:auto;max-height:none;position:relative;z-index:0}
.hero-architecture>img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:center 48%}
.hero-architecture:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,27,23,.72),rgba(9,27,23,.12) 66%),linear-gradient(0deg,rgba(9,27,23,.68),transparent 30%);pointer-events:none}
.hero-architecture figcaption{position:absolute;bottom:20px;inset-inline:var(--gutter);padding:0;background:none;z-index:2;justify-content:flex-end}
.hero-architecture figcaption>span:first-child{display:none}.hero-architecture figcaption>span:last-child{font-size:9px;letter-spacing:.05em;color:#eee9de}
.hero-intro{grid-area:1/1;position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:55px var(--gutter) 85px;gap:30px;pointer-events:none}
.hero-intro a{pointer-events:auto}.hero .eyebrow{font-size:10px;letter-spacing:.18em}.hero .tiny-star{color:var(--gold)}
.museum-hero h1,.lang-en .museum-hero h1{font-size:clamp(78px,8vw,138px);line-height:.92;letter-spacing:-.035em;margin:35px 0 0;text-shadow:0 2px 25px #071e161c}
.museum-hero h1 em{color:#f5ddb4}.hero-invitation{max-width:380px}.hero-invitation>p:first-child{font-family:var(--sans);font-size:17px;line-height:1.6;max-width:340px}.hero-invitation .hero-description{display:none}.hero-invitation .text-link{margin-top:16px;color:#fffaf0;border-color:#f5f1e88c;font-size:11px;gap:60px}.hero-invitation .text-link:hover{color:var(--gold)}
.museum-hero .hero-bottom{grid-area:2/1;margin:0;padding:22px var(--gutter);border-top:1px solid #ffffff30;background:var(--navy);width:100%;font-size:9px;letter-spacing:.13em}.hero-bottom a span,.hero-bottom .scroll-label{color:var(--gold)}
/* Sources stay visible; tabs enhance a complete, readable HTML document. */
.voices-gallery{background:#eee9df;padding-top:80px;padding-bottom:42px}
.voices-heading{display:flex;justify-content:space-between;gap:60px;align-items:flex-end;margin-bottom:35px}.voices-heading .section-label{margin-bottom:25px}.voices-heading h2{font-size:clamp(44px,4.4vw,72px)}.voices-heading>p{max-width:290px;font-size:13px;color:var(--muted);padding-bottom:5px}
.voice-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:38px}
.voice-tabs button{color:var(--muted);position:relative;display:flex;align-items:center;gap:12px;padding:14px 12px;border:0;border-bottom:2px solid transparent;background:transparent;text-align:start;cursor:pointer;min-height:80px;font-size:12px;line-height:1.3}
.voice-tabs button:first-child{padding-inline-start:0}.voice-tabs button:last-child{padding-inline-end:0}.voice-tabs button:hover,.voice-tabs button[aria-selected=true]{color:var(--ink);border-bottom-color:var(--terra)}.voice-tabs button[aria-selected=true]{background:#ffffff35}
.voice-tab-number{font-size:9px;color:var(--terra)}.voice-tabs img{width:36px;height:43px;object-fit:cover;object-position:center 22%;filter:grayscale(1)}
.voice-panel{display:grid;grid-template-columns:.77fr 1.6fr;gap:clamp(40px,6vw,110px);align-items:center;padding:0 0 20px}.voice-panel+.voice-panel{margin-top:50px}
.voices-ready .voice-panel+.voice-panel{margin-top:0}.voice-portrait{position:relative;align-self:stretch;background:#d4d2c7;min-height:395px;max-height:480px;overflow:hidden}.voice-portrait img{width:100%;height:100%;position:absolute;object-fit:cover;object-position:center 24%;filter:grayscale(1)}
.portrait-index{position:absolute;bottom:18px;inset-inline-start:20px;color:#fff;background:#102824b3;padding:6px 11px;font-size:10px;letter-spacing:.15em}
.voice-copy{padding:6px 0;max-width:780px}.voice-context-date{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--terra)}.voice-copy blockquote{font:400 clamp(31px,3.35vw,57px)/1.12 var(--serif);letter-spacing:-.018em;margin:24px 0 25px;color:var(--ink);text-wrap:pretty}.voice-copy h3{font:500 13px/1.4 var(--sans);letter-spacing:.02em}.voice-role{font-size:10px;color:var(--muted);margin-top:5px}.voice-context{font-size:12px;line-height:1.75;color:var(--muted);max-width:500px;margin-top:20px}.voice-copy .text-link{font-size:10px;padding:10px 0;gap:22px;margin-top:6px}.quote-language{font-size:9px;color:var(--muted);display:inline-block;margin-inline-start:22px}.voices-note{font-size:9px;line-height:1.6;color:var(--muted);border-top:1px solid var(--line);padding-top:18px;margin-top:12px}
/* The proposition breathes; the heritage becomes a full-height photographic spread. */
.introduction{border-top:0}.intro-layout{grid-template-columns:1.1fr 1fr;gap:10vw}.intro-layout h2{max-width:630px}.intro-body{padding-top:8px}.intro-body .lead{font-size:21px;line-height:1.55}.principles{margin-top:70px}.principles>div{border-top:1px solid var(--line);padding-top:25px}.principle-number{top:30px}.principles h3{font-size:30px}
.legacy{grid-template-columns:1.1fr .9fr;margin:0 var(--gutter);position:relative}.legacy-copy{padding:75px clamp(35px,5vw,80px)}.legacy h2{font-size:clamp(44px,4.3vw,70px)}.legacy-image{min-height:700px}.legacy-image img{object-position:center center}.legacy-image figcaption{font-size:9px;padding:50px 25px 22px}.legacy-tags{gap:12px 20px}.legacy-tags span{border:0;border-bottom:1px solid #ffffff40;padding:0 0 7px}
.pillars{padding-top:120px}.pillars .section-heading{margin-bottom:65px}.pillar-grid{gap:70px 55px}.pillar-card:first-child{grid-template-columns:1.55fr 1fr;gap:0 65px}.pillar-card:first-child figure{aspect-ratio:1.35}.pillar-card:first-child h3{font-size:72px}.pillar-card .card-title>span{font-size:10px}.pillar-card>p{font-size:14px;line-height:1.8}.pillar-card:first-child>p{max-width:360px}.pillar-card:not(:first-child){max-width:100%}.pillar-card:nth-child(3){margin-top:100px}.pillar-card:not(:first-child) figure{aspect-ratio:1.3}.card-title h3{font-size:48px}.pillar-card figcaption{background:#1a322bc9;color:white;padding:8px 12px;font-size:8px}
.experience{background:#e9e5db}.experience>div:first-child{max-width:960px}.experience-layout{margin-top:65px;grid-template-columns:1fr 1.1fr;gap:10vw}.experience-layout figure{max-width:450px}.experience-layout img{height:460px;object-fit:contain;mix-blend-mode:multiply}.experience-questions summary{font-size:32px}.architecture{margin:0;padding-top:100px;padding-bottom:100px}.architecture-values{border-top-color:#ffffff30}.houses{padding-top:120px;padding-bottom:100px}.houses-grid article{border-top:1px solid var(--ink);padding-top:30px}.houses-grid h3{font-size:42px}.house-status{border-radius:0}.roadmap{border-top:1px solid var(--line);background:#eee9df}.circle{position:relative;overflow:hidden}.circle:before{content:'';position:absolute;width:470px;height:680px;border:1px solid #dec69d24;border-radius:50% 50% 0 0;right:-180px;top:90px;pointer-events:none}.circle h2{font-size:clamp(52px,6.3vw,102px);max-width:1200px}.footer{background:#eee9df}
.lang-ar .hero-intro{padding-top:50px;padding-bottom:85px}.lang-ar .museum-hero h1{font-size:clamp(72px,7vw,116px);line-height:1.24;margin-top:20px}.lang-ar .hero-invitation>p:first-child{font-size:20px;line-height:1.6}.lang-ar .hero-architecture:after{background:linear-gradient(270deg,rgba(9,27,23,.76),rgba(9,27,23,.1) 72%),linear-gradient(0deg,rgba(9,27,23,.65),transparent 30%)}.lang-ar .voices-heading h2{font-size:60px}.lang-ar .voice-copy blockquote{line-height:1.65;font-size:35px;letter-spacing:0;margin:18px 0}.lang-ar .voice-context-date{letter-spacing:0;font-size:12px}.lang-ar .voice-context{font-size:13px}.lang-ar .voice-tabs button{font-size:12px;gap:8px}.lang-ar .voice-role{font-size:11px}.lang-ar .voices-heading>p{font-size:14px}.lang-ar .voices-note{font-size:10px}.lang-ar .quote-language{font-size:10px}
@media(min-width:1800px){.museum-hero{grid-template-rows:minmax(750px,calc(100svh - 145px)) auto}.voice-portrait{max-height:520px}}
@media(max-width:1250px){.desktop-nav{gap:17px;font-size:10px}.header-cta{display:none}.site-header{gap:18px}.voice-tabs button{font-size:11px;gap:8px}.voice-tab-number{display:none}.hero-intro{gap:23px}.voice-panel{gap:50px}.pillar-card:first-child{gap:0 40px}.pillar-card:first-child h3{font-size:58px}.legacy-copy{padding:65px 35px}.legacy h2{font-size:52px}.lang-ar .desktop-nav{font-size:10px;gap:12px}}
@media(max-width:850px){.site-header{height:76px}.museum-hero{grid-template-rows:minmax(620px,calc(100svh - 130px)) auto}.hero-intro{padding-top:40px}.museum-hero h1,.lang-en .museum-hero h1{font-size:clamp(70px,10vw,92px)}.hero-architecture>img{object-position:60% center}.voices-heading{gap:30px}.voices-heading>p{max-width:230px}.voice-tabs img{display:none}.voice-tabs button{min-height:60px;justify-content:center}.voice-panel{grid-template-columns:.8fr 1.3fr;gap:30px}.voice-portrait{min-height:400px}.voice-copy blockquote{font-size:37px}.intro-layout{grid-template-columns:1fr;gap:35px}.intro-body{max-width:630px}.legacy{margin:0;grid-template-columns:1.1fr 1fr}.legacy-copy{padding:65px var(--gutter)}.legacy h2{font-size:43px}.legacy-image{min-height:650px}.pillar-card:first-child{gap:0 30px}.pillar-card:first-child h3{font-size:47px}.pillar-card:nth-child(3){margin-top:70px}.pillar-grid{gap:50px 30px}.experience-layout{gap:50px}.experience-layout img{height:370px}.lang-ar .voices-heading h2{font-size:46px}.lang-ar .voice-copy blockquote{font-size:28px}.lang-ar .voice-tabs button{font-size:11px}.lang-ar .hero-architecture figcaption>span:last-child{font-size:9px}}
@media(max-width:700px){
.site-header{height:74px}.section{padding-top:65px;padding-bottom:65px}.museum-hero{grid-template-rows:minmax(650px,calc(100svh - 120px)) auto}.hero-intro{padding:38px var(--gutter) 68px;justify-content:space-between;gap:150px}.hero-architecture:after{background:linear-gradient(180deg,#10231bc2,transparent 64%),linear-gradient(0deg,#10231be6,transparent 52%)}.hero-architecture>img{object-position:57% center}.hero .eyebrow{font-size:8px}.museum-hero h1,.lang-en .museum-hero h1{font-size:clamp(57px,12.8vw,88px);line-height:.97;margin-top:24px}.hero-invitation>p:first-child{font-size:15px}.hero-invitation .text-link{margin-top:10px;font-size:11px;gap:40px}.hero-architecture figcaption{bottom:16px;gap:0;align-items:flex-end}.hero-architecture figcaption>span:last-child{font-size:7px}.museum-hero .hero-bottom{padding:16px var(--gutter);font-size:8px;letter-spacing:.03em;gap:20px}.hero-bottom>a{max-width:165px}.hero-bottom>a span{margin-left:5px}.voices-gallery{padding-top:48px;padding-bottom:30px}.voices-heading{display:block;margin-bottom:25px}.voices-heading .section-label{margin-bottom:22px}.voices-heading h2{font-size:44px}.voices-heading>p{max-width:330px;font-size:12px;margin-top:20px}.voice-tabs{display:flex;overflow-x:auto;gap:0;margin-bottom:24px;scrollbar-width:thin}.voice-tabs button{flex:0 0 auto;padding:12px 16px;min-height:65px;font-size:11px;justify-content:flex-start}.voice-tabs img{display:block;width:30px;height:37px}.voice-tabs button:first-child{padding-inline-start:0}.voice-tabs button:last-child{padding-inline-end:14px}.voice-panel{display:grid;grid-template-columns:1fr;gap:25px;padding-bottom:5px}.voice-portrait{height:300px;min-height:0;max-height:none;width:100%;background:#d0cfc7}.voice-portrait img{object-position:center 27%;width:100%;height:100%}.voice-copy blockquote{font-size:35px;line-height:1.16;margin:20px 0}.voice-copy h3{font-size:13px}.voice-context{font-size:12px}.voice-context-date{font-size:9px}.voices-note{margin-top:24px;font-size:8px}.quote-language{margin-inline-start:14px;font-size:8px}.intro-layout h2{font-size:45px}.intro-body .lead{font-size:19px}.principles{margin-top:40px}.principles>div{padding-top:20px}.legacy{grid-template-columns:1fr;margin:0 var(--gutter)}.legacy-copy{padding:42px 25px}.legacy h2{font-size:39px}.legacy .section-label{font-size:8px;gap:13px}.legacy-copy>p:not(.section-label){font-size:13px}.legacy-tags span{font-size:8px}.legacy-image{height:auto;min-height:0;max-height:none;aspect-ratio:2155/3012}.legacy-image img{position:static;object-fit:contain}.legacy-image figcaption{font-size:8px;padding:40px 20px 18px}.pillars .section-heading{margin-bottom:35px}.pillar-grid{gap:45px;display:block}.pillar-card+.pillar-card{margin-top:45px}.pillar-card:nth-child(3){margin-top:45px}.pillar-card:first-child{display:block}.pillar-card:first-child figure,.pillar-card:not(:first-child) figure{aspect-ratio:1.25}.pillar-card:first-child h3,.card-title h3{font-size:44px}.pillar-card:first-child>p{max-width:none}.pillar-card>p{font-size:13px}.experience-layout{grid-template-columns:1fr;gap:30px;margin-top:40px}.experience-layout figure{max-width:100%;width:100%}.experience-layout img{height:330px;margin:auto}.experience-layout figcaption{text-align:center}.experience-questions summary{font-size:28px}.houses-grid h3{font-size:37px}.circle h2{font-size:44px}.lang-ar .hero-intro{padding-top:32px;padding-bottom:68px}.lang-ar .museum-hero h1{font-size:60px;line-height:1.3}.lang-ar .hero-architecture:after{background:linear-gradient(180deg,#10231bc2,transparent 64%),linear-gradient(0deg,#10231be6,transparent 52%)}.lang-ar .hero-invitation>p:first-child{font-size:18px}.lang-ar .voices-heading h2{font-size:43px}.lang-ar .voice-copy blockquote{font-size:29px}.lang-ar .voice-tabs button{font-size:12px}.lang-ar .voice-portrait img{object-position:center 27%}.lang-ar .intro-layout h2{font-size:39px}.lang-ar .legacy h2{font-size:33px}.lang-ar .hero-architecture figcaption>span:last-child{font-size:8px}.lang-ar .circle h2{font-size:42px}
}
@media(max-width:360px){.museum-hero h1,.lang-en .museum-hero h1{font-size:52px}.voices-heading h2{font-size:39px}.voice-copy blockquote{font-size:31px}.legacy-copy{padding:35px 20px}.legacy h2{font-size:34px}.hero .eyebrow{letter-spacing:.08em}.lang-ar .museum-hero h1{font-size:53px}.lang-ar .voices-heading h2{font-size:37px}.circle h2{font-size:38px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.text-link span{transition:none}}
.hero-intro{width:100%;height:100%;margin:0;max-width:none}
.hero-invitation>p:first-child{color:#fffaf0}
@media(max-width:700px){
  .voice-panel{grid-template-columns:100px minmax(0,1fr);gap:0 20px;align-items:start}
  .voice-portrait{grid-column:1;grid-row:1/4;height:138px;width:100px;align-self:start}
  .voice-portrait img{object-position:center 20%}
  .portrait-index{bottom:8px;inset-inline-start:8px;font-size:7px;padding:3px 5px;letter-spacing:.05em}
  .voice-copy{display:contents}
  .voice-context-date{grid-column:2;grid-row:1;align-self:end;letter-spacing:.06em;font-size:8px;padding-top:8px}
  .voice-copy h3{grid-column:2;grid-row:2;align-self:center;padding-top:12px}
  .voice-role{grid-column:2;grid-row:3;font-size:10px;margin:5px 0 0;padding-bottom:12px}
  .voice-copy blockquote{grid-column:1/-1;grid-row:4;margin:25px 0 0}
  .voice-context{grid-column:1/-1;grid-row:5;margin-top:20px}
  .voice-copy .text-link{grid-column:1/-1;grid-row:6;justify-self:start;margin-top:12px}
  .quote-language{grid-column:1/-1;grid-row:7;margin:8px 0 0}
  .lang-ar .voice-context-date{font-size:10px}.lang-ar .voice-copy blockquote{margin-top:25px}
}
/* v21 — a conceptual architectural drawing introduces the museum as an idea to build. */
.museum-hero{background:#0b2b49}
.hero-architecture:after{background:linear-gradient(90deg,#071d36d9 0%,#0927468c 37%,#09274608 73%),linear-gradient(0deg,#071e34a6,transparent 32%)}
.museum-hero .hero-bottom{background:#102f48;border-top-color:#cadceb35}
.museum-hero h1{text-shadow:0 2px 28px #051c3080}
.hero-architecture figcaption>span:last-child{color:#e1e9ef}
.lang-ar .hero-architecture:after{background:linear-gradient(270deg,#071d36d9 0%,#0927468c 37%,#09274608 73%),linear-gradient(0deg,#071e34a6,transparent 32%)}
@media(max-width:700px){.hero-architecture:after,.lang-ar .hero-architecture:after{background:linear-gradient(180deg,#071e34d9,transparent 60%),linear-gradient(0deg,#071e34f2,transparent 54%)}.hero-architecture>img{object-position:57% center}}
