*{box-sizing:border-box}body{margin:0;background:#070d1d;color:#fff;font-family:Arial,'Noto Sans Arabic',sans-serif}a{color:inherit;text-decoration:none}.ref-shell{max-width:1400px;margin:auto;padding:26px 30px}.case-top{display:flex;justify-content:space-between;align-items:center}.case-top img{width:130px}.case-top>a:first-child{color:#d7d8fa;border:1px solid #52607e;border-radius:10px;padding:10px 15px}.case-breadcrumb{color:#8f9cbb;font-size:12px;margin:24px 0 10px}.ref-eyebrow{font-size:12px;color:#9f95ff;letter-spacing:3px}.case-feature{display:grid;grid-template-columns:40% 60%;align-items:center;gap:0;min-height:340px;background:radial-gradient(ellipse at 100% 0,#414e89 0,transparent 58%),linear-gradient(110deg,#07101f,#122548);border-radius:20px;overflow:hidden;padding:30px}.case-copy h1{font-size:clamp(44px,5vw,76px);margin:12px 0}.case-copy p{line-height:1.8;font-size:18px;max-width:420px}.case-pill{display:inline-block;border:1px solid #7c8cad;padding:7px 14px;border-radius:20px;font-size:13px}.case-points{display:flex;gap:15px;flex-wrap:wrap;font-size:13px;color:#c9d7ee;margin-top:25px}.case-device img{width:100%;display:block;aspect-ratio:16/9;object-fit:cover;object-position:top;border:8px solid #17223b;border-radius:16px;box-shadow:0 20px 45px #02051299}.case-info{display:grid;grid-template-columns:repeat(3,1fr);margin:18px 0 34px;border:1px solid #2e3d58;border-radius:17px;background:#101d31;padding:20px}.case-info>div{display:flex;flex-direction:column;gap:8px;align-items:center;border-left:1px solid #33435e}.case-info>div:last-child{border:0}.case-info strong{font-size:22px}.case-info span{font-size:12px;color:#acbad5}.case-gallery-head{display:flex;align-items:end;justify-content:space-between}.case-gallery h2{font-size:29px;margin:0 0 12px}.case-gallery p{color:#b2bdd2}.case-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}.case-tabs button{cursor:pointer;background:#0c1628;color:#cbd3e6;border:1px solid #3a4965;border-radius:20px;padding:10px 15px}.case-tabs button.selected{background:linear-gradient(110deg,#5945e8,#8976ff);color:white}.case-viewer{display:grid;grid-template-columns:42px minmax(0,1fr) 42px 170px;gap:12px;align-items:center;background:#0f1a2e;padding:17px;border-radius:18px;border:1px solid #2c3b56;direction:ltr}.case-viewer>img{width:100%;aspect-ratio:16/9;object-fit:contain;cursor:zoom-in;border-radius:12px;background:#edf0f6}.case-arrow{border:1px solid #4d5b78;border-radius:50%;width:40px;height:40px;background:#182943;color:white;font-size:26px;cursor:pointer}.case-thumbs{display:grid;gap:9px}.case-thumb{padding:0;background:transparent;border:2px solid transparent;border-radius:10px;overflow:hidden;cursor:pointer}.case-thumb.selected{border-color:#8e7bff}.case-thumb img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}.case-notice{color:#aab8d0;font-size:13px;margin:22px 0}.ref-shell footer{padding:22px 0;border-top:1px solid #253653}dialog{border:0;border-radius:14px;background:#111b2d;padding:30px;max-width:95vw;max-height:95vh}dialog::backdrop{background:#000c}dialog img{max-width:85vw;max-height:80vh;object-fit:contain}#closeZoom{position:absolute;top:0;right:0;background:#312a65;color:white;border:0;font-size:25px;cursor:pointer}@media(max-width:750px){.ref-shell{padding:16px}.case-feature{grid-template-columns:1fr;gap:24px;padding:22px}.case-info strong{font-size:15px}.case-viewer{grid-template-columns:28px minmax(0,1fr) 28px;gap:5px;padding:7px}.case-thumbs{grid-column:1/-1;display:flex;overflow-x:auto}.case-thumb{min-width:100px}.case-arrow{width:27px;height:27px;font-size:18px}.case-gallery-head{display:block}.case-top img{width:95px}}
/* V2: reference-led compact project presentation */
.new-case{max-width:1480px;padding:22px 28px}
.new-case .case-top{direction:ltr;padding:0 6px 18px}
.new-case .case-top img{width:120px}
.new-case .back-link{font-size:14px;border:1px solid #405071;border-radius:11px;padding:12px 16px}
.new-feature{direction:rtl;grid-template-columns:41% 59%;min-height:440px;padding:36px 42px;background:radial-gradient(ellipse at 82% 6%,#6670b8aa 0,transparent 49%),linear-gradient(130deg,#0a1429,#152e58 66%,#081324)}
.new-feature .case-copy{position:relative;z-index:3}
.new-feature .case-copy h1{font-size:clamp(56px,6vw,100px);letter-spacing:-3px;line-height:1;margin:18px 0}
.new-feature .case-copy p{font-size:19px;max-width:490px;line-height:1.7}
.new-feature .case-points{font-size:13px;gap:9px}
.new-feature .case-points span{background:#ffffff0d;border:1px solid #ffffff22;padding:7px 9px;border-radius:15px}
.new-feature .case-disclaimer{font-size:12px;color:#b2c3e4;margin-top:30px}
.hero-devices{height:365px;position:relative;direction:ltr;display:flex;align-items:center;justify-content:center}
.hero-glow{position:absolute;inset:10% 2%;background:radial-gradient(ellipse,#6682f680,transparent 65%);filter:blur(25px)}
.laptop{position:absolute;width:88%;left:0;top:42px;filter:drop-shadow(0 20px 17px #0008)}
.laptop-screen{background:#090f1c;padding:10px 10px 12px;border:2px solid #7785a5;border-radius:15px 15px 6px 6px;aspect-ratio:16/9;overflow:hidden}
.laptop-screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}
.laptop-base{height:13px;margin:0 -5%;border-radius:0 0 50% 50%;background:linear-gradient(#8c99b2,#3b4861 60%,#1b2538)}
.phone{position:absolute;right:0;bottom:5px;width:21%;height:62%;background:#090d17;border:5px solid #343d50;border-radius:23px;overflow:hidden;box-shadow:0 14px 28px #0009}
.phone img{width:100%;height:100%;object-fit:cover;object-position:top}
.phone-speaker{position:absolute;top:3px;left:30%;right:30%;height:9px;border-radius:9px;background:#090d17;z-index:1}
.new-info{margin:14px 0 26px;padding:16px}
.new-info strong{font-size:19px}
.new-gallery .case-gallery-head{align-items:center}
.new-gallery .case-gallery-head h2{font-size:26px}
.new-gallery .case-gallery-head p{font-size:13px}
.new-gallery .case-tabs{margin:10px 0 14px}
.new-gallery .case-tabs button{padding:8px 13px}
.new-gallery .case-viewer{direction:ltr;display:grid;grid-template-columns:minmax(0,1fr) 148px;gap:14px;padding:14px}
.viewer-stage{position:relative;min-width:0;display:flex;align-items:center;justify-content:center;background:#e7ebf4;border-radius:12px;overflow:hidden}
.viewer-stage>img{width:100%;max-height:490px;aspect-ratio:16/9;object-fit:contain;cursor:zoom-in}
.viewer-stage .case-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:2}
.viewer-stage .prev{left:10px}.viewer-stage .next{right:10px}
.new-gallery .case-thumbs{display:flex;flex-direction:column;gap:9px;max-height:490px;overflow-y:auto}
.new-gallery .case-thumb{flex:none}
.new-gallery .case-thumb img{aspect-ratio:16/9}
.new-footer{display:flex;justify-content:space-between;gap:20px;font-size:12px;color:#aab8d0}
@media(max-width:800px){.new-case{padding:12px}.new-feature{grid-template-columns:1fr;padding:24px;gap:10px}.hero-devices{height:260px}.laptop{top:20px}.phone{bottom:0}.new-gallery .case-viewer{grid-template-columns:1fr}.new-gallery .case-thumbs{flex-direction:row;overflow-x:auto;max-height:none}.new-gallery .case-thumb{min-width:110px}.new-gallery .case-gallery-head{display:block}.new-info strong{font-size:15px}}

/* V3.1: mobile-only gallery thumbnail sizing and clipping fix. */
@media(max-width:800px){
  .new-gallery,.new-gallery .case-viewer,.new-gallery .viewer-stage{min-width:0;max-width:100%}
  .new-gallery .case-viewer{display:grid;grid-template-columns:minmax(0,1fr);overflow:hidden}
  .new-gallery .viewer-stage>img{display:block;width:100%;height:auto;max-width:100%;aspect-ratio:16/9;object-fit:contain}
  .new-gallery .case-thumbs{display:flex;flex-direction:row;flex-wrap:nowrap;min-width:0;width:100%;max-width:100%;overflow-x:auto;overflow-y:hidden;gap:8px;padding:3px 2px 9px;scroll-snap-type:x proximity;overscroll-behavior-x:contain}
  .new-gallery .case-thumb{display:block;flex:0 0 104px!important;width:104px!important;min-width:104px!important;max-width:104px!important;height:69px;overflow:hidden;scroll-snap-align:start}
  .new-gallery .case-thumb img{display:block;width:100%!important;max-width:100%!important;height:100%!important;aspect-ratio:16/9;object-fit:cover;object-position:top}
}

/* V3.2: consistent navigation across standalone pages */
.nw-unified-header{max-width:1400px;margin:0 auto 22px;padding:12px 18px;min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:18px;direction:rtl;border:1px solid #2c3957;border-radius:18px;background:#0a1226;position:relative;z-index:30}
.nw-brand img{width:128px;max-height:55px;object-fit:contain;display:block}
.nw-links{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.nw-links a{font-size:14px;color:#d9e3ff;padding:12px 14px;border-radius:10px;white-space:nowrap;text-decoration:none}
.nw-links a:hover,.nw-links a[aria-current="page"]{background:#24254f;color:#fff}
.nw-menu-toggle{display:none;background:#1b2843;color:#fff;border:1px solid #48567b;border-radius:10px;padding:8px 12px;font-size:20px;cursor:pointer}
@media(max-width:750px){.nw-unified-header{min-height:66px;padding:8px 12px;margin-bottom:14px}.nw-brand img{width:100px}.nw-menu-toggle{display:block}.nw-links{display:none;position:absolute;top:calc(100% + 5px);right:0;left:0;flex-direction:column;align-items:stretch;background:#0c1730;border:1px solid #344569;border-radius:14px;padding:10px;box-shadow:0 18px 30px #0008}.nw-links.is-open{display:flex}.nw-links a{padding:12px 14px}}
/* Keep desktop project visuals from overlapping the title */
@media(min-width:801px){.new-feature{grid-template-columns:minmax(0,48%) minmax(0,52%)}.new-feature .case-copy h1{font-size:clamp(40px,4.2vw,76px);overflow-wrap:anywhere;letter-spacing:-2px}.new-feature .case-copy{min-width:0}.new-feature .hero-devices{min-width:0}}