@font-face {
  font-family:Manrope;
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url('/assets/fonts/manrope-latin.woff2') format('woff2');
}

/* Brand palette and base layout */
:root {
  color-scheme:dark;
  --background:#080c11;
  --cyan:#60e4f5;
  --text:#f0f5f7;
  --muted:#9aaab6;
}

* {
  box-sizing:border-box;
}

html {
  min-width:280px;
  background:var(--background);
}

body {
  margin:0;
  min-height:100svh;
  display:flex;
  flex-direction:column;
  color:var(--text);
  font-family:Inter,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  isolation:isolate;
}

a,button {
  -webkit-tap-highlight-color:transparent;
}

a {
  color:inherit;
}

a:focus-visible,button:focus-visible {
  outline:2px solid var(--cyan);
  outline-offset:6px;
}

.atmosphere {
  position:fixed;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  z-index:-1;
  background:radial-gradient(ellipse at 85% 80%,#073742 0,transparent 52%),radial-gradient(ellipse at 5% 20%,#0b2833 0,transparent 45%),var(--background);
}

.ambient {
  position:absolute;
  border-radius:50%;
  filter:blur(70px);
  opacity:.4;
  will-change:transform;
  animation:ambient-drift 24s ease-in-out infinite alternate;
}

.ambient-one {
  width:55vw;
  height:55vw;
  left:-30vw;
  top:-10vw;
  background:#08748d;
}

.ambient-two {
  width:50vw;
  height:45vw;
  right:-23vw;
  bottom:-20vw;
  background:#006e83;
  animation-delay:-12s;
}

#contours {
  width:100%;
  height:100%;
  display:block;
  position:absolute;
  inset:0;
}

.vignette {
  position:absolute;
  inset:0;
  background:radial-gradient(ellipse at 50% 44%,rgba(8,12,17,.87) 0,rgba(8,12,17,.68) 25%,rgba(8,12,17,.1) 65%,rgba(8,12,17,.2)),linear-gradient(0deg,rgba(8,12,17,.7),transparent 22%,transparent 86%,rgba(8,12,17,.35));
}

.grain {
  position:absolute;
  inset:0;
  opacity:.032;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.8' d='M0 0h180v180H0z'/%3E%3C/svg%3E");
}

.site-footer {
  display:flex;
  align-items:center;
  justify-content:center;
  width:68.25vw;
  margin:0 auto;
}

main {
  flex:1;
  display:grid;
  place-items:center;
  padding:74px 24px 84px;
  min-height:550px;
}

.hero {
  text-align:center;
  max-width:1260px;
  width:100%;
  animation:arrive 1.2s ease-out both;
}

.eyebrow {
  margin:0 0 28px;
  color:#a2cbd2;
  font-size:10px;
  letter-spacing:3px;
  font-weight:500;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:13px;
}

.eyebrow>span {
  width:23px;
  height:1px;
  background:var(--cyan);
  box-shadow:0 0 10px #60e4f566;
}

h1,.footer-wordmark {
  font-family:Manrope,Inter,Arial,sans-serif;
  line-height:1.08;
  letter-spacing:-.065em;
  font-weight:800;
  color:#e5f9ff;
  text-shadow:0 2px 36px #4cc5f00a;
}

h1 {
  font-size:clamp(46px,10.5vw,148px);
  margin:0 0 26px;
}

