/* Ertah Atelier — spatial architecture and editorial content. */
:root{--wrap:1440px;--pad-x:max(clamp(22px,5vw,80px),env(safe-area-inset-left),env(safe-area-inset-right))}
body>nav{border-bottom:1px solid #ffffff14}body>nav .nav-inner{min-height:78px}body>nav .nav-logo-img{width:106px}body>nav .page-toggle{margin-inline-start:22px;gap:24px}body>nav .pt-btn{font-size:14px}body>nav .btn-primary{border:1px solid #ffffff48;background:transparent;color:#fff;border-radius:2px;padding:12px 19px}body>nav .btn-primary:hover{background:#ffffff12}
.atelier-hero{position:relative;min-height:0;padding:0;overflow:hidden;background:var(--night)}.atelier-hero .hero-art{display:none}.atelier-hero .hero-wrap{max-width:1600px;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);gap:0;align-items:center;padding-block:20px 12px}.atelier-hero .hero-copy{position:relative;z-index:2;padding-block:30px 55px;padding-inline-end:10px}.atelier-hero .hero-h1{font-size:clamp(68px,7.3vw,116px);font-weight:400;line-height:.98;letter-spacing:-.065em;max-width:660px}.atelier-hero [data-sv="v"] .hero-h1,.atelier-hero [data-sv="b"] .hero-h1{font-size:clamp(54px,5.7vw,90px);line-height:1.02}.atelier-hero .hero-h1 .hl{margin-top:12px;color:var(--experience-accent)}.atelier-hero .hero-sub{font-size:17px;line-height:1.75;max-width:365px;margin-top:35px;color:#b9b4c1}.atelier-hero .hero-actions{margin-top:36px;gap:25px}.atelier-hero .btn-primary{border-radius:2px;padding:17px 24px;font-size:15px}.atelier-hero .btn-ghost{font-size:14px}.atelier-hero .hero-footer{margin-top:0;padding-block:22px;font-size:13px;max-width:1600px}.architecture{position:relative;min-width:0;align-self:stretch;display:flex;flex-direction:column;justify-content:center;margin-inline-start:-25px}.scene-overline{position:absolute;top:20px;inset-inline:20px 0;display:flex;align-items:center;justify-content:space-between;color:#b9b1c7;font-size:11px;letter-spacing:.13em;gap:15px}.scene-edition{letter-spacing:.03em;color:#80758e}.scene-view{height:clamp(440px,43vw,630px);position:relative;outline-offset:-5px;touch-action:pan-y;cursor:grab;z-index:1;min-width:0}.scene-view:active{cursor:grabbing}.scene-view canvas{width:100%;height:100%;display:block;position:absolute;inset:0;opacity:0;transition:opacity 1s}.scene-fallback{position:absolute;width:90%;height:75%;top:12%;left:5%;object-fit:cover;opacity:0;transition:opacity .6s}.no-webgl .scene-fallback{opacity:.85}.scene-ready canvas{opacity:1}.scene-ready .scene-fallback{opacity:0;pointer-events:none}.scene-drag{position:absolute;bottom:18px;inset-inline-start:20px;color:#8d829d;font-size:12px;pointer-events:none}.scene-tools{margin:0 0 0 20px;border-top:1px solid #ffffff1c;z-index:2;position:relative}.scene-tools[hidden]{display:none}.scene-modes{display:flex;align-items:center;gap:24px;padding-block:17px;border-bottom:1px solid #ffffff10}.scene-modes button,.scene-build button{font:inherit;font-size:13px;display:flex;align-items:center;gap:8px;border:0;background:none;color:#b6adbf;padding:7px 0;cursor:pointer}.scene-modes button[aria-pressed="true"]{color:var(--experience-accent)}.scene-modes button:hover,.scene-build button:hover{color:#fff}.scene-modes button:last-child{margin-inline-start:auto;font-size:22px;padding-inline:8px}.mode-icon{font-size:20px;color:var(--experience-accent)}.scene-build{display:flex;align-items:center;gap:16px;padding-block:16px;color:#b6adbf;font-size:13px}.scene-build input{flex:1;min-width:0;height:24px;background:transparent;cursor:ew-resize;accent-color:var(--experience-accent)}.scene-build button{font-size:23px;width:28px;justify-content:center}.scene-footnote{margin:0 0 12px 20px;color:#80778b;font-size:12px;line-height:1.5}.no-webgl .scene-drag{display:none}
/* A quieter, warm-white editorial canvas after the immersive opening. */
.site-sheet{--bg:#f5f4f1;--panel:#ecebe8;--card:#faf9f6;--ink:#201d25;--ink-2:#625d68;--ink-3:#87818c;background:var(--bg)}html[data-theme="dark"] .site-sheet{--bg:var(--night);--panel:var(--night-panel);--card:var(--night-panel);--ink:#f3f0f5;--ink-2:#c2bacb;--ink-3:#9e94aa}.sec{border:0;padding-block:100px}.h2{font-size:clamp(35px,4.3vw,62px);font-weight:400;line-height:1.1;letter-spacing:-.045em}.h2 .dim{font-size:.55em;font-weight:400;letter-spacing:-.01em;line-height:1.45;margin-top:20px;max-width:590px}.manifesto{padding-block:90px 0}.manifesto .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(230px,.35fr);gap:12%;text-align:start}.manifesto-body{font-size:clamp(28px,3.1vw,44px);line-height:1.34;max-width:none;letter-spacing:-.035em}.manifesto .meta-strip{display:flex;flex-direction:column;align-items:flex-start;margin:0;padding:0;border:0;gap:0}.meta-item{width:100%;padding:17px 0;border-bottom:1px solid var(--hairline);line-height:1.45}.meta-item .mono{font-size:13px;letter-spacing:.02em;color:var(--ink-2)}
#services{background:transparent}.service-catalogue{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:7%;margin-top:55px;align-items:start}.catalogue-photo{margin:0;position:relative;aspect-ratio:4/5;overflow:hidden}.catalogue-photo img{height:100%;width:100%;object-fit:cover;transition:opacity .3s,transform 1.2s}.catalogue-photo:hover img{transform:scale(1.04)}.catalogue-photo::after{content:"";position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#151020bd);pointer-events:none}.catalogue-photo figcaption{position:absolute;bottom:26px;inset-inline:26px;color:#fff;font-size:23px;line-height:1.25;max-width:320px;z-index:1;letter-spacing:-.02em}.service-entry{border-top:1px solid var(--hairline-2)}.service-entry:last-child{border-bottom:1px solid var(--hairline-2)}.service-entry summary{display:flex;align-items:center;gap:20px;cursor:pointer;list-style:none;padding:27px 0;font-size:clamp(22px,2.35vw,34px);letter-spacing:-.03em;line-height:1.2}.service-entry summary::-webkit-details-marker{display:none}.service-number{font-size:12px;color:var(--ink-3);letter-spacing:0;align-self:center}.service-plus{margin-inline-start:auto;font-size:24px;font-weight:300;color:var(--ink-3)}.service-entry[open] .service-plus{transform:rotate(45deg);color:var(--brand-text)}.service-entry[open] summary{color:var(--brand-text)}.service-answer{padding:0 20px 28px 40px}.service-answer p{font-size:17px;line-height:1.7;color:var(--ink-2);max-width:420px}.service-answer .link{display:inline-flex;margin-top:20px;font-size:15px;text-decoration:underline;text-underline-offset:5px}.catalogue-context{display:grid;grid-template-columns:1fr 1fr;gap:7%;border-top:1px solid var(--hairline);margin-top:45px;padding-top:30px}.catalogue-context p{font-size:15px;line-height:1.75;color:var(--ink-2)}
#build-story{padding-block:80px}.tl-head .h2{max-width:820px}#build-story .tl-rail{margin-top:40px}#build-story .tl-card{border-radius:0;border:0;background:transparent;flex-basis:clamp(280px,31vw,420px)}#build-story .tl-photo{height:235px}#build-story .tl-body{padding:23px 0 0}#build-story .tl-title{font-size:28px}#build-story .tl-text{font-size:16px;color:#bdb4ca}#build-story .tl-badge{border-radius:0}
/* Trust is a ledger: readable rows instead of a grid of generic tiles. */
#trust{padding-block:95px;background:var(--bg)}#trust>.wrap>[data-sv]{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);column-gap:8%;align-items:start}#trust .h2{grid-column:1;font-size:clamp(34px,3.6vw,53px)}#trust .trust-grid{grid-column:2;grid-row:1/3;display:flex;flex-direction:column;gap:0;margin:0;counter-reset:trust}#trust .trust-card{border:0;border-top:1px solid var(--hairline-2);border-radius:0;background:none;padding:25px 0 25px 40px;position:relative;counter-increment:trust}#trust .trust-card::before{content:"0" counter(trust);position:absolute;left:0;top:30px;color:var(--brand-text);font-size:12px}#trust .trust-card svg{display:none}#trust .trust-title{font-size:24px;font-weight:400;letter-spacing:-.025em}#trust .trust-desc{font-size:16px;line-height:1.7}#trust .trust-notes{grid-column:1;margin-top:35px;max-width:420px}.trust-note{font-size:14px}.fin-band{border-radius:0}.fb-panel{border-radius:3px}.rev-grid{gap:35px}.rev-card{background:transparent;border-radius:0}.cta{margin:0;border-radius:0!important;padding:95px var(--pad-x);background:var(--night)!important}.cta-lines{display:none}.cta-h2{font-size:clamp(46px,6.5vw,100px);max-width:1000px;margin-inline:auto;line-height:1.02}.cta-sub{color:#bbb3c8;font-size:18px}.cta .btn{border-radius:2px;background:var(--brand);color:#fff;padding:18px 32px}.footer-shell{padding:0}.footer-shell footer{border-radius:0;background:var(--night);border-top:1px solid #ffffff1a;padding-top:60px}.foot-top{padding-bottom:50px}.faq-list{max-width:850px;margin-inline-start:auto}.faq-q{font-size:21px}.faq-item.open{border-radius:0;padding-inline:0;background:none}
html[data-lang="ar"] .atelier-hero .hero-h1{font-size:clamp(54px,6vw,90px);line-height:1.35;letter-spacing:0}html[data-lang="ar"] .atelier-hero [data-sv="b"] .hero-h1,html[data-lang="ar"] .atelier-hero [data-sv="v"] .hero-h1{font-size:clamp(43px,4.8vw,70px)}html[data-lang="ar"] .service-answer{padding-inline:40px 20px}html[data-lang="ar"] #trust .trust-card{padding-inline:40px 0}html[data-lang="ar"] #trust .trust-card::before{right:0;left:auto}
@media(max-width:1200px){.atelier-hero .hero-wrap{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}.atelier-hero .hero-h1{font-size:80px}.atelier-hero [data-sv="v"] .hero-h1,.atelier-hero [data-sv="b"] .hero-h1{font-size:64px}.architecture{margin-inline-start:-10px}.scene-view{height:520px}.scene-modes{gap:16px}.scene-modes button{font-size:12px}.manifesto .wrap{gap:7%}}
@media(max-width:900px){.atelier-hero .hero-h1{font-size:65px}.atelier-hero [data-sv="v"] .hero-h1,.atelier-hero [data-sv="b"] .hero-h1{font-size:52px}.scene-view{height:470px}.scene-overline{font-size:10px}.scene-edition{display:none}.scene-modes{gap:12px;flex-wrap:wrap}.scene-modes button:last-child{margin-inline-start:0}.mode-icon{font-size:16px}.atelier-hero .hero-sub{font-size:16px}.atelier-hero .hero-actions{gap:15px}.service-catalogue{gap:5%}.scene-footnote{font-size:11px}}
@media(max-width:760px){body>nav .page-toggle{margin-inline-start:0}.atelier-hero .hero-wrap{grid-template-columns:minmax(0,1fr);padding-top:30px;padding-bottom:0}.atelier-hero .hero-copy{padding:0;max-width:600px}.atelier-hero .hero-h1{font-size:clamp(62px,15vw,100px)}.atelier-hero [data-sv="v"] .hero-h1,.atelier-hero [data-sv="b"] .hero-h1{font-size:clamp(47px,11vw,74px)}.atelier-hero .hero-h1 br{display:none}.atelier-hero .hero-h1 .hl{margin-top:4px}.atelier-hero .hero-sub{margin-top:20px;max-width:420px;line-height:1.65}.atelier-hero .hero-actions{margin-top:24px;gap:24px}.atelier-hero .btn-primary{padding:14px 19px;font-size:14px}.architecture{margin:30px -12px 0}.scene-overline{position:relative;top:0;inset:auto;margin-inline:12px;font-size:10px}.scene-edition{display:inline}.scene-view{height:clamp(340px,88vw,470px);margin-top:-10px}.scene-drag{font-size:11px;bottom:6px;left:12px}.scene-tools{margin-inline:12px}.scene-modes{flex-wrap:nowrap;gap:16px;padding-block:13px}.scene-modes button{font-size:12px;gap:6px}.scene-modes button:last-child{margin-inline-start:auto}.scene-build{padding-block:10px;gap:12px}.scene-footnote{margin:0 12px 16px;font-size:11px}.atelier-hero .hero-footer{font-size:12px;padding-block:19px}.manifesto{padding-top:55px}.manifesto .wrap{display:block}.manifesto-body{font-size:28px;line-height:1.4}.manifesto .meta-strip{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;margin-top:28px}.meta-item .mono{font-size:12px}.sec{padding-block:60px}.h2{font-size:36px}.h2 .dim{font-size:22px;margin-top:15px}.service-catalogue{grid-template-columns:1fr;margin-top:30px;gap:25px}.catalogue-photo{aspect-ratio:1.65}.catalogue-photo figcaption{font-size:22px;inset-inline:22px;bottom:20px}.service-entry summary{font-size:25px;gap:15px;padding-block:23px}.service-answer{padding-inline-start:30px}.service-answer p{font-size:16px}.catalogue-context{grid-template-columns:1fr;gap:20px;margin-top:26px;padding-top:24px}#trust{padding-block:60px}#trust>.wrap>[data-sv]{display:block}#trust .trust-grid{margin-top:30px}#trust .trust-card{padding-block:22px}#trust .trust-title{font-size:23px}#trust .trust-notes{margin-top:24px}#build-story{padding-block:55px}#build-story .tl-card{flex-basis:84%}#build-story .tl-photo{height:190px}#build-story .tl-body{padding:22px 0 0}#build-story .tl-title{font-size:25px}.cta{padding-block:70px}.cta-h2{font-size:50px}.faq-q{font-size:18px}.scene-modes .mode-icon{display:none}html[data-lang="ar"] .atelier-hero .hero-h1{font-size:56px}html[data-lang="ar"] .atelier-hero [data-sv="b"] .hero-h1,html[data-lang="ar"] .atelier-hero [data-sv="v"] .hero-h1{font-size:42px}html[data-lang="ar"] .scene-modes button{font-size:11px}}
@media(max-width:370px){.atelier-hero .hero-h1{font-size:60px}.atelier-hero [data-sv="v"] .hero-h1,.atelier-hero [data-sv="b"] .hero-h1{font-size:45px}.scene-view{height:325px}.scene-modes{gap:13px}.scene-modes button{font-size:11px}.atelier-hero .hero-actions{gap:18px}.atelier-hero .btn-ghost{font-size:13px}.service-entry summary{font-size:23px}.h2{font-size:32px}}
@media(prefers-reduced-motion:reduce){.scene-view canvas,.scene-fallback,.catalogue-photo img{transition:none}}

.architecture:not(.scene-ready) .scene-drag{display:none}

/* Allow long vendor-screening copy to shrink inside narrow grids. */
.scr-left,.scr-right,.scr-step>div{min-width:0}.scr-step{overflow-wrap:anywhere}
@media(max-width:760px){.scene-modes{flex-wrap:wrap;gap:4px 18px}.scene-modes button{font-size:14px;min-height:44px}html[data-lang="ar"] .scene-modes button{font-size:13px}}

.service-catalogue{display:block;max-width:1050px}.service-answer p{max-width:650px}
/* Hero headlines are always two lines: the statement, then the accent line (.hl is a block).
   Vendors and Business size from their column (container query units) so line 1 never
   wraps, at the same size as each other per language. Ratios = longest line 1 in em
   (EN "Stop chasing leads." 7.27em, AR "اترك مطاردة العملاء." 8.36em) plus a little room.
   Browsers without container queries ignore these and keep the sizes above. */
.atelier-hero .hero-copy{container-type:inline-size}
html .atelier-hero [data-sv="v"] .hero-h1[lang="en"],html .atelier-hero [data-sv="b"] .hero-h1[lang="en"]{font-size:clamp(34px,calc(100cqi / 7.5),90px)}
html .atelier-hero [data-sv="v"] .hero-h1[lang="ar"],html .atelier-hero [data-sv="b"] .hero-h1[lang="ar"]{font-size:clamp(28px,calc(100cqi / 8.6),70px)}