:root {
  --navy: #063d73;
  --navy-dark: #032d55;
  --blue: #0876c9;
  --orange: #f47b20;
  --orange-light: #ffad28;
  --yellow: #ffc21c;
  --text: #102f4b;
  --muted: #72808c;
}

* {
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  overflow: hidden;
}

body {
  font-family: "Manrope", sans-serif;
  color: var(--text);
  background: #fffaf2;
}

a {
  text-decoration: none;
}

.coming-soon {
  position: relative;
  width: 100%;
  height: 100svh;
  min-height: 520px;
  overflow: hidden;
  isolation: isolate;
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(circle at 50% 35%, rgba(255, 255, 255, .95) 0%, rgba(255, 250, 242, .78) 35%, transparent 65%),
    radial-gradient(circle at 8% 90%, rgba(255, 194, 28, .10), transparent 25%),
    radial-gradient(circle at 94% 15%, rgba(8, 118, 201, .09), transparent 25%),
    linear-gradient(135deg, #fffdf9 0%, #fff8eb 52%, #f6fbff 100%);
}

.coming-soon::before {
  content: "";
  position: absolute;
  z-index: -3;
  width: min(60vw, 900px);
  height: min(60vw, 900px);
  border-radius: 50%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(6, 61, 115, .045);
  box-shadow:
    0 0 0 55px rgba(6, 61, 115, .018),
    0 0 0 110px rgba(6, 61, 115, .012);
}

.coming-soon::after {
  content: "";
  position: absolute;
  z-index: -4;
  width: 100%;
  height: 100%;
  inset: 0;
  background:
    radial-gradient(circle at 50% 55%, rgba(244, 123, 32, .035), transparent 30%);
  pointer-events: none;
}

.center-content {
  width: min(94%, 1500px);
  max-height: calc(100svh - 70px);
  position: relative;
  z-index: 5;
  padding: 20px 15px 35px;
}

/* Two-column landing layout */
.left-column,
.right-column {
  display: flex;
  align-items: center;
  justify-content: center;
}

.column-inner {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}



.right-column .column-inner {
  padding-left: clamp(0px, 2vw, 35px);
}

/* Logo is intentionally the first element */
.brand {
  display: block;
  margin-bottom: clamp(13px, 2vh, 25px);
}

.brand img {
  display: block;
  width: 60%;
  height: auto;
  margin: 0 auto;
  margin-bottom: 19px;
}

.eyebrow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  color: var(--orange);
  font-size: clamp(8px, .65vw, 12px);
  font-weight: 800;
  letter-spacing: .19em;
}

.eyebrow span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--orange);
  box-shadow: 0 0 0 5px rgba(244, 123, 32, .09);
}

h1 {
  margin: clamp(12px, 1.8vh, 22px) 0 clamp(10px, 1.5vh, 18px);
  color: var(--navy-dark);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: clamp(42px, 5vw, 82px);
  line-height: .98;
  letter-spacing: normal;
  font-weight: 800;
}

h1 strong {
  color: transparent;
  background: linear-gradient(90deg, var(--orange), var(--orange-light));
  -webkit-background-clip: text;
  background-clip: text;
}

.intro {
  width: min(100%, 620px);
  margin: 18px auto 0px;
  color: var(--muted);
  font-size: clamp(11px, 1.9vw, 15px);
  line-height: 1.7;
}

.hero-status {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin-top: clamp(12px, 1.8vh, 20px);
  color: #456176;
  font-size: clamp(10px, 9.62vw, 14px);
  font-weight: 700;
}

.status-dot,
.pulse-dot {
  position: relative;
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 50%;
  background: var(--orange);
}

.status-dot::after,
.pulse-dot::after {
  content: "";
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 1px solid rgba(244, 123, 32, .35);
  animation: pulse 1.8s infinite;
}

@keyframes pulse {
  0% {
    transform: scale(.7);
    opacity: 1;
  }

  100% {
    transform: scale(1.8);
    opacity: 0;
  }
}

.countdown-card {
  width: min(100%, 690px);
  margin-top: clamp(18px, 2.8vh, 32px);
  padding: clamp(18px, 2.2vw, 30px) clamp(20px, 3vw, 42px);
  border: 1px solid rgba(255, 255, 255, .9);
  border-radius: clamp(20px, 1.8vw, 30px);
  background: rgba(255, 255, 255, .72);
  box-shadow: 0 25px 65px rgba(3, 45, 85, .12);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.card-label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: var(--navy);
  font-size: clamp(8px, .62vw, 11px);
  font-weight: 800;
  letter-spacing: .16em;
}

