@import url('https://fonts.googleapis.com/css2?family=Noto+Kufi+Arabic:wght@400;600;800&family=Noto+Sans+Arabic:wght@300;400;600;700;900&display=swap');

:root{
  --chalk:#f2eadc;--plaster:#e5d6c0;--ink:#143a35;--cedar:#0d4c43;
  --coral:#d8705b;--blue:#174b8e;--night:#10231f;--line:rgba(20,58,53,.26);
  --serif:"Noto Sans Arabic",Tahoma,Arial,sans-serif;--kufi:"Noto Kufi Arabic",Tahoma,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--chalk)}
body{margin:0;color:var(--ink);background:var(--chalk);font-family:var(--serif);font-size:18px;line-height:1.9;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button,a{touch-action:manipulation}
.skip{position:fixed;z-index:999;top:-4rem;right:1rem;background:#fff;padding:.6rem 1rem}
.skip:focus{top:1rem}
.eyebrow{font:700 .72rem/1.4 var(--kufi);letter-spacing:.09em;text-transform:uppercase}
.site-nav{height:104px;padding:19px clamp(22px,5vw,78px);display:flex;align-items:center;justify-content:space-between;position:relative;z-index:40;background:var(--chalk)}
.site-nav.over-scene{position:absolute;top:0;right:0;left:0;background:linear-gradient(180deg,rgba(242,234,220,.92),rgba(242,234,220,0))}
.brand{display:grid;grid-template-columns:auto auto;align-items:end;gap:.18rem .45rem;line-height:1}
.brand span{font-size:.84rem;align-self:center}.brand strong{font:900 2rem/1 var(--kufi);color:var(--cedar)}
.brand i{grid-column:1/-1;font-style:normal;font-size:.58rem;letter-spacing:.04em;margin-top:.3rem}
.site-nav nav{display:flex;align-items:center;gap:clamp(18px,2.4vw,38px);font:600 .78rem/1 var(--kufi)}
.site-nav nav a:not(.nav-cta){position:relative}
.site-nav nav a:not(.nav-cta)::after{content:"";position:absolute;right:0;left:100%;bottom:-8px;height:2px;background:var(--coral);transition:left .25s}
.site-nav nav a:hover::after{left:0}
.nav-cta,.door-button{display:inline-flex;align-items:center;justify-content:center;padding:15px 23px;background:var(--cedar);color:#fff;clip-path:polygon(6% 0,100% 0,94% 83%,14% 100%,0 30%);font:700 .78rem/1.4 var(--kufi)}
.menu-toggle{display:none;border:0;background:none;color:var(--ink)}
.hero-room{min-height:100svh;position:relative;background:url('/assets/room-trace-hero.png') center/cover no-repeat;isolation:isolate}
.hero-room::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(242,234,220,0) 25%,rgba(242,234,220,.08) 50%,rgba(242,234,220,.8) 100%);z-index:-1}
.hero-copy{position:absolute;top:20%;right:6vw;width:min(680px,46vw)}
.hero-copy h1{margin:.7rem 0 1.2rem;font:300 clamp(3rem,5.8vw,6.9rem)/1.05 var(--serif);letter-spacing:-.06em}
.hero-copy h1 em{font-style:normal;color:var(--coral);position:relative}
.hero-copy h1 em::after{content:"";height:12px;background:var(--blue);opacity:.8;position:absolute;right:7%;left:-4%;bottom:.08em;z-index:-1;transform:rotate(-1deg);border-radius:60% 15% 70% 20%}
.hero-copy>p:not(.eyebrow){max-width:520px;font-size:1.08rem}
.hero-actions{display:flex;align-items:center;gap:28px;margin-top:2rem}
.bare-link,.text-door,.light-link{font:700 .78rem/1.8 var(--kufi);border-bottom:2px solid currentColor;padding:0 0 .35rem}
.sun-note{position:absolute;left:45%;bottom:11%;display:flex;flex-direction:column;transform:rotate(-4deg);color:rgba(20,58,53,.68)}
.sun-note span{font-size:.67rem}.sun-note strong{font-size:1.1rem;font-weight:400}
.scroll-cue{position:absolute;right:6vw;bottom:3.2%;font-size:.72rem;writing-mode:vertical-rl}.scroll-cue i{font-style:normal;color:var(--coral);font-size:1.4rem}
.trace-story{min-height:950px;position:relative;padding:clamp(100px,12vw,180px) 7vw;background:#e8dbc6;overflow:hidden}
.trace-shape{position:absolute;width:55vw;height:44vw;left:-8vw;top:8vw;background:rgba(251,247,238,.34);border-radius:47% 38% 53% 31% / 42% 55% 36% 52%;box-shadow:inset 0 0 70px rgba(20,58,53,.05)}
.trace-shape::before{content:"";position:absolute;inset:14% 8% 2% 20%;border:2px dashed rgba(20,58,53,.17);border-radius:54% 30% 49% 42% / 32% 58% 35% 52%}
.trace-copy{width:min(630px,47vw);margin-right:auto;position:relative;z-index:2}
.trace-copy h2,.services-wall h2,.guide-library h2,.walkthrough-teaser h2,.voices h2{font:300 clamp(2.7rem,5vw,5.6rem)/1.1 var(--serif);letter-spacing:-.045em;margin:.5rem 0 1.5rem}
.trace-story blockquote{position:absolute;right:7vw;bottom:9%;font:300 clamp(2rem,3.2vw,4rem)/1.35 var(--serif);margin:0;color:var(--coral);transform:rotate(2deg)}
.services-wall{min-height:1400px;padding:clamp(100px,10vw,160px) 7vw 190px;position:relative;background:#eee4d5}
.services-wall::after{content:"";position:absolute;right:0;left:0;bottom:100px;height:16px;background:linear-gradient(180deg,#ad9679,#cbbda7);box-shadow:0 24px 30px rgba(32,29,20,.14)}
.services-wall header{max-width:760px;margin-right:8vw}
.services-wall header>p:last-child{max-width:560px}
.service-script{margin:90px auto 0;max-width:1180px;display:flex;flex-wrap:wrap;gap:0 5vw;align-items:baseline}
.service-script a{width:calc(50% - 3vw);display:grid;grid-template-columns:45px 1fr auto;align-items:baseline;gap:12px;padding:18px 0 13px;border-bottom:1px solid var(--line);transform:rotate(var(--lean));transition:transform .2s,color .2s}
.service-script a:hover{transform:rotate(0) translateX(-12px);color:var(--coral)}
.service-script small{color:var(--coral)}.service-script strong{font-size:1.3rem;font-weight:500}.service-script span{font-size:.68rem;opacity:.65}
.floor-arrow{position:absolute;left:8vw;bottom:45px;font:700 .78rem var(--kufi)}
.floor-arrow span{font-size:1.6rem;color:var(--blue)}
.hallway-story{min-height:1080px;display:grid;grid-template-columns:55% 45%;background:var(--night);color:#fff}
.hallway-image{background:url('/assets/protected-hallway.png') center/cover no-repeat;min-height:1080px;clip-path:polygon(0 0,86% 0,100% 12%,94% 100%,0 100%)}
.hallway-words{padding:130px 7vw 100px 5vw;align-self:center}
.hallway-words h2{font:300 clamp(3rem,5.2vw,6rem)/1.05 var(--serif);margin:.5rem 0 3rem}
.hallway-words ol{list-style:none;margin:0 0 3rem;padding:0}
.hallway-words li{display:grid;grid-template-columns:55px 1fr;gap:0 15px;padding:22px 0;border-bottom:1px solid rgba(255,255,255,.2)}
.hallway-words li b{grid-row:1/3;color:var(--coral);font:400 .8rem var(--kufi)}
.hallway-words li strong{font-weight:500;font-size:1.2rem}.hallway-words li span{opacity:.7;font-size:.82rem}
.voices{min-height:950px;padding:130px 7vw;background:#d7cbc0;position:relative;overflow:hidden}
.voices::before{content:"";position:absolute;width:46vw;height:52vw;left:-8vw;bottom:-22vw;border-radius:45% 56% 48% 44%;background:rgba(23,75,142,.08)}
.voice-title{max-width:520px}
.voice{position:absolute;margin:0;width:min(390px,27vw)}
.voice blockquote{margin:0;font:400 clamp(1.15rem,1.7vw,1.75rem)/1.75 var(--serif)}
.voice blockquote::before{content:"“";font-size:5rem;color:var(--coral);line-height:.5;display:block}
.voice figcaption{font-size:.68rem;margin-top:1rem;border-top:1px solid var(--ink);padding-top:.5rem}
.voice.v1{top:18%;left:10%;transform:rotate(-3deg)}.voice.v2{top:48%;right:36%;transform:rotate(2deg)}.voice.v3{bottom:9%;left:13%;transform:rotate(-1deg)}
.guide-library{padding:150px 9vw;background:#f3ecdf;position:relative}
.library-heading{max-width:620px;margin-right:auto;margin-left:10vw}
.guide-lines{margin:70px auto;max-width:1120px}
.guide-lines a{display:grid;grid-template-columns:65px 1fr 190px;gap:20px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line)}
.guide-lines a:first-child{border-top:1px solid var(--line)}
.guide-lines a span{font:400 .7rem var(--kufi);color:var(--coral)}
.guide-lines a strong{font-size:1.15rem;font-weight:500}.guide-lines a em{text-align:left;font-style:normal;font-size:.72rem;opacity:.65}
.guide-lines a:hover strong{color:var(--coral);padding-right:12px}.guide-lines strong{transition:.2s}
.walkthrough-teaser{min-height:760px;padding:130px 9vw;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:10vw;background:#c9b7a0}
.walkthrough-teaser>div:first-child{max-width:660px}
.doorframe{height:520px;border:18px solid #77573e;border-bottom:0;position:relative;background:linear-gradient(155deg,#f3e8d7,#b4a38c);box-shadow:inset 30px 0 40px rgba(28,27,22,.17)}
.doorframe::after{content:"";position:absolute;right:12%;bottom:0;width:54%;height:73%;background:#174b8e;clip-path:polygon(0 9%,90% 0,100% 100%,12% 100%);opacity:.78}
.doorframe span,.doorframe b{position:absolute;z-index:2;font:600 .72rem var(--kufi)}.doorframe span{top:16%;right:-55px;transform:rotate(90deg)}.doorframe b{bottom:8%;left:4%;color:#fff}
.doorframe i{position:absolute;top:50%;left:28px;width:14px;height:14px;border-radius:50%;background:var(--coral);z-index:3}
.page-opening{min-height:710px;padding:130px 9vw 100px;background:#e8dbc6;position:relative;overflow:hidden}
.page-opening::before{content:"";position:absolute;right:-12vw;bottom:-18vw;width:58vw;height:48vw;background:rgba(255,255,255,.27);border-radius:58% 36% 48% 42%/42% 62% 34% 51%;transform:rotate(-8deg)}
.wall-mark{position:absolute;left:6vw;top:18%;font:900 clamp(7rem,19vw,22rem)/1 var(--kufi);color:rgba(20,58,53,.055);transform:rotate(-7deg);white-space:nowrap}
.page-opening>*:not(.wall-mark){position:relative;z-index:1;max-width:850px}
.page-opening h1{font:300 clamp(3.2rem,7vw,8rem)/1.1 var(--serif);letter-spacing:-.055em;margin:1rem 0 1.4rem}
.opening-lead{font-size:1.2rem;max-width:700px!important}
.directory-scene,.library-index{padding:120px 8vw;background:#f3ecdf;position:relative}
.directory-note{max-width:530px;margin:0 10vw 60px auto}
.directory-lines{max-width:1180px;margin:auto}
.directory-lines a{display:grid;grid-template-columns:60px 1fr 210px;gap:26px;align-items:center;padding:24px 0;border-bottom:1px solid var(--line)}
.directory-lines a>b{font:400 .72rem var(--kufi);color:var(--coral)}
.directory-lines a span{display:flex;flex-direction:column}.directory-lines strong{font-size:1.35rem;font-weight:500}.directory-lines small{font-size:.74rem;opacity:.66}
.directory-lines em{text-align:left;font-style:normal;font-size:.75rem}
.directory-lines a:hover strong{color:var(--blue)}
.shelf-word{font:900 clamp(8rem,24vw,25rem)/.7 var(--kufi);color:rgba(216,112,91,.08);position:absolute;left:-3vw;top:7rem;writing-mode:vertical-rl}
.library-index .guide-lines{position:relative}
.service-moment{padding:120px 9vw;display:grid;grid-template-columns:1fr 1.05fr;gap:8vw;align-items:center;background:#d5c3ac}
.service-imprint{height:600px;border-radius:42% 47% 36% 51%/55% 35% 58% 44%;background:rgba(245,239,227,.45);box-shadow:inset 0 0 80px rgba(20,58,53,.09);display:grid;place-items:center;transform:rotate(-3deg)}
.service-imprint span{font:300 clamp(2rem,4vw,4.7rem)/1.2 var(--serif);color:rgba(20,58,53,.35);transform:rotate(3deg);text-align:center;padding:2rem}
.service-moment h2,.core-statement h2,.success-scene h2,.admin-entry h2{font:300 clamp(2.6rem,5vw,5.2rem)/1.15 var(--serif);margin:.5rem 0 1.4rem}
.service-moment dl{margin:2rem 0}.service-moment dl>div{display:flex;justify-content:space-between;gap:25px;border-bottom:1px solid var(--line);padding:12px 0}
.service-moment dt{font-weight:700}.service-moment dd{margin:0;text-align:left}
.reading-note,.core-statement{margin:100px auto;max-width:920px;padding:0 6vw}
.reading-note{border-right:10px solid var(--coral)}.reading-note span{font-size:.7rem}.reading-note strong{display:block;font:300 3.2rem var(--serif);margin:.4rem 0}
.core-statement p{max-width:740px}
.core-lines{padding:40px 9vw 120px;background:#d5c3ac}.core-lines>div{max-width:1050px;margin:auto;display:grid;grid-template-columns:70px 260px 1fr;gap:30px;align-items:baseline;padding:21px 0;border-bottom:1px solid var(--line)}.core-lines b{font:.7rem var(--kufi);color:var(--coral)}.core-lines h3{margin:0;font-size:1.4rem;font-weight:500}.core-lines p{margin:0}
.longform{padding:150px 8vw;background:#f6f0e5}
.long-intro{display:flex;justify-content:space-between;align-items:end;max-width:1120px;margin:0 auto 100px;border-bottom:1px solid var(--line)}
.long-intro span{font:.7rem var(--kufi);padding-bottom:1.5rem}.long-intro h2{font:300 clamp(2.4rem,4vw,4.8rem)/1.2 var(--serif);margin:0 0 1rem}
.long-chapter{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:100px minmax(0,820px);gap:30px;padding:48px 0;border-bottom:1px solid var(--line)}
.long-chapter:nth-child(even){padding-right:8vw}
.long-chapter>b{font:300 3rem/1 var(--serif);color:rgba(216,112,91,.55)}
.long-chapter h3{font:500 clamp(1.5rem,2.5vw,2.5rem)/1.35 var(--serif);margin:0 0 1rem}
.long-chapter p{margin:0;max-width:78ch;font-size:1rem;line-height:2.15;text-wrap:pretty}
.quote-walk{min-height:780px;padding:100px 9vw;background:#cdbca5;display:grid;grid-template-columns:1.35fr .65fr;gap:8vw}
.quote-progress{grid-column:1/-1;display:flex;align-items:center;gap:18px;font:.7rem var(--kufi)}
.quote-progress i{height:2px;flex:1;background:rgba(20,58,53,.3)}
.quote-walk fieldset{border:0;padding:0;margin:0}.quote-walk legend{font:300 clamp(2.2rem,4vw,4.5rem)/1.3 var(--serif);margin-bottom:2rem}
.quote-walk legend small{display:block;font:.65rem var(--kufi);color:var(--coral);margin-bottom:.5rem}
label{display:block;font-size:.75rem;margin:0 0 1.4rem}
input,select,textarea{display:block;width:100%;border:0;border-bottom:2px solid var(--ink);background:transparent;color:var(--ink);padding:13px 4px;outline:none;border-radius:0}
input:focus,select:focus,textarea:focus{border-color:var(--blue);background:rgba(255,255,255,.12)}
button{border:0;background:var(--cedar);color:#fff;padding:14px 23px;cursor:pointer;font:700 .75rem var(--kufi)}
.quote-walk button[data-prev]{background:none;color:var(--ink);margin-right:12px;border-bottom:1px solid}
.quote-walk aside{align-self:end;border-right:1px solid var(--ink);padding-right:25px}.quote-walk aside strong{display:block;font-size:2.2rem;font-weight:300}.quote-walk aside span{font:.7rem var(--kufi)}
.success-scene,.tracking-wall,.admin-entry,.admin-board{padding:100px 9vw;background:#d5c3ac}
.success-scene>strong{display:block;font:600 clamp(2rem,5vw,5rem) var(--kufi);margin:1rem 0 2rem;color:var(--blue)}
.tracking-wall form{max-width:750px;margin-bottom:80px;display:flex;align-items:end;gap:22px}.tracking-wall form label{flex:1;margin:0}
.track-result{max-width:900px}.track-result h2{font:300 clamp(2rem,4vw,4.5rem) var(--serif)}
.track-result dl{display:flex;flex-wrap:wrap;gap:30px}.track-result dl>div{min-width:160px;border-bottom:1px solid;padding-bottom:10px}.track-result dt{font-size:.65rem}.track-result dd{margin:0;font-weight:600}
.admin-entry form{max-width:600px}.admin-entry>p{font-size:.72rem}
.admin-board header{display:flex;justify-content:space-between;align-items:end}
.request-ledger{margin-top:60px}.request-ledger article{display:grid;grid-template-columns:180px 1fr 1fr 1.4fr 150px;align-items:center;gap:20px;padding:20px 0;border-bottom:1px solid var(--line)}
.request-ledger article strong{color:var(--blue)}.request-ledger h3,.request-ledger p{margin:0}.request-ledger small{text-align:left}
.flash{margin:20px 9vw;padding:15px;border-right:5px solid var(--coral)}.not-found{color:var(--coral)}
.site-footer{background:var(--night);color:#fff}
.footer-room{min-height:760px;padding:150px 9vw;background:linear-gradient(90deg,rgba(10,30,27,.05),rgba(10,30,27,.86)),url('/assets/arrival-room.png') center/cover no-repeat;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.footer-room h2{font:300 clamp(3rem,6vw,7rem)/1.07 var(--serif);margin:.6rem 0 1.5rem}.footer-room p:not(.eyebrow){max-width:520px}
.footer-links{padding:80px 8vw;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:60px}.footer-links>div{display:flex;flex-direction:column;gap:10px}.footer-links strong{font:700 2rem var(--kufi)}.footer-links p{opacity:.65;max-width:360px}.footer-links a{font-size:.76rem;opacity:.8}
.copyright{margin:0;padding:25px 8vw;border-top:1px solid rgba(255,255,255,.16);font-size:.65rem;opacity:.6}
@media(max-width:900px){
  body{font-size:16px}.site-nav{height:80px;padding:14px 20px}.site-nav nav{display:none;position:absolute;top:75px;right:15px;left:15px;background:var(--chalk);padding:22px;flex-direction:column;align-items:stretch;box-shadow:0 20px 40px rgba(0,0,0,.15)}.site-nav nav.open{display:flex}.menu-toggle{display:block}.brand strong{font-size:1.6rem}
  .hero-room{min-height:930px;background-position:36% center}.hero-room::after{background:linear-gradient(180deg,rgba(242,234,220,.9),rgba(242,234,220,.68) 47%,rgba(242,234,220,.12))}
  .hero-copy{top:120px;right:24px;left:24px;width:auto}.hero-copy h1{font-size:clamp(2.8rem,13vw,5rem)}.hero-actions{align-items:flex-start;flex-direction:column;gap:16px}.sun-note{left:20px;bottom:90px}.scroll-cue{right:20px}
  .trace-story{min-height:980px;padding:100px 24px}.trace-copy{width:100%;margin:0}.trace-shape{width:120vw;height:100vw;left:-45vw;top:42%}.trace-story blockquote{right:24px;bottom:8%;font-size:2.1rem}
  .services-wall{padding:100px 24px 170px}.services-wall header{margin:0}.service-script{margin-top:50px;display:block}.service-script a{width:100%;grid-template-columns:36px 1fr auto;transform:none}.service-script strong{font-size:1.08rem}
  .hallway-story{display:block}.hallway-image{min-height:720px;clip-path:polygon(0 0,100% 0,100% 94%,18% 100%,0 96%)}.hallway-words{padding:80px 24px}
  .voices{min-height:auto;padding:100px 24px}.voice{position:relative!important;inset:auto!important;width:100%;margin:70px 0!important;transform:none!important}.voice-title{max-width:none}
  .guide-library{padding:100px 24px}.library-heading{margin:0}.guide-lines a{grid-template-columns:40px 1fr}.guide-lines a em{grid-column:2;text-align:right}
  .walkthrough-teaser{padding:100px 24px;display:block}.doorframe{height:430px;margin-top:70px}
  .page-opening{min-height:600px;padding:110px 24px 80px}.page-opening h1{font-size:clamp(2.8rem,13vw,5.6rem)}.wall-mark{top:32%;font-size:34vw}
  .directory-scene,.library-index{padding:80px 24px}.directory-note{margin:0 0 40px}.directory-lines a{grid-template-columns:36px 1fr;gap:15px}.directory-lines em{grid-column:2;text-align:right}.directory-lines strong{font-size:1.05rem}
  .service-moment{padding:90px 24px;display:block}.service-imprint{height:420px;margin-bottom:60px}.reading-note,.core-statement{margin:80px auto;padding:0 24px}
  .core-lines{padding:20px 24px 80px}.core-lines>div{grid-template-columns:35px 1fr;gap:10px 15px}.core-lines p{grid-column:2}
  .longform{padding:100px 24px}.long-intro{display:block;margin-bottom:50px}.long-intro h2{font-size:2.6rem}.long-chapter,.long-chapter:nth-child(even){grid-template-columns:48px minmax(0,1fr);gap:15px;padding:34px 0}.long-chapter>b{font-size:1.8rem}.long-chapter p{max-width:100%;font-size:1rem;line-height:2}
  .quote-walk{padding:80px 24px;display:block}.quote-progress{margin-bottom:50px}.quote-walk aside{margin-top:60px}.tracking-wall form{display:block}.tracking-wall form button{margin-top:20px}.track-result dl{display:block}.track-result dl>div{margin-bottom:15px}
  .success-scene,.tracking-wall,.admin-entry,.admin-board{padding:80px 24px}.admin-board header{align-items:start}.request-ledger article{display:block;padding:24px 0}.request-ledger article>*{display:block;margin:4px 0!important}
  .footer-room{min-height:720px;padding:100px 24px;background-position:62% center}.footer-links{padding:70px 24px;grid-template-columns:1fr 1fr;gap:35px}.footer-links>div:first-child{grid-column:1/-1}.copyright{padding:22px 24px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.motion-ready .long-chapter,.motion-ready .service-script a,.motion-ready .voice{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease}
.motion-ready .long-chapter.seen,.motion-ready .service-script a.seen,.motion-ready .voice.seen{opacity:1;transform:translateY(0)}
