@font-face{font-family:"Alexandria";src:url("/fonts/alexandria-latin-wght-normal.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Alexandria";src:url("/fonts/alexandria-arabic-wght-normal.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}

/* Ink / Paper are the public site's fixed brand pair. */
:root{color-scheme:light;--paper:#FAF8F3;--ink:#14161B;--muted:#5A5E66;--line:#D9D4C7;--water:#1F7A8C;--water-inv:#4DB3C7;--logo-ground:transparent}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){color-scheme:dark;--paper:#14161B;--ink:#FAF8F3;--muted:#A7ABB3;--line:#2E3138;--water:#4DB3C7;--water-inv:#1F7A8C;--logo-ground:#FAF8F3}}
:root[data-theme="dark"]{color-scheme:dark;--paper:#14161B;--ink:#FAF8F3;--muted:#A7ABB3;--line:#2E3138;--water:#4DB3C7;--water-inv:#1F7A8C;--logo-ground:#FAF8F3}
:root[data-theme="light"]{color-scheme:light}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-block:24px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.65 "Alexandria",system-ui,-apple-system,"Segoe UI",sans-serif;overflow-wrap:anywhere}
::selection{background:var(--ink);color:var(--paper)}
:lang(ar){line-height:1.9}
img{display:block;max-inline-size:100%;block-size:auto}
a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.25em}
a:hover{text-decoration-thickness:2px}
a:focus-visible,button:focus-visible{outline:3px solid var(--ink);outline-offset:4px}
main:focus{outline:none}
.skip{max-inline-size:calc(100% - 16px);position:absolute;inset-block-start:8px;inset-inline-start:8px;padding:12px 16px;background:var(--paper);color:var(--ink);border:1px solid var(--ink);transform:translateY(-200%);z-index:10}
.skip:focus{transform:none}
.wrap{inline-size:min(100%,1200px);margin-inline:auto;padding-inline:16px}
header{border-block-end:1px solid var(--line)}
.mast{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;min-block-size:88px;padding-block:16px}
.brand{display:flex;align-items:center;gap:12px;font-weight:700;font-size:.875rem;min-inline-size:0}
.logo{inline-size:44px;block-size:44px;object-fit:contain;background:var(--logo-ground);padding:5px;border-radius:50%}
nav{display:flex;align-items:center;gap:8px 16px;flex-wrap:wrap}
nav a,nav button{display:inline-flex;align-items:center;min-block-size:44px;padding:8px 0;font:inherit;font-size:.875rem;color:inherit;background:none;border:0;cursor:pointer;text-underline-offset:.25em}
nav a{text-decoration:none}
nav a:hover,nav button:hover{text-decoration:underline;text-decoration-thickness:2px}
nav button{text-decoration:underline;text-decoration-thickness:1px}
nav button:active{color:var(--muted)}

section{padding-block:64px;border-block-end:1px solid var(--line)}
.rule{inline-size:48px;border-block-start:3px solid var(--water);margin-block-end:24px}
h1,h2,h3,p,ul,figure,pre{margin-block:0}
h1{font-size:clamp(2.6rem,11.5vw,6rem);line-height:1.1;letter-spacing:-.04em;font-weight:700;margin-block-end:24px;overflow-wrap:anywhere}
h2{font-size:clamp(1.6rem,4vw,2.75rem);line-height:1.2;letter-spacing:-.03em;font-weight:700;margin-block-end:32px;text-wrap:balance}
h3{font-size:1rem;line-height:1.5;font-weight:700;margin-block-end:8px;text-wrap:pretty}
p+p{margin-block-start:1em}
:lang(ar) h1{letter-spacing:0;line-height:1.25}
:lang(ar) h2,:lang(ar) h3{letter-spacing:0;line-height:1.6}
.lead{font-size:clamp(1.15rem,2.3vw,1.5rem);line-height:1.5;max-inline-size:36ch;margin-block-end:20px;text-wrap:pretty}
:lang(ar) .lead{line-height:1.8;max-inline-size:36ch}
.muted{color:var(--muted)}
.hero-copy>.muted{max-inline-size:45ch}
.status{display:inline-flex;align-items:center;gap:10px;color:var(--ink);font-size:.875rem;font-weight:700;margin-block-end:24px}
.status::before{content:"";inline-size:10px;block-size:10px;background:var(--water)}
.hero{display:grid;gap:40px;align-items:start}
.hero-section>.wrap>.rule{display:none}
.cta{display:inline-flex;align-items:center;justify-content:center;min-block-size:48px;margin-block-start:28px;padding:12px 20px;background:var(--ink);color:var(--paper);border:1px solid var(--ink);text-decoration:none;font-weight:700;font-size:.95rem}
.cta:hover{background:var(--paper);color:var(--ink);text-decoration:none}
.cta:active{background:var(--line)}
.ascii-box{min-inline-size:0;background:var(--ink);color:var(--paper);border-block-start:3px solid var(--water-inv);padding:32px 12px}
.ascii{font:400 clamp(12px,3.6vw,18px)/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:inherit;white-space:pre;direction:ltr;text-align:start;inline-size:max-content;max-inline-size:100%;margin-inline:auto;overflow-wrap:normal}
.sr-only{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

.ruled{list-style:none;padding:0;margin:0;border-block-start:1px solid var(--line)}
.ruled>li{padding-block:24px;border-block-end:1px solid var(--line)}
.ruled p{color:var(--muted);max-inline-size:62ch}
.planned{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.planned>div{min-inline-size:0}
.tag{flex:none;color:var(--muted);font-size:.75rem;font-weight:700;border-block-start:2px solid var(--water);padding-block-start:6px}
:lang(ar) .tag{font-size:.875rem}
.road-note{margin-block:-12px 28px}

.shots{display:grid;gap:40px;align-items:start}
figure{min-inline-size:0;margin:0}
figure img{inline-size:100%;border:1px solid var(--line)}
figure.phone img{max-inline-size:260px;margin-inline:auto}
figcaption{margin-block-start:12px;color:var(--muted);font-size:.875rem;line-height:1.65;max-inline-size:65ch}
figure.phone figcaption{max-inline-size:260px;margin-inline:auto}
.prose{max-inline-size:65ch}
.prose p{line-height:1.8}
.contact{font-size:clamp(1.05rem,2vw,1.35rem);font-weight:700}
.contact a{max-inline-size:100%;display:inline-block;padding-block:8px;overflow-wrap:anywhere}
.contact-section{border-block-end:0}
footer{padding-block:24px;border-block-start:1px solid var(--line);color:var(--muted);font-size:.875rem}
footer p{margin:0}

@media (max-width:399px){
 .mast{justify-content:flex-start;gap:8px}
 nav{inline-size:100%;justify-content:space-between;gap:16px}
 .hero-section{padding-block:40px 56px}
}
@media (min-width:760px){
 section{padding-block:88px}
 .hero-section{padding-block:72px 88px}
 .hero{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:40px;align-items:center}
 h1{font-size:clamp(3rem,6.6vw,6rem)}
 .ascii{font-size:clamp(13px,1.35vw,18px)}
 #built-title+.ruled>li{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:40px}
 #built-title+.ruled h3{margin:0}
 .shots{grid-template-columns:minmax(0,3fr) minmax(0,1fr);gap:48px 40px}
 figure.wide{grid-column:1/-1;max-inline-size:960px;margin-inline:auto;inline-size:100%}
 figure.console{grid-column:1;grid-row:2}
 figure.rtl-console{grid-column:1;grid-row:3}
 figure.phone{grid-column:2;grid-row:2/4}
 .editorial{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);column-gap:40px}
 .editorial .rule{grid-column:1/-1}
 .editorial h2{margin:0}
 .editorial .prose{grid-column:2}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}