:root {
  color-scheme: dark;
  font-family: "DM Sans", "Segoe UI", sans-serif;
  background: #050609;
  color: #f4f4f8;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-width: 320px;
  min-height: 100svh;
  background: #050609;
}

.landing {
  position: relative;
  isolation: isolate;
  display: flex;
  min-height: 100svh;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 100px 24px 90px;
  background:
    radial-gradient(ellipse at 50% 48%, rgba(21, 22, 34, .36) 0%, rgba(5, 6, 9, 0) 49%),
    #050609;
}

.glow { position: absolute; z-index: -1; width: 460px; height: 460px; border-radius: 50%; filter: blur(110px); pointer-events: none; opacity: .17; }
.glow--blue { top: -320px; left: -220px; background: #176dff; }
.glow--purple { right: -280px; bottom: -320px; background: #762be8; opacity: .2; }
.corner { position: absolute; z-index: -1; width: min(37vw, 380px); opacity: .43; pointer-events: none; }
.corner path { stroke: url(#cornerGradient); stroke-width: 1; }
.corner--top { top: -2px; left: 0; }
.corner--bottom { right: 0; bottom: -2px; }
.corner--top path, .corner--bottom path { stroke: #4774c7; }
.corner--top path:nth-child(2), .corner--bottom path:nth-child(2) { stroke: #625fc7; }
.corner--top path:nth-child(3), .corner--bottom path:nth-child(3) { stroke: #8055be; }

.brand { position: absolute; top: 34px; left: 50%; transform: translateX(-50%); }
.brand-mark { display: block; width: 48px; height: 48px; filter: drop-shadow(0 0 18px rgba(104, 119, 255, .18)); }

.message { width: min(100%, 680px); text-align: center; transform: translateY(-5px); }
.eyebrow { display: flex; align-items: center; justify-content: center; gap: 9px; margin: 0 0 25px; color: #8b8d9a; font-size: 10px; font-weight: 600; letter-spacing: .22em; }
.status-dot { width: 6px; height: 6px; border-radius: 50%; background: #7f8dff; box-shadow: 0 0 10px rgba(127, 141, 255, .75); }
h1 { margin: 0; color: #e9e9ef; font-size: clamp(29px, 4.2vw, 46px); line-height: 1.25; font-weight: 500; letter-spacing: -.045em; }
.owner { margin: 10px 0 0; background: linear-gradient(105deg, #58a6ff 12%, #7888ff 51%, #b56cff 92%); background-clip: text; -webkit-background-clip: text; color: transparent; font-size: clamp(43px, 7.5vw, 76px); line-height: 1.15; font-weight: 700; letter-spacing: -.055em; }
.divider { width: 56px; height: 2px; margin: 31px auto 25px; border-radius: 99px; background: linear-gradient(90deg, #58a6ff, #a56bff); box-shadow: 0 0 16px rgba(112, 121, 255, .3); }
.contact-copy { margin: 0 0 18px; color: #92939f; font-size: 14px; line-height: 1.5; }
.email-button { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 58px; padding: 0 21px; border: 1px solid transparent; border-radius: 12px; background: linear-gradient(#0b0c12, #0b0c12) padding-box, linear-gradient(110deg, rgba(88, 166, 255, .72), rgba(165, 107, 255, .72)) border-box; color: #e0e0eb; text-decoration: none; font-size: 14px; font-weight: 500; letter-spacing: .005em; transition: background .2s ease, transform .2s ease, box-shadow .2s ease; }
.email-button > svg:first-child { width: 19px; height: 19px; flex: none; color: #8c9aff; }
.email-button .external-arrow { width: 15px; height: 15px; color: #777987; transition: color .2s ease, transform .2s ease; }
.email-button:hover { transform: translateY(-2px); background: linear-gradient(#11121c, #11121c) padding-box, linear-gradient(110deg, #58a6ff, #b56cff) border-box; box-shadow: 0 8px 32px rgba(91, 92, 208, .15); }
.email-button:hover .external-arrow { color: #c1a1ff; transform: translate(2px, -2px); }
.email-button:focus-visible { outline: 2px solid #a68aff; outline-offset: 4px; }
.footer { position: absolute; right: 24px; bottom: 28px; left: 24px; display: flex; align-items: center; justify-content: center; gap: 12px; color: #5d5f6a; font-size: 10px; letter-spacing: .04em; }
.footer-rule { width: 3px; height: 3px; border-radius: 50%; background: #666879; }

@media (max-width: 600px) {
  .landing { padding: 100px 20px 100px; }
  .brand { top: 25px; }
  .brand-mark { width: 43px; height: 43px; }
  .message { transform: translateY(-8px); }
  .eyebrow { margin-bottom: 20px; font-size: 9px; }
  h1 { font-size: clamp(27px, 7vw, 37px); }
  .owner { margin-top: 9px; font-size: clamp(42px, 11vw, 59px); }
  .divider { margin-top: 25px; margin-bottom: 21px; }
  .contact-copy { font-size: 13px; }
  .email-button { gap: 9px; min-height: 54px; padding: 0 14px; font-size: clamp(12px, 3.5vw, 14px); }
  .email-button .external-arrow { width: 13px; height: 13px; }
  .corner { width: min(65vw, 310px); opacity: .34; }
  .footer { bottom: 22px; font-size: 9px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}