/* Our work page: gallery styles, isolated to .ow-* classes */
.ow-page{color:var(--ink);overflow-x:clip}
.ow-page p{color:var(--muted)}
.ow-page h2{font-size:40px;line-height:1.15;color:var(--ink);margin:0}
.ow-page h3{color:var(--ink)}

/* hero */
.ow-hero{padding:56px 0 72px;background:linear-gradient(180deg,#f5f8ff 0%,#fff 100%);border-bottom:1px solid var(--line)}
.ow-hero-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:56px;align-items:center}
.ow-breadcrumb ol{display:flex;gap:8px;align-items:center;list-style:none;margin:0 0 12px;padding:0;color:var(--muted);font-size:14px}
.ow-breadcrumb li+li:before{content:'/';margin-right:8px;color:var(--muted)}
.ow-breadcrumb a{display:inline-flex;align-items:center;min-height:44px;color:var(--blue-dark,#0750c7);font-weight:500}
.ow-hero h1{font-size:54px;line-height:1.06;letter-spacing:-.02em;margin:10px 0 20px;color:var(--ink)}
.ow-lead{font-size:18px;line-height:1.7;margin:0}
.ow-stats{display:flex;gap:36px;margin-top:28px}
.ow-stats>div{display:flex;align-items:baseline;gap:10px}
.ow-stat-num{margin:0}.ow-stat-num strong{font-size:36px;color:var(--blue-dark,#0750c7);line-height:1}
.ow-stat-label{margin:0;font-size:15px}
.ow-note{font-size:13px;margin:8px 0 0}
.ow-filter{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.ow-chip{min-height:44px;padding:0 18px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink);font-weight:600;font-size:15px;transition:background .2s,border-color .2s,color .2s}
.ow-chip:hover{border-color:var(--blue)}
.ow-chip[aria-pressed=true]{background:var(--blue);border-color:var(--blue);color:#fff}
.ow-chip:focus-visible,.ow-showall:focus-visible,.ow-jump a:focus-visible,.ow-tile:focus-visible,.ow-text-link:focus-visible,.ow-final a:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.ow-final a:focus-visible{outline-color:#fff}
.ow-filter-status{display:flex;align-items:center;gap:16px;min-height:44px;margin-top:10px;flex-wrap:wrap}
.ow-filter-status p{margin:0;font-size:15px}
.ow-showall{min-height:44px;padding:0 4px;border:0;background:none;color:var(--blue-dark,#0750c7);font-weight:600;text-decoration:underline;text-underline-offset:4px}

/* mosaic */
.ow-mosaic{position:relative;height:500px}
.ow-tile{position:absolute;display:block;width:58%;border-radius:14px;transition:transform .35s ease,z-index 0s;animation:ow-float 9s ease-in-out infinite}
.ow-tile .ow-frame{box-shadow:0 22px 50px #0f1f4a2e}
.ow-tile:hover,.ow-tile:focus-visible{z-index:9}
.ow-tile:hover .ow-frame,.ow-tile:focus-visible .ow-frame{transform:translateY(-6px) scale(1.03)}
.ow-tile-1{top:0;left:0;rotate:-4deg;z-index:3}
.ow-tile-2{top:28px;right:0;rotate:3deg;z-index:4;animation-delay:-2s}
.ow-tile-3{top:190px;left:18%;rotate:-1deg;z-index:5;animation-delay:-4s}
.ow-tile-4{bottom:0;left:-2%;rotate:3deg;z-index:2;animation-delay:-6s}
.ow-tile-5{bottom:16px;right:-2%;rotate:-3deg;z-index:1;animation-delay:-3s}
@keyframes ow-float{0%,100%{translate:0 0}50%{translate:0 -10px}}

/* browser frame */
.ow-frame{background:#fff;border-radius:14px;overflow:hidden;border:1px solid #e3e7ef;transition:transform .35s ease,box-shadow .35s ease}
.ow-frame-bar{display:flex;align-items:center;gap:12px;padding:9px 12px;background:#f4f6fa;border-bottom:1px solid #e3e7ef}
.ow-dots{display:flex;gap:5px}.ow-dots i{width:8px;height:8px;border-radius:50%;background:#cfd5e0}
.ow-address{flex:1;max-width:60%;margin:0 auto;padding:3px 12px;border-radius:999px;background:#fff;border:1px solid #e3e7ef;font-size:12px;color:#4a5060;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ow-frame img{display:block;width:100%;height:auto}

/* jump bar */
.ow-jump{position:sticky;top:var(--ow-header,96px);z-index:30;background:#ffffffeb;backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.ow-jump-scroll{overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain}
.ow-jump-scroll::-webkit-scrollbar{display:none}
.ow-jump ul{display:flex;gap:8px;list-style:none;margin:0;padding:8px 0;width:max-content}
.ow-jump a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;font-size:14px;font-weight:600;color:var(--muted);white-space:nowrap;transition:background .2s,color .2s}
.ow-jump a:hover{color:var(--ink);background:#f1f4fa}
.ow-jump a.is-active{background:#e8f0ff;color:var(--blue-dark,#0750c7)}

/* case blocks */
.ow-case{padding:110px 0;scroll-margin-top:170px;border-bottom:1px solid var(--line)}
.ow-case:nth-child(even){background:#f8f9fc}
.ow-case-grid{position:relative;display:grid;grid-template-columns:1.1fr 1fr;gap:72px;align-items:center}
.ow-case.is-reversed .ow-visual{order:2}
.ow-num{position:absolute;top:-70px;left:-10px;font-size:180px;font-weight:700;line-height:1;color:#0961f50f;pointer-events:none;user-select:none}
.ow-case.is-reversed .ow-num{left:auto;right:-10px}
.ow-visual{position:relative;z-index:1}
.ow-visual-link{display:block;border-radius:26px}
.ow-backdrop{padding:44px 40px;border-radius:26px;background:var(--ow-bd);box-shadow:0 30px 70px #0f1f4a29;perspective:1200px}
.ow-backdrop .ow-frame{box-shadow:0 24px 50px #00000040}
.ow-visual:hover .ow-frame,.ow-visual:focus-within .ow-frame{transform:translateY(-8px) rotateX(3deg) rotateY(-4deg)}
.ow-case.is-reversed .ow-visual:hover .ow-frame{transform:translateY(-8px) rotateX(3deg) rotateY(4deg)}
.ow-case-claimd{--ow-bd:linear-gradient(140deg,#0b1636 0%,#1747b8 100%)}
.ow-case-cleansy{--ow-bd:radial-gradient(circle at 85% 15%,#b5e14a55 0,transparent 40%),linear-gradient(140deg,#0e3b2c 0%,#1b5e43 100%)}
.ow-case-dubai-property-spot{--ow-bd:radial-gradient(circle at 15% 85%,#d39a5a4d 0,transparent 45%),linear-gradient(140deg,#121212 0%,#2a2420 100%)}
.ow-case-company-dubai{--ow-bd:linear-gradient(140deg,#4b5d78 0%,#7f93ad 100%)}
.ow-case-cleaning-service-dubai{--ow-bd:linear-gradient(140deg,#0b4f55 0%,#14868a 100%)}
.ow-facts{position:absolute;list-style:none;margin:0;padding:0;right:-18px;bottom:-26px;display:flex;flex-direction:column;align-items:flex-end;gap:8px;z-index:2}
.ow-case.is-reversed .ow-facts{right:auto;left:-18px;align-items:flex-start}
.ow-facts li{background:#fff;border:1px solid var(--line);border-radius:12px;padding:9px 14px;box-shadow:0 12px 30px #0f1f4a24}
.ow-facts li:nth-child(2){margin-right:26px}.ow-case.is-reversed .ow-facts li:nth-child(2){margin-right:0;margin-left:26px}
.ow-facts p{margin:0;font-size:14px;font-weight:600;color:var(--ink)!important;white-space:nowrap}
.ow-copy{position:relative;z-index:1}
.ow-status{display:inline-block;margin:0 0 12px;padding:5px 12px;border-radius:999px;background:#fff4dc;border:1px solid #f0d58f}
.ow-status strong{font-size:13px;color:#7a4b00}
.ow-text{font-size:17px;line-height:1.7;margin:18px 0 24px}
.ow-label{margin:0 0 10px}.ow-label strong{color:var(--ink);font-size:15px}
.ow-did{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ow-did li{display:flex;gap:12px;font-size:16px;line-height:1.55;color:var(--muted)}
.ow-check{flex:none;display:grid;place-items:center;width:22px;height:22px;margin-top:1px;border-radius:50%;background:#e8f0ff;color:var(--blue)}
.ow-tags{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:22px 0 0;padding:0}
.ow-tags li{padding:5px 12px;border-radius:999px;background:#eef3ff;color:#0750c7;font-size:13px;font-weight:600}
.ow-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:28px}
.ow-actions .button{min-height:48px;display:inline-flex;align-items:center;gap:10px}
.ow-text-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--blue-dark,#0750c7);font-weight:600}
.ow-text-link:hover{text-decoration:underline;text-underline-offset:4px}

/* common */
.ow-common{padding:100px 0}
.ow-common h2{text-align:center}
.ow-common-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px}
.ow-common-card{padding:30px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 14px 40px #0f1f4a12}
.ow-common-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:#e8f0ff;color:var(--blue)}
.ow-common-card h3{font-size:21px;margin:20px 0 10px}
.ow-common-card p{margin:0;font-size:16px;line-height:1.65}

/* final */
.ow-final{padding:0 0 110px}
.ow-final-panel{padding:64px 56px;border-radius:30px;background:linear-gradient(135deg,#0750c7 0%,#0961f5 60%,#2f7bff 100%);text-align:center;box-shadow:0 30px 70px #0961f540}
.ow-final-panel h2{color:#fff!important;font-size:44px}
.ow-final-panel p{color:#fff!important;font-size:18px;margin:16px auto 28px;max-width:520px}
.ow-final-button{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 28px;border-radius:999px;background:#fff;color:#0750c7;font-weight:700}
.ow-final-links{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 22px;list-style:none;margin:26px 0 0;padding:0}
.ow-final-links a{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:4px}

/* scroll parallax (progressive) */
@supports (animation-timeline: view()){
  .ow-backdrop .ow-frame{animation:ow-par-frame linear both;animation-timeline:view();animation-range:entry 0% exit 100%}
  .ow-facts{animation:ow-par-chips linear both;animation-timeline:view();animation-range:entry 0% exit 100%}
  @keyframes ow-par-frame{from{translate:0 18px}to{translate:0 -18px}}
  @keyframes ow-par-chips{from{translate:0 40px}to{translate:0 -40px}}
}

@media(max-width:1100px){.ow-hero h1{font-size:44px}.ow-case-grid{gap:48px}.ow-mosaic{height:420px}}
@media(max-width:767px){
  .ow-page h2{font-size:30px}
  .ow-hero{padding:24px 0 40px}
  .ow-hero-grid{grid-template-columns:1fr;gap:28px}
  .ow-hero h1{font-size:34px}
  .ow-lead,.ow-text,.ow-did li,.ow-common-card p{font-size:15px;line-height:1.55}
  .ow-stats{gap:24px}.ow-stat-num strong{font-size:30px}
  .ow-mosaic{height:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;order:0}
  .ow-tile{position:static;width:auto;rotate:0deg;animation:none}
  .ow-tile-4,.ow-tile-5{display:none}
  .ow-address{font-size:9px;padding:2px 6px;max-width:100%}.ow-frame-bar{padding:6px;gap:6px}.ow-dots{display:none}
  .ow-jump{top:var(--ow-header,64px)}
  .ow-case{padding:64px 0;scroll-margin-top:130px}
  .ow-case-grid{grid-template-columns:1fr;gap:44px}
  .ow-case.is-reversed .ow-visual{order:0}
  .ow-num{font-size:110px;top:-50px}
  .ow-backdrop{padding:22px 18px;border-radius:20px}
  .ow-facts,.ow-case.is-reversed .ow-facts{right:8px;left:auto;bottom:-30px;flex-direction:row;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:6px}
  .ow-facts li:nth-child(2),.ow-case.is-reversed .ow-facts li:nth-child(2){margin:0}
  .ow-facts li{padding:6px 10px}.ow-facts p{font-size:12px}
  .ow-common{padding:64px 0}
  .ow-common-grid{grid-template-columns:1fr}
  .ow-final{padding-bottom:64px}
  .ow-final-panel{padding:44px 22px;border-radius:24px}
  .ow-final-panel h2{font-size:30px}
  .ow-final-panel p{font-size:16px}
  .ow-final-links{flex-direction:column;align-items:center}
}
@media(prefers-reduced-motion:reduce){
  .ow-tile{animation:none}
  .ow-backdrop .ow-frame,.ow-facts{animation:none!important;translate:none}
  .ow-frame,.ow-tile{transition:none}
  .ow-visual:hover .ow-frame,.ow-visual:focus-within .ow-frame,.ow-case.is-reversed .ow-visual:hover .ow-frame,.ow-tile:hover .ow-frame,.ow-tile:focus-visible .ow-frame{transform:none}
}
/* desktop pages render at zoom .9; keep tap targets at 44px after scaling */
@media(min-width:768px){.ow-breadcrumb a,.ow-chip,.ow-showall,.ow-jump a,.ow-text-link,.ow-final-links a{min-height:50px}}
