:root {
  --orange: #ff5a14;
  --ink: #080d15;
  --muted: #747474;
  --soft-orange: rgba(255, 115, 43, 0.14);
}

* {
  box-sizing: border-box;
}

html {
  height: 100%;
  background: #fff;
}

body {
  height: 100%;
  margin: 0;
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: 0;
}

.coming-soon {
  position: relative;
  display: flex;
  height: 100vh;
  height: 100dvh;
  max-height: 100vh;
  max-height: 100dvh;
  overflow: hidden;
  flex-direction: column;
  align-items: center;
  background:
    radial-gradient(circle at 50% 27%, rgba(6, 10, 16, 0.09), transparent 6%),
    radial-gradient(circle at 49% 42%, rgba(6, 10, 16, 0.08), transparent 5%),
    linear-gradient(180deg, #fff 0%, #fff 62%, #fff7f3 100%);
}

.hero {
  position: relative;
  z-index: 2;
  display: flex;
  width: min(100%, 820px);
  flex: 1 1 auto;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: clamp(8px, 2dvh, 28px) 24px clamp(8px, 2.5dvh, 32px);
  text-align: center;
  min-height: 0;
}

.brand-logo {
  display: block;
  width: auto;
  max-width: min(580px, 70vw);
  max-height: min(34dvh, 310px);
  height: auto;
  margin: 0 auto clamp(2px, 0.45dvh, 8px);
  object-fit: contain;
  filter: drop-shadow(0 12px 14px rgba(6, 10, 16, 0.12));
}

.eyebrow {
  margin: clamp(-2px, -0.2dvh, 0) 0 clamp(8px, 1.4dvh, 16px);
  color: var(--orange);
  font-size: clamp(13px, 1.65vmin, 18px);
  font-weight: 800;
  letter-spacing: 0.52em;
  text-indent: 0.52em;
  text-transform: uppercase;
}

h1 {
  margin: 0;
  color: #070b13;
  font-size: clamp(32px, 4.2vmin, 54px);
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: -0.02em;
}

.subtitle {
  margin: clamp(10px, 1.6dvh, 22px) 0 0;
  color: var(--muted);
  font-size: clamp(16px, 1.9vmin, 22px);
  font-weight: 500;
  line-height: 1.45;
  max-width: 36em;
}

.footer {
  position: relative;
  z-index: 1;
  flex-shrink: 0;
  width: 100%;
  padding: 0 24px clamp(10px, 2dvh, 22px);
  text-align: center;
}

.waves {
  position: absolute;
  z-index: -1;
  inset: auto -8vw 0;
  height: clamp(100px, 16dvh, 200px);
  pointer-events: none;
}

.wave {
  position: absolute;
  right: -7%;
  bottom: clamp(24px, 4dvh, 48px);
  left: -7%;
  height: clamp(72px, 11dvh, 130px);
  border-radius: 50% 50% 0 0 / 42% 42% 0 0;
  background: var(--soft-orange);
}

.wave-one {
  transform: rotate(5deg) translateY(clamp(28px, 4dvh, 52px));
}

.wave-two {
  bottom: clamp(72px, 10dvh, 110px);
  background: rgba(255, 226, 210, 0.46);
  transform: rotate(-7deg) translateY(clamp(36px, 5dvh, 64px));
}

.copyright {
  margin: 0;
  color: #878787;
  font-size: clamp(13px, 1.5vmin, 17px);
  font-weight: 600;
}

/* Küçük / kısa ekranlarda içerik kesilmesin */
@media (max-width: 720px), (max-height: 640px) {
  .coming-soon {
    height: auto;
    max-height: none;
    min-height: 100vh;
    min-height: 100dvh;
    overflow-y: auto;
  }

  .hero {
    flex: 1 0 auto;
    justify-content: flex-start;
    padding-top: clamp(24px, 6vh, 72px);
    padding-bottom: clamp(24px, 5vh, 56px);
  }

  .brand-logo {
    max-width: min(440px, 92vw);
    max-height: min(36vh, 320px);
    margin-bottom: clamp(6px, 1.2vh, 14px);
  }

  .eyebrow {
    letter-spacing: 0.38em;
    text-indent: 0.38em;
    font-size: clamp(12px, 3.4vw, 16px);
  }

  h1 {
    font-size: clamp(28px, 7.8vw, 46px);
  }

  .subtitle {
    font-size: clamp(16px, 4.2vw, 19px);
  }

  .subtitle br {
    display: none;
  }

  .waves {
    height: clamp(120px, 22vh, 220px);
  }

  .wave {
    height: clamp(88px, 14vh, 150px);
  }
}

@media (max-width: 390px) {
  .brand-logo {
    max-width: min(380px, 94vw);
  }
}