/* Shared refinements, 10 October 2026. Kept separate from compiled utilities. */
:root{scroll-padding-top:88px}
body{overflow-wrap:break-word}
button,a,input,textarea,summary{touch-action:manipulation}
:focus-visible{outline:2px solid #9a3412;outline-offset:5px}
[data-testid="site-footer"]{margin-top:4rem}
[data-testid="site-footer"] a{min-height:44px;display:inline-flex;align-items:center}
[data-testid="site-footer"] .text-stone\/60{color:#bfbab5}
[data-testid="site-footer"] .text-stone\/70{color:#c9c4bf}
[data-testid="about-intro"]>div{align-items:start}
.about-portrait{grid-column:9 / span 4;align-self:start;margin:0;background:#0c1c1c;overflow:hidden}
.about-portrait img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 45%}
[data-testid="about-intro"] .lg\:col-span-7{align-self:center}
[data-testid^="lens-node-"]{width:80px;height:80px;cursor:pointer}
[data-testid^="lens-node-"] span:last-child{font-size:12px;letter-spacing:.025em}
[data-testid="lens-map"]>div:first-child{width:calc(100% - 12px);margin-inline:auto}
[data-testid="lens-map-preview"]{min-height:235px}
[data-testid^="work-story-"] img{border-radius:0;box-shadow:none;display:block}
[data-testid^="work-story-"] figure{margin:0}
[data-testid^="work-story-"] [class*="overflow-hidden"]{border-radius:0;box-shadow:none}
[data-testid^="work-story-"] h2{max-width:24ch}
[data-testid^="work-story-"] p{max-width:68ch}
html[dir="rtl"] .font-mono,html[dir="rtl"] .eyebrow{font-family:"Noto Sans Arabic",sans-serif;letter-spacing:0!important;text-transform:none}
html[dir="rtl"] main p,html[dir="rtl"] main li{line-height:1.95}
html[dir="rtl"] main .text-xs,html[dir="rtl"] main .text-sm{font-size:15px}
html[dir="rtl"] main [class*="text-[15px]"]{font-size:17px}
html[dir="rtl"] .font-heading{letter-spacing:0!important}
html[dir="rtl"] [data-testid^="lens-node-"] span:last-child{font-size:15px;line-height:1.45}
html[dir="rtl"] [data-testid^="lens-node-"] span:first-child{font-size:11px;line-height:1.3}
html[dir="rtl"] [data-testid="lens-map-preview"] p{line-height:1.75}
html[dir="rtl"] [data-testid="site-footer"] a{font-size:15px}
html[dir="rtl"] .text-clay{color:#8d3216}
html[dir="rtl"] .text-muted-ink{color:#514b45}
.method-page{max-width:1152px;margin:0 auto;padding:76px 48px 0}
.method-intro{max-width:850px}
.method-page h1,.method-page h2,.method-page h3{font-family:"Playfair Display Variable",Georgia,serif;font-weight:400;letter-spacing:-.025em;line-height:1.17}
.method-page h1{font-size:clamp(40px,5vw,68px);margin:24px 0}
.method-page h2{font-size:clamp(30px,3.2vw,42px);margin:0 0 28px}
.method-page h3{font-size:23px;margin:0 0 16px}
.method-page p{font-size:17px;line-height:1.8;margin:0 0 16px}
.method-page .eyebrow{font-size:13px;color:#9a3412}
.method-page .method-lead{font-size:21px;color:#514b45;max-width:65ch}
.method-note{padding-inline-start:20px;border-inline-start:2px solid #9a3412;color:#57534e}
.editorial-button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 24px;background:#1c1917;color:#faf8f5;border-radius:32px;font-size:15px;text-decoration:none;margin-top:16px}
.editorial-button:hover{background:#9a3412}
.method-toc{display:flex;flex-wrap:wrap;gap:12px 24px;border-block:1px solid #e7e5e4;padding:22px 0;margin:48px 0 0}
.method-toc a{font-size:14px;color:#9a3412;min-height:36px;display:inline-flex;align-items:center;text-decoration:underline;text-underline-offset:5px}
.method-section{padding:56px 0;border-bottom:1px solid #e7e5e4;scroll-margin-top:88px}
.method-prose{max-width:74ch;color:#514b45;font-size:18px;line-height:1.8;margin:0 0 24px;white-space:pre-line}
.method-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:28px 0}
.method-card{background:#f3f0e8;border-top:1px solid #ddd6c9;padding:28px;min-width:0}
.method-card>p:first-child{color:#9a3412;font-weight:500}
.method-card p:last-child{margin-bottom:0}
.method-end{padding-block:56px}
html[dir="rtl"] .method-page h1,html[dir="rtl"] .method-page h2,html[dir="rtl"] .method-page h3{font-family:"Noto Naskh Arabic",serif;letter-spacing:0;line-height:1.5}
html[dir="rtl"] .method-page p{font-size:18px}
html[dir="rtl"] .method-page .eyebrow{font-size:14px}
@media(max-width:1023px){.about-portrait{grid-column:auto;max-width:560px;width:100%;margin-inline:auto}.about-portrait img{aspect-ratio:4/3;object-position:50% 42%}}
@media(max-width:639px){
 main>div>section:not([data-testid="home-hero"]){scroll-margin-top:80px}
 main section.py-20,main section.sm\:py-28{padding-top:56px;padding-bottom:56px}
 main section.pt-20{padding-top:56px}
 [data-testid="about-intro"]{padding-top:32px;padding-bottom:56px}
 [data-testid="about-intro"]>div{gap:32px}
 .about-portrait img{aspect-ratio:5/4}
 [data-testid="site-footer"]{margin-top:48px}
 [data-testid^="lens-node-"]{width:72px;height:72px}
 [data-testid^="lens-node-"] span:last-child{font-size:11px;letter-spacing:0}
 [data-testid="lens-map-preview"]{min-height:0}
 [data-testid="lens-map"]{gap:28px}
 [data-testid="lens-map"]>div:first-child>div span:first-child{font-size:10px}
 [data-testid^="work-story-"] .grid{gap:28px}
 [data-testid^="work-story-"] img{width:100%;max-height:380px;object-fit:cover}
 html[dir="rtl"] main p{font-size:17px}
 html[dir="rtl"] main .eyebrow{font-size:14px}
 html[dir="rtl"] main h1{font-size:clamp(38px,10vw,48px);line-height:1.45}
 html[dir="rtl"] main h2{line-height:1.5}
 html[dir="rtl"] main a.font-mono,html[dir="rtl"] main button.font-mono{font-size:14px}
 html[dir="rtl"] [data-testid^="lens-node-"] span:last-child{font-size:14px}
 .method-page{padding:48px 24px 0}
 .method-grid{grid-template-columns:1fr}
 .method-section{padding:40px 0}
 .method-card{padding:24px}
 .method-toc{gap:8px 20px;margin-top:32px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Keep contact links on distinct lines and avoid repeating Arabic brand names. */
[data-testid="footer-email-link"],[data-testid="footer-linkedin-link"]{display:flex!important;width:fit-content}
html[dir="rtl"] [data-testid="about-writing"] h3>span[lang="ar"]{display:none}
[data-testid^="work-story-"]:not([data-testid="work-story-adaptive"]) img{mix-blend-mode:multiply}
@media(min-width:768px) and (max-width:1023px){
 [data-testid="site-header"]>div>nav{display:none}
 [data-testid="site-header"]>div>div:last-child{display:flex}
 [data-testid="nav-mobile-toggle"]{display:inline-flex}
 [data-testid="nav-mobile-menu"]{display:block}
}
[data-testid="contact-page"] .grid>*{min-width:0}
[data-testid="contact-mailto-link"]{max-width:100%;font-size:clamp(18px,4.7vw,24px);gap:8px;direction:ltr}
[data-testid="contact-mailto-link"] span{overflow-wrap:anywhere;min-width:0}
[data-testid="contact-mailto-link"] svg{flex-shrink:0}
@media(max-width:359px){[data-testid="contact-form"]{padding:24px}}

/* ---- pass15: dark header, clearer language button, Arabic typography ---- */
[data-testid="site-header"]{background:rgba(2,21,23,.96)!important;border-bottom:1px solid rgba(255,255,255,.08)!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
[data-testid="site-header"] .text-ink{color:#F5F0E6!important}
[data-testid="site-header"] .text-muted-ink{color:#B9CBCD!important}
[data-testid="site-header"] a.text-muted-ink:hover,[data-testid="site-header"] a:hover .text-ink{color:#fff!important}
[data-testid="site-header"] .text-clay,[data-testid="site-header"] [aria-current="page"]{color:#E98B63!important}
[data-testid="site-header"] .bg-clay{background:#E98B63!important}
[data-testid="site-header"] [data-testid="lang-switch"]{border-color:rgba(245,240,230,.5)!important;color:#F5F0E6!important;padding-inline:14px;font-size:14px;border-radius:2px}
[data-testid="site-header"] [data-testid="lang-switch"]:hover{background:#F5F0E6!important;color:#021517!important;border-color:#F5F0E6!important}
[data-testid="site-header"] [data-testid="nav-mobile-toggle"]{color:#F5F0E6!important}
[data-testid="site-header"] [data-testid="nav-mobile-toggle"]:hover{background:rgba(255,255,255,.1)!important}
[data-testid="site-header"] .link-underline::after{background:#E98B63}
#mobile-navigation{background:#021517!important;border-color:rgba(255,255,255,.1)!important}
#mobile-navigation a{color:#F5F0E6!important}

/* Arabic never uses slanted type */
:lang(ar) em,:lang(ar) i,:lang(ar) .italic,:lang(ar) blockquote,[lang="ar"],[lang="ar"] *{font-style:normal!important}
/* Arabic needs a larger size than Latin for the same legibility */
html[lang="ar"] .text-xs{font-size:14px!important;line-height:1.9!important}
html[lang="ar"] .text-sm{font-size:16px!important;line-height:1.9!important}
html[lang="ar"] .text-base{font-size:18px!important;line-height:2!important}
html[lang="ar"] p{line-height:2}
html[lang="ar"] [class*="tracking-"]{letter-spacing:0!important}
html[lang="ar"] [data-testid="site-header"] nav a{font-size:16px!important}
html[lang="ar"] footer a,html[lang="ar"] footer .text-sm{font-size:16px!important}

/* ---- pass15b: image heroes on the main pages (restored from the published site) ---- */
:is([data-testid="work-page"],[data-testid="ideas-page"],[data-testid="afterhold-page"],[data-testid="athar-page"])>section:first-child{position:relative;color:#F5F0E6;min-height:min(78vh,640px);display:flex;align-items:center;background-color:#021517;background-size:cover;background-position:center right;background-repeat:no-repeat}
:is([data-testid="work-page"],[data-testid="ideas-page"],[data-testid="afterhold-page"],[data-testid="athar-page"])>section:first-child>div{width:100%}
[data-testid="work-page"]>section:first-child{background-image:linear-gradient(90deg,rgba(2,21,23,.95) 0%,rgba(2,21,23,.78) 42%,rgba(2,21,23,.25) 100%),url(/assets/hero-work.webp)}
[data-testid="ideas-page"]>section:first-child{background-image:linear-gradient(90deg,rgba(2,21,23,.95) 0%,rgba(2,21,23,.7) 42%,rgba(2,21,23,.15) 100%),url(/assets/hero-ideas.webp)}
[data-testid="afterhold-page"]>section:first-child{background-image:linear-gradient(90deg,rgba(2,21,23,.95) 0%,rgba(2,21,23,.7) 42%,rgba(2,21,23,.15) 100%),url(/assets/hero-afterhold.webp)}
[data-testid="athar-page"]>section:first-child{background-image:linear-gradient(90deg,rgba(2,21,23,.92) 0%,rgba(2,21,23,.6) 45%,rgba(2,21,23,.1) 100%),url(/assets/hero-athar.webp)}
[data-testid="athar-page"]>section:first-child>img,[data-testid="athar-page"]>section:first-child>.absolute{display:none}
[data-testid="afterhold-page"]>section:first-child img,[data-testid="afterhold-page"]>section:first-child picture{display:none}
:is([data-testid="work-page"],[data-testid="ideas-page"],[data-testid="afterhold-page"])>section:first-child :is(h1,h2,p,a,span,li){color:#F5F0E6}
:is([data-testid="work-page"],[data-testid="ideas-page"],[data-testid="afterhold-page"])>section:first-child .text-muted-ink{color:#C9D6D8}
:is([data-testid="work-page"],[data-testid="ideas-page"],[data-testid="afterhold-page"])>section:first-child :is(.text-clay,em,.eyebrow){color:#E98B63}
[data-testid="afterhold-page"]>section:first-child a:hover{color:#E98B63}
@media(max-width:760px){
 :is([data-testid="work-page"],[data-testid="ideas-page"],[data-testid="afterhold-page"],[data-testid="athar-page"])>section:first-child{background-position:center;min-height:auto}
 [data-testid="work-page"]>section:first-child{background-image:linear-gradient(180deg,rgba(2,21,23,.9),rgba(2,21,23,.7)),url(/assets/hero-work.webp)}
 [data-testid="ideas-page"]>section:first-child{background-image:linear-gradient(180deg,rgba(2,21,23,.9),rgba(2,21,23,.6)),url(/assets/hero-ideas.webp)}
 [data-testid="afterhold-page"]>section:first-child{background-image:linear-gradient(180deg,rgba(2,21,23,.9),rgba(2,21,23,.6)),url(/assets/hero-afterhold.webp)}
 [data-testid="athar-page"]>section:first-child{background-image:linear-gradient(180deg,rgba(2,21,23,.9),rgba(2,21,23,.55)),url(/assets/hero-athar.webp)}
}
/* About: dark opening with the portrait, as on the published site */
[data-testid="about-header"],[data-testid="about-intro"]{background:#021517;color:#F5F0E6}
[data-testid="about-header"] :is(h1,p,span){color:#F5F0E6}
[data-testid="about-header"] :is(em,.text-clay,.eyebrow){color:#E98B63}
[data-testid="about-intro"] :is(p){color:#F5F0E6}
[data-testid="about-intro"] .text-muted-ink{color:#C9D6D8}
/* about contrast fix */
[data-testid="about-intro"] :is(p,a,span,li,div){color:#E7EEEE!important}
[data-testid="about-intro"] :is(.text-muted-ink,p+p){color:#C9D6D8!important}
[data-testid="about-intro"] a[href*=".pdf"],[data-testid="about-intro"] a:hover{color:#E98B63!important}
[data-testid="about-header"] :is(em,.text-clay,.eyebrow,h1 span){color:#E98B63!important}
[data-testid="about-header"] h1{color:#F5F0E6!important}
/* Work stories: images blend into the page like the published design (no boxed crop) */
[data-testid="work-page"] section[data-testid^="work-story-"] img{
 aspect-ratio:auto!important;height:auto!important;border-radius:0!important;object-fit:contain!important;
 mix-blend-mode:multiply;
 -webkit-mask-image:radial-gradient(ellipse 72% 72% at 50% 50%,#000 55%,transparent 100%);
 mask-image:radial-gradient(ellipse 72% 72% at 50% 50%,#000 55%,transparent 100%);
}
@media(min-width:1024px){
 [data-testid="work-page"] section[data-testid^="work-story-"] .lg\:col-span-5{margin-inline:-6% -10%}
 [data-testid="work-page"] section[data-testid^="work-story-"] .lg\:col-span-5 img{width:116%;max-width:none}
 html[dir="rtl"] [data-testid="work-page"] section[data-testid^="work-story-"] .lg\:col-span-5 img{margin-inline-start:-10%}
}
[data-testid="work-page"] section[data-testid^="work-story-"]{overflow-x:clip}
/* pass17: About + Now get dark image heroes like the other pages */
[data-testid="now-page"]>section:first-child,[data-testid="about-header"]{
 position:relative;color:#F5F0E6;background-color:#021517;background-size:cover;background-position:center right;
 background-image:linear-gradient(90deg,rgba(2,21,23,.55) 0%,rgba(2,21,23,.15) 55%,rgba(2,21,23,0) 100%),url(/assets/hero-now.webp)}
[data-testid="about-header"]{background-image:linear-gradient(90deg,rgba(2,21,23,.55) 0%,rgba(2,21,23,.1) 55%,rgba(2,21,23,0) 100%),linear-gradient(180deg,rgba(2,21,23,0) 70%,#021517 100%),url(/assets/hero-about.webp);padding-bottom:3rem;min-height:min(60vh,520px);display:flex;align-items:flex-end}
[data-testid="about-header"]>*{width:100%}
[data-testid="now-page"]>section:first-child{min-height:min(70vh,560px);display:flex;align-items:center}
[data-testid="now-page"]>section:first-child>*{width:100%}
html[dir="rtl"] [data-testid="now-page"]>section:first-child{background-position:center left;background-image:linear-gradient(270deg,rgba(2,21,23,.55) 0%,rgba(2,21,23,.15) 55%,rgba(2,21,23,0) 100%),url(/assets/hero-now-rtl.webp)}
html[dir="rtl"] [data-testid="about-header"]{background-position:center left;background-image:linear-gradient(270deg,rgba(2,21,23,.55) 0%,rgba(2,21,23,.1) 55%,rgba(2,21,23,0) 100%),linear-gradient(180deg,rgba(2,21,23,0) 70%,#021517 100%),url(/assets/hero-about-rtl.webp)}
[data-testid="now-page"]>section:first-child :is(h1,p,span,a){color:#F5F0E6}
[data-testid="now-page"]>section:first-child .text-muted-ink{color:#C9D6D8}
[data-testid="now-page"]>section:first-child :is(em,.text-clay,.eyebrow){color:#E98B63}
[data-testid="now-page"]>section:first-child .bg-clay{background:#E98B63}
[data-testid="about-intro"] img,[data-testid="about-intro"] picture{display:none!important}
[data-testid="about-intro"] :is(.grid,.lg\:grid-cols-12){display:block}
[data-testid="about-intro"] [class*="col-span"]{max-width:46rem}
@media(max-width:760px){
 [data-testid="now-page"]>section:first-child{background-image:linear-gradient(180deg,rgba(2,21,23,.75),rgba(2,21,23,.45)),url(/assets/hero-now.webp)!important;background-position:center!important;min-height:auto}
 [data-testid="about-header"]{background-image:linear-gradient(180deg,rgba(2,21,23,.7),rgba(2,21,23,.4)),linear-gradient(180deg,rgba(2,21,23,0) 70%,#021517 100%),url(/assets/hero-about.webp)!important;background-position:center!important;min-height:auto}
}
[data-testid="now-page"]>section:first-child{background-image:linear-gradient(90deg,rgba(2,21,23,.8) 0%,rgba(2,21,23,.45) 50%,rgba(2,21,23,0) 85%),url(/assets/hero-now.webp)}
html[dir="rtl"] [data-testid="now-page"]>section:first-child{background-image:linear-gradient(270deg,rgba(2,21,23,.8) 0%,rgba(2,21,23,.45) 50%,rgba(2,21,23,0) 85%),url(/assets/hero-now-rtl.webp)}
