:root {
  color-scheme: light;
  --background: #f8f9fc;
  --ink: #102346;
  --text: #526078;
  --blue: #0635c4;
  --yellow: #ffc400;
}
* { box-sizing: border-box; }
html { min-width: 280px; min-height: 100%; background: var(--background); }
body {
  margin: 0;
  min-height: 100vh;
  min-height: 100svh;
  color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  position: relative;
  isolation: isolate;
  overflow-x: hidden;
}
body::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background: radial-gradient(ellipse at 50% 38%, #fff 0%, #fff9 26%, transparent 64%);
  pointer-events: none;
}
.ambient-container { position: fixed; inset: 0; overflow: hidden; pointer-events: none; z-index: -1; }
.ambient {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  z-index: -1;
}
.ambient-one {
  width: 660px;
  height: 660px;
  right: -435px;
  top: -170px;
  border: 1px solid #0635c40d;
  box-shadow: 0 0 0 70px #0635c403, 0 0 0 140px #0635c403;
}
.ambient-two {
  width: 450px;
  height: 450px;
  left: -340px;
  bottom: 0;
  border: 1px solid #d5a61916;
  box-shadow: 0 0 0 60px #ffc40006, 0 0 0 120px #ffc40004;
}
.page {
  width: min(100%, 1120px);
  min-height: 100vh;
  min-height: 100svh;
  padding: 60px 28px 28px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.brand { width: min(390px, 76vw); }
.brand img { width: 100%; height: auto; display: block; }
.message { margin: auto 0; padding: 56px 0 70px; }
.eyebrow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 0 0 23px;
  color: var(--blue);
  font-size: 11px;
  line-height: 1.5;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
}
.eyebrow span { width: 7px; height: 7px; border-radius: 50%; background: var(--yellow); flex-shrink: 0; }
h1 {
  font-size: clamp(68px, 8.5vw, 112px);
  line-height: 1.02;
  font-weight: 750;
  letter-spacing: -6px;
  margin: 0 0 28px;
}
.period { color: var(--yellow); }
.description { font-size: 19px; line-height: 1.65; color: var(--text); margin: 0; font-weight: 400; }
.divider { display: flex; width: 42px; height: 3px; margin: 34px auto 24px; background: #dde3ef; border-radius: 2px; overflow: hidden; }
.divider span { width: 25px; background: var(--blue); }
.closing { margin: 0; color: #69758b; font-size: 13px; line-height: 1.65; }
footer { width: 100%; border-top: 1px solid #e8ecf3; padding-top: 22px; }
footer p { margin: 0; color: #69758b; font-size: 11px; line-height: 1.5; letter-spacing: 1.4px; }
@media (min-width: 1600px) { .page { max-width: 1280px; } }
@media (max-width: 600px) {
  .page { padding: 38px 24px 24px; }
  .brand { width: min(300px, 83vw); }
  .message { padding: 48px 0 58px; }
  .eyebrow { font-size: 10px; letter-spacing: 1.8px; gap: 8px; margin-bottom: 23px; }
  h1 { font-size: clamp(56px, 16vw, 82px); letter-spacing: -3.7px; margin-bottom: 24px; }
  .description { font-size: 16px; line-height: 1.75; max-width: 310px; }
  .desktop-break { display: none; }
  .divider { margin-top: 28px; margin-bottom: 22px; }
  .closing { max-width: 245px; margin: 0 auto; font-size: 12px; }
  .ambient-one { right: -580px; top: -240px; }
  .ambient-two { left: -420px; bottom: 30px; }
  footer { padding-top: 20px; }
  footer p { font-size: 10px; }
}
@media (max-height: 600px) and (min-width: 601px) {
  .page { padding-top: 24px; }
  .brand { width: 260px; }
  .message { padding: 30px 0 36px; }
  h1 { font-size: 72px; margin-bottom: 16px; }
  .eyebrow { margin-bottom: 14px; }
  .divider { margin-top: 22px; margin-bottom: 18px; }
}
