/* =========================================================================
   OUR WORK PAGE — Styles
   ========================================================================= */

.our-work-page{--ow-accent:#087ef5;--ow-royal:#124dd8;--ow-cyan:#13b8f4;--ow-navy:#06104f;--ow-line:#dfe7f2;--ow-soft:#f5f8fc;--ow-muted:#5b6475}

/* =========================================================================
   01. HERO
   ========================================================================= */
.ow-hero{
  min-height:640px;
  display:flex;
  align-items:center;
  padding:80px 0 90px;
  background:radial-gradient(circle at 78% 28%,rgba(19,184,244,.08) 0%,transparent 28%),radial-gradient(circle at 22% 72%,rgba(18,77,216,.06) 0%,transparent 28%),linear-gradient(145deg,#fff,#f6f9ff);
  position:relative;
  overflow:hidden
}
.ow-hero:before{
  content:"";
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(18,77,216,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(18,77,216,.04) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(135deg,transparent 30%,#000 70%);
  pointer-events:none
}
.ow-hero-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  align-items:center;
  gap:64px;
  position:relative;
  z-index:1
}
.ow-hero-copy h1{
  font-size:clamp(2.2rem,3.8vw,3.6rem);
  line-height:1.1;
  letter-spacing:-.04em;
  margin-bottom:20px;
  max-width:600px
}
.ow-lead{
  font-size:1.02rem;
  color:var(--ow-muted);
  max-width:560px;
  margin-bottom:8px
}
.ow-hero-visual{
  background:linear-gradient(145deg,#fff,#f0f6ff);
  border:1px solid rgba(18,77,216,.1);
  border-radius:22px;
  padding:32px;
  box-shadow:0 16px 44px rgba(6,16,79,.07)
}

/* ---- HERO FLOW SEQUENCE ---- */
.ow-flow-sequence{
  display:grid;
  grid-template-columns:minmax(60px,1fr) auto minmax(60px,1fr) auto minmax(60px,1fr) auto minmax(60px,1fr) auto minmax(60px,1fr) auto minmax(60px,1fr);
  align-items:center;
  gap:4px;
  margin-bottom:20px;
  width:100%
}
.ow-hs-item{
  opacity:1;
  transform:none;
}
.ow-hs-stage{
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:11px 6px;
  background:#fff;
  border:1px solid var(--ow-line);
  min-width:0;
  text-align:center;
  flex:1 1 0;
  min-height:58px;
  justify-content:center
}
.ow-hs-stage:hover{
  border-color:var(--ow-accent);
  background:#f4faff;
  transform:translateY(-2px)
}
.ow-hs-num{
  font:700 .52rem Manrope;
  color:var(--ow-accent);
  letter-spacing:.16em;
  margin-bottom:4px
}
.ow-hs-stage b{
  font:800 .6rem Manrope;
  color:var(--ow-navy);
  letter-spacing:.04em;
  line-height:1.2;
  display:block
}
.ow-hs-stage-start{
  background:linear-gradient(135deg,#06104f,#0a2773);
  border-color:rgba(19,184,244,.3)
}
.ow-hs-stage-start .ow-hs-num{color:#55c8fa}
.ow-hs-stage-start b{color:#fff}
.ow-hs-stage-end{
  background:linear-gradient(135deg,var(--ow-royal),var(--ow-accent));
  border-color:transparent
}
.ow-hs-stage-end .ow-hs-num{color:#cdeaff}
.ow-hs-stage-end b{color:#fff}

.ow-hs-conn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:auto;
  font:800 .85rem Manrope;
  color:var(--ow-accent);
  flex:0 0 auto;
  line-height:1;
  padding:0 2px
}

.ow-project-types{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding-top:18px;
  border-top:1px solid var(--ow-line)
}
.ow-chip{
  padding:7px 12px;
  background:#f4f8fd;
  border:1px solid var(--ow-line);
  border-radius:6px;
  font:600 .66rem Manrope;
  color:var(--ow-muted);
  letter-spacing:.04em;
  text-transform:uppercase;
  transition:border-color .2s,background-color .2s,color .2s,transform .2s;
  opacity:1;
  transform:none
}
.ow-chip:hover{
  border-color:var(--ow-accent);
  background:#eef7ff;
  color:var(--ow-accent);
  transform:translateY(-2px)
}

/* =========================================================================
   02. WORK PHILOSOPHY
   ========================================================================= */
.ow-section-header{
  max-width:720px;
  margin-bottom:40px
}
.ow-section-header h2{
  font-size:clamp(1.8rem,3vw,2.8rem);
  letter-spacing:-.04em;
  margin-bottom:0
}
.ow-section-header p{
  color:var(--ow-muted);
  font-size:1rem;
  margin-top:12px;
  max-width:580px
}
.ow-section-header-light h2,
.ow-section-header-light p{color:#fff}
.ow-section-header-light p{color:#b9c6e5}

.ow-philosophy-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px
}
.ow-phil-card{
  padding:26px 22px;
  background:#fff;
  border:1px solid var(--ow-line);
  border-radius:14px;
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease,background-color .25s ease;
  clip-path:polygon(0 0,94% 0,100% 10%,100% 100%,0 100%);
  opacity:1;
  transform:none
}
.ow-phil-card:hover{
  transform:translateY(-4px);
  border-color:var(--ow-accent);
  box-shadow:0 12px 28px rgba(6,16,79,.08);
  background:#f4faff
}
.ow-phil-icon{
  width:38px;
  height:38px;
  border-radius:8px;
  background:#eef5ff;
  color:var(--ow-accent);
  font:800 .72rem Manrope;
  display:grid;
  place-items:center;
  margin-bottom:16px;
  transition:background-color .2s,color .2s
}
.ow-phil-card:hover .ow-phil-icon{
  background:var(--ow-accent);
  color:#fff
}
.ow-phil-card h3{
  font-size:.92rem;
  text-transform:uppercase;
  letter-spacing:.04em;
  margin-bottom:8px;
  color:var(--ow-navy)
}
.ow-phil-card p{
  font-size:.8rem;
  color:var(--ow-muted);
  line-height:1.55;
  margin:0
}

/* =========================================================================
   04. PROJECT PORTFOLIO (includes Featured + Filters)
   ========================================================================= */
.ow-projects{
  background:var(--ow-soft)
}
.ow-section-intro{
  color:var(--ow-muted);
  font-size:.92rem;
  line-height:1.6;
  max-width:600px;
  margin:0 auto 28px
}
.ow-filter{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:48px;
  justify-content:center
}
.ow-filter-btn{
  padding:10px 18px;
  border:1px solid var(--ow-line);
  border-radius:8px;
  background:#fff;
  font:700 .72rem Manrope;
  color:var(--ow-muted);
  letter-spacing:.04em;
  text-transform:uppercase;
  cursor:pointer;
  transition:border-color .2s,color .2s,background-color .2s
}
.ow-filter-btn:hover{
  border-color:var(--ow-accent);
  color:var(--ow-accent);
  background:#f4faff
}
.ow-filter-btn.active{
  background:var(--ow-accent);
  border-color:var(--ow-accent);
  color:#fff
}
.ow-projects-label{
  font:700 .7rem Manrope;
  color:var(--ow-navy);
  letter-spacing:.12em;
  text-transform:uppercase;
  margin-bottom:28px;
  opacity:.5;
  margin-top:40px
}

.ow-project-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-bottom:72px
}

.ow-featured-eyebrow{
  font:700 .7rem Manrope;
  color:var(--ow-accent);
  letter-spacing:.14em;
  text-transform:uppercase;
  margin-bottom:24px;
  display:flex;
  align-items:center;
  gap:10px
}
.ow-featured-eyebrow i{
  display:inline-block;
  width:32px;
  height:1px;
  background:var(--ow-accent)
}

.ow-featured-card{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:48px;
  align-items:center;
  padding:40px;
  background:#fff;
  border:1px solid var(--ow-line);
  border-radius:20px;
  box-shadow:0 14px 40px rgba(6,16,79,.06);
  opacity:1;
  transform:none
}
.ow-featured-preview{
  background:linear-gradient(145deg,#f4f8fd,#eef5ff);
  border:1px solid var(--ow-line);
  border-radius:16px;
  padding:24px;
  min-height:320px;
  display:flex;
  align-items:center;
  justify-content:center
}
.ow-preview-placeholder{
  display:flex;
  gap:16px;
  align-items:flex-start;
  width:100%
}
.ow-preview-screen{
  flex:1;
  background:#fff;
  border:1px solid var(--ow-line);
  border-radius:10px;
  overflow:hidden;
  min-height:220px
}
.ow-preview-bar{
  display:flex;
  gap:5px;
  padding:8px 10px;
  border-bottom:1px solid var(--ow-line);
  background:#f8fbff
}
.ow-preview-bar span{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#dde5ef
}
.ow-preview-bar span:first-child{background:#f66}
.ow-preview-bar span:nth-child(2){background:#fa0}
.ow-preview-bar span:nth-child(3){background:#4c9}
.ow-preview-content{padding:12px}
.ow-preview-nav{
  height:10px;
  background:#eef5ff;
  border-radius:3px;
  margin-bottom:10px
}
.ow-preview-main{display:flex;gap:8px}
.ow-preview-sidebar{width:22%;height:80px;background:#f4f8fd;border-radius:4px}
.ow-preview-body{flex:1;display:flex;flex-direction:column;gap:6px}
.ow-preview-block{height:28px;background:#eef5ff;border-radius:4px}
.ow-preview-block.tall{height:50px}
.ow-preview-block.short{height:16px}
.ow-preview-mobile{
  width:80px;
  flex:0 0 80px;
  background:#fff;
  border:1px solid var(--ow-line);
  border-radius:12px;
  overflow:hidden
}
.ow-preview-phone-bar{height:12px;background:#f4f8fd;border-bottom:1px solid var(--ow-line)}
.ow-preview-phone-content{margin:8px 6px;height:60px;background:#eef5ff;border-radius:4px}
.ow-featured-info{padding:8px 0}
.ow-featured-label{
  display:inline-block;
  padding:5px 12px;
  background:#eef5ff;
  border:1px solid #dbe9fa;
  border-radius:6px;
  font:700 .6rem Manrope;
  color:var(--ow-royal);
  letter-spacing:.14em;
  margin-bottom:14px
}
.ow-featured-info h3{
  font-size:1.5rem;
  letter-spacing:-.03em;
  margin-bottom:12px;
  color:var(--ow-navy)
}
.ow-featured-desc{
  color:var(--ow-muted);
  font-size:.9rem;
  line-height:1.6;
  margin-bottom:20px
}
.ow-featured-caps{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-bottom:24px
}
.ow-featured-caps span{
  padding:6px 11px;
  background:#f4f8fd;
  border:1px solid var(--ow-line);
  border-radius:5px;
  font:600 .65rem Manrope;
  color:var(--ow-muted);
  letter-spacing:.04em;
  text-transform:uppercase
}

/* =========================================================================
   05. PROJECT GRID
   ========================================================================= */
.ow-project-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px
}
.ow-project-card{
  background:#fff;
  border:1px solid var(--ow-line);
  border-radius:16px;
  overflow:hidden;
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease,opacity .25s ease;
  display:flex;
  flex-direction:column;
  opacity:1;
  transform:none
}
.ow-project-card:hover{
  transform:translateY(-4px);
  border-color:var(--ow-accent);
  box-shadow:0 14px 32px rgba(6,16,79,.09)
}
.ow-project-preview{
  position:relative;
  overflow:hidden
}
.ow-project-thumb{height:180px;overflow:hidden}
.ow-project-thumb .ow-project-img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center
}
.ow-thumb-placeholder{
  width:100%;
  height:100%;
  background:linear-gradient(145deg,#eef5ff,#f4f8fd);
  display:flex;
  align-items:center;
  justify-content:center
}
.ow-thumb-placeholder:before{
  content:"";
  width:60px;
  height:60px;
  border:2px solid rgba(18,77,216,.15);
  border-radius:12px;
  transform:rotate(45deg)
}
.ow-thumb-placeholder.alt:before{
  border-color:rgba(19,184,244,.2)
}
.ow-project-category{
  position:absolute;
  top:12px;
  left:12px;
  padding:5px 10px;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(6px);
  border:1px solid var(--ow-line);
  border-radius:5px;
  font:700 .58rem Manrope;
  color:var(--ow-muted);
  letter-spacing:.08em;
  text-transform:uppercase
}
.ow-project-info{
  padding:20px;
  flex:1;
  display:flex;
  flex-direction:column
}
.ow-project-info h3{
  font-size:1rem;
  letter-spacing:.01em;
  margin-bottom:8px;
  color:var(--ow-navy)
}
.ow-project-info p{
  font-size:.8rem;
  color:var(--ow-muted);
  line-height:1.55;
  margin-bottom:12px;
  flex:1
}
.ow-project-tags{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-bottom:14px
}
.ow-project-tags span{
  padding:4px 9px;
  background:#f4f8fd;
  border:1px solid var(--ow-line);
  border-radius:4px;
  font:600 .6rem Manrope;
  color:var(--ow-muted);
  letter-spacing:.04em;
  text-transform:uppercase
}
.ow-project-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font:700 .76rem Manrope;
  color:var(--ow-royal);
  letter-spacing:.04em;
  transition:color .2s,transform .2s
}
.ow-project-link:hover{
  color:var(--ow-accent);
  transform:translateX(3px)
}

/* =========================================================================
   06. CASE STUDY SPOTLIGHT
   ========================================================================= */
.ow-spotlight-flow{
  display:grid;
  grid-template-columns:repeat(9,1fr);
  gap:0;
  align-items:center;
  margin-top:40px;
  opacity:1;
  transform:none
}
.ow-spotlight-stage{
  padding:22px 16px;
  background:rgba(8,30,90,.6);
  border:1px solid rgba(166,191,229,.2);
  border-radius:10px;
  text-align:center;
  transition:border-color .2s,background-color .2s,transform .2s
}
.ow-spotlight-stage:hover{
  border-color:var(--ow-cyan);
  background:rgba(25,70,151,.7);
  transform:translateY(-2px)
}
.ow-spotlight-num{
  font:800 .62rem Manrope;
  color:var(--ow-cyan);
  letter-spacing:.16em;
  margin-bottom:8px
}
.ow-spotlight-stage h3{
  font-size:.82rem;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:#fff;
  margin-bottom:6px
}
.ow-spotlight-stage p{
  font-size:.7rem;
  color:#b9c6e5;
  line-height:1.5;
  margin:0
}
.ow-spotlight-final{
  background:linear-gradient(135deg,rgba(10,39,115,.8),rgba(19,184,244,.3));
  border-color:rgba(19,184,244,.4)
}
.ow-spotlight-connector{
  text-align:center;
  color:var(--ow-cyan);
  font:800 1.1rem Manrope;
  padding:0 4px
}

/* =========================================================================
   07. PROJECT APPROACH — HORIZONTAL 6-STEP
   ========================================================================= */
.ow-steps-flow{
  display:flex;
  align-items:center;
  gap:0;
  flex-wrap:nowrap;
  overflow-x:auto;
  padding:0 8px 8px;
  margin-left:8px;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin
}
.ow-steps-flow::-webkit-scrollbar{height:4px}
.ow-steps-flow::-webkit-scrollbar-thumb{background:#cfdce9;border-radius:2px}

.ow-step-item{
  flex:0 0 auto;
  opacity:1;
  transform:none
}
.ow-step-card{
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:18px 14px;
  background:#fff;
  border:1px solid var(--ow-line);
  border-radius:12px;
  min-width:120px;
  text-align:center;
  transition:border-color .22s,background .22s,color .18s,transform .22s,box-shadow .22s
}
.ow-step-card:hover{
  border-color:var(--ow-accent);
  background:#f4faff;
  transform:translateY(-3px);
  box-shadow:0 8px 20px rgba(6,16,79,.07)
}
.ow-step-card:hover .ow-step-num{color:var(--ow-accent)}
.ow-step-card:hover b{color:var(--ow-navy)}
.ow-step-card:hover p{color:var(--ow-muted)}
.ow-step-start{
  background:linear-gradient(135deg,var(--ow-royal) 0%,var(--ow-accent) 100%);
  border-color:transparent;
  box-shadow:0 10px 28px rgba(37,87,214,.18)
}
.ow-step-start > .ow-step-num,
.ow-step-start > b,
.ow-step-start > p{color:#fff!important}
.ow-step-start:hover{
  background:linear-gradient(135deg,var(--ow-navy) 0%,var(--ow-royal) 100%)!important;
  border-color:var(--ow-cyan);
  transform:translateY(-2px);
  box-shadow:0 12px 32px rgba(37,87,214,.28)
}
.ow-step-start:hover .ow-step-num{color:#fff!important}
.ow-step-start:hover b{color:#fff!important}
.ow-step-start:hover p{color:rgba(255,255,255,.9)!important}
.ow-step-end{
  background:linear-gradient(135deg,var(--ow-royal) 0%,var(--ow-accent) 100%);
  border-color:transparent;
  box-shadow:0 10px 28px rgba(37,87,214,.18)
}
.ow-step-end > .ow-step-num,
.ow-step-end > b,
.ow-step-end > p{color:#fff!important}
.ow-step-end:hover{
  background:linear-gradient(135deg,var(--ow-navy) 0%,var(--ow-royal) 100%)!important;
  border-color:var(--ow-cyan);
  transform:translateY(-2px);
  box-shadow:0 12px 32px rgba(37,87,214,.28)
}
.ow-step-end:hover .ow-step-num{color:#fff!important}
.ow-step-end:hover b{color:#fff!important}
.ow-step-end:hover p{color:rgba(255,255,255,.9)!important}

.ow-step-num{
  font:800 .6rem Manrope;
  color:var(--ow-accent);
  letter-spacing:.16em;
  margin-bottom:6px;
  transition:color .18s
}
.ow-step-card b{
  font:700 .78rem Manrope;
  color:var(--ow-navy);
  letter-spacing:.04em;
  text-transform:uppercase;
  margin-bottom:4px;
  display:block;
  transition:color .18s
}
.ow-step-card p{
  font-size:.68rem;
  color:var(--ow-muted);
  line-height:1.45;
  margin:0;
  transition:color .18s
}

.ow-step-conn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:22px;
  flex:0 0 22px;
  color:var(--ow-accent);
  font:800 1rem Manrope;
  line-height:1
}

/* =========================================================================
   08. CAPABILITIES
   ========================================================================= */
.ow-cap-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px
}
.ow-cap-card{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:20px 18px;
  background:#fff;
  border:1px solid var(--ow-line);
  border-radius:12px;
  color:var(--ow-navy);
  transition:transform .25s ease,border-color .25s ease,background-color .25s ease,box-shadow .25s ease;
  clip-path:polygon(0 0,94% 0,100% 10%,100% 100%,0 100%);
  opacity:1;
  transform:none
}
.ow-cap-card:hover{
  transform:translateY(-3px);
  border-color:var(--ow-accent);
  background:#f4faff;
  box-shadow:0 10px 24px rgba(6,16,79,.07)
}
.ow-cap-icon{
  font-size:1.2rem;
  color:var(--ow-accent)
}
.ow-cap-card b{
  font:700 .8rem Manrope;
  letter-spacing:.02em;
  flex:1
}
.ow-cap-card span:last-child{
  color:var(--ow-accent);
  font:800 1rem Manrope;
  transition:transform .25s
}
.ow-cap-card:hover span:last-child{transform:translateX(3px)}

/* =========================================================================
   09. INDUSTRY CONTEXT
   ========================================================================= */
.ow-industry-list{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  margin-bottom:28px
}
.ow-industry-item{
  padding:18px 16px;
  background:#fff;
  border:1px solid var(--ow-line);
  border-radius:10px;
  font:700 .78rem Manrope;
  color:var(--ow-navy);
  text-transform:uppercase;
  letter-spacing:.04em;
  text-align:center;
  transition:border-color .2s,color .2s,transform .2s
}
.ow-industry-item:hover{
  border-color:var(--ow-accent);
  color:var(--ow-accent);
  transform:translateY(-2px)
}

/* =========================================================================
   10. TECHNOLOGY CONNECTION
   ========================================================================= */
.ow-tech-flow{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0;
  margin:36px 0 28px;
  opacity:1;
  transform:none
}
.ow-tech-stage{
  flex:0 0 auto;
  min-width:160px;
  padding:22px 18px;
  background:rgba(8,30,90,.6);
  border:1px solid rgba(166,191,229,.2);
  border-radius:10px;
  text-align:center;
  transition:border-color .2s,background-color .2s,transform .2s
}
.ow-tech-stage:hover{
  border-color:var(--ow-cyan);
  background:rgba(25,70,151,.7);
  transform:translateY(-2px)
}
.ow-tech-num{
  display:block;
  font:700 .58rem Manrope;
  color:var(--ow-cyan);
  letter-spacing:.18em;
  margin-bottom:8px
}
.ow-tech-stage b{
  display:block;
  font:800 .7rem Manrope;
  color:#fff;
  letter-spacing:.04em;
  text-transform:uppercase;
  margin-bottom:6px
}
.ow-tech-stage p{
  font-size:.68rem;
  color:#b9c6e5;
  margin:0;
  line-height:1.4
}
.ow-tech-stage-final{
  background:linear-gradient(135deg,rgba(10,39,115,.8),rgba(19,184,244,.35));
  border-color:rgba(19,184,244,.45)
}
.ow-tech-arrow{
  width:28px;
  flex:0 0 28px;
  text-align:center;
  color:var(--ow-cyan);
  font:800 1.1rem Manrope
}
.ow-tech-categories{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
  margin-bottom:28px
}
.ow-tech-categories span{
  padding:8px 14px;
  background:rgba(8,30,90,.5);
  border:1px solid rgba(166,191,229,.22);
  border-radius:6px;
  font:600 .66rem Manrope;
  color:#d8e9ff;
  letter-spacing:.06em;
  text-transform:uppercase;
  transition:border-color .2s,color .2s
}
.ow-tech-categories span:hover{
  border-color:var(--ow-cyan);
  color:#fff
}

/* =========================================================================
   11. ENGAGEMENT TYPES
   ========================================================================= */
.ow-engagement-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px
}
.ow-engage-card{
  padding:26px 22px;
  background:#fff;
  border:1px solid var(--ow-line);
  border-radius:14px;
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
  clip-path:polygon(0 0,94% 0,100% 10%,100% 100%,0 100%);
  opacity:1;
  transform:none
}
.ow-engage-card:hover{
  transform:translateY(-4px);
  border-color:var(--ow-accent);
  box-shadow:0 12px 28px rgba(6,16,79,.08)
}
.ow-engage-icon{
  display:block;
  font-size:1.6rem;
  color:var(--ow-accent);
  margin-bottom:14px
}
.ow-engage-card h3{
  font-size:.9rem;
  text-transform:uppercase;
  letter-spacing:.04em;
  margin-bottom:8px;
  color:var(--ow-navy)
}
.ow-engage-card p{
  font-size:.78rem;
  color:var(--ow-muted);
  line-height:1.55;
  margin:0
}

/* =========================================================================
   12. FINAL CTA
   ========================================================================= */
.ow-final-cta{
  text-align:center;
  padding:90px 0;
  position:relative;
  overflow:hidden
}
.ow-final-cta:before{
  content:"";
  position:absolute;
  width:480px;
  height:480px;
  right:-160px;
  top:-220px;
  border:1px solid rgba(19,184,244,.15);
  transform:rotate(45deg);
  pointer-events:none
}
.ow-final-cta .container{position:relative;z-index:1}
.ow-final-cta h2{
  font-size:clamp(2rem,3.8vw,3.2rem);
  max-width:700px;
  margin:0 auto 16px;
  color:#fff
}
.ow-final-cta p{
  max-width:600px;
  margin:0 auto 8px;
  color:#bdc9df;
  font-size:1rem
}
.ow-final-cta .button-row{justify-content:center;margin-top:24px}

/* =========================================================================
   RESPONSIVE
   ========================================================================= */
@media(max-width:1024px){
  .ow-hero-grid{grid-template-columns:1fr;gap:40px}
  .ow-hero-visual{max-width:600px}
  .ow-philosophy-grid{grid-template-columns:repeat(2,1fr)}
  .ow-featured-card{grid-template-columns:1fr}
  .ow-project-grid{grid-template-columns:repeat(2,1fr)}
  .ow-cap-grid{grid-template-columns:repeat(2,1fr)}
  .ow-industry-list{grid-template-columns:repeat(2,1fr)}
  .ow-spotlight-flow{grid-template-columns:1fr 1fr}
  .ow-spotlight-connector{grid-column:span 1}
  .ow-steps-flow{gap:0}
  .ow-step-card{min-width:100px;padding:15px 10px}
  .ow-step-conn{width:16px;flex:0 0 16px;font-size:.9rem}
}
@media(max-width:768px){
  .ow-hero{padding:60px 0 70px;min-height:auto}
  .ow-hero-copy h1{font-size:clamp(1.8rem,7vw,2.8rem)}
  .ow-filter{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:4px}
  .ow-filter::-webkit-scrollbar{display:none}
  .ow-filter-btn{white-space:nowrap;flex:0 0 auto}
  .ow-project-grid{grid-template-columns:1fr}
  .ow-engagement-grid{grid-template-columns:repeat(2,1fr)}
  .ow-spotlight-flow{grid-template-columns:1fr}
  .ow-spotlight-connector{transform:rotate(90deg);text-align:center;padding:8px 0}
  .ow-tech-flow{flex-direction:column;gap:12px}
  .ow-tech-arrow{transform:rotate(90deg)}
  .ow-steps-flow{
    flex-direction:column;
    align-items:center;
    gap:12px;
    overflow-x:visible;
    padding:0
  }
  .ow-step-item{width:100%}
  .ow-step-card{min-width:0;width:100%;max-width:320px;flex-direction:row;gap:14px;text-align:left}
  .ow-step-conn{transform:rotate(90deg);height:16px;display:flex;align-items:center;justify-content:center}
  .ow-flow-sequence{
    display:flex;
    flex-wrap:nowrap;
    overflow-x:auto;
    gap:0;
    padding-bottom:8px;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    justify-content:flex-start
  }
  .ow-flow-sequence::-webkit-scrollbar{display:none}
  .ow-hs-stage{flex:0 0 auto;min-width:64px;padding:10px 5px}
  .ow-hs-conn{flex:0 0 auto;padding:0 1px}
}
@media(max-width:480px){
  .ow-philosophy-grid{grid-template-columns:1fr}
  .ow-cap-grid{grid-template-columns:1fr}
  .ow-engagement-grid{grid-template-columns:1fr}
  .ow-industry-list{grid-template-columns:1fr}
  .ow-featured-card{padding:24px}
  .ow-preview-placeholder{flex-direction:column}
  .ow-preview-mobile{display:none}
}