/* EPPOS Services v14 — specific services / visual separation / unique imagery */
.services-page .services-hero{padding-bottom:0}
.services-page .services-hero-grid{min-height:610px}
.services-page .services-hero-copy>p:not(.eyebrow){max-width:500px}
.services-page .services-hero-art{min-height:550px}
.services-page .services-horse{inset:0 -48px 28px 0;clip-path:polygon(28% 0,100% 0,80% 100%,0 100%)}
.services-page .services-horse img{object-position:48% 50%;transform:scale(1.02);filter:grayscale(1) contrast(1.08)}
.services-page .services-momentum,
.services-page .services-hero-tag,
.services-page .services-index{display:none!important}

.services-transition{background:var(--ivory);padding:38px 0 42px;border-top:1px solid rgba(22,22,22,.10);border-bottom:1px solid rgba(22,22,22,.14)}
.services-transition-inner{display:flex;align-items:center;gap:22px}
.services-transition .eyebrow{margin:0;white-space:nowrap;color:var(--ink)}
.services-transition-line{height:1px;background:rgba(22,22,22,.22);flex:1}
.services-transition-index{font-family:var(--font-body);font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:#595651;white-space:nowrap}

.service-detail-grid{grid-template-columns:54px 1.05fr .92fr 1.55fr;min-height:275px}
.service-detail-grid>div{padding:38px 42px 34px 0}
.service-detail h2{font-size:clamp(38px,3.4vw,52px);line-height:1.02;margin-bottom:10px;max-width:420px}
.service-detail p{font-size:16px;line-height:1.5;max-width:390px;color:#373531;margin-bottom:24px}
.service-detail ul{padding:38px 30px;font-size:14px;line-height:1.65}
.service-detail figure{min-height:275px;background:#ddd5ca}
.service-detail figure img{filter:saturate(.72) contrast(1.03);object-position:center center;transition:transform .65s var(--ease),filter .45s ease}
.service-detail:hover figure img{transform:scale(1.025);filter:saturate(.9) contrast(1.03)}
.service-detail figcaption{right:24px;bottom:22px;font-size:12px;line-height:1.45;max-width:220px}
.service-detail .text-link{font-size:14px}

.services-page .services-approach{margin-top:0}
.services-page .services-industries{border-top:1px solid rgba(22,22,22,.1)}

@media(max-width:1050px){
  .services-page .services-hero-grid{min-height:auto}
  .services-page .services-hero-art{min-height:430px;margin-top:8px}
  .services-page .services-horse{inset:0 -54px 22px 18%}
  .service-detail-grid{grid-template-columns:45px 1fr 1fr}
  .service-detail figure{grid-column:1/-1;min-height:340px}
}
@media(max-width:720px){
  .services-page .services-hero-copy h1{font-size:clamp(58px,17vw,78px);line-height:.92}
  .services-page .services-hero-art{min-height:300px;margin-top:28px}
  .services-page .services-horse{inset:0 -65px 18px 4%}
  .services-transition{padding:26px 0 28px}
  .services-transition-index{font-size:11px}
  .services-transition-line{min-width:20px}
  .service-detail-grid{grid-template-columns:34px 1fr}
  .service-detail-grid>div{padding:26px 0 18px}
  .service-detail h2{font-size:38px;max-width:100%}
  .service-detail p{font-size:16px;margin-bottom:18px}
  .service-detail ul{grid-column:2;padding:0 0 26px;font-size:14px;line-height:1.7}
  .service-detail figure{grid-column:1/-1;min-height:255px}
  .service-detail figcaption{font-size:11px}
}


/* EPPOS Services v16 — equal image geometry + revised strategy visual */
/* Real-photo treatment: harmonise different locations without making them look synthetic. */
.services-page .service-photo{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:#cdbda9;
}
.services-page .service-photo::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:1;
  background:
    linear-gradient(180deg,rgba(84,49,25,.04),rgba(119,61,24,.12)),
    linear-gradient(90deg,rgba(227,92,50,.035),rgba(244,241,234,0));
  mix-blend-mode:multiply;
}
.services-page .service-photo img{
  position:relative;
  z-index:0;
  width:100%;
  height:100%;
  object-fit:cover;
  filter:sepia(.12) saturate(.78) contrast(1.04) brightness(.96) !important;
}
.services-page .service-detail:hover .service-photo img{
  transform:scale(1.025);
  filter:sepia(.10) saturate(.88) contrast(1.045) brightness(.98) !important;
}
.services-page .service-photo figcaption{
  z-index:2;
}

/* Individual crops so the five photos feel varied, not like one repeated office shoot. */
.services-page .service-photo-web img{object-position:center 58%}
.services-page .service-photo-brand img{object-position:center 58%}
.services-page .service-photo-content img{object-position:center 54%}
.services-page .service-photo-performance img{object-position:center 48%;filter:sepia(.18) saturate(.70) contrast(1.03) brightness(.96) !important}
.services-page .service-photo-strategy img{object-position:center 42%;filter:sepia(.05) saturate(.72) contrast(1.06) brightness(.90) !important}

/* Keep the transition from hero to actual services calm and clear. */
.services-page .services-transition{padding-top:42px;padding-bottom:46px}

@media(max-width:720px){
  .services-page .service-photo-web img{object-position:center 60%}
  .services-page .service-photo-brand img{object-position:center 62%}
  .services-page .service-photo-content img{object-position:center 52%}
  .services-page .service-photo-performance img{object-position:center 50%}
  .services-page .service-photo-strategy img{object-position:center 38%}
}


/* v16: lock every service visual to the same geometry */
.services-page .service-detail-grid{min-height:320px;}
.services-page .service-photo{height:320px;min-height:320px;align-self:stretch;}
.services-page .service-photo img{display:block;width:100%;height:100%;object-fit:cover;}
.services-page .service-photo-strategy img{object-position:center 52%;filter:sepia(.10) saturate(.76) contrast(1.04) brightness(.95)!important;}

@media(max-width:1050px){
  .services-page .service-detail-grid{min-height:0;}
  .services-page .service-photo{height:340px;min-height:340px;}
}
@media(max-width:720px){
  .services-page .service-photo{height:270px;min-height:270px;}
  .services-page .service-photo-strategy img{object-position:center 50%;}
}