/* ============================================================
   Aurelius — Landing Page
   Faithful production recreation of Landing.dc.html
   ============================================================ */

*{ box-sizing:border-box; -webkit-font-smoothing:antialiased; }
/* `hidden` must beat inline display:flex/inline-flex on the waitlist states */
[hidden]{ display:none !important; }
html,body{ margin:0; scroll-behavior:smooth; }
body{ font-family:'Newsreader',Georgia,serif; background:#0b0b0c; }

:root{
  --accent:#66023C;        /* Tyrská purpura */
  --accent-glow:#66023C2b;
  --accent-tab-dark:#ab7494; /* mix(accent, #fff, .45) — active tab on dark bar */
  --pink:#c25f8a;          /* light accent used in mono labels */
}

/* ---- keyframes (verbatim from source) ---- */
@keyframes lifeblink{ 0%,100%{ opacity:1; transform:scale(1) } 50%{ opacity:.3; transform:scale(.7) } }
@keyframes floatHint{ 0%,100%{ transform:translateY(0); opacity:.55 } 50%{ transform:translateY(4px); opacity:.9 } }
@keyframes fadeUp{ from{ opacity:0; transform:translateY(14px) } to{ opacity:1; transform:translateY(0) } }
@keyframes dotHalo{ 0%,100%{ transform:scale(.8); opacity:.45 } 50%{ transform:scale(1); opacity:.8 } }
@keyframes dotPing{ 0%{ transform:scale(.18); opacity:.6 } 100%{ transform:scale(1); opacity:0 } }
@keyframes fingerUp{ 0%{opacity:0;transform:translateY(78px) scale(.6)} 10%{opacity:1;transform:translateY(58px) scale(1)} 88%{opacity:1;transform:translateY(-58px) scale(1)} 100%{opacity:0;transform:translateY(-78px) scale(.6)} }
@keyframes fingerDown{ 0%{opacity:0;transform:translateY(-78px) scale(.6)} 10%{opacity:1;transform:translateY(-58px) scale(1)} 88%{opacity:1;transform:translateY(58px) scale(1)} 100%{opacity:0;transform:translateY(78px) scale(.6)} }
@keyframes fingerLeft{ 0%{opacity:0;transform:translateX(86px) scale(.6)} 10%{opacity:1;transform:translateX(64px) scale(1)} 88%{opacity:1;transform:translateX(-64px) scale(1)} 100%{opacity:0;transform:translateX(-86px) scale(.6)} }
@keyframes fingerRight{ 0%{opacity:0;transform:translateX(-86px) scale(.6)} 10%{opacity:1;transform:translateX(-64px) scale(1)} 88%{opacity:1;transform:translateX(64px) scale(1)} 100%{opacity:0;transform:translateX(86px) scale(.6)} }

/* ---- responsive nav ---- */
@media (max-width:780px){
  .nav-desktop{ display:none !important; }
  .nav-burger{ display:flex !important; }
}
@media (min-width:781px){
  .nav-burger{ display:none !important; }
  .nav-mobile{ display:none !important; }
}

/* ---- hover states (were handled by dc `style-hover`) ---- */
.nav-link{ color:#b9b6ad; text-decoration:none; transition:color .3s ease; }
.nav-link:hover{ color:#e89bc4 !important; text-decoration:underline; text-underline-offset:7px; text-decoration-thickness:1px; }

.nav-cta{ color:#0b0b0c; background:#f3f1ea; text-decoration:none; padding:9px 16px; border-radius:100px; letter-spacing:.1em; transition:background-color .3s ease, color .3s ease; }
.nav-cta:hover{ background:#66023C; color:#fff; }

.nav-link-m{ color:#cfccc3; text-decoration:none; padding:14px 0; border-bottom:1px solid rgba(255,255,255,.06); transition:color .3s ease; }
.nav-link-m:hover{ color:#e89bc4; }

.nav-cta-m{ margin-top:16px; color:#0b0b0c; background:#f3f1ea; text-decoration:none; padding:13px 16px; border-radius:100px; text-align:center; letter-spacing:.1em; transition:background-color .3s ease, color .3s ease; }
.nav-cta-m:hover{ background:#66023C; color:#fff; }

.btn-light{ appearance:none; border:0; background:#f3f1ea; color:#0b0b0c; border-radius:100px; font-family:'IBM Plex Mono',monospace; letter-spacing:.12em; cursor:pointer; white-space:nowrap; transition:background-color .3s ease, color .3s ease; }
.btn-light:hover{ background:#66023C; color:#fff; }

.btn-dark{ appearance:none; border:0; background:#0b0b0c; color:#f3f1ea; border-radius:100px; font-family:'IBM Plex Mono',monospace; letter-spacing:.12em; cursor:pointer; white-space:nowrap; transition:background-color .3s ease, color .3s ease; }
.btn-dark:hover{ background:#66023C; color:#fff; }

/* faq toggle button reset */
.faq-toggle{ appearance:none; border:0; background:transparent; width:100%; text-align:left; cursor:pointer; padding:24px 0; display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }

/* ---- cookie consent banner ---- */
.cc-banner{
  position:fixed; left:16px; right:16px; bottom:16px; z-index:1000;
  max-width:560px; margin:0 auto;
  background:rgba(14,14,17,.97); backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.12); border-radius:18px;
  padding:20px 22px; box-shadow:0 30px 60px -28px rgba(0,0,0,.7);
  color:#dcd9d2;
}
.cc-text{ font-family:'Newsreader',serif; font-size:15px; line-height:1.55; margin:0 0 16px; color:#cfccc4; }
.cc-btns{ display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.cc-btn{
  appearance:none; cursor:pointer; border-radius:100px;
  font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:.1em;
  padding:11px 20px; transition:background-color .25s ease, color .25s ease, border-color .25s ease;
}
.cc-btn-ghost{ background:transparent; border:1px solid rgba(255,255,255,.22); color:#cfccc4; }
.cc-btn-ghost:hover{ border-color:#e89bc4; color:#e89bc4; }
.cc-btn-solid{ background:#f3f1ea; border:1px solid #f3f1ea; color:#0b0b0c; }
.cc-btn-solid:hover{ background:#66023C; border-color:#66023C; color:#fff; }
.cc-btn:focus-visible{ outline:2px solid #e89bc4; outline-offset:2px; }

/* ---- waitlist form states ---- */
.wl-error{
  display:flex; align-items:center; gap:13px; padding:15px 22px;
  border:1px solid rgba(214,120,80,.45); border-radius:100px; background:rgba(120,40,20,.16);
}
.wl-error-dot{ width:9px; height:9px; border-radius:50%; background:#d8784f; flex:0 0 9px; }
.wl-error-text{ font-family:'Newsreader',serif; font-size:17px; color:#f3f1ea; }
.wl-retry{
  appearance:none; border:0; background:none; padding:0; cursor:pointer;
  color:#e89bc4; font:inherit; text-decoration:underline; text-underline-offset:3px;
}
button[type="submit"][disabled]{ opacity:.6; cursor:progress; }

/* ---- waitlist field: input + odeslat v jednom pillu ---- */
.wl-field{
  display:flex; align-items:center; gap:8px;
  border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.04);
  border-radius:100px; padding:5px 6px 5px 22px;
  transition:border-color .25s ease, box-shadow .25s ease;
}
.wl-field:focus-within{ border-color:rgba(255,255,255,.6); box-shadow:0 0 0 3px rgba(255,255,255,.12); }
.wl-field [data-email]{
  flex:1 1 auto; min-width:0; border:0; background:transparent; padding:11px 0;
  font-family:'Newsreader',serif; font-size:18px; color:#f3f1ea;
  outline:none; caret-color:#fff;
}
.wl-field [data-email]::placeholder{ color:#8d8a81; }
.wl-field button[type="submit"]{ flex:0 0 auto; padding:13px 24px; font-size:11.5px; }

/* ---- mobil: e-mailový formulář na jednom řádku + ikona místo textu ---- */
.btn-icon{ display:none; }
@media (max-width:600px){
  form[data-waitlist]{ flex-wrap:nowrap !important; gap:8px !important; }
  form[data-waitlist] [data-email]{ flex:1 1 auto !important; min-width:0 !important; }
  form[data-waitlist] button[type="submit"]{
    flex:0 0 auto !important; display:flex; align-items:center; justify-content:center;
    padding-left:18px !important; padding-right:18px !important;
  }
  .btn-label{ display:none; }
  .btn-icon{ display:inline-flex; }
}

/* ---- mobil: menší blok teček (memento mori life grid) ---- */
@media (max-width:600px){
  [data-life-grid]{ gap:2px !important; padding:4px !important; }
  [data-life-grid] > div{ gap:2px !important; }
  [data-life-grid] > div > div{ width:3px !important; height:3px !important; }
}

@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; }
  html{ scroll-behavior:auto; }
}