/* ========================================================================== 
   ESPO 2.5.1.123.55 — Visual refinement phase 2
   Scope: header scroll state, service presentation, section transitions.
   Deliberately conservative: no page structure or approved brand identity changes.
   ========================================================================== */

:root {
  --espo-phase2-ink: #101c28;
  --espo-phase2-muted: #687787;
  --espo-phase2-line: rgba(16, 28, 40, .085);
  --espo-phase2-line-strong: rgba(16, 28, 40, .135);
  --espo-phase2-paper: #ffffff;
  --espo-phase2-wash: #f7f8f7;
  --espo-phase2-gold: #c4a451;
  --espo-phase2-blue: #0b6da8;
}

/* --------------------------------------------------------------------------
   Header — quieter at rest, cleaner and more compact once the page is moving.
   Reduces the heavy glass/GPU feel without changing navigation structure.
   -------------------------------------------------------------------------- */
.site-header.espo-floating-header .espo-header-shell {
  background: rgba(253, 252, 249, .93) !important;
  border-color: rgba(16, 28, 40, .075) !important;
  box-shadow: 0 12px 34px rgba(18, 27, 36, .07), inset 0 1px 0 rgba(255,255,255,.94) !important;
  backdrop-filter: blur(12px) saturate(118%) !important;
  -webkit-backdrop-filter: blur(12px) saturate(118%) !important;
}

.site-header.espo-floating-header .espo-header-shell::before {
  display: none !important;
}

.site-header.espo-floating-header.is-scrolled .espo-header-shell {
  background: rgba(255, 255, 253, .965) !important;
  border-color: rgba(16, 28, 40, .095) !important;
  box-shadow: 0 16px 38px rgba(18, 27, 36, .095), inset 0 1px 0 rgba(255,255,255,.96) !important;
  backdrop-filter: blur(14px) saturate(112%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(112%) !important;
}

.site-header.espo-floating-header .espo-primary-nav {
  background: rgba(255,255,255,.34) !important;
  border-color: rgba(16,28,40,.05) !important;
  box-shadow: none !important;
}

.site-header.espo-floating-header .espo-primary-nav > a,
.site-header.espo-floating-header .espo-services-menu > a {
  box-shadow: none !important;
}

.site-header.espo-floating-header .espo-primary-nav > a:hover,
.site-header.espo-floating-header .espo-services-menu > a:hover {
  background: rgba(255,255,255,.76) !important;
  box-shadow: none !important;
}

@media (min-width: 1024px) {
  .site-header.espo-floating-header.is-scrolled .espo-primary-nav {
    padding-block: .2rem !important;
  }

  .site-header.espo-floating-header.is-scrolled .espo-primary-nav > a,
  .site-header.espo-floating-header.is-scrolled .espo-services-menu > a {
    min-height: 34px !important;
    padding-block: .52rem !important;
  }

  .site-header.espo-floating-header.is-scrolled .espo-btn {
    min-height: 2.55rem !important;
    padding-block: .72rem !important;
  }

  .site-header.espo-floating-header.is-scrolled .espo-search-toggle {
    width: 2.45rem !important;
    height: 2.45rem !important;
  }
}

@media (max-width: 1023px) {
  .site-header.espo-floating-header .espo-mobile-menu {
    background: rgba(255,255,253,.985) !important;
    box-shadow: 0 18px 42px rgba(18,27,36,.11) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
  }
}

/* --------------------------------------------------------------------------
   Home section rhythm — subtle architectural separation, not decorative noise.
   -------------------------------------------------------------------------- */
body:is(.home, .espo-home-context) :is(
  .espo-cohesive-about,
  .espo-cohesive-services,
  .espo-cohesive-work,
  .espo-sectors-section,
  .espo-why-section,
  .espo-home-trust,
  .espo-home-insights
) {
  position: relative;
}

body:is(.home, .espo-home-context) .espo-cohesive-services {
  background: var(--espo-phase2-wash) !important;
  border-color: var(--espo-phase2-line) !important;
}

body:is(.home, .espo-home-context) .espo-cohesive-work {
  background: #fff !important;
}

body:is(.home, .espo-home-context) :is(
  .espo-cohesive-services,
  .espo-cohesive-work,
  .espo-sectors-section,
  .espo-why-section,
  .espo-home-insights
)::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: 0;
  left: 50%;
  width: min(90rem, calc(100% - 2.5rem));
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(16,28,40,.075) 16%, rgba(16,28,40,.075) 84%, transparent);
  transform: translateX(-50%);
  pointer-events: none;
}

