.home { font-family: Arial, Helvetica, sans-serif; color: #091426; }
.home .wrap { width: min(1350px, 91.3%); }
.home .icon-library { position: absolute; width: 0; height: 0; overflow: hidden; }
.home .icon { display: inline-block; width: 1em; height: 1em; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.home .site-header { background: #041a2d; position: relative; z-index: 2; }
.home .site-header .header-inner { min-height: 57px; padding-block: 0; gap: .8rem; }
.home .header-inner .logo { width: clamp(145px, 18vw, 210px); }
.home nav { width: auto; order: 0; gap: clamp(.65rem, 2.35vw, 2rem); margin-inline-start: auto; padding: 0; }
.home nav a, .nav-menu summary { color: #fff; font-size: .76rem; font-weight: 700; white-space: nowrap; }
.home nav > a { position: relative; padding-block: .7rem; }
.home nav a:hover, .nav-menu summary:hover { color: #71dfff; }
.home nav a[aria-current]::after { content: ""; position: absolute; inset: auto -.35rem 0; height: 2px; background: #15b8ef; }
.nav-menu { position: relative; }
.nav-menu summary { cursor: pointer; display: flex; align-items: center; gap: .28rem; list-style: none; }
.nav-menu summary::-webkit-details-marker { display: none; }
.nav-menu summary .icon { width: .9em; height: .9em; }
.nav-menu.language { margin-inline-start: .4rem; }
.nav-menu.language summary .icon:first-child { width: 1.45em; height: 1.45em; }
.nav-menu div { position: absolute; z-index: 1; top: calc(100% + .8rem); right: 0; min-width: max-content; padding: .4rem; background: #071f36; border: 1px solid #355775; border-radius: 7px; box-shadow: 0 10px 24px #071f3655; }
.nav-menu div a { display: block; padding: .5rem .65rem; }
.home .button { gap: .45rem; background: linear-gradient(105deg, #007dbd, #0055ce); }
.home .button:hover { background: #004ba9; }
.home .button.secondary { background: #071e3588; border-color: #e5eef8; }
.home .header-cta { font-size: .78rem; white-space: nowrap; padding: .43rem .92rem; margin-inline-start: .5rem; }
.home .eyebrow { font-size: .87rem; letter-spacing: .1em; }
.home .eyebrow::before { display: none; }

/* Percentages map the image-only regions of the 1122 × 1402 reference. */
.mock-photo { background-image: url("assets/images/home-design-reference.png"); background-repeat: no-repeat; }
.home .hero { min-height: clamp(415px, 37vw, 535px); background: #092236; border-bottom: 0; }
.home .hero .wrap { padding-block: 37px; }
.hero-art { position: absolute; inset: 0 0 0 auto; width: 53%; height: 100%; z-index: -1; background-size: 191.14% 338.65%; background-position: 100% 6.07%; }
.home .hero::after { background: linear-gradient(90deg, #071d31 0%, #0e293e 36%, #112d40 46%, #0b233aa8 50%, transparent 58%); }
.home .hero h1 { font-size: clamp(2.52rem, 3.78vw, 3.9rem); max-width: none; line-height: .99; margin-block: .7rem .5rem; letter-spacing: -.032em; }
.hero-subtitle { font-size: clamp(1.25rem, 2.2vw, 1.8rem); line-height: 1.1; color: #c4cedc; font-weight: 700; }
.home .hero .promise { font-size: clamp(.98rem, 1.66vw, 1.35rem); margin-top: .85rem; line-height: 1.25; border-inline-start: 4px solid #00adf3; padding-inline-start: .8rem; }
.home .hero .intro { font-size: .94rem; line-height: 1.27; max-width: 51ch; margin-top: .7rem; }
.home .hero .actions { margin-top: 1.2rem; gap: 1.15rem; }
.home .hero .button { font-size: .87rem; padding: .57rem 1.3rem; min-height: 43px; border-radius: 8px; }
.home .hero .button .icon { font-size: 1.25rem; }

.benefits { background: #eaf1f8; }
.benefits ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); list-style: none; margin-block: 0; padding: 20px 0; }
.benefits li { display: flex; justify-content: center; align-items: center; gap: .9rem; padding-inline: .65rem; min-height: 40px; }
.benefits li + li { border-inline-start: 1px solid #cbd8e6; }
.benefits .icon { font-size: clamp(1.55rem, 3.1vw, 2.25rem); }
.benefits strong, .benefits span { display: block; line-height: 1.3; }
.benefits strong { font-size: .96rem; letter-spacing: -.035em; }
.benefits span { font-size: .81rem; margin-top: .26rem; color: #22334a; }

.home-services { background: linear-gradient(#f8fafc, #f2f7fc); padding-block: 28px 32px; }
.home .home-services .wrap { width: min(1380px, 94%); }
.home-services .section-head { text-align: center; margin-bottom: 30px; }
.home-services .eyebrow { justify-content: center; color: #0068e4; gap: 1.45rem; }
.home-services .eyebrow::before, .home-services .eyebrow::after { content: ""; display: block; width: clamp(28px, 6.2vw, 70px); height: 1px; background: #1688ff; }
.home-services h2 { font-size: clamp(1.9rem, 3.7vw, 3.4rem); margin-block: .72rem .5rem; letter-spacing: -.037em; }
.home-services .section-head p:last-child { max-width: 72ch; color: #263a54; margin-inline: auto; font-size: 1.11rem; line-height: 1.34; }
.home-services .grid { gap: clamp(.9rem, 1.9vw, 1.5rem); }
.home-services .card { background: #f9fbfe; border: 0; border-radius: 11px; box-shadow: 0 5px 10px #16355326; }
.card-photo { aspect-ratio: 2.36; }
.photo-av { background-size: 330% 1431%; background-position: 4.48% 57.21%; }
.photo-rack { background-size: 341% 1431%; background-position: 50.06% 57.21%; }
.photo-data { background-size: 331% 1431%; background-position: 95.53% 57.21%; }
.home-services .card-body { position: relative; gap: .34rem; padding: 15px clamp(.8rem, 2vw, 1.5rem) 15px; }
.home-services .card-badge { position: absolute; bottom: calc(100% - 9px); left: clamp(.8rem, 2vw, 1.5rem); width: 49px; aspect-ratio: 1; display: grid; place-items: center; color: white; background: #163550; border: 1px solid #42657c; border-radius: 50%; }
.card-badge .icon { font-size: 1.55rem; }
.home-services h3 { font-size: clamp(1.02rem, 1.91vw, 1.63rem); }
.home-services .card p { font-size: .95rem; color: #21334b; line-height: 1.25; }
.home-services .card a { font-size: .94rem; text-decoration: none; color: #005bce; }
.home-services .card a:hover { text-decoration: underline; }
.partner-note { position: relative; margin-top: 32px; border-radius: 9px; padding: 13px clamp(1.25rem, 5.5vw, 4rem); background: #e5eef7; color: #0c192a; font-size: clamp(.95rem, 1.8vw, 1.28rem); font-weight: 700; }
.partner-note::before { content: ""; position: absolute; inset: 28% auto 28% 4%; width: 4px; background: #0887ee; }

.ownership { position: relative; isolation: isolate; min-height: clamp(266px, 23.7vw, 350px); background: linear-gradient(135deg, #173a56, #00223c 70%); }
.ownership-photo { position: absolute; inset: 0 auto 0 0; width: 40.8%; z-index: -1; background-size: 245.5% 529.1%; background-position: 0 100%; mask-image: linear-gradient(90deg, #000 76%, transparent 100%); }
.ownership-inner { padding: 28px 0 32px 37%; }
.ownership h2 { font-size: clamp(1.62rem, 2.9vw, 2.6rem); margin-block: .5rem 1.4rem; }
.ownership ul { display: grid; grid-template-columns: repeat(5, 1fr); padding: 0; margin: 0; list-style: none; }
.ownership li { display: grid; justify-items: center; align-content: start; gap: .5rem; padding-inline: .5rem; text-align: center; font-size: clamp(.75rem, 1.3vw, .95rem); line-height: 1.1; font-weight: 700; }
.ownership li + li { border-inline-start: 1px solid #3c5c76; }
.ownership li .icon { font-size: 2rem; }

@media (max-width: 880px) {
  .home .site-header .header-inner { padding-block: .45rem; }
  .home nav { order: 3; width: 100%; justify-content: space-between; gap: .35rem .9rem; }
  .home nav > a { padding-block: .35rem; }
  .home .hero::after { background: linear-gradient(90deg, #071d31 28%, #0e293e 44%, #0b233a77 61%, transparent 78%); }
  .home-services .card-body { padding-inline: .8rem; }
  .benefits li { gap: .5rem; justify-content: flex-start; }
}
@media (max-width: 640px) {
  .home .hero { min-height: auto; }
  .hero-art { width: 100%; height: 250px; }
  .home .hero::after { background: linear-gradient(180deg, transparent 105px, #092236 245px); }
  .home .hero .wrap { padding-block: 200px 28px; }
  .home .hero h1 { font-size: clamp(2rem, 8vw, 2.55rem); }
  .home .hero h1 br { display: none; }
  .home .hero .actions { gap: .65rem; }
  .home .hero .button { padding-inline: .85rem; }
  .benefits ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem .35rem; }
  .benefits li:nth-child(3) { border-inline-start: 0; }
  .home-services .grid { grid-template-columns: 1fr; }
  .home-services .card h3 { font-size: 1.3rem; }
  .partner-note { padding-inline-start: 1.5rem; }
  .ownership-photo { width: 100%; height: 225px; mask-image: linear-gradient(#000 60%, transparent); }
  .ownership-inner { padding: 195px 0 30px; }
  .ownership ul { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 1rem; }
  .ownership li:nth-child(4) { border-inline-start: 0; }
}

@media (min-width: 881px) {
  .home .site-header .wrap { width: min(1380px, 95.8%); padding-inline-start: 2.2%; }
  .hero-art { mask-image: linear-gradient(90deg, transparent, #000 15%); }
}
.home-services .eyebrow { width: fit-content; margin-inline: auto; }
.partner-note { overflow: hidden; }
.partner-note::after {
  content: "";
  position: absolute;
  width: 205px;
  height: 85px;
  right: -26px;
  bottom: -46px;
  border-radius: 50%;
  background: repeating-radial-gradient(ellipse at 60% 95%, transparent 0 4px, #2d9af250 5px 6px);
  transform: rotate(-14deg);
  pointer-events: none;
}
@media (max-width: 880px) {
  .partner-note::after { display: none; }
}
