:root{--bg:#111110;--paper:#f1eee5;--muted:#a8a69d;--gold:#e7a078;--line:#363630}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:88px}body{margin:0;background:var(--bg);color:var(--paper);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:6px}header{height:88px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;background:#111110;position:relative;z-index:3}.wordmark{font-size:26px;font-weight:900;letter-spacing:-1.7px}.brand-dot{color:var(--gold);font-size:36px}nav{display:flex;gap:38px;font-size:13px}nav a{padding:12px 0}nav a:hover{color:var(--gold)}.skip{position:fixed;top:-100px;z-index:20;padding:14px;background:var(--paper);color:#111}.skip:focus{top:10px;left:10px}.hero{position:relative;min-height:700px;height:calc(100svh - 88px);max-height:1050px;isolation:isolate;overflow:hidden}.hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% center;z-index:-3}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.8),rgba(0,0,0,.18) 75%),linear-gradient(0deg,rgba(0,0,0,.7),transparent 40%);z-index:-2}.hero-content{padding:8% 6% 130px;max-width:1000px}.eyebrow{text-transform:uppercase;font-size:11px;letter-spacing:2.5px;line-height:1.6;margin:0 0 22px;font-weight:600}.hero h1{font-size:clamp(64px,7.8vw,122px);font-weight:500;letter-spacing:-6px;line-height:.96;margin:0 0 30px}.hero h1 span{color:#e7a078}.hero-line{font-size:17px;line-height:1.55;color:#ded9cf;margin:0 0 32px}.pill{display:inline-flex;gap:40px;align-items:center;border:1px solid #ad775b;padding:17px 22px;border-radius:40px;font-size:12px}.pill:hover{background:var(--paper);color:#111}.hero-bottom{position:absolute;bottom:35px;left:6%;right:6%;display:flex;justify-content:space-between;font-size:9px;letter-spacing:2px;color:#d8d2c7}.section{padding:105px 6%}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:48px}.section-heading h2,.about h2{font-size:clamp(44px,5vw,74px);font-weight:400;line-height:1;letter-spacing:-3px;margin:0}.section-heading>p{font-size:14px;color:var(--muted);line-height:1.6;margin:0}.gold{color:var(--gold)}.sup{font-size:13px;letter-spacing:0;color:var(--muted);vertical-align:top;display:inline-block;margin:8px 0 0 16px}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:65px 30px}.project.featured{grid-column:1/-1}.project-image{display:block;position:relative;overflow:hidden;aspect-ratio:16/10;background:#222}.featured .project-image{aspect-ratio:2.15}.project-image img{height:100%;width:100%;object-fit:cover;transition:transform .6s}.project-image:hover img{transform:scale(1.035)}.watch{position:absolute;bottom:22px;right:22px;background:#f1eee5;color:#171715;font-size:11px;padding:13px 18px;border-radius:25px;display:flex;gap:12px;align-items:center}.watch span{font-size:19px}.project-info{display:flex;justify-content:space-between;gap:12px;margin-top:22px}.project .eyebrow{color:var(--muted);font-size:9px;letter-spacing:1.8px;margin-bottom:8px}.project h3{font-size:29px;letter-spacing:-1px;font-weight:400;margin:0}.project-detail{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:12px;font-size:10px;color:var(--muted);padding-top:3px}.frames-button{background:none;color:var(--paper);border:0;border-bottom:1px solid #54534c;padding:0 0 5px;font-size:10px}.frames-button span{margin-left:15px;color:var(--gold)}.viewing-note{font-size:11px;color:var(--muted);margin:40px 0 0}.about{border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:9%;align-items:center}.about-photo img{display:block;width:100%;aspect-ratio:1.1;object-fit:cover;object-position:60% center;filter:grayscale(1)}.photo-caption{display:block;color:var(--muted);font-size:8px;letter-spacing:1.4px;margin-top:14px}.about-copy h2{margin-bottom:30px}.about-copy>p:not(.eyebrow){font-size:15px;line-height:1.8;color:#bbb9b0;max-width:490px}.disciplines{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}.disciplines span{border:1px solid var(--line);padding:9px 12px;font-size:9px;color:#d4d0c5}.contact{background:#e9e4d8;color:#191a17;padding-top:94px;padding-bottom:98px}.contact .gold{color:#9f4729}.contact h2{font-size:clamp(38px,5.6vw,84px);font-weight:400;letter-spacing:-3.4px;line-height:1.08;margin:0 0 42px}.contact h2 em{font-family:Georgia,serif;font-weight:400}.contact-email{display:inline-flex;align-items:center;gap:50px;font-size:clamp(19px,2.3vw,32px);letter-spacing:-.5px;border-bottom:1px solid #76786f;padding-bottom:10px}.phone{display:block;width:fit-content;margin-top:22px;font-size:14px}footer{display:flex;align-items:center;justify-content:space-between;padding:28px 6%;font-size:9px;letter-spacing:1.5px}footer>a:last-child{font-size:10px;letter-spacing:0}dialog{width:min(1100px,94vw);border:1px solid #565447;background:#171715;color:var(--paper);padding:22px;max-height:90svh}dialog::backdrop{background:#000d;backdrop-filter:blur(6px)}.dialog-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.dialog-header h2{font-size:22px;font-weight:400;margin:0}.dialog-header button{background:none;border:1px solid #666;color:var(--paper);padding:9px 14px;font-size:12px}dialog img{width:100%;display:block;max-height:67svh;object-fit:contain}dialog p{font-size:10px;color:var(--muted);margin:16px 0 0}@media(min-width:1600px){.section,header,footer{padding-left:max(6%,calc((100vw - 1500px)/2));padding-right:max(6%,calc((100vw - 1500px)/2))}}@media(max-width:700px){html{scroll-padding-top:20px}header{height:72px;padding:0 6%}.wordmark{font-size:22px}nav{gap:22px;font-size:11px}.hero{height:calc(88svh - 72px);min-height:590px;max-height:820px}.hero-image{object-position:65% center}.hero-shade{background:linear-gradient(90deg,#000b,#0003),linear-gradient(0deg,#000b,transparent)}.hero-content{padding-top:85px}.hero h1{font-size:64px;letter-spacing:-3.6px}.hero .eyebrow{font-size:10px}.hero-line{font-size:14px}.hero-bottom{bottom:25px;font-size:8px;letter-spacing:1px}.hero-bottom .scroll-note{display:none}.section{padding:65px 6%}.section-heading{margin-bottom:30px;align-items:center}.section-heading h2,.about h2{font-size:43px;letter-spacing:-2px}.section-heading>p{display:none}.sup{font-size:11px;margin-left:8px}.project-grid{grid-template-columns:1fr;gap:38px}.project.featured{grid-column:auto}.project-image,.featured .project-image{aspect-ratio:1.45}.project h3{font-size:25px}.project-info{margin-top:18px}.project-detail{font-size:9px}.project .eyebrow{font-size:8px}.watch{bottom:15px;right:15px;padding:9px 14px}.about{grid-template-columns:1fr;gap:35px}.about-photo img{aspect-ratio:1.35}.about-copy>p:not(.eyebrow){font-size:14px}.contact h2{font-size:41px;letter-spacing:-1.9px}.contact-email{gap:22px;font-size:20px}footer{padding:22px 6%;flex-wrap:wrap;gap:22px}footer>span{display:none}dialog{padding:16px}.dialog-header h2{font-size:19px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
.arrow{width:14px;height:14px;display:inline-block;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.5}.hero-bottom .arrow{width:9px;height:9px}
.new-project h3{font-size:clamp(25px,2.5vw,38px);line-height:1.12;letter-spacing:-1.1px}.project-description{color:var(--muted);font-size:13px;line-height:1.7;max-width:510px;margin:17px 0 22px}.new-project-bottom{display:flex;justify-content:space-between;gap:20px;align-items:center;padding-top:16px;border-top:1px solid var(--line);font-size:10px;color:#d2cbbc}.gallery-controls{display:flex;align-items:center;justify-content:center;gap:22px;margin-top:16px}.gallery-controls[hidden]{display:none}.gallery-controls button{border:1px solid #666;background:transparent;color:var(--paper);padding:9px 14px;font-size:11px}.gallery-controls button:disabled{opacity:.3;cursor:default}#frame-count{font-size:11px;color:var(--muted)}@media(max-width:700px){.new-project h3{font-size:28px}.project-description{font-size:12px}.new-project-bottom{font-size:9px}}
.dialog-header{gap:16px}.dialog-header button{flex-shrink:0}@media(max-width:700px){.dialog-header h2{font-size:16px;line-height:1.3}dialog img{max-height:55svh}}
.project-client{font-size:12px;color:var(--gold);margin:9px 0 0}.new-project .project-info{min-height:106px}@media(max-width:700px){.new-project .project-info{min-height:0}}
header nav{margin-left:auto;margin-right:30px}.language-toggle{color:var(--paper);background:transparent;border:1px solid #686458;border-radius:22px;padding:9px 15px;font-size:12px;min-height:38px}.language-toggle:hover{background:var(--paper);color:var(--bg)}html[dir=rtl] body{font-family:Tahoma,Arial,sans-serif}html[dir=rtl] .wordmark{direction:ltr}html[dir=rtl] header nav{margin-right:auto;margin-left:30px}html[dir=rtl] h1,html[dir=rtl] h2,html[dir=rtl] h3,html[dir=rtl] .eyebrow,html[dir=rtl] .hero-bottom,html[dir=rtl] footer,html[dir=rtl] .photo-caption{letter-spacing:0}html[dir=rtl] .hero h1{line-height:1.2;font-size:clamp(64px,7vw,108px)}html[dir=rtl] .hero-content{margin-left:auto}html[dir=rtl] .hero-shade{background:linear-gradient(270deg,rgba(0,0,0,.85),rgba(0,0,0,.2) 75%),linear-gradient(0deg,rgba(0,0,0,.7),transparent 40%)}html[dir=rtl] .hero-image{object-position:38% center}html[dir=rtl] .eyebrow{font-size:13px}html[dir=rtl] .hero-line{line-height:1.9}html[dir=rtl] .section-heading h2,html[dir=rtl] .about h2{line-height:1.3}html[dir=rtl] .sup{direction:ltr;margin-left:0;margin-right:16px}html[dir=rtl] .project-detail{text-align:left}html[dir=rtl] .frames-button span{margin-left:0;margin-right:15px}html[dir=rtl] .project h3{line-height:1.5}html[dir=rtl] .new-project h3{font-size:clamp(23px,2.3vw,34px)}html[dir=rtl] .project-description,html[dir=rtl] .about-copy>p:not(.eyebrow){line-height:2}html[dir=rtl] .contact h2{line-height:1.5}html[dir=rtl] .contact h2 em{font-family:inherit;font-style:normal;color:#9f4729}html[dir=rtl] .contact-email,html[dir=rtl] .phone{direction:ltr;unicode-bidi:isolate}html[dir=rtl] .contact-email{letter-spacing:0}html[dir=rtl] .photo-caption{font-size:10px}#frame-count{direction:ltr;unicode-bidi:isolate}@media(max-width:700px){header{gap:12px}header nav{gap:14px;margin-right:0;margin-left:auto}.language-toggle{padding:7px 10px;min-height:34px;font-size:11px}html[dir=rtl] header nav{margin-left:0;margin-right:auto;gap:12px;font-size:10px}html[dir=rtl] .hero h1{font-size:66px}html[dir=rtl] .hero-content{padding-top:65px}html[dir=rtl] .hero-bottom{font-size:9px}html[dir=rtl] .new-project h3{font-size:25px}html[dir=rtl] .contact h2{font-size:37px}}@media(max-width:380px){header{padding-left:4%;padding-right:4%;gap:8px}header .wordmark{font-size:19px}header nav{gap:10px;font-size:10px}.language-toggle{padding:6px 8px;font-size:10px}html[dir=rtl] header nav{gap:8px}}
#film-dialog{width:min(1200px,96vw);padding:22px}.film-viewport{position:relative;aspect-ratio:16/9;background:#000}.film-viewport iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.film-footer{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-top:17px}.film-footer p{margin:0;line-height:1.7}.film-footer a{font-size:12px;color:var(--gold);border-bottom:1px solid #a96542;padding:8px 0}.film-footer a:focus-visible{outline:2px solid var(--gold)}@media(max-width:700px){#film-dialog{padding:14px}.film-footer{flex-direction:column;align-items:flex-start;gap:8px}.film-footer p{font-size:11px}.film-footer a{font-size:11px}}
#film-dialog .film-viewport{height:min(60svh,56vw);aspect-ratio:auto}#film-dialog .dialog-header{margin-bottom:12px}#film-dialog .dialog-header h2{line-height:1.4}
.frame-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:6px}.frame-strip button{position:relative;display:block;border:0;padding:0;overflow:hidden;background:#24231f;aspect-ratio:1.75}.frame-strip img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s,filter .4s;filter:brightness(.82)}.frame-strip button:hover img,.frame-strip button:focus-visible img{transform:scale(1.06);filter:brightness(1)}.frame-strip button span{position:absolute;bottom:8px;left:10px;font-family:Arial,sans-serif;font-size:9px;letter-spacing:1px;color:white;text-shadow:0 1px 4px #000}.gallery-thumbs{display:flex;justify-content:center;gap:8px;margin-top:14px;overflow-x:auto}.gallery-thumbs[hidden]{display:none}.gallery-thumbs button{flex:0 0 94px;aspect-ratio:1.8;overflow:hidden;padding:0;background:#111;border:2px solid transparent;opacity:.5}.gallery-thumbs button[aria-pressed=true]{border-color:var(--gold);opacity:1}.gallery-thumbs button:hover{opacity:1}.gallery-thumbs img{width:100%;height:100%;object-fit:cover;display:block}.gallery-controls{margin-top:10px}#frames-dialog{width:min(1280px,96vw)}#dialog-image{max-height:57svh}.gallery-controls button{min-height:36px}@media(max-width:700px){.frame-strip{gap:4px;margin-top:4px}.frame-strip button span{font-size:8px;bottom:5px;left:7px}.gallery-thumbs{justify-content:flex-start}.gallery-thumbs button{flex-basis:72px}#dialog-image{max-height:50svh}.gallery-controls{gap:16px}.frame-strip img{filter:none}}
.watch > svg,.watch > span{display:none}.watch::before{content:'';display:block;width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:8px solid currentColor;margin-right:2px}
@media(max-width:700px){html[lang=en] .hero h1{font-size:54px;letter-spacing:-3px}}

header .wordmark{letter-spacing:-.7px;white-space:nowrap}html[lang="ar"] header .wordmark{letter-spacing:0}
@media(max-width:600px){header{height:110px;display:grid;grid-template-columns:1fr auto;grid-template-rows:62px 48px;column-gap:12px}header .wordmark{font-size:20px;grid-column:1;grid-row:1}header .brand-dot{font-size:25px}header .language-toggle{grid-column:2;grid-row:1;justify-self:end;margin:0}header nav{grid-column:1 / -1;grid-row:2;justify-content:center;gap:32px;font-size:12px}.hero{height:calc(100svh - 110px)}}
html[dir=rtl] header .wordmark{direction:rtl;text-align:right}@media(max-width:600px){header nav,html[dir=rtl] header nav{margin:0;gap:32px;font-size:12px}header .wordmark{justify-self:start}}



#frame-count{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
html[lang="en"] h1,html[lang="en"] h2,html[lang="en"] h3{font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.035em}html[lang="en"] header .wordmark{font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.04em}
@font-face{font-family:"Noto Naskh Arabic";src:url("assets/fonts/noto-naskh-arabic.woff2") format("woff2");font-style:normal;font-weight:400 700;font-display:swap}
html[lang="ar"] body{font-family:"Noto Naskh Arabic",serif;font-size:17px;line-height:1.7}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3{font-family:"Noto Naskh Arabic",serif;font-weight:500;letter-spacing:0}
html[lang="ar"] header .wordmark{font-size:29px;font-weight:600;line-height:1.3}
html[lang="ar"] header nav{font-size:16px}
html[lang="ar"] .language-toggle{font-size:14px}
html[lang="ar"] .hero-line{font-size:21px;line-height:1.8}
html[lang="ar"] .project-description,html[lang="ar"] .about-copy>p:not(.eyebrow){font-size:19px;line-height:1.9}
html[lang="ar"] .project-detail>span,html[lang="ar"] .new-project-bottom,html[lang="ar"] .project-client,html[lang="ar"] .film-footer p,html[lang="ar"] #dialog-credit{font-size:14px;line-height:1.6}
html[lang="ar"] .frames-button,html[lang="ar"] .pill,html[lang="ar"] .watch,html[lang="ar"] .dialog-header button{font-size:15px}
html[lang="ar"] .contact-email,html[lang="ar"] .phone{font-family:Arial,Helvetica,sans-serif}
@media(max-width:600px){html[lang="ar"] header .wordmark{font-size:25px}html[lang="ar"] header nav{font-size:16px}html[lang="ar"] .hero h1{font-size:66px}html[lang="ar"] .new-project h3{font-size:29px}}

#project-jackie .project-image img,#project-jackie .frame-strip img{object-fit:contain;background:#000}

html[lang] .project h3{font-size:30px;line-height:1.4}html[lang="ar"] .project h3{line-height:1.5}@media(max-width:700px){html[lang] .project h3{font-size:26px}}

/* Shared card hierarchy: imagery, category/title/client, then role and frames. */
.project{display:flex;flex-direction:column;min-width:0}
.project-info{display:block;margin-top:22px;flex:1;padding-bottom:20px}
.project-info>div{width:100%}
.project-meta{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:16px;border-top:1px solid var(--line);color:#d4d0c7;font-size:13px;line-height:1.6}
html[lang] .project .eyebrow{font-size:12px;line-height:1.6;color:#bbb8ae;margin-bottom:8px}
html[lang] .project-client{font-size:14px;line-height:1.65;margin-top:8px}
html[lang] .frames-button{font-size:13px;line-height:1.6;min-height:36px;flex-shrink:0}
html[lang=ar] .project .eyebrow{font-size:16px}
html[lang=ar] .project-client,html[lang=ar] .project-meta,html[lang=ar] .frames-button{font-size:17px;line-height:1.7}
html[lang] .hero-bottom{font-size:12px;line-height:1.6;letter-spacing:1px;color:#f1eee5;gap:20px;text-shadow:0 1px 8px #000}
html[lang=ar] .hero-bottom{font-size:16px;letter-spacing:0}
.hero-shade{background:linear-gradient(90deg,rgba(0,0,0,.62),rgba(0,0,0,.06) 80%),linear-gradient(0deg,rgba(0,0,0,.62),transparent 42%)}
html[dir=rtl] .hero-shade{background:linear-gradient(270deg,rgba(0,0,0,.64),rgba(0,0,0,.06) 80%),linear-gradient(0deg,rgba(0,0,0,.62),transparent 42%)}
.hero-content{text-shadow:0 2px 20px #0006}
@media(max-width:700px){.project-info{margin-top:18px;padding-bottom:16px}.project-meta{gap:12px;padding-top:12px}html[lang] .hero-bottom{font-size:11px;letter-spacing:.4px}html[lang=ar] .hero-bottom{font-size:14px;letter-spacing:0}.hero-shade{background:linear-gradient(90deg,#0009,#0002),linear-gradient(0deg,#000a,transparent 50%)}html[dir=rtl] .hero-shade{background:linear-gradient(270deg,#0009,#0002),linear-gradient(0deg,#000a,transparent 50%)}}