@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap");

:root{
  --site-bg:#050505;
  --site-text:#fff;
  --site-muted:rgba(255,255,255,.62);
  --site-line:rgba(255,255,255,.12);
  --site-body:#18181b;
  --site-body-elevated:#222226;
  --site-body-border:rgba(255,255,255,.08);
  --site-ink:#f4f4f5;
  --site-ink-muted:rgba(244,244,245,.58);
  --site-accent:#93c5fd;
  --site-max:1160px;
}

/* Hide stray file-picker UI (e.g. injected by local preview tools) */
input[type="file"]{
  display:none !important;
  visibility:hidden !important;
  position:absolute !important;
  width:0 !important;
  height:0 !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  border:0 !important;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  color:var(--site-text);
  background:var(--site-bg);
}

.landing-hero{
  position:relative;
  isolation:isolate;
  min-height:100vh;
  min-height:100dvh;
  overflow:hidden;
  color:var(--site-text);
  background:var(--site-bg);
}

.landing-hero__bg{
  position:absolute;
  inset:0;
  z-index:0;
  background:#050505;
}

.landing-hero__bg canvas{
  display:block;
  width:100%;
  height:100%;
}

.landing-nav{
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:16px;
  width:min(1280px,calc(100% - 48px));
  margin:28px auto 0;
  padding:10px 16px;
  border:1px solid var(--site-line);
  border-radius:999px;
  background:rgba(0,0,0,.55);
  backdrop-filter:blur(18px);
}

.landing-nav__brand{
  display:flex;
  align-items:center;
  justify-self:start;
  text-decoration:none;
}

.landing-nav__logo{
  display:block;
  height:28px;
  width:auto;
  max-width:min(220px,42vw);
  object-fit:contain;
}

.landing-nav__links{
  display:flex;
  gap:24px;
  align-items:center;
  justify-self:center;
}

.landing-nav__links a{
  color:var(--site-muted);
  text-decoration:none;
  font-size:13px;
  font-weight:500;
  transition:color .18s ease;
}

.landing-nav__links a:hover{
  color:#fff;
}

.landing-nav__tools{
  display:flex;
  align-items:center;
  gap:10px;
  justify-self:end;
}

/* Drawer wraps nav + mobile-only CTA; on wide screens children join the 3-column grid */
.landing-nav__drawer{
  display:contents;
}

.landing-nav__cta--drawer{
  display:none !important;
}

.landing-nav__menu-btn{
  display:none !important;
  flex-shrink:0;
  align-items:center;
  justify-content:center;
  width:40px;
  min-width:40px;
  height:40px;
  margin:0;
  padding:0;
  border:1px solid rgba(255,255,255,.18);
  border-radius:12px;
  background:rgba(0,0,0,.35);
  color:#fff;
  cursor:pointer;
  transition:background .18s ease,border-color .18s ease;
}

.landing-nav__menu-btn:hover{
  border-color:rgba(255,255,255,.32);
  background:rgba(255,255,255,.06);
}

.landing-nav__menu-icon{
  position:relative;
  display:block;
  width:18px;
  height:2px;
  margin:0 auto;
  background:currentColor;
  border-radius:1px;
  transition:transform .2s ease;
}

.landing-nav__menu-icon::before,
.landing-nav__menu-icon::after{
  content:"";
  position:absolute;
  left:0;
  width:18px;
  height:2px;
  background:currentColor;
  border-radius:1px;
  transition:transform .2s ease,top .2s ease;
}

.landing-nav__menu-icon::before{top:-6px}
.landing-nav__menu-icon::after{top:6px}

.landing-nav.is-nav-open .landing-nav__menu-icon{
  background:transparent;
}

.landing-nav.is-nav-open .landing-nav__menu-icon::before{
  top:0;
  transform:rotate(45deg);
}

.landing-nav.is-nav-open .landing-nav__menu-icon::after{
  top:0;
  transform:rotate(-45deg);
}

.landing-nav .lang{
  appearance:none;
  /* Native OS dropdowns inherit light panels on some browsers; force dark picker + readable options */
  color-scheme: dark;
  background:rgba(22,22,26,.94);
  color:#f4f4f5;
  border:1px solid rgba(147,164,229,.42);
  border-radius:999px;
  padding:8px 12px;
  font-size:12px;
  font-weight:500;
  cursor:pointer;
}

.landing-nav .lang:hover,
.landing-nav .lang:focus{
  border-color:rgba(188,206,253,.72);
}

.landing-nav .lang:focus{
  outline:2px solid rgba(147,164,229,.45);
  outline-offset:2px;
}

/* Option list: avoid white tray + pale text on macOS Safari/Chrome */
.landing-nav .lang option{
  background-color:#18181c;
  color:#f4f4f5;
}

