:root{
  --work-navy:#031329;
  --work-navy2:#061b37;
  --work-cyan:#1dc7ff;
  --work-text:#10253f;
  --work-muted:#617488;
  --work-line:#dce6ef;
  --work-light:#f5f9fc;
}
.work-page{overflow:hidden;color:var(--work-text);background:#fff}
.work-page .content-eyebrow{display:inline-block;color:var(--work-cyan);font-size:12px;font-weight:800;letter-spacing:1.7px;text-transform:uppercase}
.work-hero{padding:76px 0 84px;color:#fff;background:radial-gradient(circle at 82% 22%,rgba(29,199,255,.14),transparent 30%),linear-gradient(135deg,#031329 0%,#061b37 58%,#0b2f61 100%)}
.work-hero-inner{max-width:900px}.work-back-link{display:inline-flex;align-items:center;gap:8px;margin-bottom:22px;color:#bcd0e1;text-decoration:none;font-size:12px;font-weight:700}.work-back-link:hover{color:var(--work-cyan)}
.work-hero h1{max-width:820px;margin:12px 0 20px;color:#fff;font-size:46px;line-height:1.06;letter-spacing:-1.5px}.work-hero h1 span{color:var(--work-cyan)}
.work-hero p{max-width:780px;margin:0;color:#c7d7e5;font-size:16px;line-height:1.75}
.work-list{padding:84px 0;background:#f6f9fc}.work-project{overflow:hidden;margin-bottom:48px;border:1px solid var(--work-line);border-radius:24px;background:#fff;box-shadow:0 18px 46px rgba(13,43,74,.08)}.work-project:last-child{margin-bottom:0}
.work-project-main{display:grid;grid-template-columns:minmax(240px,.52fr) minmax(0,1.48fr);align-items:stretch}.work-project.is-reversed .work-project-main{
  grid-template-columns:minmax(0,1.48fr) minmax(240px,.52fr);
}
.work-project.is-reversed .work-project-image{order:2}
.work-project.is-reversed .work-project-copy{order:1}
.work-project-image{min-height:250px;background:#061a34}.work-project-image>img{display:block;width:100%;height:100%;min-height:250px;object-fit:cover}
.work-image-fallback{min-height:250px;height:100%;display:flex;flex-direction:column;justify-content:center;padding:44px;color:#fff;background:radial-gradient(circle at 20% 30%,rgba(29,199,255,.16),transparent 34%),linear-gradient(135deg,#031329,#0b3564)}.work-image-fallback span{color:var(--work-cyan);font-size:12px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase}.work-image-fallback strong{max-width:480px;margin-top:10px;font-size:32px;line-height:1.14}
.work-project-copy{display:flex;flex-direction:column;justify-content:center;padding:34px 38px}.work-project-copy h2{margin:10px 0 14px;color:#082141;font-size:34px;line-height:1.13;letter-spacing:-.8px}.work-project-copy p{margin:0;color:var(--work-muted);font-size:15px;line-height:1.78}.work-client{margin:-2px 0 20px!important;color:#2f5878!important;font-weight:700}
.work-empty{padding:92px 0;background:#f6f9fc}.work-empty-card{max-width:760px;margin:0 auto;padding:48px;border:1px solid var(--work-line);border-radius:22px;background:#fff;text-align:center;box-shadow:0 16px 42px rgba(11,42,72,.07)}.work-empty-card h2{margin:10px 0 14px;color:#082141;font-size:34px}.work-empty-card p{margin:0 0 24px;color:var(--work-muted);line-height:1.7}
.work-cta{padding:66px 0;color:#fff;background:radial-gradient(circle at 82% 25%,rgba(29,199,255,.11),transparent 28%),#031329}.work-cta-inner{display:flex;justify-content:space-between;align-items:center;gap:40px}.work-cta h2{margin:8px 0;color:#fff;font-size:34px}.work-cta p{max-width:760px;margin:0;color:#b9cada;line-height:1.65}

.work-showreel-compact{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-top:28px;
  padding:16px 18px;
  border:1px solid #d8e7f1;
  border-radius:14px;
  background:linear-gradient(135deg,#f4fafd 0%,#edf6fb 100%);
}
.work-showreel-compact-copy{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}
.work-showreel-icon{
  flex:0 0 42px;
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  padding-left:2px;
  border-radius:50%;
  background:#0aa9da;
  color:#fff;
  font-size:14px;
  box-shadow:0 8px 18px rgba(10,169,218,.18);
}
.work-showreel-compact-copy div{
  min-width:0;
}
.work-showreel-compact-copy div>span{
  display:block;
  margin-bottom:2px;
  color:#079ccc;
  font-size:10px;
  font-weight:800;
  letter-spacing:1.35px;
}
.work-showreel-compact-copy strong{
  display:block;
  color:#082a51;
  font-size:15px;
  line-height:1.25;
}
.work-showreel-button{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:40px;
  padding:0 16px;
  border:0;
  border-radius:9px;
  background:#062c55;
  color:#fff;
  font:inherit;
  font-size:12px;
  font-weight:800;
  text-decoration:none;
  cursor:pointer;
  transition:transform .18s ease,background .18s ease,box-shadow .18s ease;
}
.work-showreel-button:hover{
  transform:translateY(-1px);
  background:#084879;
  box-shadow:0 8px 18px rgba(6,44,85,.14);
}

body.showreel-modal-open{
  overflow:hidden;
}
.work-showreel-modal{
  position:fixed;
  inset:0;
  z-index:99999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:28px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .2s ease,visibility .2s ease;
}
.work-showreel-modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.work-showreel-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(1,12,26,.86);
  backdrop-filter:blur(5px);
}
.work-showreel-modal-dialog{
  position:relative;
  z-index:1;
  width:min(1080px,94vw);
  max-height:92vh;
  overflow:auto;
  border:1px solid rgba(255,255,255,.12);
  border-radius:20px;
  background:#031329;
  box-shadow:0 30px 90px rgba(0,0,0,.5);
}
.work-showreel-modal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:18px 20px 16px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.work-showreel-modal-head span{
  display:block;
  color:var(--work-cyan);
  font-size:10px;
  font-weight:800;
  letter-spacing:1.5px;
}
.work-showreel-modal-head h2{
  margin:4px 0 0;
  color:#fff;
  font-size:20px;
  line-height:1.2;
}
.work-showreel-modal-close{
  flex:0 0 42px;
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:50%;
  background:rgba(255,255,255,.05);
  color:#fff;
  font-size:28px;
  line-height:1;
  cursor:pointer;
}
.work-showreel-modal-close:hover{
  background:rgba(255,255,255,.11);
}
.work-showreel-modal-player{
  width:100%;
  aspect-ratio:16/9;
  background:#000;
}
.work-showreel-modal-player iframe,
.work-showreel-modal-player video{
  display:block;
  width:100%;
  height:100%;
  border:0;
  background:#000;
}

@media(max-width:700px){
  .work-showreel-compact{
    align-items:stretch;
    flex-direction:column;
  }
  .work-showreel-button{
    width:100%;
  }
  .work-showreel-modal{
    padding:12px;
  }
  .work-showreel-modal-dialog{
    width:100%;
    border-radius:16px;
  }
  .work-showreel-modal-head{
    padding:14px 15px;
  }
  .work-showreel-modal-head h2{
    font-size:17px;
  }
}

@media(max-width:900px){.work-project-main,.work-project.is-reversed .work-project-main{grid-template-columns:1fr}.work-project.is-reversed .work-project-image,.work-project.is-reversed .work-project-copy{order:initial}.work-project-image,.work-project-image>img,.work-image-fallback{min-height:240px}}
@media(max-width:700px){.work-hero{padding:56px 0 62px}.work-hero h1{font-size:35px}.work-list{padding:62px 0}.work-project{border-radius:18px}.work-project-copy{padding:26px 24px}.work-project-copy h2{font-size:28px}.work-empty-card{padding:34px 24px}.work-empty-card h2{font-size:29px}.work-cta-inner{flex-direction:column;align-items:flex-start}.work-cta-inner .btn{width:100%;justify-content:center}}