/* هوية «فولاذ وماء» */
@font-face{font-family:Alex;src:url(fonts/alex-arabic-900.woff2) format("woff2");font-weight:900;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+FB50-FDFF,U+FE70-FEFF}
@font-face{font-family:Alex;src:url(fonts/alex-latin-900.woff2) format("woff2");font-weight:900;font-display:swap;unicode-range:U+0000-00FF,U+2013-2014}
@font-face{font-family:Kufi;src:url(fonts/kufi-arabic-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Grotesk;src:url(fonts/grotesk-700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Grotesk;src:url(fonts/grotesk-500.woff2) format("woff2");font-weight:500;font-display:swap}

:root{
  --navy:#061836;--navy2:#0B2A5B;--cobalt:#1466D6;--sky:#D6E6F8;--mist:#EFF4FB;--red:#C4121F;--brass:#E2A72E;--steel:#9FB2CA;--ink:#14243F;--soft:#51627E;
  --head:#061836;--gut:clamp(22px,6vw,88px);
  --metal:linear-gradient(175deg,#fff 18%,#BFD3EC 46%,#7E9CC4 62%,#E8F0FA 84%);
  --hair:1px solid rgba(159,178,202,.28);
  --cutc:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px));
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .055 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
  --rotor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220' fill='none' stroke='%239FB2CA' stroke-opacity='.08'%3E%3Ccircle cx='110' cy='110' r='100'/%3E%3Ccircle cx='110' cy='110' r='64'/%3E%3Ccircle cx='110' cy='110' r='20'/%3E%3C/svg%3E");
}
html{scroll-behavior:auto}
body{line-height:1.95;background:#fff}
h1,h2,h3{font-weight:900;letter-spacing:-.008em}
h2{font-size:clamp(2.5rem,6.4vw,5.6rem);line-height:1.2}
h3{font-family:Kufi,Alex,Plex,sans-serif;font-weight:600;font-size:clamp(1.35rem,2.2vw,1.8rem)}
.dark{background:var(--navy);color:#DDE7F5}
.dark h2,.dark h3{background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent}
.dark .sub{color:var(--steel)}
.w{display:inline-block;overflow:hidden;padding-block:.14em .22em;margin-block:-.14em -.22em;vertical-align:top}
.wi{display:inline-block}
.dark .w .wi{background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent}
.h-line{display:block;width:clamp(70px,9vw,130px);height:3px;margin-top:14px;background:var(--brass);transform-origin:right}
[dir=ltr] .h-line{transform-origin:left}
.sec-n{display:block;font:900 clamp(4rem,10vw,9rem)/1 Alex,sans-serif;color:transparent;-webkit-text-stroke:1px rgba(20,102,214,.28);margin-bottom:-.28em;pointer-events:none}
.dark .sec-n,.inside .sec-n,.agency .sec-n{-webkit-text-stroke-color:rgba(226,167,46,.34)}
.cut{clip-path:var(--cutc)}
.big-phone,.top-phone,.stats b{font-family:Barlow,Alex,sans-serif}
.badge,.logo-btn,.cp-card b{font-family:Grotesk,Plex,sans-serif}

/* الرأس والقائمة */
.topbar{position:fixed;top:0;inset-inline:0;height:3px;z-index:40;background:var(--brass);transform:scaleX(0);transform-origin:right}
[dir=ltr] .topbar{transform-origin:left}
.rail{position:fixed;top:0;bottom:0;inset-inline-start:14px;width:1px;background:rgba(159,178,202,.35);z-index:14;pointer-events:none}
.rail b{display:block;height:100%;background:var(--cobalt);transform:scaleY(0);transform-origin:top}
.top{position:fixed;inset-inline:0;background:transparent;border:0;box-shadow:none;transition:background-color .3s,box-shadow .3s}
body:not(.home) .top,.top.slim{background:#fff;box-shadow:0 1px 0 var(--sky)}
.home .top:not(.slim) .top-phone,.home .top:not(.slim) .menu-btn,.home .top:not(.slim) .lang-top,.home .top:not(.slim) .tool{color:#fff;border-color:rgba(255,255,255,.4)}
.js body.home .top:not(.slim) .brand{opacity:1;pointer-events:auto}
.brand{background:none}
.top-in{justify-content:flex-start;height:92px}
.tools{margin-inline-start:auto}
.menu-btn{display:block;order:9;margin:0;padding:8px 22px;font:600 1rem Kufi,Plex,sans-serif;color:var(--head);border-color:var(--head)}
.lang-top{display:inline-block;text-decoration:none;font-weight:500;padding:6px 14px;border:1px solid var(--sky);border-radius:4px;color:var(--head)}
#nav{position:fixed;inset:0;z-index:-1;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;padding:90px clamp(30px,12vw,180px);margin:0;background:var(--navy) var(--rotor);clip-path:inset(0 0 100% 0);visibility:hidden;transition:clip-path .7s cubic-bezier(.76,0,.24,1),visibility 0s .7s}
#nav.open{display:flex;clip-path:inset(0);visibility:visible;transition:clip-path .7s cubic-bezier(.76,0,.24,1)}
#nav a{font:900 clamp(2.4rem,7vw,5.4rem)/1.3 Alex,sans-serif;color:#fff;border:0;padding:0;background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:0;transform:translateY(30px);transition:opacity .5s,transform .5s}
#nav.open a{opacity:1;transform:none}
#nav.open a:nth-child(2){transition-delay:.08s}#nav.open a:nth-child(3){transition-delay:.14s}#nav.open a:nth-child(4){transition-delay:.2s}#nav.open a:nth-child(5){transition-delay:.26s}#nav.open a:nth-child(6){transition-delay:.32s}
#nav a:hover{letter-spacing:.01em}
#nav .lang{display:none}
.menu-open .top{background:transparent;box-shadow:none}
.menu-open .menu-btn,.menu-open .tool,.menu-open .top-phone,.menu-open .lang-top{color:#fff;border-color:rgba(255,255,255,.45)}

/* البوابة */
.gate{position:fixed;inset:0;z-index:90;pointer-events:none;display:grid;place-items:center}
.gate i{position:absolute;top:0;bottom:0;width:50.5%;background:var(--navy);animation:gateL 1.05s .55s cubic-bezier(.76,0,.24,1) both}
.gate i:first-child{left:0}
.gate i:nth-child(2){right:0;animation-name:gateR}
.gate img{position:relative;width:min(40vw,260px);animation:gateLogo 1.5s both}
@keyframes gateL{to{transform:translateX(-101%)}}
@keyframes gateR{to{transform:translateX(101%)}}
@keyframes gateLogo{0%{opacity:0;transform:scale(.9)}30%,55%{opacity:1;transform:none}100%{opacity:0;transform:scale(1.05)}}
.seen .gate{display:none}

/* الواجهة */
.hero{position:relative;min-height:100svh;overflow:hidden;background:var(--navy);color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:0}
.hero-bg{position:absolute;inset:-12% 0 0;background:linear-gradient(180deg,rgba(6,24,54,.62),rgba(6,24,54,.82) 58%,var(--navy)),var(--grain),url(g/b1.webp) center/cover}
.hero-title{position:absolute;top:11vh;inset-inline:0;margin:0;text-align:center;font:400 clamp(4.6rem,17.5vw,17rem)/1 Rakkas,Alex,sans-serif;background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent;white-space:nowrap;animation:rise 1.2s .15s cubic-bezier(.16,.8,.24,1) both}
.hero .hero-title{background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:clamp(4rem,13.4vw,13.5rem);line-height:1.25}
[lang=en] .hero .hero-title{font-size:clamp(3.2rem,11vw,11rem)}
.hero-title span{display:inline}
[lang=en] .hero-title{font-size:clamp(3.4rem,12.6vw,12.5rem)}
.hero-art{position:absolute;top:25vh;left:50%;width:min(50vh,430px);max-width:none;margin:0;transform:translateX(-50%);animation:none}
[dir=rtl] .hero-art{margin:0}
.has3d .hero-art{display:none}
.pump-water{fill:#27487A}
.pump-foot,.motor{fill:#2B5292}
.hero-foot{position:relative;z-index:3;display:flex;align-items:center;justify-content:flex-start;gap:34px;width:100%;padding-bottom:104px}
.lead{margin:0;max-width:27em;color:#DDE7F5;font-size:clamp(1.15rem,1.9vw,1.6rem);line-height:1.7}
.word{display:inline-block;color:var(--brass);font-family:Kufi,Plex,sans-serif;font-weight:600;min-width:3.4em;text-align:center}
.btn-gold{color:#061836}
.cut.btn{border:0}
.ticker{position:absolute;bottom:0;inset-inline:0;z-index:3;overflow:hidden;border-top:var(--hair);background:rgba(6,24,54,.55);direction:ltr}
.ticker ul{display:flex;width:max-content;animation:marq 46s linear infinite}
.ticker li{padding:15px 34px;font:500 1rem Grotesk,sans-serif;color:var(--steel);white-space:nowrap}
.cue{position:absolute;bottom:64px;left:50%;z-index:3;width:1px;height:58px;background:rgba(255,255,255,.3);overflow:hidden}
.cue i{position:absolute;inset:0;background:var(--brass);animation:drip 1.9s cubic-bezier(.76,0,.24,1) infinite}
@keyframes drip{0%{transform:translateY(-100%)}100%{transform:translateY(100%)}}

/* المشهد ثلاثي الأبعاد */
#stage3d{position:fixed;inset:0;z-index:1;pointer-events:none;transition:opacity .4s}
#stage3d canvas{width:100%;height:100%;display:block}
#stage3d.off{opacity:0}
#stage3d:empty{display:none}
.hero-foot,.ticker{z-index:3}
.hero-title{z-index:0}
.inside{position:relative;min-height:100vh;background:radial-gradient(70% 70% at 50% 50%,#10306A,var(--navy)) ;color:#DDE7F5;overflow:hidden;display:flex;align-items:center;z-index:0}
.inside::after{content:"";position:absolute;inset:0;background:var(--rotor);pointer-events:none}
main>section{position:relative}
.inside-in{width:100%;display:flex;justify-content:space-between;gap:30px;align-items:flex-end;z-index:2;padding-block:120px 60px;min-height:100vh;flex-direction:column;align-items:stretch}
.inside h2{font-size:clamp(2.2rem,4.4vw,3.9rem)}
.inside-head{max-width:30%}
.inside-head h2{background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent}
.inside-head .w .wi{background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent}
.inside .sub{color:var(--steel);max-width:28em}
.in-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:s}
.in-steps li{border-top:2px solid rgba(159,178,202,.3);padding-top:12px;transition:border-color .3s,opacity .3s;opacity:.55}
.in-steps li.on{border-color:var(--brass);opacity:1}
.has3d .in-steps li:first-child{opacity:1}
.in-steps b{display:block;font:600 1.2rem Kufi,Plex,sans-serif;color:#fff}
.in-steps span{font-size:.98rem;color:var(--steel)}
html:not(.has3d) .in-steps li{opacity:1}
.labels{position:absolute;inset:0;z-index:2;pointer-events:none;display:none}
.has3d .labels{display:block}
.label{position:absolute;top:0;left:0;white-space:nowrap;font:600 .95rem Kufi,Plex,sans-serif;color:#fff;opacity:0;transition:opacity .4s}
.label::before{content:"";position:absolute;bottom:-34px;inset-inline-start:0;width:1px;height:34px;background:var(--brass)}
.label span{display:block;padding:2px 12px;background:rgba(6,24,54,.8);border-inline-start:2px solid var(--brass);margin-top:-34px;translate:0 -100%}
.open3d .label{opacity:1}

/* الوكالات */
.agency-wrap{display:block;padding:0;background:var(--navy)}
.agency,.agency+.agency{position:relative;min-height:100vh;display:flex;align-items:center;padding:0;overflow:hidden;box-shadow:none;border:0}
.ag-cal{background:linear-gradient(135deg,#C4121F 10%,#6F0912)}
.ag-ren{background:var(--navy)}
.ag-bg{position:absolute;inset:-12% 0;background:linear-gradient(rgba(6,24,54,.72),rgba(6,24,54,.86)),var(--grain),url(g/v1.webp) center/cover}
.ag-in{position:relative;z-index:2;max-width:1240px;margin-inline:auto;width:100%;padding-inline:var(--gut)}
.ag-tag{position:static!important;font:600 1.15rem Kufi,Plex,sans-serif!important;color:#fff;margin-bottom:22px!important;opacity:.85}
.agency .plate{position:static;display:inline-block;padding:22px 34px;background:#fff;clip-path:var(--cutc);margin-bottom:24px}
.agency .plate img{height:clamp(64px,10vw,120px);width:auto}
.agency h2{color:#fff;font-size:clamp(2.3rem,6vw,5.4rem)}
.agency .sec-n{-webkit-text-stroke-color:rgba(255,255,255,.3)}
.seal{position:absolute;bottom:7vh;inset-inline-end:7vw;width:clamp(120px,14vw,190px);z-index:2}

/* الثقة */
.trust{background:var(--navy);padding-block:0 90px}
.flips{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:0;list-style:none}
.flip{height:190px;perspective:900px}
.flip-in{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.76,0,.24,1)}
.flip:hover .flip-in,.flip:focus-within .flip-in{transform:rotateY(180deg)}
.flip b,.flip span.bk{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:20px;backface-visibility:hidden;clip-path:var(--cutc)}
.flip b{background:var(--navy2);color:#fff;font:800 clamp(1.3rem,2.2vw,1.9rem)/1.4 Alex,sans-serif}
.flip span.bk{background:var(--brass);color:#061836;font-weight:500;transform:rotateY(180deg)}

/* المنتجات */
.products{padding:0;background:radial-gradient(60% 70% at 30% 55%,color-mix(in srgb,var(--pc,#1466D6) 34%,var(--navy)),var(--navy));transition:background .6s;overflow:hidden}
.products::before{content:"";position:absolute;inset:0;background:var(--grain),var(--rotor);pointer-events:none}
.prod-pin{min-height:100vh;display:flex;align-items:center;padding-block:96px 40px}
.prod-pin>.wrap{width:100%}
.prod-head{margin-bottom:18px}
.prod-head h2{font-size:clamp(2.2rem,4.8vw,4.2rem)}
.products .finder{margin-top:10px;grid-template-columns:230px 1fr}
.use{color:var(--steel);border-color:rgba(159,178,202,.2);background:none}
.use:hover{color:#fff}
.use[aria-selected=true]{background:rgba(255,255,255,.08);color:#fff;box-shadow:none;border-inline-start:3px solid var(--paint)}
.use[aria-selected=true] .use-ic{color:var(--paint)}
.stage,.stage+.stage{background:rgba(255,255,255,.04);border:var(--hair);border-top:var(--hair);box-shadow:none;padding:24px;overflow:hidden;position:relative;clip-path:var(--cutc)}
.stage::before{content:"";position:absolute;inset:0;background:radial-gradient(320px circle at var(--mx,70%) var(--my,30%),rgba(255,255,255,.1),transparent 70%);pointer-events:none}
.stage h3{font-family:Alex,sans-serif;font-weight:800;font-size:clamp(1.5rem,2.8vw,2.5rem)}
.stage-img{background:radial-gradient(closest-side,rgba(255,255,255,.14),transparent);max-height:56vh}
.stage-img img{filter:drop-shadow(0 24px 30px rgba(0,0,0,.45))}
.stage-text{position:relative;color:#DDE7F5}
.stage .btn-line{color:#fff;border-color:rgba(255,255,255,.5)}
.stage .btn-line:hover{background:#fff;color:var(--navy)}
.tools-sec{background:var(--mist);padding-block:90px}
.products .wave-end{display:none}

/* الصورة الكبيرة */
.wide{background:var(--navy);padding:0}
.wide-pin{position:relative;height:100vh;overflow:hidden;display:grid;place-items:center}
.wide-img{position:absolute;inset:0}
.wide-img img{width:100%;height:100%;object-fit:cover;animation:burns 22s ease-in-out infinite alternate}
.wide-img::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(6,24,54,.35),rgba(6,24,54,.7)),var(--grain)}
@keyframes burns{to{translate:0 -1.5%}}
.fill-text{position:relative;z-index:2;margin:0;padding-inline:var(--gut);text-align:center;font:900 clamp(2.6rem,7.8vw,7.4rem)/1.3 Alex,sans-serif;color:#fff;-webkit-text-stroke:0}
html:not(.no) .fill-text{color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.75);background:linear-gradient(90deg,#fff,#fff) no-repeat right/100% 100%;-webkit-background-clip:text;background-clip:text}
[dir=ltr] .fill-text{background-position:left}

/* المخزن */
.store{padding:0;overflow:hidden}
.store-pin{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding-block:90px 40px;gap:26px;background:var(--grain)}
.slides{overflow-x:auto;scroll-snap-type:x mandatory;background:none}
.slides.pinned{overflow:visible;width:max-content;scroll-snap-type:none;padding-inline:var(--gut)}
.slide{width:min(46vw,680px);aspect-ratio:16/11;box-shadow:none}
.slide img{width:100%;height:100%;object-fit:cover}
.slide figcaption{background:var(--brass);color:#061836;font-family:Kufi,Plex,sans-serif;font-weight:600}
.showcase{display:none}

/* التجهيزات */
.also{clip-path:none;margin:0;background:var(--navy);padding-block:40px 110px;overflow:hidden}
.also-in{position:relative}
.run{font:900 clamp(4rem,13vw,12rem)/1.2 Alex,sans-serif;white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgba(159,178,202,.28);margin-bottom:30px}
.run span{display:inline-block}
.range li{font-family:Kufi,Plex,sans-serif;color:#fff;border-color:rgba(159,178,202,.22)}
.rise{position:relative;height:30vh;margin-top:-1px;background:var(--navy);overflow:hidden}
.rise svg{position:absolute;inset:0;width:100%;height:100%;fill:#fff;transform-origin:bottom}

/* المعرض */
.gallery{margin:0;padding-block:40px 110px;background:#fff}
.shots{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:clamp(120px,14vw,210px);grid-auto-flow:dense;gap:10px;columns:auto}
.shot{margin:0;height:100%}
.shot .zoom,.shot img{height:100%}
.shot img{object-fit:cover}
.shot{grid-column:span 4;grid-row:span 2}
.shot:nth-child(6n+1){grid-column:span 6;grid-row:span 3}
.shot:nth-child(6n+2),.shot:nth-child(6n+3){grid-column:span 3;grid-row:span 3}
.shot[data-cat=range] img{object-fit:contain;background:var(--mist)}
.shot.star{outline:0}
.shot figcaption{font-family:Plex,sans-serif}
.rv-round{clip-path:circle(0% at 50% 50%);transition:clip-path 1.1s cubic-bezier(.16,.8,.24,1) var(--d,0ms)}
.rv-round.in{clip-path:circle(120% at 50% 50%)}
.dark .zoom::after,.visits .zoom::after{content:"";position:absolute;inset:0;background:var(--grain);pointer-events:none}
.zoom{position:relative}

/* من نحن */
.band{padding-block:clamp(120px,20vw,230px);background-attachment:scroll}
.band::before{display:none}
.band2{background-image:linear-gradient(rgba(6,24,54,.62),rgba(6,24,54,.74)),var(--grain),url(g/b2.webp)}
.band p{font-family:Alex,sans-serif;font-weight:900;font-size:clamp(2rem,5.4vw,4.8rem)}
.about{padding-block:70px 90px;background:#fff}
.since{font-family:Alex,sans-serif;font-weight:900;font-size:clamp(5rem,14vw,12rem);line-height:1.05}
.about-text blockquote{font-family:Alex,sans-serif;font-weight:600}
.route{padding-block:100px;overflow:hidden;background:radial-gradient(60% 80% at 25% 50%,#113271,var(--navy))}
.route-in{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:30px}
.route-keys{display:flex;gap:18px;margin-top:20px;font-family:Kufi,Plex,sans-serif;color:#fff}
.route-keys li{display:flex;align-items:center;gap:8px}
.route-keys li::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--brass)}
.route-keys .k-b::before{background:var(--red)}
.globe{position:relative;aspect-ratio:1;max-height:560px;width:100%}
.globe canvas{position:absolute;inset:0;width:100%!important;height:100%!important}
.globe.live .route-map{display:none}
.route-map{height:100%}
.route-map .land{fill:#284E8C}
.pt text{fill:#fff;stroke:var(--navy)}
.visits-sec{padding-block:80px;background:#fff}
.visit-head{margin:0 0 26px}
.story{display:grid;grid-template-columns:.42fr 1fr;gap:34px;padding-block:34px;border-top:1px solid var(--sky);position:relative}
.story-text{position:sticky;top:110px;align-self:start}
.story-text h3{color:var(--head)}
.story-text p{color:var(--soft);margin-top:6px}
.story .visits{margin:0;grid-auto-rows:210px}
.visits figure{overflow:hidden}

/* العلامات */
.brands{background:var(--mist);padding-block:80px;overflow:visible}
.logos.stamps{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:34px;width:auto;animation:none}
.stamps li{padding:0;height:auto;border:0}
.logo-btn{width:100%;height:112px;clip-path:var(--cutc)}

/* التواصل */
.contact{padding-top:90px}
.lit{box-shadow:0 0 0 3px var(--brass),0 0 34px 6px rgba(226,167,46,.6);animation:litp 2s ease-in-out infinite}
@keyframes litp{50%{box-shadow:0 0 0 3px var(--brass),0 0 14px 2px rgba(226,167,46,.3)}}
.request{clip-path:var(--cutc);border-radius:0}
.btn{border-radius:2px}
.btn-gold.cut{clip-path:var(--cutc);padding-inline:34px;font-family:Kufi,Plex,sans-serif;font-size:1.08rem;min-height:60px}
.sizer,.compare{background:#fff;box-shadow:none}
.sizer output{color:var(--cobalt)}

/* صفحات المنتجات */
.pp-hero{padding-top:130px}
.pp h1{font-family:Alex,sans-serif;font-weight:900;letter-spacing:-.008em}
body:not(.home) .top .menu-btn{color:var(--head)}

@media (max-width:1040px){
  .hero-foot{flex-direction:column;align-items:flex-start;gap:18px}
  .route-in{grid-template-columns:1fr}
  .story{grid-template-columns:1fr}
  .story-text{position:static}
  .logos.stamps{grid-template-columns:repeat(3,1fr)}
  .products .finder{grid-template-columns:1fr}
  .prod-pin{padding-block:80px}
  .rail{display:none}
  .wide-pin{height:62vh}
  .wide-img{clip-path:none}
  .fill-text{color:#fff!important;-webkit-text-stroke:0!important;background:none!important}
  .store-pin{min-height:0;padding-block:70px}
  .slide{width:82vw}
  .slides{padding-inline:var(--gut)}
}
@media (max-width:760px){
  :root{--gut:20px}
  .wrap{padding-left:20px;padding-right:20px}
  .top-in{height:70px;padding-inline:14px}
  .top.slim .top-in{height:62px}
  .top .brand img{height:50px}
  .lang-top{padding:3px 9px;font-size:.92rem}
  .menu-btn{padding:5px 13px}
  .top-phone{display:none}
  #nav{height:100dvh;padding:90px 28px 40px;font:inherit;z-index:-1}
  #nav a{padding:0;border:0;color:transparent}
  .hero .hero-title{top:96px;font-size:clamp(4rem,21vw,7rem);white-space:normal;line-height:1.08}
  .hero-title span{display:block}
  [lang=en] .hero .hero-title{font-size:clamp(3rem,15vw,5rem)}
  .hero-art{top:44svh;width:min(58vw,250px)}
  .hero-foot{padding-bottom:78px;padding-top:0}
  .ticker li{padding:10px 20px;font-size:.88rem}
  .cue{display:none}
  .agency,.agency+.agency{min-height:72vh}
  .seal{bottom:3vh;inset-inline-end:5vw;width:92px}
  .flips{grid-template-columns:1fr}
  .flip{height:120px}
  .in-steps{grid-template-columns:1fr}
  .inside-in{padding-block:80px 50px;min-height:0;gap:40px}
  .inside{min-height:0}
  .stage,.stage+.stage{padding:16px}
  .shots{grid-template-columns:repeat(2,1fr);grid-auto-rows:42vw}
  .shot,.shot:nth-child(6n+2),.shot:nth-child(6n+3){grid-column:span 1;grid-row:span 1}
  .shot:nth-child(6n+1){grid-column:span 2;grid-row:span 2}
  .story .visits{grid-auto-rows:150px}
  .logos.stamps{grid-template-columns:repeat(2,1fr)}
  .logo-btn{height:82px}
  .rise{height:16vh}
}
@media (prefers-reduced-motion:reduce){
  .gate,.cue{display:none}
  .ticker ul,.wide-img img{animation:none}
}

.about h2,.route h2{font-size:clamp(2rem,4vw,3.5rem)}
.logos.stamps img[alt=Ozito]{max-height:30px}

section.route{display:block;margin:0;padding-block:100px}
.pp .lead{color:var(--soft)}
@media (max-width:760px){.tools{display:none}.top-in{gap:10px}.lang-top{margin-inline-start:auto}section.route{padding-block:70px}}
html,body{overflow-x:clip}
main{overflow-x:clip}

/* المعرض: ألبومات هادئة بمقاس واحد */
.gallery .shots{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:auto;gap:40px 22px;margin-top:40px}
.gallery .shot,.gallery .shot:nth-child(n){grid-column:auto;grid-row:auto;height:auto;overflow:visible;margin:0}
.gallery .shot .zoom{height:auto;aspect-ratio:4/3;overflow:hidden}
.gallery .shot img{height:100%;object-fit:cover}
.gallery .shot figcaption{position:static;opacity:1;translate:none;background:none;padding:14px 0 0;display:flex;align-items:baseline;justify-content:space-between;gap:12px;color:var(--soft);pointer-events:auto;font-size:.95rem;border-bottom:1px solid var(--sky);padding-bottom:12px;transition:border-color .25s}
.gallery .shot figcaption b{font:600 1.22rem/1.4 Kufi,Plex,sans-serif;color:var(--head)}
.gallery .shot:hover figcaption{border-color:var(--brass)}
.gallery .zoom::after{display:none}
@media (max-width:1040px){.gallery .shots{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){.gallery .shots{grid-template-columns:1fr;gap:26px}}
#box img#box-img{max-height:calc(100dvh - 130px);max-width:100%;width:auto;height:auto}
@media (max-width:760px){#box img#box-img{max-height:calc(100dvh - 210px)}}

/* جولة الاحتراف */
.sec-n{font:700 clamp(4rem,9vw,8rem)/1 Barlow,sans-serif;letter-spacing:.01em;-webkit-text-stroke:1px rgba(20,102,214,.3)}
.top.slim,body:not(.home) .top{background:#061836;box-shadow:0 1px 0 rgba(159,178,202,.16)}
.top .top-phone,.top .menu-btn,.top .lang-top,.top .tool,body:not(.home) .top .menu-btn{color:#fff;border-color:rgba(255,255,255,.34)}
.top .top-phone{color:var(--brass)}
.menu-btn,.lang-top,.tool{transition:background-color .25s,color .25s,border-color .25s}
.menu-btn:hover,.lang-top:hover,.tool:hover{background:#fff;color:#061836!important;border-color:#fff}
.totop{background:transparent;color:var(--brass);border:1px solid var(--brass);width:46px;height:46px;padding:10px;background:rgba(6,24,54,.82)}
.fab{width:50px;height:50px;box-shadow:0 8px 22px -8px rgba(0,0,0,.5)}

.seal{position:absolute;bottom:8vh;inset-inline-end:7vw;width:clamp(130px,13vw,176px);aspect-ratio:1;display:grid;place-items:center;z-index:2;text-align:center}
.seal svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.s-ring{fill:none;stroke:var(--brass);stroke-width:1.2}
.s-tick{fill:none;stroke:var(--brass);stroke-width:7;stroke-dasharray:1.200 7.71}
.seal p{position:static!important;margin:0!important;font:600 clamp(.86rem,1.05vw,1.02rem)/1.5 Kufi,Plex,sans-serif!important;color:#fff}
.seal b{display:block;font:800 clamp(1.05rem,1.4vw,1.3rem)/1.4 Alex,sans-serif;color:var(--brass)}

.ag-cal{background:linear-gradient(120deg,#2A0A12 0%,#6E0C16 55%,#A30F1C 100%)}
.ag-cal::after,.ag-ren::after{content:"";position:absolute;inset:0;background:var(--grain);pointer-events:none}
.ag-word{position:absolute!important;top:50%;inset-inline-end:-2vw;bottom:auto!important;translate:0 -50%;margin:0;font:900 clamp(7rem,21vw,21rem)/1 Alex,sans-serif!important;color:transparent!important;-webkit-text-stroke:1px rgba(255,255,255,.13);white-space:nowrap;pointer-events:none}
.ag-tag{letter-spacing:.01em;color:var(--brass)!important;opacity:1}
.agency .plate{box-shadow:0 22px 44px -24px rgba(0,0,0,.6)}

.prod-head{display:flex;align-items:flex-end;justify-content:space-between;gap:30px}
.prod-count{display:flex;align-items:center;gap:12px;margin:0 0 8px;font:700 1.2rem Barlow,sans-serif;color:var(--steel)}
.prod-count b{font-size:3rem;line-height:1;color:var(--brass)}
.prod-count i{width:44px;height:1px;background:var(--steel)}
.stage,.stage-img img{animation:none}
.use{transition:color .25s,background-color .25s,padding .3s}
.use[aria-selected=true]{padding-inline-start:22px}

.btn{overflow:hidden;isolation:isolate}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(255,255,255,.16);transform:translateX(-101%);transition:transform .5s cubic-bezier(.16,.8,.24,1)}
[dir=rtl] .btn::before{transform:translateX(101%)}
.btn:hover::before{transform:none}
.foot a,.contact address a{background:linear-gradient(currentColor,currentColor) no-repeat 100% 100%/0 1px;transition:background-size .35s,color .2s;text-decoration:none}
[dir=ltr] .foot a{background-position:0 100%}
.foot a:hover,.contact address a:hover{background-size:100% 1px}

.gallery .shot .zoom::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(transparent 55%,rgba(6,24,54,.6));opacity:0;transition:opacity .35s}
.gallery .shot:hover .zoom::before{opacity:1}
.gallery .shot img{transition:transform .9s cubic-bezier(.16,.8,.24,1)}
.gallery .shot:hover img{transform:scale(1.06)}

.contact{background:linear-gradient(125deg,#7C0B15,#B8101D 60%,#C4121F)}
.request{box-shadow:none}

.pp-hero{background:radial-gradient(70% 90% at 25% 50%,color-mix(in srgb,var(--paint) 30%,#061836),#061836);padding-block:140px 80px;color:#DDE7F5}
.pp h1{color:#fff;font-size:clamp(2.5rem,5vw,4.6rem)}
.pp .lead{color:#C7D5E8}
.pp-use{color:var(--brass)}
.pp-back{color:#fff}
.pp-img{background:radial-gradient(closest-side,rgba(255,255,255,.16),transparent);box-shadow:none}
.pp-img img{filter:drop-shadow(0 26px 34px rgba(0,0,0,.5))}
.pp .btn-line{color:#fff;border-color:rgba(255,255,255,.5)}
.pp .btn-line:hover{background:#fff;color:#061836}
.badge{background:#fff}
@media (max-width:760px){
  .ag-word{font-size:30vw!important;top:18%}
  .seal{bottom:3vh;inset-inline-end:4vw;width:112px}
  .seal b{font-size:.95rem}.seal p{font-size:.72rem!important}
  .prod-count{display:none}
  .totop{inset-block-end:70px}
}

/* الإصلاحات بعد الفحص */
html{scroll-padding-top:0}
::selection{background:var(--brass);color:#061836}
html{scrollbar-color:#2B5292 #061836;scrollbar-width:thin}
.hero .hero-title{top:clamp(100px,14vh,140px)}
.top:not(.slim) .brand img{height:76px}

@media (min-width:1041px) and (max-height:860px){
  .prod-pin{padding-block:78px 14px}
  .prod-head .sec-n{display:none}
  .prod-head h2{font-size:clamp(1.9rem,3.5vw,3rem)}
  .prod-head .sub{margin-top:2px;font-size:1rem}
  .prod-head .h-line{margin-top:6px}
  .prod-count b{font-size:2.2rem}
  .products .finder{margin-top:4px;gap:26px}
  .products .use{padding-block:6px;font-size:1rem}
  .stage,.stage+.stage{padding:14px 18px;gap:26px}
  .stage-img{max-height:50vh}
  .stage h3{font-size:clamp(1.3rem,2.2vw,1.9rem)}
  .stage-text p{margin-block:8px 12px;font-size:.96rem;line-height:1.75}
  .stage .btn{min-height:44px;padding:6px 16px}
  .stage .btn-line{display:none}
  .store-pin{padding-block:76px 18px;gap:12px}
  .store .sec-n{display:none}
  .store h2{font-size:clamp(2rem,4vw,3.2rem)}
  .slide{aspect-ratio:auto;height:50vh;width:calc(50vh*1.45)}
}
@media (min-width:1041px) and (max-height:680px){
  .prod-head .sub,.store .sub{display:none}
  .stage-img{max-height:44vh}
  .stage-text p{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
  .products .use{padding-block:3px;font-size:.94rem}
  .slide{height:46vh;width:calc(46vh*1.45)}
}

/* الوضع الليلي لكل الأقسام */
[data-theme=dark] body{background:var(--bg)}
[data-theme=dark] .gallery,[data-theme=dark] .about,[data-theme=dark] .visits-sec{background:var(--bg)}
[data-theme=dark] .tools-sec,[data-theme=dark] .brands{background:var(--tint)}
[data-theme=dark] .sizer,[data-theme=dark] .compare,[data-theme=dark] .request{background:var(--card);color:var(--body)}
[data-theme=dark] .rise svg{fill:var(--bg)}
[data-theme=dark] .story{border-color:var(--line)}
[data-theme=dark] .story-text p,[data-theme=dark] .gallery .shot figcaption{color:var(--soft)}
[data-theme=dark] .gallery .shot figcaption{border-color:var(--line)}
[data-theme=dark] .stats{border-color:var(--line)}
[data-theme=dark] .pp-rel,[data-theme=dark] .pp-pics{background:var(--bg)}
[data-theme=dark] .sec-n{-webkit-text-stroke-color:rgba(226,167,46,.3)}
[data-theme=dark] .sz-note,[data-theme=dark] .sub{color:var(--soft)}

/* 404 */
.e404{background:#061836;color:#DDE7F5}
.e404 h1{background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent;font-family:Alex,sans-serif;font-weight:900}
html[data-theme=dark]{--head:#fff;--ink:#DCE7F5;--soft:#A9BDD8;--navy:#061836;--mist:#0C2348;--sky:#24426F}
[data-theme=dark] .chip,[data-theme=dark] .gallery .shot figcaption b,[data-theme=dark] .story-text h3{color:#fff}

/* الواجهة النهائية */
.hero{justify-content:center;min-height:100svh}
.hero-bg{inset:0;background:linear-gradient(100deg,rgba(6,24,54,.96) 18%,rgba(6,24,54,.74) 58%,rgba(6,24,54,.9)),var(--grain),url(g/b1.webp) center/cover;transform-origin:center}
[dir=rtl] .hero-bg{background:linear-gradient(260deg,rgba(6,24,54,.96) 18%,rgba(6,24,54,.74) 58%,rgba(6,24,54,.9)),var(--grain),url(g/b1.webp) center/cover}
.hero-grid{position:relative;z-index:3;display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:30px;width:100%;padding-block:110px 90px}
.hero-tag{margin:0 0 16px;font:600 clamp(.98rem,1.25vw,1.15rem)/1.6 Kufi,Plex,sans-serif;color:var(--brass);padding-inline-start:14px;border-inline-start:2px solid var(--brass)}
.hero .hero-title{position:static;text-align:start;margin:0;white-space:normal;font:900 clamp(3.4rem,7.6vw,7.8rem)/1.2 Alex,sans-serif;letter-spacing:-.012em;animation:none}
.hero-title span{display:block}
[lang=en] .hero .hero-title{font-size:clamp(3rem,6.6vw,6.8rem)}
.hero-copy .lead{margin-block:18px 30px}
.hero-shot{position:relative;display:grid;place-items:center;aspect-ratio:1;max-height:72vh;justify-self:center;width:100%;max-width:640px}
.hero-shot::before{content:"";position:absolute;inset:6%;border-radius:50%;background:radial-gradient(closest-side,rgba(60,140,255,.5),rgba(20,102,214,.16) 58%,transparent)}
.orbit{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:rgba(159,178,202,.3);stroke-width:1;overflow:visible}
.o-t{stroke:var(--brass);stroke-width:7;stroke-dasharray:1 21.87;opacity:.75}
.hero-shot img{position:relative;width:auto;height:auto;max-width:84%;max-height:84%;filter:drop-shadow(0 34px 34px rgba(0,0,0,.62)) drop-shadow(0 0 22px rgba(90,160,255,.28))}
.top:not(.slim) .brand img{height:68px}
.has3d .hero-art{display:none}
#stage3d{transition:opacity .7s,transform .9s cubic-bezier(.16,.8,.24,1)}
#stage3d.off{opacity:0;transform:translateY(70px)}
.ag-ren{z-index:2}
.ag-cal .ag-in{transform-origin:center}
.curtain{position:fixed;inset:0;z-index:95;display:grid;place-items:center;background:var(--navy);pointer-events:none;clip-path:inset(100% 0 0 0);transition:clip-path .5s cubic-bezier(.76,0,.24,1)}
.curtain img{width:min(36vw,220px);opacity:0;transition:opacity .3s .2s}
.curtain.in{clip-path:inset(0);pointer-events:auto}
.curtain.in img{opacity:1}
.cur-out .curtain{animation:curOut .8s .1s cubic-bezier(.76,0,.24,1) both}
.cur-out .curtain img{opacity:1}
@keyframes curOut{from{clip-path:inset(0)}to{clip-path:inset(0 0 100% 0)}}
.cur-out .gate{display:none}
@media (max-width:1040px){
  .hero-grid{grid-template-columns:1fr;gap:10px;padding-block:100px 70px}
  .hero-shot{max-width:min(78vw,430px);max-height:none;order:2}
}
@media (max-width:760px){
  .hero .hero-title{font-size:clamp(3.1rem,15vw,5rem);line-height:1.22}
  [lang=en] .hero .hero-title{font-size:clamp(2.7rem,13vw,4.4rem)}
  .hero-grid{padding-block:92px 62px}
  .hero-tag{font-size:.92rem}
  .hero-copy .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){.curtain{display:none}}

/* العلامات: البلد ثابت تحت كل شعار */
.logos.stamps{gap:26px 14px}
.stamps li{display:block;text-align:center}
.stamps .logo-btn{display:grid;place-items:center;background:#fff}
.stamps .logo-btn img{filter:none;opacity:1}
.stamps small{display:block;margin-top:10px;font:600 .95rem Kufi,Plex,sans-serif;color:var(--soft)}

/* التذييل المرتب */
.foot-in{grid-template-columns:1.1fr 1.7fr .8fr 1.1fr;gap:44px;padding-block:60px 40px}
.foot-brand img{width:128px;background:none;padding:0;margin-bottom:10px;border-radius:0}
.foot-brand p{color:#AFC1DA;font-size:.98rem}
.foot-prod ul{columns:2;column-gap:26px}
.foot li{padding-block:4px;break-inside:avoid}
.foot-tel{display:block;font:700 1.5rem Barlow,sans-serif;color:var(--brass);margin-bottom:6px;background:none}
.foot-con p{font-size:.94rem;color:#AFC1DA;line-height:1.7}
.foot-end{color:#8FA5C3}

/* طريقة العمل: خطوات مرقمة */
.in-steps,.how-steps{counter-reset:s;list-style:none;margin:0;padding:0}
.in-steps li,.how-steps li{counter-increment:s}
.in-steps b::before,.how-steps b::before{content:counter(s) ;display:block;font:700 2.1rem/1.1 Barlow,sans-serif;color:var(--brass);margin-bottom:6px}
.inside-img{display:none;width:100%;height:auto;margin-block:6px}
html:not(.has3d) .inside-head{max-width:none}
.pp-how{background:var(--navy);padding-block:76px}
.pp-how .how-img{width:min(100%,860px);height:auto;margin:30px auto 10px;display:block}
.how-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:30px}
.how-steps li{border-top:1px solid rgba(159,178,202,.3);padding-top:16px}
.how-steps b{display:block;font:600 1.25rem/1.5 Kufi,Plex,sans-serif;color:#fff}
.how-steps span{display:block;color:var(--steel);margin-top:2px}

@media (max-width:1040px){
  .inside-img{display:block}
  .foot-in{grid-template-columns:1fr 1fr 1fr}
  .foot-brand{grid-column:1/-1;display:flex;align-items:center;gap:18px}
  .foot-brand img{margin:0}
  .foot-prod ul{columns:1}
}
@media (max-width:760px){
  .totop{display:none}
  .foot-in{grid-template-columns:1fr;gap:20px;padding-block:36px 22px;text-align:center}
  .foot-brand{display:block}
  .foot-brand img{width:112px;margin:0 auto 8px}
  .foot-prod{display:none}
  .foot-nav h3,.foot-con h3{display:none}
  .foot-nav ul{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 20px}
  .foot-nav li{padding:0;font-size:1rem}
  .foot-tel{font-size:1.7rem;margin:0}
  .foot-end{justify-content:center;gap:14px;font-size:.84rem;padding-block:12px 14px!important}
  .inside-in{gap:22px}
  .in-steps li,.how-steps li{display:grid;grid-template-columns:44px 1fr;column-gap:6px;border-top:1px solid rgba(159,178,202,.24);padding-block:14px 12px}
  .in-steps li{opacity:1}
  .in-steps b,.how-steps b{display:contents;font:600 1.12rem/1.5 Kufi,Plex,sans-serif;color:#fff}
  .in-steps b::before,.how-steps b::before{grid-row:1/3;margin:0;font-size:1.9rem}
  .in-steps span,.how-steps span{grid-column:2}
  .how-steps{grid-template-columns:1fr;gap:0}
  .pp-how{padding-block:52px}
}

/* المضخة المتحركة على الموبايل */
.seq{display:none;width:100%;height:auto;max-height:42svh;object-fit:contain}
.seq-on .seq{display:block}
.seq-on .inside-img{display:none}
.seq-on .inside{display:block;height:310vh;overflow:visible;min-height:0}
.seq-on .inside::after{display:none}
.seq-on .inside-in{position:sticky;top:0;height:100svh;min-height:0;display:flex;flex-direction:column;justify-content:center;gap:clamp(8px,2.4vh,22px);padding-block:78px 72px;overflow:hidden}
.seq-on .inside .sec-n{display:none}
.seq-on .inside h2{font-size:clamp(2rem,9vw,3rem)}
.seq-on .in-steps{position:relative;min-height:116px}
.seq-on .in-steps li,.seq-on .in-steps li.on{position:absolute;inset:0;border:0;border-top:2px solid var(--brass);padding-top:12px;opacity:0;transform:translateY(16px);transition:opacity .45s,transform .45s cubic-bezier(.16,.8,.24,1)}
.seq-on .in-steps li.on{opacity:1;transform:none}
@media (min-width:761px){.seq-on .in-steps{grid-template-columns:1fr}.seq-on .in-steps li{max-width:560px}}
html.seq-on .in-steps li:not(.on){opacity:0!important;pointer-events:none}
html.seq-on .in-steps li.on{opacity:1!important}
.seq-on .seq{filter:drop-shadow(0 18px 24px rgba(0,0,0,.4))}
.seq-on .seq{transform:scale(1.34);transform-origin:center}