:root{color:#e9edf2;scroll-behavior:smooth;background:#0f1115;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{color:#e9edf2;background:#0f1115;margin:0;line-height:1.65}.app{width:100%}.top-nav{z-index:100;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transform-origin:top;background:#0a0c10f0;border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;min-height:78px;padding:0 7vw;animation:.88s cubic-bezier(.22,1,.36,1) both navEnter,1.6s ease-out 50ms both navGlow;display:flex;position:sticky;top:0}.brand-wrap{align-items:center;gap:12px;animation:.75s cubic-bezier(.22,1,.36,1) .12s both brandReveal;display:flex}.brand-logo{object-fit:contain;width:46px;height:46px}.brand-name{letter-spacing:.03em;margin:0;font-size:1.05rem;font-weight:600}.top-nav nav{gap:1.8rem;display:flex}.top-nav nav a{color:#cad1da;opacity:0;font-size:.95rem;font-weight:500;text-decoration:none;transition:color .28s;animation:.55s cubic-bezier(.22,1,.36,1) forwards navLinkReveal}.top-nav nav a:first-child{animation-delay:.42s}.top-nav nav a:nth-child(2){animation-delay:.5s}.top-nav nav a:nth-child(3){animation-delay:.58s}.top-nav nav a:nth-child(4){animation-delay:.66s}.top-nav nav a:nth-child(5){animation-delay:.74s}.top-nav nav a:hover{color:#fff}.hero{background-image:linear-gradient(90deg,#07090ce0 0%,#07090ca6 45%,#07090c73 100%),url(/pics/logo%20metallic_XpertPro%20Arabia_2.png);background-position:right 8% center;background-repeat:no-repeat;background-size:auto 88%;align-items:center;min-height:76vh;padding:120px 7vw 90px;display:flex}.hero-overlay{max-width:680px}.tag{letter-spacing:.22rem;text-transform:uppercase;color:#b5bfca;margin:0 0 12px;font-size:.84rem}.hero h1{margin:0 0 14px;font-size:clamp(2rem,4.4vw,4rem);font-weight:600;line-height:1.1}.hero p{color:#d3dae2;max-width:62ch;margin:0;font-size:1.05rem}.btn{color:#0d1015;letter-spacing:.02em;background:#d8dee6;margin-top:22px;padding:11px 20px;font-weight:600;text-decoration:none;transition:transform .28s,background-color .28s;display:inline-block}.btn:hover{background:#fff;transform:translateY(-2px)}section{padding:78px 7vw}h2{letter-spacing:.01em;margin:0 0 18px;font-size:clamp(1.65rem,2.7vw,2.8rem);font-weight:600}.about{background:#12161d}.about p{color:#cfd6df;max-width:95ch;margin:0 0 14px}.about-points{flex-wrap:wrap;gap:12px;margin-top:18px;display:flex}.about-points span{color:#aeb8c4;border-bottom:1px solid #adb8c459;padding-bottom:4px;font-size:.92rem}.services{background:#0f1115}.service-grid{gap:32px;display:grid}.service-row{grid-template-columns:minmax(250px,360px) 1fr;align-items:center;gap:28px;display:grid}.img-lightbox{cursor:zoom-in;text-align:left;background:0 0;border:none;width:100%;margin:0;padding:0;display:block}.img-lightbox:focus-visible{outline-offset:3px;outline:2px solid #d8dee6}.img-lightbox--fill{height:100%}.img-lightbox img{object-fit:cover;width:100%;height:100%;display:block}.service-row .img-lightbox img{filter:grayscale(.15);height:240px;transition:transform .35s,filter .35s}.service-row:hover .img-lightbox img{filter:grayscale(0);transform:scale(1.03)}.service-copy h3{margin:0;font-size:1.55rem;font-weight:600}.subtitle{color:#a9b3c0;margin:4px 0 8px;font-weight:500}.service-copy p{color:#ced5de;max-width:68ch;margin:0}.chips{flex-wrap:wrap;gap:8px;margin-top:12px;display:flex}.chips span{color:#d2d9e2;background:#ffffff0f;padding:4px 9px;font-size:.82rem}.specialty{background:#12161d;overflow:hidden}.specialty-inner{grid-template-columns:1fr minmax(280px,1.05fr);align-items:center;gap:48px;display:grid}.specialty-copy p{color:#cfd6df;max-width:56ch;margin:0 0 14px}.specialty-copy strong{color:#e9edf2;font-weight:600}.specialty-visual{flex-direction:column;gap:14px;display:flex}.specialty-feature{position:relative;overflow:hidden;box-shadow:0 28px 60px #00000059}.specialty-feature:after{content:"";pointer-events:none;background:linear-gradient(#0000 55%,#07090c8c 100%);position:absolute;inset:0}.specialty-feature .specialty-feature-open{height:auto}.specialty-feature .specialty-feature-open img{object-fit:cover;width:100%;height:auto;max-height:420px;transition:transform .55s;display:block}.specialty-feature:hover .specialty-feature-open img{transform:scale(1.04)}.specialty-blur-row{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.specialty-thumb{aspect-ratio:4/3;transition:transform .35s,filter .35s;position:relative;overflow:hidden}.specialty-thumb:before{content:"";-webkit-backdrop-filter:blur();backdrop-filter:blur();opacity:0;z-index:1;pointer-events:none;background:#ffffff0a;transition:opacity .35s,-webkit-backdrop-filter .35s,backdrop-filter .35s;position:absolute;inset:0}.specialty-thumb:hover{filter:brightness(1.06);transform:translateY(-4px)}.specialty-thumb:hover:before{opacity:1;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.specialty-thumb .img-lightbox{width:100%;height:100%}.specialty-thumb .img-lightbox img{object-fit:cover;width:100%;height:100%;display:block}.portfolio{background:#0f1115}.gallery-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;display:grid}.gallery-item{margin:0;overflow:hidden}.gallery-item .img-lightbox img{object-fit:cover;width:100%;height:200px;transition:transform .45s,filter .45s;transform:scale(1.02)}.gallery-item:hover .img-lightbox img{filter:contrast(1.04);transform:scale(1.08)}.contact{background:#0f1115;padding-bottom:90px}.contact-location{color:#d1d8e0;margin:0 0 20px}.contact-group{margin-bottom:18px}.contact-label{color:#b8c2ce;margin:0 0 6px;font-weight:600}.contact-line{color:#d1d8e0;margin:0 0 4px}.contact-website{margin-top:16px;margin-bottom:0}.lightbox-backdrop{z-index:1000;cursor:zoom-out;background:#050608eb;justify-content:center;align-items:center;padding:48px 24px 24px;display:flex;position:fixed;inset:0}.lightbox-close{z-index:1001;color:#fff;cursor:pointer;background:#ffffff1f;border:none;border-radius:0;width:44px;height:44px;font-size:1.75rem;line-height:1;transition:background-color .2s;position:fixed;top:16px;right:20px}.lightbox-close:hover{background:#ffffff38}.lightbox-image{object-fit:contain;cursor:default;width:auto;max-width:min(96vw,1200px);height:auto;max-height:88vh;box-shadow:0 24px 80px #0000008c}.reveal{opacity:0;filter:blur(6px);transition:opacity .92s cubic-bezier(.22,1,.36,1),transform .92s cubic-bezier(.22,1,.36,1),filter .7s;transition-delay:var(--reveal-delay,0s);transform:translateY(30px)}.reveal.show{opacity:1;filter:blur();transform:translate(0,0)}@keyframes navEnter{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translate(0,0)}}@keyframes navGlow{0%{box-shadow:0 0 #0000}35%{box-shadow:0 14px 42px #00000052}to{box-shadow:0 0 #0000}}@keyframes brandReveal{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0,0)}}@keyframes navLinkReveal{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translate(0,0)}}@media (prefers-reduced-motion:reduce){.top-nav,.brand-wrap{animation:none}.top-nav nav a{opacity:1;animation:none}.reveal{opacity:1;filter:none;transition:none;transform:none}}@media (width<=1024px){.hero{background-size:auto 70%;min-height:70vh}.specialty-inner{grid-template-columns:1fr;gap:32px}.specialty-blur-row{grid-template-columns:repeat(2,1fr)}.service-row{grid-template-columns:1fr;gap:16px}.service-row .img-lightbox img{height:230px}}@media (width>=761px) and (width<=1366px){.hero{background-image:linear-gradient(90deg,#0a0c0f 0% 28%,#0a0c0ffa 38%,#0a0c0fe6 48%,#0a0c0fa6 58%,#0a0c0f47 72%,#0a0c0f00 84%),url(/pics/logo%20metallic_XpertPro%20Arabia_2.png);background-position:right 6% center;background-size:auto 64%}.hero-overlay{z-index:1;max-width:min(32rem,46vw);padding-right:1.5rem;position:relative}}@media (width<=760px){.top-nav{flex-direction:column;align-items:flex-start;gap:10px;min-height:auto;padding:14px 5vw}.top-nav nav{gap:1rem}.hero{background-position:right -70px center;background-size:auto 62%;padding:90px 5vw 70px}section{padding:60px 5vw}.gallery-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}}
