/* Shared editorial foundations. Layouts live in main.css and mobile.css. */
@font-face{font-family:'IBM Plex Sans Arabic';src:url('../assets/fonts/ibm-plex-sans-arabic-arabic-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans Arabic';src:url('../assets/fonts/ibm-plex-sans-arabic-arabic-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans Arabic';src:url('../assets/fonts/ibm-plex-sans-arabic-arabic-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans Arabic';src:url('../assets/fonts/ibm-plex-sans-arabic-arabic-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url('../assets/fonts/manrope-latin-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url('../assets/fonts/manrope-latin-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
:root{--color-bg:#F7F4EE;--color-surface-soft:#E7DFD3;--color-text:#252923;--color-text-secondary:#4E534B;--color-text-muted:#52574E;--color-accent:#C49A73;--color-accent-ink:#845830;--color-dark:#252923;--color-on-dark:#F7F4EE;--color-on-dark-muted:#B8B2A6;--color-sage:#4A5A46;--color-field-border:#8B9B86;--color-error:#B91C1C;--color-on-dark-error:#FFB4A8;--border:rgba(37,41,35,.18);--border-dark:rgba(247,244,238,.24);--radius-control:4px;--radius-frame:8px;--radius-hero:2px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--space-8:32px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;--font-ar:'IBM Plex Sans Arabic',system-ui,sans-serif;--font-en:Manrope,system-ui,sans-serif;--duration-press:120ms;--duration-feedback:150ms;--duration-state:250ms;--duration-reveal:350ms;--duration-panel:400ms;--duration-close:300ms;--ease:cubic-bezier(.22,1,.36,1);--header-height:72px;--page-gutter:48px}
*,*::before,*::after{box-sizing:border-box}*{margin:0}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--sticky-offset,var(--header-height)) + 20px);background:var(--color-bg);color:var(--color-text);font-size:16px;scrollbar-color:var(--color-accent-ink) var(--color-bg)}body{font-family:var(--font-ar);line-height:1.8;letter-spacing:0;-webkit-font-smoothing:antialiased}::selection{background:var(--color-surface-soft);color:var(--color-text)}img,svg{display:block;max-width:100%}img{height:auto}svg{width:20px;height:20px;flex-shrink:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-decoration:none;text-underline-offset:.3em}button{color:inherit}a,button{ -webkit-tap-highlight-color:transparent}a:hover{text-decoration-color:currentColor}input,textarea{caret-color:var(--color-accent)}[lang=en],[dir=ltr]{font-family:var(--font-en);font-variant-numeric:tabular-nums}h1,h2,h3,h4{font-weight:600;line-height:1.4;text-wrap:balance}h1{font-weight:700}h2{font-size:clamp(2rem,3vw,3rem)}h3{font-size:1.5rem}h4{font-size:1.125rem}p{max-width:55ch}p,a,button,h1,h2,h3,h4{overflow-wrap:break-word}ul,ol{padding-inline-start:1.4em}fieldset{border:0;padding:0;min-width:0}section[id]{scroll-margin-top:20px}.container{width:min(100% - var(--page-gutter)*2,1280px);margin-inline:auto}.section-block{padding-block:80px;border-bottom:1px solid var(--border)}.section-heading{margin-bottom:40px}.section-heading p{margin-top:16px;color:var(--color-text-secondary);font-size:1.0625rem}.section-heading h2{max-width:24ch}.dark-surface{color:var(--color-on-dark);background:var(--color-dark)}:focus-visible{outline:2px solid var(--color-accent-ink);outline-offset:5px}.dark-surface :focus-visible{outline-color:var(--color-accent)}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:8px;right:16px;transform:translateY(-180%);padding:12px 20px;z-index:200;background:var(--color-text);color:var(--color-bg);border-radius:4px}.skip-link:focus{transform:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:11px 22px;border:1px solid transparent;border-radius:var(--radius-control);font-size:1rem;font-weight:600;line-height:1.7;transition:background-color var(--duration-feedback) var(--ease),border-color var(--duration-feedback) var(--ease),transform var(--duration-press) var(--ease);text-align:center}.btn-primary{background:var(--color-text);color:var(--color-bg)}.btn-primary:hover{background:#181B16}.btn-secondary{background:transparent;border-color:var(--border);color:var(--color-text)}.btn-secondary:hover{background:var(--color-surface-soft)}.btn:active{transform:scale(.98)}.btn svg,.text-link svg{transition:transform var(--duration-feedback) var(--ease)}.btn:is(:hover,:focus-visible) svg,.text-link:is(:hover,:focus-visible) svg{transform:translateX(-4px)}.dark-surface .btn-primary{background:var(--color-accent);color:var(--color-dark)}.dark-surface .btn-primary:hover{background:#D2AA84}.dark-surface .btn-secondary{color:var(--color-on-dark);border-color:var(--border-dark)}.btn:disabled{opacity:.55;cursor:not-allowed}.text-link{display:inline-flex;align-items:center;gap:12px;min-height:44px;font-weight:600;font-size:.9375rem;text-decoration:underline;text-decoration-color:transparent;transition:text-decoration-color var(--duration-feedback)}.text-link:hover{text-decoration-color:currentColor}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex-shrink:0;border:1px solid var(--border);border-radius:4px;background:transparent;transition:background var(--duration-feedback)}.icon-button:hover{background:var(--color-surface-soft)}.text-button{border:1px solid var(--border);background:var(--color-bg);border-radius:4px;min-height:44px;padding:8px 16px;font-size:.875rem}.text-button:hover{background:var(--color-surface-soft)}
.site-header{position:sticky;top:0;z-index:40;background:rgba(247,244,238,.97);border-bottom:1px solid var(--border)}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:var(--header-height)}.brand-identity{display:flex;align-items:center;gap:12px;flex-shrink:0}.brand-monogram{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--border);background:var(--color-surface-soft);font-size:.875rem;font-weight:600}.brand-identity strong{display:block;font-size:1rem;line-height:1.4}.brand-en{display:block;font-size:.8125rem;color:var(--color-text-secondary);line-height:1.5}.availability{display:inline-flex;align-items:center;gap:8px;font-size:.8125rem;color:var(--color-sage);line-height:1.6}.availability>span{width:6px;height:6px;background:var(--color-sage);border-radius:50%;flex-shrink:0}.hero-ledger{display:flex;justify-content:space-between;gap:12px;padding-block:20px;border-bottom:1px solid var(--border);font-size:.8125rem;color:var(--color-text-muted)}.hero-intro{font-size:.9375rem;margin-bottom:16px;color:var(--color-text-secondary)}.hero-content h1>span{display:block}.hero-highlight{color:var(--color-accent-ink)}.hero-lead{font-size:1.125rem;line-height:1.8;margin-top:24px;color:var(--color-text-secondary)}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}.hero-portrait{min-width:0;border:1px solid var(--border);padding:12px;background:var(--color-surface-soft);border-radius:var(--radius-frame)}.portrait-frame{overflow:hidden;background:var(--color-surface-soft);border-radius:var(--radius-hero)}.portrait-frame img{width:100%;height:100%;object-fit:cover;object-position:center top}.hero-portrait figcaption{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;padding-top:12px;font-size:.8125rem;color:var(--color-text-secondary)}
.work-notice{font-size:.875rem;color:var(--color-text-muted);border-inline-start:1px solid var(--border);padding-inline-start:16px;margin-bottom:32px}.project-card{min-width:0}.project-image-link{display:block}.project-image{position:relative;overflow:hidden;background:var(--color-surface-soft);border:1px solid var(--border);border-radius:var(--radius-frame)}.project-image img{width:100%;aspect-ratio:35/24;object-fit:cover;transition:transform var(--duration-panel) var(--ease)}.project-image-link:hover img{transform:scale(1.015)}.concept-tag{display:inline-block;padding:4px 10px;border:1px solid var(--border);border-radius:4px;font-size:.8125rem;line-height:1.7;background:var(--color-bg);color:var(--color-text-secondary)}.project-image .concept-tag{position:absolute;top:12px;right:12px}.project-image-action{position:absolute;bottom:16px;left:16px;display:grid;place-items:center;width:40px;height:40px;background:var(--color-text);color:var(--color-bg);border-radius:4px;transition:transform var(--duration-feedback)}.project-image-link:hover .project-image-action{transform:translateX(-4px)}.project-meta{display:flex;justify-content:space-between;gap:12px;margin-block:16px 8px;color:var(--color-text-muted);font-size:.8125rem}.project-card h3{margin-bottom:12px;font-size:clamp(1.25rem,1.8vw,1.625rem)}.project-card>p{font-size:1rem;color:var(--color-text-secondary)}.project-detail-link{margin-top:12px}.study-static{border-top:1px solid var(--border);padding-block:20px;margin-top:24px}.study-static>summary{cursor:pointer;font-weight:600;min-height:44px}.js-enhanced .study-static{display:none}.service-index{font-family:var(--font-en);font-size:2.25rem;font-weight:400;color:var(--color-accent-ink);line-height:1.2}.service-description{display:block;color:var(--color-text-secondary);margin-top:8px;font-size:1rem}.service-heading p{margin-top:12px;color:var(--color-text-secondary)}.service-icon{display:inline-flex;color:var(--color-accent-ink);margin-bottom:12px}.service-icon svg{width:28px;height:28px}.deliverables{list-style:none;padding:0;color:var(--color-text-secondary);font-size:1rem}.deliverables li{position:relative;padding-inline-start:16px;margin-bottom:8px}.deliverables li::before{content:'';position:absolute;right:0;top:.85em;width:4px;height:4px;border-radius:50%;background:var(--color-accent-ink)}.service-links{display:flex;gap:24px;flex-wrap:wrap;margin-top:16px}.process-timeline{list-style:none;padding:0}.process-step h3{font-size:1.125rem;margin-bottom:12px}.process-step p{color:var(--color-text-secondary);font-size:1rem}.process-number{font-family:var(--font-en);color:var(--color-accent-ink);font-size:1.125rem}.process-output{display:inline-block;margin-top:16px;border-top:1px solid var(--border);padding-top:8px;font-size:.875rem;color:var(--color-sage)}.about-image img{width:100%;border-radius:var(--radius-frame);border:1px solid var(--border)}.about-lead{font-size:1.375rem;margin-block:16px}.about-copy>p:not(.about-lead){color:var(--color-text-secondary);font-size:1.0625rem}.about-specialties{display:flex;gap:16px;flex-wrap:wrap;font-size:.875rem;color:var(--color-accent-ink);margin-block:24px}.faq-grid>div>p{color:var(--color-text-secondary);margin-top:16px}.faq-item{border-top:1px solid var(--border)}.faq-item:last-child{border-bottom:1px solid var(--border)}.faq-item summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:64px;list-style:none;cursor:pointer;font-weight:600;padding-block:16px}.faq-item summary::-webkit-details-marker,.service-accordion summary::-webkit-details-marker{display:none}.faq-item[open] summary svg{transform:rotate(45deg)}.faq-item p{padding-bottom:24px;color:var(--color-text-secondary);line-height:1.85}.faq-item summary svg{transition:transform var(--duration-state) var(--ease)}
.contact-section{padding-block:80px}.contact-copy>p{margin-top:24px;color:var(--color-on-dark-muted);font-size:1.0625rem}.contact-copy>.btn{margin-top:32px}.contact-copy .contact-channel-label{font-size:.875rem;margin-top:32px}.contact-email{display:block;font-size:1rem;text-decoration:underline;margin-top:8px;overflow-wrap:anywhere;max-width:100%;width:fit-content}.contact-instagram{margin-top:24px;color:var(--color-on-dark-muted)}.inquiry-form{border:1px solid var(--border-dark);padding:32px;border-radius:var(--radius-frame);background:#2E332C;min-width:0}.inquiry-form h3{font-size:1.375rem}.inquiry-form>p{font-size:.9375rem;color:var(--color-on-dark-muted);margin-block:12px 24px}.form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.form-group{min-width:0;margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;font-size:.875rem}.form-group input,.form-group select,.form-group textarea{width:100%;min-width:0;border:1px solid var(--color-field-border);border-radius:var(--radius-control);background:var(--color-dark);color:var(--color-on-dark);padding:12px;min-height:48px;font-size:1rem;line-height:1.7}.form-group textarea{resize:vertical}.form-group input::placeholder,.form-group textarea::placeholder{color:var(--color-on-dark-muted);opacity:1}.form-group :is(input,select,textarea):focus{border-color:var(--color-accent)}.form-group [aria-invalid=true]{border-color:var(--color-on-dark-error)}.field-error{font-size:.875rem;color:var(--color-on-dark-error);margin-top:8px}.field-hint,.form-hint{color:var(--color-on-dark-muted);font-size:.8125rem;margin-top:8px}.form-hint{margin-bottom:20px}.form-error-summary{padding:12px;border:1px solid var(--color-on-dark-error);color:var(--color-on-dark-error);margin-bottom:20px;font-size:.875rem}.inquiry-form .btn{width:100%}.form-status{color:var(--color-on-dark);font-size:.9375rem;margin-top:16px}.form-status:empty{display:none}.wa-fallback{margin-top:8px;color:var(--color-accent);text-decoration:underline}.site-footer{border-top:1px solid var(--border-dark);padding-block:24px}.site-footer>.container{display:flex;justify-content:space-between;gap:24px;align-items:center}.site-footer nav{display:flex;gap:20px;flex-wrap:wrap;font-size:.875rem;color:var(--color-on-dark-muted)}.site-footer nav a{display:inline-flex;align-items:center;min-height:44px}.site-footer p{font-size:.8125rem;white-space:nowrap;color:var(--color-on-dark-muted)}
.project-dialog{position:fixed;inset:0 0 0 auto;margin:0;width:min(760px,90vw);max-width:100%;height:100dvh;max-height:100dvh;border:0;padding:0;background:var(--color-bg);color:var(--color-text);overflow:hidden;opacity:0;transition:opacity var(--duration-close) var(--ease),display var(--duration-close) allow-discrete,overlay var(--duration-close) allow-discrete}.project-dialog[open]{opacity:1}.project-dialog:not([open]){display:none}.project-dialog::backdrop{background:rgba(20,23,19,.6);transition:opacity var(--duration-close);backdrop-filter:blur(3px)}@starting-style{.project-dialog[open]{opacity:0}.project-dialog[open]::backdrop{opacity:0}}.dialog-panel{display:flex;flex-direction:column;height:100%;max-height:100%;overflow:hidden}.dialog-header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 32px;border-bottom:1px solid var(--border);flex-shrink:0}.dialog-header h2{font-size:1.25rem}.dialog-body{padding:24px 32px;overflow-y:auto;overscroll-behavior:contain;min-height:0}.dialog-footer{padding:16px 32px max(16px,env(safe-area-inset-bottom));border-top:1px solid var(--border);background:var(--color-bg);flex-shrink:0}.dialog-footer .btn{width:100%}.sheet-handle{display:none}.study-intro{margin-block:16px 24px;font-size:1.0625rem}.study-visual{margin-bottom:32px}.study-image-scroll{overflow:auto;border-radius:var(--radius-frame);border:1px solid var(--border)}.study-image-scroll img{width:100%;max-width:100%;height:auto}.study-visual.is-zoomed .study-image-scroll img{width:1100px;min-width:1100px;max-width:none}.zoom-control{margin-top:12px}.study-facts{display:grid;gap:24px;padding-block:8px 24px}.study-content h3{font-size:1.25rem;margin-bottom:12px}.study-content h4{font-size:1.0625rem;margin-bottom:8px}.study-content p{color:var(--color-text-secondary)}.study-decisions{display:grid;gap:24px;margin-bottom:32px}.decision{padding-inline-start:16px;border-inline-start:1px solid var(--border)}.project-demo{margin-top:32px;padding:24px 20px;border:1px solid var(--border);border-radius:var(--radius-frame);background:#EFEAE0}.project-demo>p{font-size:.875rem}.demo-content{margin-top:24px}.demo-tabs,.demo-filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}.demo-tabs button,.demo-filters button,.demo-control{min-height:44px;min-width:44px;border:1px solid var(--border);padding:8px 12px;border-radius:4px;background:var(--color-bg);font-size:.875rem}.demo-tabs [aria-selected=true],.demo-filters [aria-pressed=true]{background:var(--color-text);color:var(--color-bg)}.demo-products{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.demo-product{padding:16px;background:var(--color-bg);border:1px solid var(--border);border-radius:4px}.demo-product h4{font-size:1rem}.demo-product .btn{font-size:.875rem;padding:8px 12px;margin-top:12px;width:100%}.demo-cart{margin-top:24px;padding-top:20px;border-top:1px solid var(--border)}.demo-cart h4{font-size:1rem}.demo-cart-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-block:12px;border-top:1px solid var(--border)}.demo-quantity{display:flex;align-items:center;gap:8px}.demo-status{font-size:.875rem;min-height:26px;margin-top:16px;color:var(--color-sage)!important}.demo-step .btn{margin-top:16px}.demo-step select{padding:10px;min-height:48px;border:1px solid var(--border);background:var(--color-bg);border-radius:4px;color:var(--color-text);width:100%;margin-top:8px}.demo-review{padding:16px;border:1px solid var(--border);background:var(--color-bg);margin-block:16px}.study-static .zoom-control{display:none}.js-enhanced .project-dialog .zoom-control{display:inline-block}::view-transition-group(msb-project-image){animation-duration:400ms;animation-timing-function:var(--ease)}::view-transition-old(root),::view-transition-new(root){animation:none}
@media(min-width:1200px){.section-block{padding-block:96px}}
@media(max-width:1023px){:root{--page-gutter:32px}.form-row{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.project-image-link:hover img{transform:none}.btn:active,.btn:is(:hover,:focus-visible) svg,.text-link:is(:hover,:focus-visible) svg{transform:none}}

.brand-identity{min-width:0;flex-shrink:1}.brand-identity>span:last-child{min-width:0}.brand-en{overflow-wrap:anywhere}