.landing-nav__cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:0 18px;
  border-radius:999px;
  background:#fff;
  color:#050505;
  text-decoration:none;
  font-size:13px;
  font-weight:600;
  white-space:nowrap;
  transition:transform .18s ease;
}

.landing-nav__cta:hover{
  transform:translateY(-1px);
}

.landing-hero__content{
  position:relative;
  z-index:2;
  pointer-events:none;
}

.landing-hero__content a,
.landing-hero__content button,
.landing-hero__content select{
  pointer-events:auto;
}

.landing-hero__content{
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  min-height:calc(100vh - 120px);
  min-height:calc(100dvh - 120px);
  max-width:1280px;
  margin:0 auto;
  padding:0 24px 96px;
}

.landing-hero__title{
  margin:0;
  max-width:880px;
  font-size:clamp(40px,7vw,80px);
  line-height:.96;
  letter-spacing:-.055em;
  font-weight:600;
}

.landing-hero__copy{
  margin:24px 0 0;
  max-width:540px;
  color:var(--site-muted);
  font-size:clamp(15px,1.8vw,18px);
  line-height:1.75;
}

.landing-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:32px;
}

.landing-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 24px;
  border-radius:999px;
  text-decoration:none;
  font-size:14px;
  font-weight:600;
  transition:transform .18s ease,background-color .18s ease,border-color .18s ease;
}

.landing-btn:hover{
  transform:translateY(-1px);
}

.landing-btn--primary{
  background:#fff;
  color:#050505;
}

.landing-btn--ghost{
  color:#fff;
  border:1px solid rgba(255,255,255,.22);
  background:transparent;
}

.landing-scroll{
  position:absolute;
  left:50%;
  bottom:28px;
  z-index:2;
  transform:translateX(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  color:rgba(255,255,255,.35);
  font-size:10px;
  letter-spacing:.28em;
  font-weight:600;
}

.landing-scroll::after{
  content:"";
  width:1px;
  height:42px;
  background:linear-gradient(180deg, rgba(255,255,255,.45), transparent);
}

/* —— Main (dark gray) —— */
.site-main{
  position:relative;
  z-index:1;
  margin-top:-28px;
  background:var(--site-body);
  color:var(--site-ink);
  border-radius:28px 28px 0 0;
  overflow:hidden;
  border-top:1px solid var(--site-body-border);
}

.site-wrap{
  max-width:var(--site-max);
  margin:0 auto;
  padding:0 24px;
}

.site-section{
  padding:96px 0;
  border-bottom:1px solid var(--site-body-border);
}

.site-section--message{
  background:var(--site-body-elevated);
}

.site-section__eyebrow{
  margin:0 0 14px;
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--site-ink-muted);
  font-weight:600;
}

.site-section__title{
  margin:0 0 18px;
  font-size:clamp(28px,4vw,40px);
  line-height:1.08;
  letter-spacing:-.04em;
  font-weight:600;
}

.site-section__lead{
  margin:0 0 32px;
  max-width:640px;
  color:var(--site-ink-muted);
  font-size:17px;
  line-height:1.8;
}

.site-prose{
  display:grid;
  gap:14px;
  max-width:680px;
  color:rgba(244,244,245,.78);
  font-size:15px;
  line-height:1.9;
}

.site-prose p{
  margin:0;
}

/* About: intro + pillars */
.site-about{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
  gap:48px;
  align-items:start;
}

.site-pillars{
  display:grid;
  gap:12px;
}

.site-pillar{
  padding:22px 24px;
  border-radius:18px;
  background:rgba(255,255,255,.03);
  border:1px solid var(--site-body-border);
  transition:border-color .18s ease,background-color .18s ease;
}

.site-pillar:hover{
  background:rgba(255,255,255,.05);
  border-color:rgba(255,255,255,.14);
}

.site-pillar__index{
  display:block;
  margin-bottom:10px;
  font-size:11px;
  letter-spacing:.12em;
  color:var(--site-accent);
  font-weight:600;
}

.site-pillar h3{
  margin:0 0 8px;
  font-size:16px;
  font-weight:600;
  letter-spacing:-.02em;
}

.site-pillar p{
  margin:0;
  color:var(--site-ink-muted);
  font-size:13px;
  line-height:1.75;
}

/* CEO message */
.site-message{
  display:grid;
  grid-template-columns:minmax(180px,240px) minmax(0,1fr);
  gap:40px;
  align-items:start;
}

.site-message__photo{
  display:block;
  width:100%;
  max-width:240px;
  aspect-ratio:3/2;
  object-fit:cover;
  object-position:center;
  border-radius:20px;
  border:1px solid var(--site-body-border);
  background:#111;
}

.site-message__quote{
  margin:0 0 28px;
  padding:0 0 0 20px;
  border-left:2px solid rgba(147,197,253,.5);
  font-size:clamp(18px,2.5vw,24px);
  line-height:1.55;
  letter-spacing:-.02em;
  font-weight:500;
  color:var(--site-ink);
}