body:is(.home, .espo-home-context) :is(
  .espo-services-heading,
  .espo-cohesive-work__heading,
  .espo-home-section-heading
) {
  position: relative;
  z-index: 1;
}

/* --------------------------------------------------------------------------
   Home service cards — more portfolio/editorial, less generic UI.
   -------------------------------------------------------------------------- */
body:is(.home, .espo-home-context) .espo-home-services-grid {
  gap: clamp(.85rem, 1.25vw, 1.1rem) !important;
  margin-top: clamp(1.9rem, 3.3vw, 2.55rem) !important;
}

body:is(.home, .espo-home-context) .espo-home-service-card {
  border: 1px solid var(--espo-phase2-line) !important;
  border-radius: .9rem !important;
  background: var(--espo-phase2-paper) !important;
  box-shadow: 0 8px 24px rgba(16,28,40,.035) !important;
  transition: transform .3s cubic-bezier(.22,1,.36,1), border-color .28s ease, box-shadow .28s ease !important;
}

body:is(.home, .espo-home-context) .espo-home-service-card::after {
  display: none !important;
}

body:is(.home, .espo-home-context) .espo-home-service-card:hover,
body:is(.home, .espo-home-context) .espo-home-service-card:focus-visible {
  transform: translateY(-3px) !important;
  border-color: color-mix(in srgb, var(--service-accent) 22%, var(--espo-phase2-line-strong)) !important;
  box-shadow: 0 17px 38px rgba(16,28,40,.065) !important;
}

body:is(.home, .espo-home-context) .espo-home-service-accent {
  inset-inline-start: 1rem !important;
  width: 2.2rem !important;
  height: 2px !important;
  opacity: .9 !important;
}

body:is(.home, .espo-home-context) .espo-home-service-card:hover .espo-home-service-accent,
body:is(.home, .espo-home-context) .espo-home-service-card:focus-visible .espo-home-service-accent {
  width: 3.4rem !important;
}

body:is(.home, .espo-home-context) .espo-home-service-media {
  aspect-ratio: 16 / 10 !important;
  background: #edf0f1 !important;
}

body:is(.home, .espo-home-context) .espo-home-service-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 70%, rgba(7,15,22,.08));
  pointer-events: none;
}

body:is(.home, .espo-home-context) .espo-home-service-media img {
  filter: none !important;
  transform: scale(1.001) !important;
  transition: transform .6s cubic-bezier(.22,1,.36,1) !important;
}

body:is(.home, .espo-home-context) .espo-home-service-card:hover .espo-home-service-media img,
body:is(.home, .espo-home-context) .espo-home-service-card:focus-visible .espo-home-service-media img {
  transform: scale(1.022) !important;
}

body:is(.home, .espo-home-context) .espo-home-service-content {
  padding: .95rem 1rem 1.02rem !important;
}

body:is(.home, .espo-home-context) .espo-home-service-number {
  color: rgba(16,28,40,.43) !important;
  font-size: .66rem !important;
  letter-spacing: .14em !important;
}

body:is(.home, .espo-home-context) .espo-home-service-dot {
  width: .4rem !important;
  height: .4rem !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--service-accent) 7%, transparent) !important;
}

body:is(.home, .espo-home-context) .espo-home-service-title {
  min-height: 2.8em !important;
  margin-top: .62rem !important;
  color: var(--espo-phase2-ink) !important;
  font-size: clamp(1rem, 1.02vw, 1.12rem) !important;
  font-weight: 640 !important;
  line-height: 1.34 !important;
}

body:is(.home, .espo-home-context) .espo-home-service-summary {
  min-height: 4.45em !important;
  margin-top: .36rem !important;
  color: var(--espo-phase2-muted) !important;
  font-size: .78rem !important;
  line-height: 1.54 !important;
}

body:is(.home, .espo-home-context) .espo-home-service-link {
  margin-top: .78rem !important;
  padding-top: .78rem !important;
  border-top-color: rgba(16,28,40,.075) !important;
  color: var(--espo-phase2-ink) !important;
  font-size: .68rem !important;
  font-weight: 690 !important;
}

