:root {
  color-scheme: light;
  --navy: #102b4e;
  --blue: #0077bd;
  --text: #28323d;
  --muted: #617181;
  --line: #dce5ec;
  --surface: #ffffff;
  --background: #f3f7fa;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--text);
  background: linear-gradient(135deg, #eaf3f8, var(--background) 52%, #e7f1f8);
}

.page {
  width: min(100% - 40px, 760px);
  min-height: 100vh;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 48px 0;
}

.brand { margin: 0 0 26px 8px; }
.logo { display: block; width: 190px; height: auto; max-height: 70px; object-fit: contain; object-position: left center; }

.notice {
  background: var(--surface);
  border: 1px solid var(--line);
  border-left: 6px solid var(--blue);
  border-radius: 8px;
  padding: 46px 48px;
  box-shadow: 0 16px 40px rgba(20, 57, 85, .10);
}

.eyebrow {
  margin: 0 0 12px;
  color: var(--blue);
  font-size: .83rem;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
}

h1 { margin: 0 0 20px; color: var(--navy); font-size: clamp(1.8rem, 4vw, 2.55rem); line-height: 1.15; }
p { font-size: 1.05rem; line-height: 1.65; }
.lead { margin-top: 0; font-size: 1.18rem; }

.contact {
  display: inline-block;
  margin-top: 20px;
  color: var(--navy);
  font-weight: 700;
  text-decoration: none;
  border-bottom: 2px solid var(--blue);
}
.contact:hover, .contact:focus { color: var(--blue); }

footer { padding: 25px 8px 0; color: var(--muted); font-size: .85rem; }

@media (max-width: 560px) {
  .page { width: min(100% - 28px, 760px); padding: 28px 0; }
  .notice { padding: 32px 26px; }
}
