/* The launch stub at qrok.uz, /uz/ and /en/ (templates/home.hbs). */
:root{
  --ground:#F2F5F4; --card:#FFFFFF; --line:#D2DDDB;
  --ink:#0E1A1C; --dim:#5C7072;
  --ishkor:#12787E; --ishkor-soft:#12787E14;
  --shadow:0 1px 2px rgba(14,26,28,.05), 0 18px 50px -28px rgba(14,26,28,.4);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ground:#08100F; --card:#101A1A; --line:#213130;
    --ink:#E6EEEC; --dim:#8CA3A2;
    --ishkor:#43B0AE; --ishkor-soft:#43B0AE1c;
    --shadow:0 1px 2px rgba(0,0,0,.5), 0 20px 55px -30px rgba(0,0,0,.9);
  }
}
:root[data-theme="dark"]{
  --ground:#08100F; --card:#101A1A; --line:#213130;
  --ink:#E6EEEC; --dim:#8CA3A2;
  --ishkor:#43B0AE; --ishkor-soft:#43B0AE1c;
  --shadow:0 1px 2px rgba(0,0,0,.5), 0 20px 55px -30px rgba(0,0,0,.9);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background:var(--ground); color:var(--ink);
  font:400 16px/1.6 "Golos Text","Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  display:flex; align-items:center; justify-content:center; padding:28px 20px;
  background-image:radial-gradient(60% 55% at 50% 0%, var(--ishkor-soft), transparent 70%);
}
main{
  width:100%; max-width:560px; background:var(--card); border:1px solid var(--line);
  border-radius:22px; padding:clamp(30px,6vw,48px); box-shadow:var(--shadow); text-align:center;
}
.mark{
  display:inline-flex; align-items:center; gap:10px;
  font:700 clamp(30px,7vw,42px)/1 "Unbounded","Golos Text",sans-serif; letter-spacing:-.02em;
}
.mark img{width:.9em; height:.9em; flex:none; display:block}
h1{
  margin:26px 0 0; font:600 clamp(19px,3.6vw,23px)/1.35 "Golos Text",sans-serif;
  letter-spacing:-.01em; text-wrap:balance;
}
.sub{margin:12px 0 0; color:var(--dim); font-size:15.5px; text-wrap:balance}
.soon{
  display:inline-block; margin-top:26px; padding:9px 18px; border-radius:999px;
  background:var(--ishkor-soft); color:var(--ishkor); border:1px solid var(--ishkor);
  font-weight:500; font-size:14px; letter-spacing:.01em;
}
.promise{
  margin:30px 0 0; padding-top:22px; border-top:1px solid var(--line);
  color:var(--dim); font-size:14.5px; text-wrap:balance;
}
.promise b{color:var(--ink); font-weight:600}
.langs{display:flex; gap:6px; justify-content:center; margin-top:26px}
.langs a{
  font:500 13px/1 "Golos Text",sans-serif; color:var(--dim); background:transparent;
  border:1px solid transparent; border-radius:999px; padding:7px 13px; text-decoration:none;
}
.langs a[aria-current="true"]{color:var(--ishkor); border-color:var(--line); background:var(--ishkor-soft)}
.langs a:hover{color:var(--ink)}
.langs a:focus-visible{outline:2px solid var(--ishkor); outline-offset:2px}
@media (prefers-reduced-motion:no-preference){
  main{animation:rise .5s cubic-bezier(.2,.7,.3,1) both}
  @keyframes rise{from{opacity:0; transform:translateY(10px)} to{opacity:1; transform:none}}
}

/* 404 (templates/notfound.hbs) */
.notfound .mark { color: var(--ink); text-decoration: none }
.notfound .code { margin: 22px 0 0; font: 700 clamp(46px, 11vw, 64px)/1 "Unbounded", "Golos Text", sans-serif; color: var(--ishkor); letter-spacing: -.02em }
.notfound h1 { margin-top: 14px }
.nav-links { margin: 20px 0 0; font-size: 15px; line-height: 2; text-wrap: balance; color: var(--dim) }
.nav-links a, .notfound .promise a { color: var(--ishkor); font-weight: 500; text-decoration: none; white-space: nowrap }
.nav-links a:hover, .notfound .promise a:hover { text-decoration: underline }

/* Offer and privacy links under the language switch. */
.legal { margin: 18px 0 0; font-size: 13px; color: var(--dim) }
.legal a { color: var(--dim); text-decoration: none }
.legal a:hover { text-decoration: underline }
