:root {
  --navy:#09285f;
  --deep:#032754;
  --ink:#08265d;
  --blue:#078fd8;
  --cyan:#11a4e7;
  --pale:#eaf7fc;
  --line:#d4e4f2;
  --muted:#5577b3;
  --section-space:100px;
  --hero-fade-desktop: linear-gradient(90deg, #f8fcff 0%, #f8fcfff7 22%, #f8fcffe0 37%, #f8fcffad 52%, #f8fcff52 66%, transparent 80%);
  --hero-fade-partial: linear-gradient(90deg, #f8fcff 0%, #f8fcfff5 10%, #f8fcffcc 25%, #f8fcff80 40%, #f8fcff29 55%, transparent 70%);
  --hero-fade-tablet: linear-gradient(90deg, #f8fcff 0%, #f8fcfff5 20%, #f8fcffcc 38%, #f8fcff80 55%, #f8fcff29 72%, transparent 85%);
  --hero-fade-bottom: linear-gradient(0deg, #f8fcff 0%, #f8fcffcc 18%, #f8fcff66 36%, transparent 55%);
  --hero-fade-mobile: linear-gradient(180deg, #f8fcff 0%, #f8fcfff5 25%, #f8fcffcc 40%, #f8fcff80 53%, #f8fcff26 67%, transparent 76%);
}

* {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth
}

body {
  margin:0;
  color:var(--ink);
  font-family:Poppins,Arial,sans-serif;
  -webkit-font-smoothing:antialiased
}

h1,
h2,
h3 {
  letter-spacing: -.02em;
  line-height: 1.2em !important;
}

button,a {
  font:inherit;
  -webkit-tap-highlight-color:transparent
}

a {
  text-decoration:none;
  color:inherit
}

button {
  cursor:pointer
}

.svg-library {
  position:absolute;
  width:0;
  height:0;
  overflow:hidden
}

svg {
  width:1.4em;
  height:1.4em;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round
}

.container {
  width:min(100% - 92px,1280px);
  margin-inline:auto
}

.section-pad {
  padding-block:var(--section-space)
}

.section-intro-grid {
  display:grid;
  grid-template-columns:minmax(0,44%) minmax(0,1fr);
  align-items:center
}

.section-intro-grid h2 {
  padding-right:38px
}

.section-intro-grid > p {
  margin:0;
  padding:0 0 0 38px;
  border-left:1px solid #b8d8ef;
  color:#3d62a1;
  line-height:1.5
}

.site-header {
  height:73px;
  background:#fff;
  position:sticky;
  top:0;
  z-index:100;
  box-shadow:0 2px 18px #133d6112
}

.nav-backdrop {
  position:fixed;
  inset:0;
  z-index:99;
  background:rgba(8,18,32,.44);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .2s ease,visibility .2s ease
}

@media(max-width:1100px) {
  .nav-backdrop.open {
    opacity:1;
    visibility:visible;
    pointer-events:auto
  }
}

.header-inner {
  height:100%;
  display:flex;
  align-items:center;
  gap:32px
}

.brand {
  display:block;
  flex:none;
  width:235px
}

.brand img {
  display:block;
  width:100%;
  height:auto
}

.nav {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  margin-left:auto;
  white-space:nowrap
}

.nav a {
  position:relative;
  font-size:14px;
  font-weight:500;
  color:#203d73;
  padding-block:25px
}

.nav a:hover,.nav a.active {
  color:#048ee0
}

.nav a.active:after,.nav a:hover:after {
  content:"";
  height:2px;
  position:absolute;
  bottom:20px;
  left:0;
  right:0;
  background:#08a8ec
}

.nav .nav-contact .nav-label {
  position:relative;
  display:block;
  border:0;
  background:transparent;
  padding-block:25px;
  padding-inline:0;
  color:#203d73;
  font-size:14px;
  font-weight:500;
  text-align:left
}

.nav-contact:hover .nav-label,
.nav-contact .nav-label.active {
  color:#048ee0
}

.nav-contact:hover .nav-label::after,
.nav-contact .nav-label.active::after {
  content:"";
  position:absolute;
  bottom:20px;
  left:0;
  right:0;
  height:2px;
  background:#08a8ec
}

.nav-services,
.nav-contact {
  position:relative;
  display:flex;
  align-items:center;
  gap:3px
}

.submenu-toggle {
  display:grid;
  place-items:center;
  width:18px;
  height:30px;
  padding:0;
  border:0;
  background:transparent;
  color:#203d73
}

.submenu-toggle svg {
  width:11px;
  height:11px;
  transition:transform .2s
}

.nav-services.open .submenu-toggle svg,
.nav-contact.open .submenu-toggle svg {
  transform:rotate(180deg)
}

.submenu {
  display:none;
  position:absolute;
  z-index:20;
  top:100%;
  left:-15px;
  min-width:235px;
  padding:7px;
  background:#fff;
  border-top:2px solid #08a8ec;
  border-radius:0 0 5px 5px;
  box-shadow:0 12px 25px #001d3d26
}

.nav-services:hover .submenu,
.nav-services:focus-within .submenu,
.nav-services.open .submenu,
.nav-contact:hover .submenu,
.nav-contact:focus-within .submenu,
.nav-contact.open .submenu {
  display:block
}

.nav .submenu a {
  display:block;
  padding:10px 11px;
  font-size:14px;
  color:#203d73;
  border-radius:3px
}

.nav .submenu a + a {
  margin-top:4px
}

.nav .submenu a:hover,
.nav .submenu a.active {
  color:#048ee0
}

@media(hover:hover) {
  .nav .submenu a:hover {
    background:#eef9ff
  }
}

.nav .submenu a:after {
  display:none
}

.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:15px;
  min-height:45px;
  padding:0 23px;
  border-radius:5px;
  color:#fff;
  background:linear-gradient(100deg,#087acb,#079ce6);
  font-size:13px;
  font-weight:600;
  box-shadow:0 6px 15px #007ab01f;
  transition:transform .2s,box-shadow .2s
}

.button:hover {
  transform:translateY(-2px);
  box-shadow:0 9px 18px #007ab039
}

.button svg,.all-services svg {
  width:19px;
  height:19px
}

.button-small {
  min-height:36px;
  min-width:118px;
  font-size:13px;
  padding:0 15px
}

.nav .nav-cta {
  display:none
}

.menu-toggle {
  display:none
}

.hero {
  position:relative;
  overflow:hidden;
  min-height:420px;
  background:#f8fcff;
  display:flex;
  align-items:center
}

.hero-photo {
  position:absolute;
  inset:0 0 0 39%;
  background-image:url('../assets/images/hero-team.webp?v=20261019.6');
  background-size:cover;
  background-position:center 42%
}

.hero-photo:before {
  content:"";
  position:absolute;
  inset:0;
  background: var(--hero-fade-partial)
}

.hero-content {
  position:relative;
  z-index:2
}

.hero-eyebrow {
  display:flex;
  align-items:center;
  gap:13px;
  color:#324f96
}

.eyebrow,.section-label {
  font-size:9px;
  letter-spacing:.3em;
  text-transform:uppercase;
  font-weight:700
}

.hero-eyebrow span {
  width:37px;
  height:1px;
  background:#718db1
}

h1,h2,h3,p {
  margin-top:0
}

.hero h1 {
  font-size:clamp(38px,4.7vw,66px);
  line-height:.98;
  letter-spacing:-.02em;
  margin:22px 0 13px;
  font-weight:700;
  max-width:620px
}

.hero em,.services em,.about em {
  font-style:normal;
  color:var(--cyan)
}

.hero-lead {
  font-size:15px;
  line-height:1.5;
  font-weight:400;
  margin-bottom:19px
}

.hero-actions {
  display:flex;
  align-items:center
}

.facts {
  background:#ecf7fc;
  padding:22px 0
}

.facts-inner {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0
}

.fact {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:19px;
  min-height:42px
}

.fact+.fact {
  border-left:1px solid #c8dce9
}

.fact>svg,.fact>img {
  width:37px;
  height:37px;
  color:#001b71;
  stroke-width:1.7
}

.fact-rule {
  height:35px;
  width:1px;
  background:#afc3dc
}

.fact p {
  display:flex;
  flex-direction:column;
  margin:0;
  line-height:1.25
}

.fact strong {
  font-size:15px
}

.fact p span {
  font-size:12px;
  color:#6680ae
}

.services {
  background:#fff
}

.section-label {
  display:flex;
  align-items:center;
  gap:19px;
  color:#5274b3;
  margin-bottom:20px
}

.section-label>span {
  width:43px;
  height:3px;
  background:#f31f2a
}

.section-heading-row {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:25px;
  margin-bottom:23px
}

.section-heading-row h2 {
  font-size:clamp(29px,3.5vw,46px);
  letter-spacing:-.02em;
  line-height:1.18;
  font-weight:700;
  margin-bottom:6px
}

.section-heading-row p {
  color:#6280b7;
  font-size:15px;
  margin-bottom:0
}

.all-services {
  border:0;
  border-bottom:1px solid #08a6e4;
  background:none;
  display:inline-flex;
  align-items:center;
  gap:10px;
  white-space:nowrap;
  color:#008de3;
  font-size:13px;
  padding:0 0 6px;
  margin-bottom:7px
}

.all-services:hover {
  color:#005fa3
}

.service-row {
  border-top:1px solid var(--line);
  min-height:95px;
  padding:16px 22px;
  display:grid;
  grid-template-columns:93px minmax(230px,1.3fr) minmax(220px,1.25fr) 38px;
  align-items:center;
  gap:18px;
  transition:background .2s
}

.service-row:hover {
  background:#f7fcff
}

.service-icon {
  width:74px;
  height:74px;
  border-radius:50%;
  background:var(--pale);
  display:grid;
  place-items:center;
  color:#001b81
}

.service-icon svg,.service-icon img {
  width:46px;
  height:46px;
  stroke-width:1.9
}

.service-row h3 {
  font-size:20px;
  letter-spacing:-.02em;
  font-weight:700;
  margin:0;
  color:#08186c
}

.service-row p {
  font-size:14px;
  line-height:1.5;
  color:#5579be;
  margin:0;
  max-width:500px
}

.row-arrow {
  width:27px;
  height:27px;
  color:#001481;
  justify-self:end;
  transition:transform .2s
}

.service-row:hover .row-arrow {
  transform:translateX(5px)
}

.about {
  position:relative;
  overflow:hidden;
  background:#eef9ff;
  color:#09285f
}

.about-photo {
  position:absolute;
  inset:0 0 0 43%;
  background:url('../assets/images/office-building.webp?v=20261019.6') center / cover no-repeat;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#0002 18%,#0006 38%,#000b 62%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#0002 18%,#0006 38%,#000b 62%,#000 100%)
}

.about-inner {
  position:relative;
  z-index:2
}

.about-copy {
  max-width:570px
}

.section-label.light {
  color:#e5f0ff
}

.about .section-label.light {
  color:#3d62a1
}

.about h2 {
  font-size:clamp(37px,4.4vw,58px);
  line-height:1.03;
  letter-spacing:-.02em;
  margin-bottom:17px
}

.about p {
  font-size:15px;
  line-height:1.5;
  max-width:475px;
  margin-bottom:20px;
  color:#385faf
}

.about .button-outline {
  color:#09285f;
  border-color:#09285f
}

.about .button-outline:hover {
  background:#dff2ff
}

.button-outline {
  background:transparent;
  border:1.5px solid #fff;
  border-radius:5px;
  min-height:48px;
  box-shadow:none
}

.button-outline:hover {
  background:#ffffff16
}

.contact {
  position:relative;
  overflow:hidden;
  color:#fff;
  background:linear-gradient(115deg,#062c63,#0065ab 70%,#009bdb)
}

.contact.section-pad {
  padding-block:44px;
  border-bottom:2px solid #29bdf2;
  background:linear-gradient(105deg,#062a65 0%,#075ca9 62%,#079cdd 100%)
}

.contact:before,.contact:after {
  content:"";
  position:absolute;
  transform:skewX(-40deg);
  background:#35c4ed24;
  width:100px;
  height:180%;
  top:-40%;
  right:22%
}

.contact:after {
  right:15%;
  width:35px;
  background:#47c4f43d
}

.contact.section-pad::before,
.contact.section-pad::after {
  display:none
}

.contact-inner {
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px
}

.contact.section-pad .contact-inner {
  display:flex;
  gap:clamp(25px,4vw,62px)
}

.contact.section-pad .contact-inner > div {
  max-width:1000px
}

.contact .eyebrow {
  font-size:9px;
  margin-bottom:9px
}

.contact.section-pad .eyebrow {
  margin-bottom:13px;
  letter-spacing:.3em;
  font-weight:700
}

.contact h2 {
  font-size:clamp(21px,2.5vw,31px);
  line-height:1.2;
  letter-spacing:-.02em;
  font-weight:500;
  margin:0
}

.contact.section-pad h2 {
  margin:0;
  color:#fff;
  font-size:var(--section-h2-size);
  font-weight:700;
  line-height:1.15;
  letter-spacing:-.02em
}

.contact.section-pad p {
  margin:10px 0 0;
  color:#e8f4ff;
  line-height:1.5
}

.button-white {
  background:#fff;
  color:#0b3176;
  min-width:128px;
  box-shadow:none
}

.button-white:hover {
  box-shadow:0 8px 25px #001c4a2d
}

.contact.section-pad .button-white {
  flex:none;
  min-width:178px;
  min-height:48px;
  margin-top:0;
  padding-inline:25px;
  border-radius:4px;
  color:#09285f;
  background:#fff;
  font-size:14px;
  font-weight:600
}

.footer {
  position:relative;
  overflow:hidden;
  background:#052857;
  color:#fff
}

.footer .container {
  position:relative;
  z-index:1
}

.footer-main {
  display:grid;
  grid-template-columns:minmax(270px,1.8fr) repeat(3,minmax(150px,1fr));
  gap:clamp(28px,4vw,74px);
  padding:55px 0 82px
}

.footer-brand {
  display:inline-block;
  width:218px;
  max-width:100%
}

.footer-brand img {
  display:block;
  width:100%;
  height:auto;
  filter:brightness(0) invert(1)
}

.footer-intro {
  max-width:340px;
  margin:25px 0 0;
  color:#b2c8e2;
  font-size:15px;
  line-height:1.65
}

.footer-nav h2 {
  margin:0;
  color:#fff;
  font-size:18px;
  font-weight:600;
  line-height:1.4
}

.footer-nav h2 {
  margin-bottom:24px
}

.footer-nav ul {
  display:grid;
  gap:16px;
  margin:0;
  padding-left:17px;
  color:#75a5ca
}

.footer-nav li {
  padding-left:2px
}

.footer-nav a {
  color:#b2c8e2;
  font-size:14px;
  line-height:1.45;
  transition:color .2s
}

.footer-nav a:hover,
.footer-nav a:focus-visible,
.footer-bottom a:hover,
.footer-bottom a:focus-visible {
  color:#fff;
  text-decoration:underline;
  text-underline-offset:4px
}

.footer-rule {
  position:relative;
  height:1px;
  background:#ffffff25
}

.footer-back-top {
  position:absolute;
  top:50%;
  left:50%;
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  border:1px solid #ffffff38;
  border-radius:13px;
  background:#062b5b;
  color:#fff;
  transform:translate(-50%,-50%);
  transition:background .2s,border-color .2s
}

.footer-back-top:hover,
.footer-back-top:focus-visible {
  border-color:#58c3f0;
  background:#0a4d8c
}

.footer-back-top svg {
  width:21px;
  height:21px;
  transform:rotate(-90deg)
}

.whatsapp-float {
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:90;
  display:block;
  width:58px;
  height:58px;
  border-radius:50%;
  box-shadow:0 8px 24px #05285738;
  transition:transform .2s,box-shadow .2s
}

.whatsapp-float:hover {
  transform:translateY(-3px);
  box-shadow:0 12px 28px #0528574d
}

.whatsapp-float:focus-visible {
  outline:3px solid #078fd8;
  outline-offset:3px
}

.whatsapp-float img {
  display:block;
  width:100%;
  height:100%
}

.footer-bottom {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
  padding-block:49px 32px;
  color:#b2c8e2;
  font-size:12px
}

.footer-bottom p {
  margin:0
}

.footer-bottom-links {
  display:flex;
  flex-wrap:wrap;
  gap:22px
}

.footer-bottom a {
  color:#b2c8e2
}

#services,#about,#contact {
  scroll-margin-top:72px
}

@media(max-width:1100px) {
  .footer-main {
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:45px 28px;
    padding:55px 0 70px
  }

  .footer-about {
    grid-column:1 / -1
  }

  .header-inner {
    gap:24px
  }

  .brand {
    width:205px
  }

  .nav {
    gap:15px
  }

  .hero h1 {
    font-size:clamp(38px,4.7vw,54px)
  }

  .service-row {
    grid-template-columns:90px minmax(220px,1.1fr) minmax(190px,1fr) 30px
  }

}

@media(min-width:901px) and (max-width:1100px) {
  .site-header {
    height:70px
  }

  .header-inner {
    gap:18px
  }

  .header-cta {
    margin-left:auto
  }

  .menu-toggle {
    display:flex;
    order:3;
    width:40px;
    height:40px;
    border:0;
    background:transparent;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:5px
  }

  .menu-toggle span {
    display:block;
    width:24px;
    height:2px;
    background:#062e66
  }

  .nav {
    display:none;
    position:absolute;
    top:70px;
    left:0;
    right:0;
    max-height:calc(100vh - 70px);
    overflow-y:auto;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    padding:12px 46px 25px;
    background:#fff;
    box-shadow:0 12px 25px #001d3d19
  }

  .nav.open {
    display:flex
  }

  .nav a,
  .nav .nav-contact .nav-label {
    padding:13px 0
  }

  .nav a.active:after,
  .nav a:hover:after,
  .nav-contact:hover .nav-label::after,
  .nav-contact .nav-label.active::after {
    bottom:8px;
    right:auto;
    width:35px
  }

  .nav-services,
  .nav-contact {
    flex-wrap:wrap;
    gap:0
  }

  .nav-services > a,
  .nav-contact > .nav-label {
    flex:1
  }

  .submenu-toggle {
    width:40px;
    height:43px
  }

  .submenu-toggle svg {
    width:15px;
    height:15px
  }

  .nav .nav-services .submenu,
  .nav .nav-contact .submenu {
    display:none;
    position:static;
    flex-basis:100%;
    min-width:0;
    margin:0 0 8px 12px;
    padding:0 0 0 13px;
    border:0;
    border-left:2px solid #c7e9fa;
    border-radius:0;
    box-shadow:none
  }

  .nav .nav-services.open .submenu,
  .nav .nav-contact.open .submenu {
    display:block
  }

  .nav .submenu a {
    padding:9px 12px
  }
}

@media(max-width:900px) {
  :root {
    --section-space:80px
  }

  .section-intro-grid h2 {
    padding-right:28px
  }

  .section-intro-grid > p {
    padding-left:28px
  }

  .contact.section-pad {
    padding-block:50px
  }

  .contact.section-pad .contact-inner {
    flex-direction:column;
    align-items:flex-start;
    gap:24px
  }

  .container {
    width:min(100% - 64px,1280px)
  }

  .site-header {
    height:70px
  }

  .brand {
    width:205px
  }

  .header-cta {
    margin-left:auto
  }

  .menu-toggle {
    display:flex;
    order:3;
    width:40px;
    height:40px;
    border:0;
    background:transparent;
    flex-direction:column;
    justify-content:center;
    gap:5px;
    align-items:center
  }

  .menu-toggle span {
    width:24px;
    height:2px;
    background:#062e66;
    display:block
  }

  .nav {
    display:none;
    position:absolute;
    top:70px;
    left:0;
    right:0;
    max-height:calc(100vh - 70px);
    overflow-y:auto;
    background:#fff;
    padding:12px 32px 25px;
    box-shadow:0 12px 25px #001d3d19;
    flex-direction:column;
    align-items:stretch;
    gap:0
  }

  .nav.open {
    display:flex
  }

  .nav a {
    font-size:14px;
    padding:13px 0
  }

  .nav .nav-contact .nav-label {
    padding:13px 0;
    font-size:14px
  }

  .nav a.active:after,.nav a:hover:after {
    bottom:8px;
    right:auto;
    width:35px
  }

  .nav-contact:hover .nav-label::after,
  .nav-contact .nav-label.active::after {
    bottom:8px;
    right:auto;
    width:35px
  }

  .nav-services,
  .nav-contact {
    flex-wrap:wrap;
    gap:0
  }

  .nav-services > a,
  .nav-contact > .nav-label {
    flex:1
  }

  .submenu-toggle {
    width:40px;
    height:43px
  }

  .submenu-toggle svg {
    width:15px;
    height:15px
  }

  .nav .nav-services .submenu,
  .nav .nav-contact .submenu {
    display:none;
    position:static;
    flex-basis:100%;
    min-width:0;
    margin:0 0 8px 12px;
    padding:0 0 0 13px;
    border:0;
    border-left:2px solid #c7e9fa;
    border-radius:0;
    box-shadow:none
  }

  .nav .nav-services.open .submenu,
  .nav .nav-contact.open .submenu {
    display:block
  }

  .nav .submenu a {
    padding:9px 12px;
    font-size:14px
  }

  .hero {
    min-height:480px
  }

  .hero-photo {
    left:32%;
    background-position:48% center
  }

  .hero-photo:before {
    background: var(--hero-fade-tablet)
  }

  .hero-content {
    max-width:none
  }

  .hero h1 {
    font-size:clamp(39px,5.1vw,53px)
  }

  .section-heading-row h2 {
    font-size:34px
  }

  .service-row {
    grid-template-columns:80px minmax(195px,1fr) minmax(175px,1fr) 25px;
    gap:12px;
    padding:14px 18px
  }

  .service-icon {
    width:66px;
    height:66px
  }

  .service-icon svg,.service-icon img {
    width:41px;
    height:41px
  }

  .service-row h3 {
    font-size:17px
  }

  .service-row p {
    font-size:12px
  }

  .about-photo {
    left:35%
  }

  .about-copy {
    max-width:470px
  }

}

@media(max-width:650px) {
  :root {
    --section-space:50px
  }

  .whatsapp-float {
    right:16px;
    bottom:16px;
    display:grid;
    place-items:center;
    width:52px;
    height:52px;
    box-shadow:none
  }

  .whatsapp-float:hover {
    box-shadow:none
  }

  .whatsapp-float img {
    width:42px;
    height:42px;
    filter:drop-shadow(0 5px 8px #05285738)
  }

  .section-intro-grid {
    grid-template-columns:1fr
  }

  .section-intro-grid h2 {
    padding-right:0
  }

  .section-intro-grid > p {
    margin-top:25px;
    padding:25px 0 0;
    border-left:0;
    border-top:1px solid #b8d8ef
  }

  .container {
    width:min(100% - 38px,1280px)
  }

  .site-header {
    height:64px
  }

  .header-inner {
    gap:5px
  }

  .brand {
    width:clamp(124px,40vw,177px)
  }

  .header-cta {
    display:none
  }

  .menu-toggle {
    flex:none;
    width:36px;
    margin-left:auto
  }

  .nav {
    top:64px;
    max-height:calc(100vh - 64px);
    padding-inline:20px
  }

  .nav.open .nav-cta {
    display:flex;
    align-self:stretch;
    margin-top:16px;
    min-height:45px;
    padding:0 20px;
    color:#fff;
    font-size:13px;
    text-align:center
  }

  .nav.open .nav-cta:hover {
    color:#fff
  }

  .nav.open .nav-cta::after {
    display:none
  }

  .hero {
    padding-top:310px;
    min-height:0;
    align-items:end;
    background:#f8fcff
  }

  .hero-photo {
    height:340px;
    inset:0 0 auto 0;
    background-position:51% 44%
  }

  .hero-photo:before {
    background: var(--hero-fade-bottom)
  }

  .hero-content {
    padding-bottom:0
  }

  .hero-eyebrow {
    font-size:8px;
    white-space:nowrap
  }

  .hero h1 {
    font-size:clamp(34px,9vw,50px);
    line-height:1.02;
    margin-top:18px
  }

  .hero-lead {
    font-size:14px
  }

  .desktop-break {
    display:none
  }

  .hero-actions {
    flex-wrap:wrap
  }

  .hero-actions .button {
    font-size:12px;
    padding-inline:16px
  }

  .facts {
    padding:21px 0
  }

  .facts-inner {
    grid-template-columns:1fr;
    gap:18px
  }

  .fact {
    justify-content:flex-start;
    gap:15px
  }

  .fact+.fact {
    border-left:0;
    border-top:1px solid #c8dce9;
    padding-top:18px
  }

  .fact>svg,.fact>img {
    width:33px;
    height:33px
  }

  .fact strong {
    font-size:13px
  }

  .fact p span {
    font-size:11px
  }

  .section-label {
    font-size:8px;
    margin-bottom:15px
  }

  .section-label>span {
    width:31px
  }

  .section-heading-row {
    display:block;
    margin-bottom:22px
  }

  .section-heading-row h2 {
    font-size:clamp(29px,8vw,38px)
  }

  .section-heading-row p {
    font-size:13px;
    line-height:1.5;
    margin-bottom:16px
  }

  .all-services {
    font-size:12px
  }

  .service-row {
    grid-template-columns:58px 1fr 24px;
    gap:12px;
    min-height:96px;
    padding:16px 14px
  }

  .service-icon {
    width:54px;
    height:54px
  }

  .service-icon svg,.service-icon img {
    width:33px;
    height:33px
  }

  .service-row h3 {
    font-size:16px;
    line-height:1.28
  }

  .service-row p {
    grid-column:2;
    grid-row:2;
    font-size:11px;
    margin-top:-5px
  }

  .row-arrow {
    grid-column:3;
    grid-row:1/3;
    width:21px;
    height:21px
  }

  .contact-inner {
    display:block
  }

  .contact .eyebrow {
    line-height:1.6
  }

  .contact h2 {
    font-size:24px;
    margin-bottom:23px
  }

  .footer-main {
    grid-template-columns:1fr;
    gap:36px;
    padding:50px 0 60px
  }

  .footer-about {
    grid-column:auto
  }

  .footer-brand {
    width:195px
  }

  .footer-intro {
    margin:20px 0 0;
    font-size:14px
  }

  .footer-nav h2 {
    margin-bottom:18px;
    font-size:16px
  }

  .footer-nav ul {
    gap:12px
  }

  .footer-nav a {
    font-size:13px
  }

  .footer-bottom {
    flex-direction:column;
    align-items:flex-start;
    gap:13px;
    padding-block:45px 28px
  }

}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }

  *,*:before,*:after {
    transition:none!important
  }

}

@media(max-width:650px) {
  .hero {
    min-height:clamp(700px,165vw,850px);
    padding-block:50px;
    align-items:flex-start;
    background:#eaf7ff
  }

  .hero-photo {
    inset:0;
    height:auto;
    background-image:url('../assets/images/hero-team-mobile.webp?v=20261019.6');
    background-position:center center;
    background-size:cover
  }

  .hero-photo:before {
    background: var(--hero-fade-mobile)
  }

  .hero-content {
    padding-bottom:0
  }

}

@media(max-width:650px) {
  .about {
    min-height:clamp(550px, 140vw, 600px);
    padding-block:50px;
    background:#eef9ff
  }

  .about-photo {
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    background-image:url('../assets/images/office-building-mobile.webp?v=20261019.6');
    background-position:center bottom;
    background-size:cover;
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,transparent 40%,#0002 55%,#0007 72%,#000b 86%,#000 100%);
    mask-image:linear-gradient(180deg,transparent 0%,transparent 40%,#0002 55%,#0007 72%,#000b 86%,#000 100%)
  }

}

/* Shared section typography across all pages. */
:root {
  --section-h2-size:clamp(34px,3.8vw,44px);
  --section-p-size:16px
}

body main section.section-pad h2 {
  font-size:var(--section-h2-size)
}

body main section.section-pad p {
  font-size:var(--section-p-size)
}

@media(max-width:900px) {
  :root {
    --section-h2-size:34px;
    --section-p-size:15px
  }

}

@media(max-width:650px) {
  :root {
    --section-h2-size:30px;
    --section-p-size:14px
  }

}

@media(min-width:901px) and (max-width:1100px) {
  body main section.hero h1,
  body main section[class*="-hero"] h1 {
    width:min(100%,600px);
    max-width:600px
  }
}

@media(min-width:651px) and (max-width:900px) {
  body main section.hero h1,
  body main section[class*="-hero"] h1 {
    width:min(100%,500px);
    max-width:500px
  }
}