h1 span,.footer-wordmark span {
  background:linear-gradient(135deg,#b8f6ff 5%,#48d6ef 48%,#1596be 100%);
  background-clip:text;
  -webkit-background-clip:text;
  color:transparent;
}

.description {
  font-size:14px;
  color:var(--muted);
  line-height:1.85;
  margin:0 auto 34px;
  letter-spacing:.1px;
}

.shop-links {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
}

.button {
  min-height:54px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:29px;
  padding:16px 25px;
  border:1px solid transparent;
  border-radius:7px;
  text-decoration:none;
  font-size:13px;
  font-weight:600;
  transition:transform .25s,background .25s,box-shadow .25s,border-color .25s;
}

.button svg {
  width:18px;
  height:18px;
  stroke:currentColor;
  stroke-width:1.5;
  transition:transform .25s;
}

.button-primary {
  color:#06252d;
  background:linear-gradient(115deg,#a2f0f5,#51cee3);
  border-color:#b7f8ff88;
  box-shadow:0 0 28px #3ad4ee16,inset 0 1px 0 #ffffff80;
}

.button-secondary {
  background:#10232b66;
  border-color:#8ac7d03b;
  box-shadow:inset 0 1px 0 #ffffff06;
  backdrop-filter:blur(12px);
}

@media(hover:hover) {
  .button:hover {
    transform:translateY(-3px);
  }
  .button-primary:hover {
    box-shadow:0 6px 36px #3ad4ee35;
  }
  .button-secondary:hover {
    border-color:#8ac7d080;
    background:#18354099;
  }
  .button:hover svg {
    transform:translateX(3px);
  }
  .footer-brand:hover {
    filter:grayscale(0);
    opacity:1;
  }
}

.coming-soon {
  margin:29px 0 0;
  font-size:11px;
  color:#94a5af;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  line-height:1.8;
}

.status-dot {
  width:5px;
  height:5px;
  border-radius:50%;
  background:#71c9cf;
  box-shadow:0 0 8px #71c9cf66;
}

.shop-note {
  color:#becbd1;
  margin-left:2px;
}

.site-footer {
  min-height:64px;
  border-top:1px solid #91d7e112;
  font-size:10px;
  color:#8496a3;
  flex-shrink:0;
}

.footer-brand {
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:44px;
  text-decoration:none;
  filter:grayscale(1);
  opacity:.65;
  transition:filter .35s ease,opacity .35s ease;
}

.footer-brand:focus-visible {
  filter:grayscale(0);
  opacity:1;
}

.footer-wordmark {
  font-size:16px;
}

.copyright {
  font-size:10px;
}

body.motion-paused .ambient {
  animation-play-state:paused;
}

@keyframes ambient-drift {
  to {
    transform:translate3d(9vw,6vh,0) scale(1.15);
  }
}

@keyframes arrive {
  from {
    opacity:0;
    transform:translateY(12px);
  }
  to {
    opacity:1;
    transform:none;
  }
}

@media(min-width:1600px) {
  main {
    padding-block:100px;
  }
  .description {
    font-size:16px;
  }
}

@media(max-width:600px) {
  main {
    min-height:540px;
    padding:64px 20px 70px;
  }
  .eyebrow {
    font-size:8px;
    letter-spacing:1.9px;
    gap:9px;
    margin-bottom:26px;
  }
  h1 {
    font-size:clamp(38px,11.4vw,68px);
    letter-spacing:-.065em;
    margin-bottom:24px;
  }
  .description {
    font-size:12px;
    margin-bottom:28px;
  }
  .shop-links {
    gap:10px;
  }
  .button {
    padding:15px 18px;
    gap:17px;
    font-size:12px;
    min-height:52px;
  }
  .coming-soon {
    flex-wrap:wrap;
    gap:6px;
    font-size:10px;
    max-width:280px;
    margin:25px auto 0;
  }
  .shop-note {
    flex-basis:100%;
    margin-top:-5px;
  }
  .site-footer {
    width:calc((100% - 48px) * .75);
    min-height:72px;
  }
  .ambient {
    filter:blur(45px);
  }
  .vignette {
    background:radial-gradient(ellipse at 50% 45%,#080c11d9,#080c1199 35%,#080c1122 80%);
  }
}

@media(max-width:350px) {
  .shop-links {
    flex-direction:column;
  }
  .button {
    min-width:190px;
  }
  .eyebrow {
    font-size:7px;
    letter-spacing:1.5px;
  }
}

@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    animation:none!important;
    transition:none!important;
  }
  .ambient {
    will-change:auto;
  }
}