/* CEREND — Monolith M·2 brand */
@font-face{font-family:"Archivo";src:url("fonts/archivo-var.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Alexandria";src:url("fonts/alexandria-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Alexandria";src:url("fonts/alexandria-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}

:root{
  --ink:#0B0B0B;--paper:#FFFFFF;--bone:#F1F0EC;--silver:#C9C7C1;--graphite:#55534E;
  --mute-dark:#A3A19B;--line-dark:#262624;--line-light:#DAD8D2;
  --font:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;
  --gutter:clamp(20px,5vw,72px);--max:1320px;
  --ease:cubic-bezier(.2,.7,.1,1);
}
html[lang="ar"]{--font:"Alexandria","Archivo",system-ui,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--ink);color:var(--ink);font-family:var(--font);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,p,ul,ol,dl,dd{margin:0}
ul{padding:0;list-style:none}
:focus-visible{outline:2px solid currentColor;outline-offset:4px;border-radius:2px}
.skip{position:absolute;left:16px;top:-60px;z-index:100;background:var(--paper);color:var(--ink);padding:10px 16px;border-radius:6px;font-weight:600;text-decoration:none}
.skip:focus{top:16px}
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
html[lang="ar"] .eyebrow{letter-spacing:0;text-transform:none;font-size:14px}
.dark{background:var(--ink);color:var(--paper)}
.bone{background:var(--bone)}
.light{background:var(--paper)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 22px;border-radius:999px;font:600 15px/1 var(--font);text-decoration:none;transition:transform .5s var(--ease),background-color .3s,color .3s,box-shadow .3s}
.btn:hover{transform:translateY(-2px)}
.btn-solid{background:var(--paper);color:var(--ink)}
.btn-solid:hover{background:var(--bone)}
.btn-ghost{box-shadow:inset 0 0 0 1px #3A3936;color:var(--paper)}
.btn-ghost:hover{box-shadow:inset 0 0 0 1px var(--paper)}
.btn-ink{background:var(--ink);color:var(--paper)}
.btn .arrow{transition:transform .5s var(--ease)}
.btn:hover .arrow{transform:translateX(4px)}
html[dir="rtl"] .btn .arrow{transform:scaleX(-1)}
html[dir="rtl"] .btn:hover .arrow{transform:scaleX(-1) translateX(4px)}

/* header */
.site-header{position:fixed;inset:0 0 auto 0;z-index:50;color:var(--paper);transition:background-color .4s,backdrop-filter .4s,box-shadow .4s}
.site-header.is-scrolled{background:rgba(11,11,11,.72);-webkit-backdrop-filter:saturate(1.4) blur(18px);backdrop-filter:saturate(1.4) blur(18px);box-shadow:0 1px 0 rgba(255,255,255,.06)}
.nav{display:flex;align-items:center;justify-content:space-between;height:76px;gap:24px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand svg{width:30px;height:30px}
.wordmark{font-family:"Archivo",sans-serif;font-weight:800;font-size:23px;letter-spacing:-.035em;line-height:1}
.nav-links{display:flex;align-items:center;gap:30px;font-size:14px}
.nav-links a{text-decoration:none;color:#D9D7D1;transition:color .3s}
.nav-links a:hover{color:var(--paper)}
.nav-right{display:flex;align-items:center;gap:18px}
.lang{font-size:14px;text-decoration:none;color:#D9D7D1}
.lang:hover{color:var(--paper)}
.nav .btn{min-height:42px;padding:0 18px;font-size:14px}
.menu-btn{display:none;width:44px;height:44px;border:0;border-radius:999px;background:transparent;color:var(--paper);cursor:pointer}
.menu-btn span{display:block;width:20px;height:2px;margin:5px auto;background:currentColor;transition:transform .4s var(--ease),opacity .3s}
.menu-open .menu-btn span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-open .menu-btn span:nth-child(2){opacity:0}
.menu-open .menu-btn span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media (max-width:960px){
  .nav-links{position:fixed;inset:76px 0 auto 0;flex-direction:column;align-items:flex-start;gap:0;padding:8px var(--gutter) 28px;background:rgba(11,11,11,.96);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);transform:translateY(-12px);opacity:0;pointer-events:none;transition:opacity .35s,transform .45s var(--ease)}
  .nav-links a{display:block;width:100%;padding:14px 0;font-size:20px;border-bottom:1px solid var(--line-dark)}
  .menu-open .nav-links{opacity:1;transform:none;pointer-events:auto}
  .menu-btn{display:block}
  .nav .btn{display:none}
}

/* hero */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;overflow:hidden;padding:120px 0 96px}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);align-items:center;gap:48px}
.hero-copy{display:flex;flex-direction:column;gap:28px;will-change:transform,opacity}
.hero .eyebrow{color:var(--mute-dark)}
.hero h1{font-weight:800;font-size:clamp(52px,7.6vw,132px);line-height:.92;letter-spacing:-.05em}
html[lang="ar"] .hero h1{letter-spacing:0;line-height:1.15;font-weight:600;font-size:clamp(52px,8.4vw,128px)}
.hero h1 .line{display:block;overflow:hidden;padding-bottom:.06em}
.hero h1 .line>span{display:inline-block;transform:translateY(105%);transition:transform 1.2s var(--ease)}
.loaded .hero h1 .line>span{transform:none}
.hero h1 .line:nth-child(2)>span{transition-delay:.12s}
.hero-sub{max-width:560px;font-size:clamp(17px,1.5vw,20px);line-height:1.6;color:#CFCDC7}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px}
.hero-mark{justify-self:end;width:min(34vw,500px);aspect-ratio:1;will-change:transform}
.hero-mark svg{width:100%;height:100%}
.hero-mark .disc{transform-origin:center;transform:scale(.86);opacity:0;transition:transform 1.6s var(--ease),opacity 1.2s}
.loaded .hero-mark .disc{transform:none;opacity:1}
.cut{transform-box:fill-box;transform-origin:right center}
.hero-mark .cut{transform:scaleX(0);transition:transform 1.3s var(--ease)}
.loaded .hero-mark .cut{transform:scaleX(1)}
.loaded .hero-mark .c1{transition-delay:.55s}.loaded .hero-mark .c2{transition-delay:.7s}.loaded .hero-mark .c3{transition-delay:.85s}
.scroll-cue{position:absolute;bottom:32px;inset-inline-start:var(--gutter);display:flex;align-items:center;gap:12px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute-dark)}
html[lang="ar"] .scroll-cue{letter-spacing:0;text-transform:none;font-size:14px}
.scroll-cue i{display:block;width:1px;height:40px;background:linear-gradient(var(--paper),transparent);animation:cue 2.2s var(--ease) infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.hero .fade-in{opacity:0;transform:translateY(16px);transition:opacity 1s .5s,transform 1.2s .5s var(--ease)}
.loaded .hero .fade-in{opacity:1;transform:none}
@media (max-width:900px){
  .hero{align-items:flex-end;padding-top:110px}
  .hero-grid{grid-template-columns:1fr;gap:28px}
  .hero-mark{order:-1;justify-self:start;width:min(46vw,240px)}
  .scroll-cue{display:none}
}

/* marquee */
.marquee{overflow:hidden;border-block:1px solid var(--line-dark);padding:22px 0;color:#8E8C86;font-size:clamp(18px,2vw,24px);font-weight:500;letter-spacing:-.01em;direction:ltr}
.marquee-track{display:flex;width:max-content;animation:marquee 42s linear infinite}
.marquee ul{display:flex;gap:48px;padding-inline-end:48px}
.marquee li{display:flex;align-items:center;gap:48px;white-space:nowrap}
.marquee li::after{content:"";width:8px;height:8px;border-radius:50%;background:#3A3936}
@keyframes marquee{to{transform:translateX(-50%)}}
html[lang="ar"] .marquee{font-weight:400;letter-spacing:0}

/* sections */
.section{padding:clamp(96px,14vw,184px) 0}
.sec-head{display:flex;flex-direction:column;gap:18px;max-width:820px}
.sec-head h2{font-weight:800;font-size:clamp(40px,6vw,88px);line-height:.98;letter-spacing:-.045em}
html[lang="ar"] .sec-head h2,html[lang="ar"] .cta h2{letter-spacing:0;line-height:1.2;font-weight:600}
.sec-head p{font-size:clamp(17px,1.4vw,20px);color:var(--graphite);max-width:600px}
.dark .sec-head p{color:var(--mute-dark)}
.bone .eyebrow,.light .eyebrow{color:var(--graphite)}
.dark .eyebrow{color:var(--mute-dark)}

/* statement */
.statement .eyebrow{margin-bottom:32px}
.statement-text{font-weight:600;font-size:clamp(28px,4.2vw,60px);line-height:1.14;letter-spacing:-.03em;max-width:1180px}
html[lang="ar"] .statement-text{letter-spacing:0;line-height:1.55;font-weight:600}
.statement-text .w{color:var(--silver);transition:color .35s}
.statement-text .w.on{color:var(--ink)}

/* services horizontal */
.services{position:relative}
.services-pin{position:relative}
.services.is-pinned .services-pin{position:sticky;top:0;height:100vh;padding-top:64px;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.services-top{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:clamp(36px,5vw,64px)}
.services-progress{flex-shrink:0;width:180px;height:2px;background:var(--line-dark);position:relative;overflow:hidden}
.services-progress i{position:absolute;inset:0;background:var(--paper);transform-origin:left;transform:scaleX(0)}
html[dir="rtl"] .services-progress i{transform-origin:right}
.track{display:grid;gap:20px;padding-inline:var(--gutter)}
.services.is-pinned .track{display:flex;width:max-content;will-change:transform}
.card{position:relative;display:flex;flex-direction:column;gap:22px;padding:34px;border-radius:20px;background:#141413;box-shadow:inset 0 0 0 1px var(--line-dark);transition:box-shadow .5s,background-color .5s}
.services.is-pinned .card{width:min(420px,78vw);min-height:min(460px,52vh)}
.card:hover{background:#181817;box-shadow:inset 0 0 0 1px #4A4945}
.card-num{font-size:13px;font-weight:600;letter-spacing:.12em;color:var(--mute-dark)}
.card-icon{width:56px;height:56px;color:var(--paper)}
.card h3{font-weight:700;font-size:clamp(26px,2.4vw,32px);line-height:1.1;letter-spacing:-.03em}
html[lang="ar"] .card h3{letter-spacing:0;line-height:1.35;font-weight:600}
.card p{color:#BDBBB5;font-size:16px}
.card ul{margin-top:auto;display:flex;flex-wrap:wrap;gap:8px}
.card li{font-size:13px;padding:7px 12px;border-radius:999px;box-shadow:inset 0 0 0 1px #34332F;color:#D9D7D1}
.wrap-track{max-width:var(--max);margin-inline:auto}
@media (max-width:900px){.track{grid-template-columns:1fr}}
@media (min-width:901px){.services:not(.is-pinned) .track{grid-template-columns:repeat(2,minmax(0,1fr));max-width:var(--max);margin-inline:auto}}

/* approach */
.approach-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,8vw,120px);align-items:start}
.approach .sec-head{position:sticky;top:120px}
.steps{position:relative;display:flex;flex-direction:column}
.steps::before,.steps .fill{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:2px;background:var(--line-light)}
.steps .fill{background:var(--ink);transform-origin:top;transform:scaleY(0)}
.step{padding:0 0 clamp(56px,7vw,96px);padding-inline-start:clamp(28px,4vw,56px)}
.step:last-child{padding-bottom:0}
.step-num{font-size:13px;font-weight:600;letter-spacing:.12em;color:var(--graphite)}
.step h3{margin:10px 0 12px;font-weight:800;font-size:clamp(34px,4.4vw,64px);line-height:1;letter-spacing:-.045em;color:var(--silver);transition:color .6s}
html[lang="ar"] .step h3{letter-spacing:0;line-height:1.3;font-weight:600}
.step.on h3{color:var(--ink)}
.step p{max-width:460px;color:var(--graphite);font-size:18px}
@media (max-width:900px){.approach-grid{grid-template-columns:1fr}.approach .sec-head{position:static}}

/* kingdom */
.kingdom-grid{margin-top:clamp(48px,7vw,96px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line-light);border-block:1px solid var(--line-light)}
.k-item{background:var(--bone);padding:36px 28px 40px 0;display:flex;flex-direction:column;gap:14px}
html[dir="rtl"] .k-item{padding:36px 0 40px 28px}
.k-item+.k-item{padding-inline-start:28px}
.k-item h3{font-weight:700;font-size:22px;line-height:1.2;letter-spacing:-.02em}
html[lang="ar"] .k-item h3{letter-spacing:0;line-height:1.5;font-weight:600}
.k-item p{color:var(--graphite);font-size:16px}
.k-item svg{width:28px;height:28px}
@media (max-width:1000px){.kingdom-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.k-item:nth-child(3){padding-inline-start:0}}
@media (max-width:620px){.kingdom-grid{grid-template-columns:1fr}.k-item,.k-item+.k-item{padding-inline:0}}

/* mark story */
.story{position:relative;height:320vh}
.story-pin{position:sticky;top:0;height:100vh;display:flex;align-items:center;overflow:hidden}
.story-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center}
.story-mark{width:min(40vw,500px);aspect-ratio:1;justify-self:center}
.story-mark .cut{transform:none;transition:transform 1s var(--ease)}
.story-mark .cut.on{transform:translateX(-14%)}
.layers{display:flex;flex-direction:column;gap:6px;margin-top:40px}
.layer{display:flex;align-items:baseline;gap:20px;padding:16px 0;border-bottom:1px solid var(--line-dark);color:#5E5C57;transition:color .6s}
.layer.on{color:var(--paper)}
.layer b{font-size:13px;font-weight:600;letter-spacing:.12em;min-width:28px}
.layer span{font-weight:800;font-size:clamp(28px,3.4vw,48px);letter-spacing:-.04em;line-height:1.1}
html[lang="ar"] .layer span{letter-spacing:0;font-weight:600;line-height:1.4}
.story .sec-head p{max-width:520px}
@media (max-width:900px){.story{height:auto}.services-top{flex-direction:column;align-items:flex-start}.services-progress{display:none}.story-pin{position:static;height:auto;padding:96px 0}.story-grid{grid-template-columns:1fr}.story-mark{width:min(64vw,300px);justify-self:start}.layer{color:var(--paper)}}

/* industries */
.ind-grid{margin-top:clamp(48px,7vw,96px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line-light)}
.ind{position:relative;padding:32px 24px 40px 0;border-bottom:1px solid var(--line-light);display:flex;flex-direction:column;gap:10px;overflow:hidden}
html[dir="rtl"] .ind{padding:32px 0 40px 24px}
.ind::before{content:"";position:absolute;inset:0;background:var(--ink);transform:scaleY(0);transform-origin:bottom;transition:transform .6s var(--ease);z-index:0}
.ind>*{position:relative;z-index:1;transition:color .4s,transform .6s var(--ease)}
.ind h3{font-weight:700;font-size:22px;letter-spacing:-.02em;line-height:1.2}
html[lang="ar"] .ind h3{letter-spacing:0;line-height:1.5;font-weight:600}
.ind p{color:var(--graphite);font-size:15px}
@media (hover:hover){.ind:hover::before{transform:scaleY(1)}.ind:hover>*{color:var(--paper);transform:translateX(24px)}html[dir="rtl"] .ind:hover>*{transform:translateX(-24px)}.ind:hover p{color:var(--silver)}}
@media (max-width:1000px){.ind-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.ind-grid{grid-template-columns:1fr}}

/* faq */
.faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(40px,8vw,120px);align-items:start}
.faq-list{border-top:1px solid var(--line-light)}
.faq-list details{border-bottom:1px solid var(--line-light)}
.faq-list summary{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:26px 0;cursor:pointer;list-style:none;font-weight:600;font-size:clamp(18px,1.6vw,22px);letter-spacing:-.01em}
html[lang="ar"] .faq-list summary{letter-spacing:0}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary i{position:relative;flex-shrink:0;width:18px;height:18px}
.faq-list summary i::before,.faq-list summary i::after{content:"";position:absolute;left:0;top:8px;width:18px;height:2px;background:currentColor;transition:transform .5s var(--ease)}
.faq-list summary i::after{transform:rotate(90deg)}
.faq-list details[open] summary i::after{transform:rotate(0)}
.faq-list .answer{padding:0 0 28px;max-width:640px;color:var(--graphite)}
@media (max-width:900px){.faq-grid{grid-template-columns:1fr}}

/* cta */
.cta{text-align:center}
.cta .wrap{display:flex;flex-direction:column;align-items:center;gap:28px}
.cta-mark svg{width:72px;height:72px}
.cta h2{font-weight:800;font-size:clamp(48px,9vw,140px);line-height:.92;letter-spacing:-.05em}
.cta p{max-width:520px;font-size:clamp(17px,1.4vw,20px);color:var(--mute-dark)}
.cta .mail{font-size:clamp(18px,2vw,24px);color:var(--paper);text-decoration-thickness:1px;text-underline-offset:6px}

/* footer */
.footer{border-top:1px solid var(--line-dark);padding:72px 0 40px;color:var(--mute-dark);font-size:15px}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:40px}
.foot-grid h2{font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--paper);margin-bottom:16px}
html[lang="ar"] .foot-grid h2{letter-spacing:0;text-transform:none;font-size:15px}
.foot-grid li{margin-bottom:10px}
.foot-grid a{text-decoration:none}
.foot-grid a:hover{color:var(--paper)}
.foot-brand{display:flex;flex-direction:column;gap:16px;color:var(--paper)}
.foot-brand p{color:var(--mute-dark);max-width:300px}
.legal{margin-top:72px;padding-top:28px;border-top:1px solid var(--line-dark);display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;font-size:13px}
@media (max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}.foot-brand{grid-column:1/-1}}

/* reveal */
.js [data-reveal]{opacity:0;transform:translateY(32px);transition:opacity 1s var(--ease),transform 1.2s var(--ease);transition-delay:var(--d,0s)}
.js [data-reveal].in{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js [data-reveal]{opacity:1;transform:none}
  .hero h1 .line>span,.hero-mark .disc,.cut,.hero .fade-in{transform:none!important;opacity:1!important}
  .statement-text .w{color:var(--ink)}
  .step h3{color:var(--ink)}
}