body:is(.home, .espo-home-context) .espo-home-service-link svg {
  color: var(--service-accent);
}

/* Mobile: turn service cards into compact editorial rows to reduce page length. */
@media (max-width: 699px) {
  body:is(.home, .espo-home-context) .espo-home-services-grid {
    gap: .72rem !important;
    margin-top: 1.55rem !important;
  }

  body:is(.home, .espo-home-context) .espo-home-service-card {
    display: grid !important;
    grid-template-columns: minmax(7.25rem, 39%) minmax(0, 1fr);
    min-height: 9.4rem;
    border-radius: .82rem !important;
  }

  body:is(.home, .espo-home-context) .espo-home-service-card:hover,
  body:is(.home, .espo-home-context) .espo-home-service-card:focus-visible {
    transform: none !important;
  }

  body:is(.home, .espo-home-context) .espo-home-service-accent {
    top: .72rem !important;
    inset-inline-start: calc(39% + .82rem) !important;
  }

  body:is(.home, .espo-home-context) .espo-home-service-media {
    height: 100%;
    min-height: 9.4rem;
    aspect-ratio: auto !important;
  }

  body:is(.home, .espo-home-context) .espo-home-service-content {
    min-width: 0;
    padding: .82rem .82rem .78rem !important;
  }

  body:is(.home, .espo-home-context) .espo-home-service-title {
    min-height: 0 !important;
    margin-top: .48rem !important;
    font-size: .95rem !important;
  }

  body:is(.home, .espo-home-context) .espo-home-service-summary {
    min-height: 0 !important;
    margin-top: .3rem !important;
    font-size: .73rem !important;
    line-height: 1.48 !important;
    -webkit-line-clamp: 2 !important;
  }

  body:is(.home, .espo-home-context) .espo-home-service-link {
    margin-top: auto !important;
    padding-top: .56rem !important;
    font-size: .64rem !important;
  }
}

/* --------------------------------------------------------------------------
   Services archive — bring the same calmer editorial language to the index.
   -------------------------------------------------------------------------- */
.espo-services-page .espo-service-card__link {
  border: 1px solid var(--espo-phase2-line) !important;
  border-radius: .92rem !important;
  background: #fff !important;
  box-shadow: 0 9px 26px rgba(16,28,40,.035) !important;
  transition: transform .3s cubic-bezier(.22,1,.36,1), border-color .28s ease, box-shadow .28s ease !important;
}

.espo-services-page .espo-service-card__link:hover,
.espo-services-page .espo-service-card__link:focus-visible {
  transform: translateY(-3px) !important;
  box-shadow: 0 18px 40px rgba(16,28,40,.065) !important;
}

.espo-services-page .espo-service-card__media::after {
  background: linear-gradient(180deg, transparent 74%, rgba(7,15,22,.1)) !important;
}

.espo-services-page .espo-service-card__media img {
  filter: none !important;
  transition: transform .6s cubic-bezier(.22,1,.36,1) !important;
}

.espo-services-page .espo-service-card__link:hover .espo-service-card__media img,
.espo-services-page .espo-service-card__link:focus-visible .espo-service-card__media img {
  filter: none !important;
  transform: scale(1.022) !important;
}

.espo-services-page .espo-service-card__body {
  padding: 1rem 1.05rem 1.08rem !important;
}

.espo-services-page .espo-service-card__body::before {
  height: 1.5px !important;
  opacity: .72 !important;
}

.espo-services-page .espo-service-card__capabilities li {
  background: #fbfbfa !important;
  border-color: rgba(16,28,40,.075) !important;
  color: #657383 !important;
}

.espo-services-page .espo-service-card__action {
  color: var(--espo-phase2-ink) !important;
}

/* Accessibility / motion preference. */
@media (prefers-reduced-motion: reduce) {
  .site-header.espo-floating-header .espo-header-shell,
  body:is(.home, .espo-home-context) .espo-home-service-card,
  body:is(.home, .espo-home-context) .espo-home-service-media img,
  .espo-services-page .espo-service-card__link,
  .espo-services-page .espo-service-card__media img {
    transition: none !important;
  }
}