/* Nanobyte — pre-launch holding page. Standalone: no build step, no runtime
   third-party requests. Fonts are self-hosted (GDPR), tokens copied verbatim
   from the main site's tokens.css so the reveal is visually continuous. */

/* ---- self-hosted fonts ---- */
@font-face{font-family:'Archivo';src:url('fonts/archivo-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:'Archivo';src:url('fonts/archivo-800.woff2') format('woff2');font-weight:800;font-style:normal;font-display:swap;}
@font-face{font-family:'Hanken Grotesk';src:url('fonts/hanken-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Space Mono';src:url('fonts/spacemono-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Commissioner';src:url('fonts/commissioner-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:'Commissioner';src:url('fonts/commissioner-800.woff2') format('woff2');font-weight:800;font-style:normal;font-display:swap;}
@font-face{font-family:'Inter';src:url('fonts/inter-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'JetBrains Mono';src:url('fonts/jetbrains-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;}

:root{
  --bg:#000000;--white:#fff;--soft:rgba(255,255,255,.66);--faint:rgba(255,255,255,.42);
  --purple:#7C6CF7;--purple-2:#6B5AF0;--purple-br:#9a8cff;
  --f-display:'Archivo',system-ui,sans-serif;
  --f-body:'Hanken Grotesk',system-ui,sans-serif;
  --f-mono:'Space Mono',ui-monospace,monospace;
  --gutter:clamp(20px,4.5vw,72px);
}
html[lang="el"]{
  --f-display:'Commissioner',system-ui,sans-serif;
  --f-body:'Inter',system-ui,sans-serif;
  --f-mono:'JetBrains Mono',ui-monospace,monospace;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{background:var(--bg);color:var(--white);font-family:var(--f-body);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button,input{font:inherit;}

.cs-page{position:relative;min-height:100svh;display:grid;place-items:center;
  overflow:hidden;padding:clamp(40px,7vh,80px) var(--gutter);}

/* ---- backdrop ---- */
.cs-fx{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;}
.cs-glow{position:absolute;left:50%;top:44%;translate:-50% -50%;z-index:0;pointer-events:none;
  width:min(1100px,120vw);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(124,108,247,.2),transparent 62%);filter:blur(20px);}
.cs-grid-lines{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:78px 78px;
  -webkit-mask-image:radial-gradient(70% 60% at 50% 45%,#000 30%,transparent 78%);
  mask-image:radial-gradient(70% 60% at 50% 45%,#000 30%,transparent 78%);}

/* ---- language switch ---- */
.cs-lang{position:absolute;top:clamp(18px,3vh,30px);right:var(--gutter);z-index:3;
  display:inline-flex;border:1px solid rgba(255,255,255,.18);border-radius:999px;overflow:hidden;}
.cs-lang a{padding:7px 14px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--faint);transition:background .25s ease,color .25s ease;}
.cs-lang a.on{background:#fff;color:#000;}
.cs-lang a:not(.on):hover{color:#fff;}

/* ---- content ---- */
.cs-inner{position:relative;z-index:1;width:100%;max-width:820px;text-align:center;
  display:flex;flex-direction:column;align-items:center;}
.cs-logo{display:inline-flex;align-items:center;gap:14px;margin-bottom:clamp(34px,6vh,60px);}
.cs-logo img{height:42px;width:auto;}
.cs-logo .cs-word{height:30px;}

.cs-eyebrow{display:inline-flex;align-items:center;gap:10px;
  font-family:var(--f-mono);font-size:11.5px;letter-spacing:.26em;text-transform:uppercase;
  color:var(--purple-br);border:1px solid rgba(124,108,247,.32);border-radius:999px;
  padding:9px 18px;margin-bottom:clamp(24px,4vh,36px);}
.cs-eyebrow i{font-style:normal;opacity:.5;}

.cs-title{font-family:var(--f-display);font-weight:800;
  font-size:clamp(2.15rem,6.2vw,4.4rem);letter-spacing:-.035em;line-height:1.02;text-wrap:balance;}
.cs-title .ac{color:var(--purple-br);}
.cs-sub{margin-top:clamp(20px,3vh,28px);max-width:60ch;color:var(--soft);
  font-size:clamp(1rem,1.25vw,1.14rem);line-height:1.68;text-wrap:pretty;}

/* ---- countdown ---- */
.cs-count{margin-top:clamp(34px,5.5vh,52px);display:flex;align-items:flex-start;gap:clamp(14px,3vw,34px);}
.cs-unit{display:flex;flex-direction:column;align-items:center;gap:9px;min-width:clamp(56px,9vw,84px);}
.cs-num{font-family:var(--f-display);font-weight:700;font-variant-numeric:tabular-nums;
  font-size:clamp(2rem,4.6vw,3.2rem);letter-spacing:-.03em;line-height:1;}
.cs-lab{font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);}
.cs-live{font-family:var(--f-display);font-weight:700;font-size:clamp(1.6rem,3.6vw,2.4rem);
  letter-spacing:-.02em;color:var(--purple-br);}

/* ---- notify ---- */
.cs-notify{margin-top:clamp(34px,5.5vh,52px);width:100%;max-width:520px;}
.cs-lab-inline{display:block;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--faint);margin-bottom:12px;}
.cs-row{display:flex;gap:10px;}
.cs-row input{flex:1;min-width:0;background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.14);border-radius:999px;color:#fff;font-size:1rem;
  padding:14px 20px;outline:0;transition:border-color .25s ease,background .25s ease;}
.cs-row input::placeholder{color:rgba(255,255,255,.34);}
.cs-row input:focus{border-color:var(--purple-br);background:rgba(124,108,247,.07);}
.cs-row button{flex:none;display:inline-flex;align-items:center;gap:10px;background:var(--purple);
  color:#fff;border:0;border-radius:999px;padding:14px 24px;font-weight:600;font-size:.95rem;
  cursor:pointer;transition:background .3s ease;}
.cs-row button svg{width:16px;height:16px;transition:transform .35s cubic-bezier(.22,.61,.36,1);}
.cs-row button:hover{background:var(--purple-2);}
.cs-row button:hover svg{transform:translateX(4px);}
.cs-row button:disabled{opacity:.6;cursor:progress;}
.cs-err{margin-top:10px;font-family:var(--f-mono);font-size:11.5px;letter-spacing:.06em;color:#ff9d97;}
.hp-field{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}

.cs-done{display:none;align-items:center;justify-content:center;gap:12px;color:var(--soft);
  font-size:1rem;line-height:1.5;}
.cs-tick{flex:none;width:34px;height:34px;border-radius:50%;background:rgba(124,108,247,.14);
  border:1px solid var(--purple-br);display:grid;place-items:center;}
.cs-tick svg{width:16px;height:16px;color:var(--purple-br);}
.cs-notify.sent .cs-form{display:none;}
.cs-notify.sent .cs-done{display:flex;}

/* ---- foot ---- */
.cs-foot{margin-top:clamp(44px,7vh,76px);padding-top:clamp(22px,3.5vh,32px);width:100%;
  border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;
  gap:26px;flex-wrap:wrap;text-align:left;}
.cs-foot-block{display:flex;flex-direction:column;gap:8px;}
.cs-foot-lab{font-family:var(--f-mono);font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--faint);}
.cs-foot-txt{color:var(--soft);font-size:.95rem;}
.cs-foot-txt a{color:#fff;border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:2px;
  transition:color .25s ease,border-color .25s ease;}
.cs-foot-txt a:hover{color:var(--purple-br);border-color:var(--purple-br);}
.cs-regions{display:flex;flex-wrap:wrap;gap:8px 14px;}
.cs-regions span{position:relative;}
.cs-regions span + span::before{content:"\00b7";position:absolute;left:-9px;color:var(--faint);}

@media(max-width:620px){
  .cs-eyebrow{flex-direction:column;gap:5px;padding:11px 20px;line-height:1.35;text-align:center;}
  .cs-eyebrow i{display:none;}
  .cs-count{gap:10px;width:100%;justify-content:space-between;}
  .cs-unit{min-width:0;flex:1;}
  .cs-row{flex-direction:column;}
  .cs-row button{justify-content:center;}
  .cs-foot{flex-direction:column;gap:22px;}
  .cs-logo img{height:36px;}
  .cs-logo .cs-word{height:26px;}
  .cs-lang{top:14px;}
}
@media (prefers-reduced-motion:reduce){.cs-row button svg{transition:none;}}
.cs-page a:focus-visible,.cs-page button:focus-visible,.cs-page input:focus-visible{
  outline:2px solid var(--purple-br);outline-offset:3px;}