.countdown-grid {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr;
  align-items: center;
  gap: clamp(5px, .8vw, 12px);
  margin-top: clamp(15px, 2.4vh, 25px);
}

.time-item {
  min-width: 0;
  padding: clamp(11px, 1.2vw, 19px) 5px;
  border-radius: clamp(11px, .8vw, 16px);
  background: rgba(255, 255, 255, .92);
  border: 1px solid rgba(6, 61, 115, .065);
  box-shadow: 0 8px 22px rgba(3, 45, 85, .045);
}

.time-item strong {
  display: block;
  color: var(--navy);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: clamp(22px, 2.4vw, 42px);
  line-height: 1;
  letter-spacing: -.06em;
}

.time-item span {
  display: block;
  margin-top: 6px;
  color: #8b959e;
  font-size: clamp(6px, .48vw, 9px);
  font-weight: 800;
  letter-spacing: .11em;
}

.separator {
  color: rgba(6, 61, 115, .25);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: clamp(16px, 1.6vw, 27px);
  font-weight: 700;
}

/* No process/progress line */
.progress-wrap,
.progress-track,
.launch-note {
  display: none !important;
}

.contact-row {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: clamp(15px, 2.2vh, 23px);
}

.contact-row a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: #526878;
  font-size: clamp(8px, 3.62vw, 12px);
  font-weight: 700;
  transition: .2s ease;

}

.contact-row a:hover {
  color: var(--orange);
}

.contact-row i {
  color: var(--orange);
}

.contact-divider {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #aab4bb;
}

.site-footer {
  position: absolute;
  z-index: 10;
  left: 0;
  bottom: clamp(12px, 2vh, 22px);
  width: 100%;
  text-align: center;
  color: #171818;
  font-size: clamp(7px, 2.5vw, 10px);
  font-weight: 600;
}

.background-shape {
  position: absolute;
  z-index: -1;
  pointer-events: none;
  border-radius: 50%;
}

.shape-one {
  width: clamp(90px, 11vw, 190px);
  height: clamp(90px, 11vw, 190px);
  left: -4%;
  top: 22%;
  background: rgba(255, 194, 28, .09);
}

.shape-two {
  width: clamp(30px, 3vw, 58px);
  height: clamp(40px, 4vw, 75px);
  right: 9%;
  top: 17%;
  border-radius: 70% 30% 60% 40% / 55% 45% 55% 45%;
  transform: rotate(45deg);
  background: linear-gradient(145deg, rgba(255, 194, 28, .45), rgba(244, 123, 32, .28));
}

.shape-three {
  width: clamp(22px, 2.5vw, 45px);
  height: clamp(28px, 3vw, 58px);
  left: 10%;
  bottom: 18%;
  border-radius: 70% 30% 60% 40% / 55% 45% 55% 45%;
  transform: rotate(45deg);
  background: rgba(8, 118, 201, .10);
}

/* Keep the two-column layout on large screens, stack on smaller screens */
@media (max-width: 991px) {
  .center-content {
    width: min(94%, 760px);
    max-height: calc(100svh - 60px);
    padding: 15px 10px 30px;
  }

  .left-column .column-inner,
  .right-column .column-inner {
    padding-left: 0;
    padding-right: 0;
  }

  .right-column {
    margin-top: 0;
  }
}

/* Tablet */
@media (max-width: 991px) {
  .center-content {
    width: min(94%, 760px);
  }

  .brand img {
    width: 60%;
  }

  h1 {
    font-size: clamp(40px, 8vw, 65px);
  }

  .intro {
    max-width: 570px;
  }

  .countdown-card {
    width: min(100%, 620px);
  }
}

