@font-face{font-family:WovenDisplay;src:url('../assets/display.ttf')}
body[data-story=mghallaf]{--paper:#eee9df;--ink:#303c2b;--ex-accent:#a57e4d}
body[data-story=mghallaf] [hidden]{display:none!important}
body[data-story=mghallaf] header{background:#eee9dff5;backdrop-filter:blur(12px)}
body[data-story=mghallaf] .hero{position:relative;isolation:isolate;overflow:hidden;padding:80px 0 70px}
.hero-weft{position:absolute;inset:0 0 0 52%;display:grid;grid-template-columns:repeat(9,1fr);gap:16px;z-index:-1;opacity:.16;pointer-events:none}
.hero-weft span{background:#9c7848;transform:translateY(calc(var(--section-progress,.25)*100px - 80px))}.hero-weft span:nth-child(even){transform:translateY(calc(var(--section-progress,.25)*-100px + 80px));background:#41523a}
body[data-story=mghallaf] .hero-grid{grid-template-columns:1.25fr .75fr;gap:6vw}
body[data-story=mghallaf] .hero h1{font:clamp(65px,9.4vw,145px)/1 WovenDisplay,sans-serif;text-transform:uppercase;letter-spacing:-.025em;margin:30px 0}
.woven-title{display:inline-block;transform:translateX(calc(var(--section-progress,.25)*-14px))}
body[data-story=mghallaf] .hero .intro{font:clamp(28px,3.1vw,44px)/1.16 Georgia,serif;letter-spacing:-.04em;margin-bottom:24px}
body[data-story=mghallaf] .hero figure{transform:none;padding:15px;border:1px solid #8d8f77;background:#e2d5bd}
body[data-story=mghallaf] .hero figure a{transform:rotate(calc(var(--section-progress,.25)*-4deg + 2deg));transform-origin:50% 50%}
body[data-story=mghallaf] .hero img{aspect-ratio:3/4;object-fit:cover}
body[data-story=mghallaf] .hero figcaption{font-size:10px;padding-bottom:0}
body[data-story=mghallaf] .facts{gap:12px;margin-top:35px;padding:22px 0}
body[data-story=mghallaf] .facts span{font-size:12px}
body[data-story=mghallaf] h2{font:clamp(40px,5.2vw,76px)/1.04 WovenDisplay,sans-serif;text-transform:uppercase;letter-spacing:-.02em}
body[data-story=mghallaf] .initial-direction{background:#e6a0ba;padding:100px 0}
body[data-story=mghallaf] .initial-direction h2{font:clamp(65px,8.3vw,120px)/.98 WovenDisplay,sans-serif;text-transform:uppercase;letter-spacing:-.025em}
body[data-story=mghallaf] .initial-direction h3{font:clamp(31px,3.8vw,55px)/1.07 WovenDisplay,sans-serif;text-transform:uppercase;letter-spacing:0}
body[data-story=mghallaf] .initial-lead figure{padding:0;background:transparent}
body[data-story=mghallaf] .initial-turn{border-top:2px solid;padding-top:45px}
body[data-story=mghallaf] .initial-turn h3{font-family:Georgia,serif;text-transform:none;font-style:italic;letter-spacing:-.045em;font-size:clamp(40px,4.8vw,68px)}
body[data-story=mghallaf] .woven{position:relative;isolation:isolate;overflow:hidden;padding:110px 0;background:#aa8554;background-image:none}
.woven-field{position:absolute;inset:-15%;display:grid;grid-template-rows:repeat(12,1fr);gap:13px;z-index:-1;pointer-events:none;opacity:.17;transform:rotate(-9deg)}
.woven-field i{background:#efe5d1;transform:translateX(calc(var(--section-progress,.5)*120px - 60px))}.woven-field i:nth-child(even){background:#324329;transform:translateX(calc(var(--section-progress,.5)*-120px + 60px))}
body[data-story=mghallaf] .woven p:not(.act-note){font:clamp(50px,7.3vw,108px)/1.03 WovenDisplay,sans-serif;letter-spacing:-.025em;text-transform:uppercase;max-width:19ch;margin:24px 0}
body[data-story=mghallaf] .woven .act-note{font-size:18px;max-width:48ch}
body[data-story=mghallaf] .study{padding:100px 0;grid-template-columns:150px 1fr;gap:50px}
body[data-story=mghallaf] .study>.label{position:sticky;top:110px;align-self:start;max-width:16ch;line-height:1.8}
body[data-story=mghallaf] .process{gap:22px}
body[data-story=mghallaf] .process figure:nth-child(2){margin-top:80px}
body[data-story=mghallaf] .process figure:nth-child(3){margin-top:135px}
body[data-story=mghallaf] .process img{border:10px solid #dfd4bf}
.material-bench{position:relative;margin:0 0 90px;background:#d7c7aa;border:1px solid #776449;padding:45px;color:#303c2b;overflow:hidden}
.bench-heading{display:grid;grid-template-columns:1fr .8fr;gap:0 45px;align-items:end}.bench-heading .label{grid-column:1/-1}.bench-heading h2{margin-bottom:28px}.bench-heading p{font-size:15px;line-height:1.7;margin-bottom:32px;max-width:35ch}
.bench-controls{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #303c2b;margin-bottom:30px;position:relative;z-index:3}
.bench-controls button{display:flex;align-items:center;gap:15px;min-height:58px;border:0;border-right:1px solid #303c2b;border-radius:0;background:transparent;color:#303c2b;padding:15px 20px;font:13px Body,sans-serif;cursor:pointer}.bench-controls button:last-child{border-right:0}.bench-controls button[aria-pressed=true]{background:#303c2b;color:#eee9df}.bench-controls button span{font:10px Mono,monospace}
.bench-stage{position:relative;isolation:isolate;min-width:0}
.bench-stage:before{content:'WRAPPED.';position:absolute;top:5%;left:0;width:100%;font:clamp(50px,13vw,180px)/1 WovenDisplay,sans-serif;letter-spacing:-.025em;color:#303c2b;opacity:.07;z-index:-1;pointer-events:none}
.bench-weave{position:absolute;inset:10% -45px 4%;display:grid;grid-template-columns:repeat(8,1fr);gap:28px;z-index:-1;opacity:.14;pointer-events:none;overflow:hidden}
.bench-weave i{background:#9c7848;border-top:1px solid #5c503e;border-bottom:1px solid #5c503e;transform:translateY(calc(var(--section-progress,.5)*70px - 35px));transition:transform .65s}.bench-weave i:nth-child(even){background:#eee9df;transform:translateY(calc(var(--section-progress,.5)*-70px + 35px))}
.material-bench[data-layer="1"] .bench-weave{opacity:.4}.material-bench[data-layer="2"] .bench-weave{opacity:.25}
.bench-stage>figure{display:grid;grid-template-columns:1fr .7fr;gap:45px;align-items:center;min-width:0;padding:15px 0}
.bench-stage>figure+figure{border-top:1px solid #776449;padding-top:30px;margin-top:20px}
.material-bench.is-enhanced .bench-stage>figure{border:0;margin:0;padding:0}
.bench-stage img{width:min(100%,400px);aspect-ratio:3/4;max-height:550px;object-fit:cover;justify-self:center;box-shadow:10px 10px 0 #303c2b;border:1px solid #303c2b}
.bench-stage figcaption{font:clamp(21px,2.4vw,33px)/1.4 Georgia,serif;letter-spacing:-.03em;opacity:1;padding:20px 0;max-width:20ch}
.bench-stage figcaption b{display:block;font:10px/1.7 Mono,monospace;letter-spacing:.08em;text-transform:uppercase;margin-bottom:25px}
body[data-story=mghallaf] .final{background:#303c2b;color:#eee9df}
body[data-story=mghallaf] .ritual{border-top:1px solid #eee9df66;padding-top:35px;margin-top:70px}
body[data-story=mghallaf] .ritual div{font-family:WovenDisplay,sans-serif;text-transform:uppercase;font-size:clamp(42px,7vw,88px)}
.experience-reduced .hero-weft span,.experience-reduced .woven-title,.experience-reduced .hero figure a,.experience-reduced .woven-field i,.experience-reduced .bench-weave i,.reduce-motion .hero-weft span,.reduce-motion .woven-title,.reduce-motion .hero figure a,.reduce-motion .woven-field i,.reduce-motion .bench-weave i{transform:none!important}
@media(max-width:760px){body[data-story=mghallaf] .hero{padding:45px 0}.hero-weft{inset:0 0 0 45%;gap:12px}body[data-story=mghallaf] .hero-grid{grid-template-columns:1fr;gap:30px}body[data-story=mghallaf] .hero h1{font-size:16.8vw;margin:25px 0}body[data-story=mghallaf] .hero .intro{font-size:31px}body[data-story=mghallaf] .hero figure{padding:12px;width:90%;margin-left:5%}body[data-story=mghallaf] .hero figure a{transform:none}body[data-story=mghallaf] .facts{grid-template-columns:repeat(3,1fr);gap:8px}body[data-story=mghallaf] .facts span{font-size:10px}body[data-story=mghallaf] .facts b{font-size:8px}body[data-story=mghallaf] .initial-direction{padding:65px 0}body[data-story=mghallaf] .initial-direction h2{font-size:20vw}body[data-story=mghallaf] .woven{padding:70px 0}body[data-story=mghallaf] .woven p:not(.act-note){font-size:13vw}body[data-story=mghallaf] .woven .act-note{font-size:16px}body[data-story=mghallaf] .study{grid-template-columns:1fr;gap:20px;padding:65px 0}body[data-story=mghallaf] .study>.label{position:static;max-width:none}body[data-story=mghallaf] .process figure:nth-child(n){margin-top:20px}.material-bench{padding:25px 20px;margin-bottom:60px}.bench-heading{grid-template-columns:1fr;gap:0}.bench-heading h2{font-size:39px;margin-bottom:20px}.bench-heading p{font-size:14px;margin-bottom:25px}.bench-controls{margin-bottom:25px}.bench-controls button{display:block;padding:12px 8px;font-size:10px;min-height:65px;text-align:left}.bench-controls button span{display:block;font-size:9px;margin-bottom:5px}.bench-stage>figure{grid-template-columns:1fr;gap:22px}.bench-stage img{width:90%;max-height:440px}.bench-stage figcaption{font-size:25px;max-width:27ch;padding:8px 0}.bench-stage figcaption b{margin-bottom:15px}.bench-weave{inset:0 -20px 20%;gap:15px}.bench-stage:before{font-size:16vw}body[data-story=mghallaf] .ritual{gap:30px;margin-top:45px}}
@media(prefers-reduced-motion:reduce){html:not(.motion-user-on) .hero-weft span,html:not(.motion-user-on) .woven-title,html:not(.motion-user-on) .hero figure a,html:not(.motion-user-on) .woven-field i,html:not(.motion-user-on) .bench-weave i{transform:none!important}}
/* Archive additions: the material at hand scale, and the process laid out. */
.woven-making{position:relative;isolation:isolate;overflow:hidden;background:#d6cbb6;color:#303c2b;margin:0 0 55px;padding:60px 40px}
.woven-making-heading{display:grid;grid-template-columns:1fr 1fr;gap:0 50px;align-items:end;margin-bottom:45px}.woven-making-heading .label{grid-column:1/-1}.woven-making-heading h2{margin:0;font-size:clamp(40px,4.5vw,65px)!important}.woven-making-heading p{font:17px/1.65 Body,sans-serif;max-width:34ch;margin:0 0 5px}
.woven-ambient{position:absolute;inset:0;z-index:-1;pointer-events:none;display:flex;gap:8%;transform:rotate(-12deg) scale(1.4);opacity:.1}.woven-ambient i{display:block;background:#756546;width:15%;height:100%;animation:weave-drift 16s ease-in-out infinite alternate}.woven-ambient i:nth-child(even){background:#f7f0df;animation-direction:alternate-reverse;animation-delay:-8s}
.woven-archive-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;align-items:start}.woven-archive-grid figure:nth-child(2){margin-top:60px}.woven-archive-grid figure:nth-child(3){margin-top:120px}.woven-archive-grid a{display:block;box-shadow:5px 7px 0 #303c2b24;background:#eee9df}.woven-archive-grid img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover}.woven-archive-grid figcaption{font:11px/1.6 Mono,monospace;opacity:1;padding-top:18px}
.woven-closeup{display:grid;grid-template-columns:.7fr 1.3fr;background:#303c2b;color:#eee9df;min-height:700px;overflow:hidden;border-bottom:1px solid #eee9df44}.woven-closeup-copy{position:relative;padding:60px 12% 80px 15%;align-self:center;overflow:hidden}.woven-closeup-copy .label{font-size:10px;line-height:1.5}.woven-closeup-copy h2{font-size:clamp(54px,6.5vw,100px)!important;line-height:1!important;margin:20px 0 30px!important}.woven-closeup-copy h2 em{font-family:Georgia,serif;text-transform:none;font-size:.83em;letter-spacing:-.04em}.woven-closeup-copy p{font:16px/1.7 Body,sans-serif;max-width:29ch}.woven-cross{display:block;margin-top:35px;font:70px/1 Georgia,serif;width:70px;text-align:center;color:#d1b183;animation:weave-crossing 30s linear infinite}.woven-closeup figure{position:relative;min-width:0;overflow:hidden}.woven-closeup figure>a{display:block;width:100%;height:100%;min-height:700px}.woven-closeup img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}.woven-closeup figcaption{position:absolute;left:0;right:0;bottom:0;background:#303c2bea;padding:18px 25px;font:10px/1.5 Mono,monospace;opacity:1;max-width:none}
@keyframes weave-drift{from{transform:translateY(-35px)}to{transform:translateY(35px)}}
@keyframes weave-crossing{to{transform:rotate(360deg)}}
/* One material-led narrative, from the question to the labelled object. */
body[data-story=mghallaf]{--paper:#f0eadf;--ink:#3d2c1b;--ex-accent:#a98453;background:var(--paper);color:var(--ink)}
body[data-story=mghallaf] header{background:#f0eadff5}
body[data-story=mghallaf] .hero figure{border-color:#8a705250;background:#dfd1b9}
body[data-story=mghallaf] .hero-weft span:nth-child(even){background:#705638}
body[data-story=mghallaf] h2,body[data-story=mghallaf] .initial-direction h2{font:clamp(40px,5.2vw,76px)/1.04 WovenDisplay,sans-serif;letter-spacing:-.02em;text-transform:uppercase}
body[data-story=mghallaf] .initial-direction{background:#e3d6bf;color:#3d2c1b;border-top:1px solid #8a705250;border-bottom:1px solid #8a705250}
body[data-story=mghallaf] .initial-direction h3{font:clamp(30px,3.4vw,48px)/1.08 WovenDisplay,sans-serif;letter-spacing:-.015em}
body[data-story=mghallaf] .initial-turn h3{font:clamp(34px,4.1vw,58px)/1.1 Georgia,serif;letter-spacing:-.045em;text-transform:none}
body[data-story=mghallaf] .initial-direction .label{max-width:60ch;line-height:1.8}
body[data-story=mghallaf] .initial-swatches{border:1px solid #8a705250}
body[data-story=mghallaf] .woven{background:#b89a6c;color:#3d2c1b}
body[data-story=mghallaf] .woven-field i:nth-child(even){background:#6d5131}
body[data-story=mghallaf] .study{border-color:#8a705250}
body[data-story=mghallaf] .media figcaption{font:11px/1.7 Mono,monospace;opacity:.85}
.material-bench{background:#dfd1b9;border-color:#8a705270;color:#3d2c1b}
.bench-controls{border-color:#6d5131}.bench-controls button{color:#3d2c1b;border-color:#6d5131}.bench-controls button[aria-pressed=true]{background:#3d2c1b;color:#f0eadf}
.bench-stage:before{color:#3d2c1b}.bench-stage img{border-color:#6d5131;box-shadow:8px 8px 0 #725738}
.woven-making{background:#dfd1b9;color:#3d2c1b}.woven-archive-grid a{box-shadow:5px 7px 0 #6d513126}
.woven-closeup,body[data-story=mghallaf] .final{background:#3d2c1b;color:#f0eadf}
.woven-closeup figcaption{background:#3d2c1bea}
body[data-story=mghallaf] .outcome{align-items:center;gap:7vw}
.final-labelled img{aspect-ratio:3/4;object-fit:cover;object-position:50% 50%;border:1px solid #f0eadf40}
.final-details{display:grid;grid-template-columns:1fr 1fr;gap:35px;margin:75px 0 0;align-items:start;padding-top:40px;border-top:1px solid #f0eadf55}
.final-details figure{min-width:0}.final-details figure:nth-child(2){margin-top:90px}.final-details img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 50%}
@media(max-width:760px){body[data-story=mghallaf] h2,body[data-story=mghallaf] .initial-direction h2{font-size:clamp(37px,11.5vw,54px)}body[data-story=mghallaf] .initial-direction h3{font-size:34px}body[data-story=mghallaf] .initial-turn h3{font-size:38px}.final-details{grid-template-columns:1fr;gap:28px;margin-top:40px;padding-top:30px}.final-details figure:nth-child(2){margin-top:0}.final-details img{aspect-ratio:3/4;max-height:560px}body[data-story=mghallaf] .outcome{gap:35px}.material-bench .bench-heading h2{font-size:36px}.woven-making .woven-making-heading h2{font-size:38px!important}}
@media(max-width:760px){.woven-making{padding:35px 22px;margin-bottom:20px}.woven-making-heading{grid-template-columns:1fr;gap:17px;margin-bottom:30px}.woven-making-heading .label{margin-bottom:0}.woven-making-heading h2{font-size:42px!important}.woven-making-heading p{font-size:15px}.woven-archive-grid{grid-template-columns:1fr;gap:30px}.woven-archive-grid figure:nth-child(n){margin-top:0}.woven-archive-grid img{aspect-ratio:4/5;max-height:490px}.woven-closeup{grid-template-columns:1fr;min-height:0}.woven-closeup-copy{padding:45px 7%}.woven-closeup-copy h2{font-size:65px!important}.woven-closeup-copy h2 br{display:initial}.woven-closeup-copy h2 .ex-word{margin-right:.05em}.woven-closeup-copy p{max-width:36ch}.woven-cross{position:absolute;bottom:42px;right:7%;opacity:.18;margin:0}.woven-closeup figure>a{min-height:540px}.woven-closeup figcaption{font-size:9px;padding:16px 6%}}