:root { color-scheme: dark; --navy: #0c1928; --blue: #1264c6; --sky: #85c5ff; }
*, *::before, *::after { box-sizing: border-box; }
html { min-height: 100%; background: var(--navy); }
body { margin: 0; min-height: 100svh; display: flex; flex-direction: column; color: #fff; font-family: "Segoe UI", Arial, sans-serif; background: radial-gradient(ellipse at 90% 15%, #1a3850 0%, #102337 33%, var(--navy) 70%); border-top: 4px solid var(--blue); }
body::before { content: ""; position: fixed; right: -180px; top: -220px; width: 680px; height: 680px; border: 1px solid #85c5ff12; border-radius: 50%; pointer-events: none; }
.construction { position: relative; width: min(900px, calc(100% - 64px)); margin: auto; padding-block: 62px 56px; }
.brand-panel { width: min(346px, 100%); max-width: 100%; background: #fff; padding: 20px 22px; border: 1px solid #d7dfe6; }
.brand-logo { display: block; width: 100%; height: auto; }
.service-area { margin: 14px 0 0; color: #b9cce0; font-size: 13px; letter-spacing: .045em; }
.notice { margin-top: 56px; }
.eyebrow { display: flex; align-items: center; gap: 12px; margin: 0 0 19px; color: #acd4fc; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.eyebrow > span { width: 32px; height: 2px; background: var(--sky); }
h1 { margin: 0; font-size: clamp(44px, 6vw, 76px); font-weight: 650; line-height: 1.05; letter-spacing: -.045em; }
h1 > span { color: #b9d4ed; }
.intro { margin: 24px 0 0; color: #c2d0dd; font-size: 17px; line-height: 1.7; }
.contact { margin-top: 38px; }
.contact > p { margin: 0 0 12px; color: #c2d0dd; font-size: 13px; }
.contact > a { display: inline-flex; align-items: center; gap: 13px; max-width: 100%; padding: 17px 22px; min-height: 56px; background: var(--blue); color: #fff; text-decoration: none; font-size: 17px; font-weight: 650; }
.contact > a:hover { background: #0d51a3; }
.contact > a:focus-visible { outline: 3px solid var(--sky); outline-offset: 5px; }
.contact svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linejoin: round; }
.arrow { margin-left: 15px; font-size: 23px; line-height: 1; font-weight: 400; }
footer { position: relative; width: min(900px, calc(100% - 64px)); margin: 0 auto; padding: 22px 0 26px; border-top: 1px solid #ffffff19; color: #8ea5bb; font-size: 11px; line-height: 1.6; }
::selection { background: var(--sky); color: var(--navy); }
@media (max-width: 600px) {
  body::before { display: none; }
  .construction { width: calc(100% - 48px); padding-block: 40px 38px; }
  .brand-panel { width: 286px; padding: 17px 19px; }
  .notice { margin-top: 42px; }
  .intro { font-size: 16px; }
  .contact { margin-top: 30px; }
  .contact > a { font-size: 16px; }
  footer { width: calc(100% - 48px); padding-block: 19px 23px; }
}
@media (max-width: 360px) {
  .construction, footer { width: calc(100% - 40px); }
  h1 { font-size: 39px; }
  .contact > a { padding-inline: 16px; }
  .arrow { margin-left: 6px; }
}
@media print {
  body { background: #fff; color: var(--navy); border-top: 0; }
  body::before { display: none; }
  .construction { margin-block: 0; }
  h1 > span, .intro, .service-area, .contact > p, footer, .eyebrow { color: var(--navy); }
  .contact > a { background: #fff; color: var(--navy); border: 1px solid var(--navy); }
}