/* Mobile */
@media (max-width: 767px) {
  .coming-soon {
    min-height: 560px;
  }

  .center-content {
    width: calc(100% - 20px);
    max-height: calc(100svh - 55px);
    padding: 10px 5px 25px;
  }

  .brand {
    margin-bottom: 12px;
  }

  .brand img {
    width:60%;
  }

  .eyebrow {
    font-size: 7px;
    letter-spacing: .13em;
  }

  .eyebrow span {
    width: 5px;
    height: 5px;
  }

  h1 {
    font-size: clamp(36px, 12vw, 54px);
    margin-top: 12px;
  }

  .intro {
    max-width: 480px;
    font-size: 10px;
    line-height: 1.6;
  }

  .hero-status {
    font-size: 13px;
    margin-top: 12px;
  }

  .countdown-card {
    width: 100%;
    margin-top: 16px;
    padding: 16px 10px;
    border-radius: 18px;
  }

  .card-label {
    font-size: 7px;
  }

  .countdown-grid {
    gap: 3px;
    margin-top: 13px;
  }

  .time-item {
    padding: 11px 2px 9px;
    border-radius: 9px;
  }

  .time-item strong {
    font-size: clamp(18px, 6.7vw, 27px);
  }

  .time-item span {
    margin-top: 5px;
    font-size: 5px;
  }

  .separator {
    font-size: 13px;
  }

  .contact-row {
    gap: 8px 13px;
    margin-top: 12px;
  }

  .contact-row a {
    font-size: 7px;
  }

  .site-footer {
    font-size: 8px;
    bottom: 10px;
  }

  .shape-two {
    right: 2%;
    top: 13%;
  }
}

/* Small phones */
@media (max-width: 380px) {
  .center-content {
    width: calc(100% - 20px);
  }

  .brand img {
    width: 140px;
  }

  h1 {
    font-size: 35px;
  }

  .intro {
    font-size: 11px;
  }

  .countdown-card {
    padding: 14px 7px;
  }

  .time-item strong {
    font-size: 18px;
  }

  .time-item span {
    font-size: 7.5px;
  }

  .separator {
    font-size: 11px;
  }

  .contact-row a {
    font-size: 9.5px;
  }
}

/* 2K */
@media (min-width: 2200px) {
  .center-content {
    width: min(94%, 1500px);
  }

  .brand img {
    width: 60%;
  }

  h1 {
    font-size: 100px;
  }

  .intro {
    max-width: 800px;
    font-size: 18px;
  }

  .hero-status {
    font-size: 13px;
  }

  .countdown-card {
    width: 820px;
    padding: 38px 50px;
  }

  .time-item strong {
    font-size: 52px;
  }

  .time-item span {
    font-size: 10px;
  }

  .contact-row a {
    font-size: 12px;
  }
}

/* 4K */
@media (min-width: 3200px) {
  .center-content {
    width: min(94%, 2300px);
  }

  .brand img {
    width: 60%;
  }

  .eyebrow {
    font-size: 15px;
  }

  h1 {
    font-size: 145px;
  }

  .intro {
    max-width: 1050px;
    font-size: 25px;
  }

  .hero-status {
    font-size: 15px;
  }

  .countdown-card {
    width: 1050px;
    padding: 55px 70px;
    border-radius: 42px;
  }

  .card-label {
    font-size: 14px;
  }

  .countdown-grid {
    gap: 14px;
    margin-top: 30px;
  }

  .time-item {
    padding: 30px 10px 25px;
    border-radius: 22px;
  }

  .time-item strong {
    font-size: 70px;
  }

  .time-item span {
    font-size: 12px;
  }

  .separator {
    font-size: 38px;
  }

  .contact-row {
    margin-top: 28px;
  }

  .contact-row a {
    font-size: 14px;
  }
}

@media (min-width: 3840px) {
  .center-content {
    width: min(94%, 2700px);
  }

  .brand img {
    width: 60%;
  }

  h1 {
    font-size: 165px;
  }

  .intro {
    font-size: 28px;
  }

  .countdown-card {
    width: 1180px;
    padding: 65px 80px;
  }

  .time-item strong {
    font-size: 82px;
  }
}

/* Short-height screens: compact spacing to guarantee one-screen display */
@media (max-height: 720px) {
  .center-content {
    padding-top: 5px;
    padding-bottom: 25px;
  }

  .brand {
    margin-bottom: 8px;
  }

  .brand img {
    width: 86%;
  }

  h1 {
    margin-top: 9px;
    margin-bottom: 8px;
  }

  .intro {
    line-height: 1.45;
  }

  .hero-status {
    margin-top: 8px;
  }

  .countdown-card {
    margin-top: 11px;
    padding-top: 14px;
    padding-bottom: 14px;
  }

  .countdown-grid {
    margin-top: 10px;
  }

  .contact-row {
    margin-top: 23px;
  }

  .site-footer {
    bottom: 7px;
  }
}