/*
Theme Name: La Vāza
Theme URI: https://lavaza.cz
Author: studioArk / Tereza Kundrátová
Description: One-page prezentační šablona pro la vāza – ruční keramika.
Version: 1.0.1
Text Domain: lavaza
*/

:root {
  --col-bg:    #9B6933;
  --col-cream: #F0E0C8;
  --col-text:  #F0E0C8;
  --col-muted: rgba(240, 224, 200, 0.60);
  --font:      'Nunito', 'Varela Round', sans-serif;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }

body {
  background-color: var(--col-bg);
  color: var(--col-text);
  font-family: var(--font);
  min-height: 100vh;
  position: relative;
  overflow-x: hidden;
}

/* Głębokość – delikatna winieta */
body::before {
  content: '';
  position: fixed; inset: 0;
  background: radial-gradient(ellipse at 50% 40%,
    rgba(200,140,60,.10) 0%,
    rgba(40,18,2,.28) 100%);
  pointer-events: none;
  z-index: 0;
}

a { color: inherit; text-decoration: none; transition: color .2s; }
a:hover { color: #fff; }

/* ---- LAYOUT ---- */
.lv-page {
  position: relative; z-index: 1;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 40px;
  gap: 0;
}

/* ---- PIKTOGRAM ---- */
.lv-mark {
  margin-bottom: 40px;
  opacity: 0;
  animation: fadeUp .9s ease .1s forwards;
}
.lv-mark img,
.lv-mark svg {
  width: 48px;
  height: auto;
  display: block;
}

/* ---- WORDMARK / LOGO ---- */
.lv-logo {
  margin-bottom: 56px;
  opacity: 0;
  animation: fadeUp 1s ease .3s forwards;
  text-align: center;
}

/* Nahraný obrázek – přes custom-logo */
.lv-logo .custom-logo-link { display: block; }
.lv-logo .custom-logo {
  max-width: min(560px, 82vw);
  height: auto;
  display: block;
}

/* Fallback textové logo pokud obrázek není nahrán */
.lv-logo-text {
  font-size: clamp(48px, 11vw, 90px);
  font-weight: 300;
  letter-spacing: -.02em;
  color: var(--col-cream);
  white-space: nowrap;
}

/* ---- DĚLIČ ---- */
.lv-divider {
  width: 40px; height: 2px;
  background: var(--col-muted);
  border-radius: 2px;
  margin-bottom: 36px;
  opacity: 0;
  animation: fadeUp .9s ease .55s forwards;
}

/* ---- KONTAKT ---- */
.lv-info {
  text-align: center;
  opacity: 0;
  animation: fadeUp .9s ease .7s forwards;
}

.lv-name {
  font-size: clamp(.85rem, 2vw, 1rem);
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--col-cream);
  margin-bottom: 18px;
}

.lv-tagline {
  font-size: clamp(.75rem, 1.8vw, .88rem);
  font-weight: 300;
  letter-spacing: .12em;
  text-transform: lowercase;
  color: var(--col-muted);
  margin-bottom: 22px;
}

.lv-contacts {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin-bottom: 36px;
}

.lv-contact-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: clamp(.82rem, 2vw, .95rem);
  font-weight: 300;
  letter-spacing: .04em;
  color: var(--col-muted);
  transition: color .2s;
}
.lv-contact-item:hover { color: var(--col-cream); }

.lv-contact-icon { width: 15px; height: 15px; flex-shrink: 0; opacity: .75; }

/* ---- SOCIÁLNÍ SÍTĚ ---- */
.lv-social {
  display: flex;
  gap: 20px;
  margin-top: 8px;
  opacity: 0;
  animation: fadeUp .9s ease .9s forwards;
}

.lv-social-link {
  display: flex; align-items: center; justify-content: center;
  width: 44px; height: 44px;
  border: 1.5px solid var(--col-muted);
  border-radius: 50%;
  color: var(--col-muted);
  transition: border-color .22s, color .22s, transform .22s, background .22s;
}
.lv-social-link:hover {
  border-color: var(--col-cream);
  color: var(--col-cream);
  transform: translateY(-3px);
  background: rgba(240,224,200,.08);
}
.lv-social-link svg { width: 17px; height: 17px; fill: currentColor; }

/* ---- FOOTER NOTE ---- */
.lv-foot {
  position: fixed; bottom: 22px; left: 50%; transform: translateX(-50%);
  font-size: .6rem; letter-spacing: .22em; text-transform: uppercase;
  color: rgba(240,224,200,.2); white-space: nowrap;
  opacity: 0; animation: fadeIn 1.4s ease 1.3s forwards;
  z-index: 2;
}

/* ---- ANIMACE ---- */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  from { opacity: 0; } to { opacity: 1; }
}

/* ---- RESPONSIVE ---- */
@media (max-width: 480px) {
  .lv-page { padding: 50px 28px; }
  .lv-mark { margin-bottom: 30px; }
  .lv-logo { margin-bottom: 44px; }
  .lv-foot { font-size: .56rem; bottom: 14px; }
}