.site-message__sign{
  margin-top:28px;
  padding-top:20px;
  border-top:1px solid var(--site-body-border);
}

.site-message__role{
  margin:0;
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--site-ink-muted);
  font-weight:600;
}

.site-message__name{
  margin:6px 0 0;
  font-size:18px;
  font-weight:600;
  letter-spacing:-.02em;
}

/* Regions */
.site-region-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}

.site-links-subtitle{
  margin:36px 0 14px;
  font-size:13px;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--site-ink-muted);
}

.site-links-subtitle:first-of-type{
  margin-top:10px;
}

.site-region-card{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-height:180px;
  padding:24px;
  border-radius:20px;
  background:rgba(255,255,255,.03);
  border:1px solid var(--site-body-border);
  text-decoration:none;
  color:inherit;
  transition:transform .18s ease,border-color .18s ease,background-color .18s ease;
}

.site-region-card:hover{
  transform:translateY(-2px);
  background:rgba(255,255,255,.05);
  border-color:rgba(255,255,255,.16);
}

.site-region-card[data-region-soon]{
  cursor:default;
  opacity:.65;
}

.site-region-card[data-region-soon]:hover{
  transform:none;
  background:rgba(255,255,255,.03);
}

.site-region-card__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.site-region-card__code{
  font-size:11px;
  font-weight:700;
  letter-spacing:.14em;
  color:var(--site-accent);
}

.site-region-card__locale{
  font-size:11px;
  color:var(--site-ink-muted);
}

.site-region-card h3{
  margin:4px 0 0;
  font-size:22px;
  letter-spacing:-.03em;
  font-weight:600;
}

.site-region-card p{
  margin:0;
  flex:1;
  color:var(--site-ink-muted);
  font-size:14px;
  line-height:1.7;
}

.site-region-card__link{
  margin-top:8px;
  font-size:13px;
  font-weight:600;
  color:var(--site-accent);
}

.site-region-card[data-region-soon] .site-region-card__link{
  color:var(--site-ink-muted);
}

/* Footer */
.site-footer{
  padding:40px 0 56px;
  border-top:1px solid var(--site-body-border);
}

.site-footer__inner{
  display:flex;
  align-items:flex-start;
  gap:28px;
}

.site-footer__logo{
  height:24px;
  width:auto;
  max-width:200px;
  object-fit:contain;
  flex-shrink:0;
  opacity:.88;
}

.site-footer p{
  margin:0 0 8px;
  color:var(--site-ink-muted);
  font-size:13px;
  line-height:1.75;
  max-width:640px;
}

.site-footer p:last-child{
  margin-bottom:0;
}

@media (max-width:960px){
  .landing-nav{
    width:calc(100% - 28px);
    margin-top:14px;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:12px 10px;
    border-radius:22px;
    padding:12px 14px;
  }

  .landing-nav__brand{
    flex:1;
    min-width:0;
    justify-self:unset;
  }

  .landing-nav__drawer{
    display:none;
    flex-basis:100%;
    flex-direction:column;
    align-items:stretch;
    gap:4px;
    order:3;
    margin:4px -2px 0;
    padding:12px 2px 4px;
    border-top:1px solid rgba(255,255,255,.12);
  }

  .landing-nav.is-nav-open .landing-nav__drawer{
    display:flex;
  }

  .landing-nav__links{
    flex-direction:column;
    align-items:stretch;
    gap:4px;
    justify-self:unset;
  }

  .landing-nav__links a{
    padding:12px 4px;
    font-size:15px;
    border-radius:10px;
  }

  .landing-nav__links a:hover{
    color:#fff;
    background:rgba(255,255,255,.06);
  }

  .landing-nav__tools{
    flex-shrink:0;
    justify-self:unset;
    gap:8px;
  }

  .landing-nav__cta--toolbar{
    display:none !important;
  }

  .landing-nav__cta--drawer{
    display:inline-flex !important;
    width:100%;
    margin-top:8px;
    justify-content:center;
  }

  .landing-nav__menu-btn{
    display:inline-flex !important;
  }

  .landing-scroll{
    display:none;
  }

  .site-about{
    grid-template-columns:1fr;
    gap:36px;
  }

  .site-message{
    grid-template-columns:1fr;
  }

  .site-message__photo{
    max-width:280px;
  }

  .site-region-grid{
    grid-template-columns:1fr;
  }

  .site-footer__inner{
    flex-direction:column;
    gap:20px;
  }
}

@media (max-width:680px){
  .landing-hero__title{
    font-size:34px;
  }

  .site-section{
    padding:72px 0;
  }

  .site-wrap{
    padding:0 16px;
  }

  .landing-nav__logo{
    height:24px;
  }
}