/* ZD-fotoshop — Coming Soon — v1.1 */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --c-bg:        #0d0e0c;
  --c-white:     #f0ede8;
  --c-olive:     #a38d5e;
  --c-olive-dim: rgba(163,141,94,.2);
  --c-text-dim:  rgba(240,237,232,.5);
  --f-serif:     'Cormorant Garamond', Georgia, serif;
  --f-sans:      'Inter', sans-serif;
}

html, body {
  height: 100%;
  background: var(--c-bg);
  color: var(--c-white);
  font-family: var(--f-sans);
  font-weight: 300;
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
}

/* ── Vintage noise ───────────────────────────────────────── */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9999;
  opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.72' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 180px 180px;
}

/* ── Pozadí ──────────────────────────────────────────────── */
.zdfs-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.zdfs-bg__overlay {
  position: absolute;
  inset: 0;
  background: #0d0e0c;
}

.zdfs-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center, transparent 30%, rgba(13,14,12,.65) 100%);
  pointer-events: none;
}

/* ── Rohové dekorace ─────────────────────────────────────── */
.zdfs-corner {
  position: fixed;
  width: 36px;
  height: 36px;
  opacity: .3;
  z-index: 10;
}
.zdfs-corner--tl { top: 2.5rem; left: 2.5rem;   border-top: 1px solid var(--c-olive); border-left:  1px solid var(--c-olive); }
.zdfs-corner--tr { top: 2.5rem; right: 2.5rem;  border-top: 1px solid var(--c-olive); border-right: 1px solid var(--c-olive); }
.zdfs-corner--bl { bottom: 2.5rem; left: 2.5rem;  border-bottom: 1px solid var(--c-olive); border-left:  1px solid var(--c-olive); }
.zdfs-corner--br { bottom: 2.5rem; right: 2.5rem; border-bottom: 1px solid var(--c-olive); border-right: 1px solid var(--c-olive); }

/* ── Layout ──────────────────────────────────────────────── */
.zdfs-page {
  position: relative;
  z-index: 5;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 5rem 2rem;
}

/* ── Logo ────────────────────────────────────────────────── */
.zdfs-logo-wrap {
  margin-bottom: .6rem;
  opacity: 0;
  animation: zdfs-up .8s .15s ease forwards;
}

.zdfs-logo-text {
  font-size: .72rem;
  font-weight: 300;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--c-white);
}

.zdfs-logo-img {
  height: 52px;
  width: auto;
  display: block;
  margin: 0 auto;
  filter: brightness(0) invert(1);
}

/* ── Label ───────────────────────────────────────────────── */
.zdfs-label {
  font-size: .58rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--c-olive);
  margin-bottom: 3.5rem;
  opacity: 0;
  animation: zdfs-up .8s .28s ease forwards;
}

/* ── Dekorativní linka ───────────────────────────────────── */
.zdfs-divider {
  width: 1px;
  height: 52px;
  background: linear-gradient(to bottom, transparent, var(--c-olive-dim) 50%, transparent);
  margin: 0 auto 3.5rem;
  opacity: 0;
  animation: zdfs-up .7s .4s ease forwards;
}

/* ── Hlavní nadpis ───────────────────────────────────────── */
.zdfs-headline {
  font-family: var(--f-serif);
  font-size: clamp(4rem, 11vw, 10rem);
  font-weight: 300;
  line-height: .95;
  letter-spacing: .01em;
  color: var(--c-white);
  margin-bottom: 2rem;
  opacity: 0;
  animation: zdfs-up 1s .52s ease forwards;
}

/* ── Popis ───────────────────────────────────────────────── */
.zdfs-subline {
  font-size: clamp(.78rem, 1.3vw, .88rem);
  font-weight: 300;
  color: var(--c-text-dim);
  line-height: 1.8;
  max-width: 44ch;
  margin-bottom: 3rem;
  opacity: 0;
  animation: zdfs-up .8s .68s ease forwards;
}

/* ── Tlačítko ────────────────────────────────────────────── */
.zdfs-btn {
  display: inline-block;
  padding: .72rem 2.25rem;
  border: 1px solid var(--c-olive-dim);
  color: var(--c-olive);
  font-family: var(--f-sans);
  font-size: .6rem;
  font-weight: 300;
  letter-spacing: .18em;
  text-transform: uppercase;
  text-decoration: none;
  transition: border-color .3s, color .3s, background .3s;
  opacity: 0;
  animation: zdfs-up .8s .84s ease forwards;
}
.zdfs-btn:hover {
  border-color: rgba(163,141,94,.6);
  color: var(--c-white);
  background: rgba(163,141,94,.07);
}

/* ── Countdown ───────────────────────────────────────────── */
.zdfs-countdown {
  position: fixed;
  bottom: 2.5rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  display: flex;
  align-items: center;
  gap: .85rem;
  font-size: .55rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--c-text-dim);
  white-space: nowrap;
  opacity: 0;
  animation: zdfs-up .6s 1.1s ease forwards;
}

.zdfs-countdown__num {
  font-family: var(--f-serif);
  font-size: 1.6rem;
  font-weight: 300;
  color: var(--c-olive);
  min-width: 1.8ch;
  text-align: center;
  line-height: 1;
}

.zdfs-bar-wrap {
  width: 80px;
  height: 1px;
  background: rgba(163,141,94,.18);
  overflow: hidden;
}

.zdfs-bar {
  height: 100%;
  background: var(--c-olive);
  transform-origin: left;
  transform: scaleX(1);
}

/* ── Animace ─────────────────────────────────────────────── */
@keyframes zdfs-up {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Mobil ───────────────────────────────────────────────── */
@media (max-width: 480px) {
  .zdfs-corner { display: none; }
  .zdfs-page { padding: 3rem 1.5rem; }
  .zdfs-headline { font-size: clamp(3rem, 14vw, 5rem); }
}
