/* style.css — HellRave theme
   Fonts: Unbounded (imported in index.php)
*/

:root{
  --bg-dark: #050307;
  --panel: #160606;
  --lava-1: #ff3b00;
  --lava-2: #ff9a00;
  --muted: #bfb1a7;
  --glass: rgba(255,255,255,0.04);
  --accent-glow: 0 0 24px rgba(255,70,30,0.16);
  font-family: 'Unbounded', system-ui, -apple-system, 'Segoe UI', Roboto, Arial;
}

/* Reset */
*{box-sizing:border-box}
html,body{
  height:100%;
  margin:0;
  background-color:#050307;
  background-image:
    radial-gradient(circle at top, rgba(255,80,40,0.18) 0%, transparent 38%),
    radial-gradient(circle at bottom, rgba(255,110,30,0.14) 0%, transparent 46%),
    linear-gradient(180deg,#050307 0%, #050307 42%, #0f0505 100%);
  color:#fff;
  -webkit-font-smoothing:antialiased;
  scroll-behavior:smooth;
}
a{color:inherit;text-decoration:none}
.container{max-width:1180px;margin:0 auto;padding:0 20px}

/* Header */
.site-header{position:fixed;left:0;right:0;top:0;z-index:100;padding:16px 0;background:linear-gradient(180deg,rgba(0,0,0,0.55),rgba(0,0,0,0.18));backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,0.03)}
.header-inner{display:flex;align-items:center;justify-content:space-between;max-width:1180px;margin:0 auto;padding:0 20px}
.brand{display:flex;gap:14px;align-items:center}
.logo{font-weight:900;letter-spacing:1px;color:var(--lava-1);font-size:20px;text-transform:uppercase}
.meta{color:var(--muted);font-size:13px}
.main-nav a{margin-left:18px;font-weight:700;font-size:13px;color:var(--muted)}
.btn-ghost{padding:8px 12px;border-radius:8px;background:transparent;border:1px solid rgba(255,255,255,0.08)}

/* Hero */
.hero{padding-top:110px;position:relative;overflow:hidden}
.hero-grid{
  display:grid;
  grid-template-columns:1fr 460px;
  gap:36px;
  align-items:flex-start;
  padding:64px 0;
}

.kicker{display:inline-block;background:linear-gradient(90deg,rgba(255,50,10,0.10),rgba(255,160,30,0.04));padding:6px 10px;border-radius:8px;font-weight:800;color:#ffd9c0;font-size:13px}
.hero-title{font-size:56px;line-height:0.96;margin:6px 0;background:linear-gradient(90deg,var(--lava-1),var(--lava-2));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 6px 30px rgba(0,0,0,0.6)}
.lead{color:var(--muted);font-size:18px;max-width:56ch}
.promos{display:flex;gap:8px;margin-top:18px;flex-wrap:wrap}
.pill{background:rgba(255,255,255,0.02);padding:8px 12px;border-radius:10px;font-weight:700}
.pill.muted{color:var(--muted);font-weight:600}
.cta-row{margin-top:22px;display:flex;gap:12px}
.cta-primary{display:inline-block;padding:12px 18px;background:linear-gradient(90deg,var(--lava-1),var(--lava-2));border-radius:12px;font-weight:900}
.cta-secondary{display:inline-block;padding:12px 18px;border-radius:12px;background:transparent;border:1px solid rgba(255,255,255,0.08)}

.hero-right{
  position:relative;
}

.hero-right-inner{
  position:relative;
}
.scene{
  width:100%;
  display:block;
  border-radius:18px;
}


/* Animated decorative lava background */
.lava-bg{
  position:absolute;
  left:-10%;
  right:-10%;
  bottom:-16%;
  height:320px;
  background:
    radial-gradient(circle at 20% 0%, rgba(255,120,40,0.3) 0%, transparent 55%),
    radial-gradient(circle at 80% 20%, rgba(255,80,20,0.25) 0%, transparent 55%),
    linear-gradient(180deg, rgba(255,60,10,0.18), rgba(255,30,0,0.03));
  filter:blur(55px);
  transform:skewY(-8deg);
  pointer-events:none;
  z-index:0;
}

/* Tickets section */
.section{padding:72px 0}
.tickets-grid{
  display:grid;
  grid-template-columns:1fr 420px;
  gap:32px;
  align-items:start;
  padding:0 20px;
}
.tickets-desc h2{font-size:28px;margin:0 0 8px}
.muted{color:var(--muted)}
.tier{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:14px;border-radius:10px;border:1px solid rgba(255,255,255,0.03);margin-top:12px}
.tier-name{font-weight:900;font-size:16px}

/* Checkout column */
.checkout-column{
  display:flex;
  flex-direction:column;
  gap:18px;
}
.checkout-wrap{position:relative}
.checkout-card{
  position:sticky;
  top:92px;
  background:radial-gradient(circle at top, rgba(255,80,40,0.10) 0%, rgba(19,6,6,1) 40%, #140707 100%);
  padding:18px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.06);
  box-shadow:var(--accent-glow);
  backdrop-filter:blur(10px);
}
.checkout-card.bundle-card{
  position:relative;
  top:0;
  background:radial-gradient(circle at top, rgba(255,160,80,0.18) 0%, rgba(26,8,8,1) 40%, #140707 100%);
  border-color:rgba(255,160,80,0.35);
}
.card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.ticket-name{font-weight:900}
.ticket-meta{font-size:13px;color:var(--muted)}
.ticket-price{font-weight:900;color:var(--lava-1);font-size:22px}
.bundle-price{color:#ffcf8a}

/* qty row */
.card-body{display:flex;flex-direction:column;gap:12px}
.qty-row{display:flex;align-items:center;gap:10px}
.qty-btn{background:var(--glass);border:0;padding:8px 12px;border-radius:8px;font-weight:900;cursor:pointer;color:#fff}
.qty-display{min-width:36px;text-align:center;font-weight:900}
.btn-full{width:100%;padding:12px;border-radius:10px;background:linear-gradient(90deg,var(--lava-1),var(--lava-2));border:0;font-weight:900;cursor:pointer}
.card-foot{font-size:13px}

/* Embers / micro animation */
.ember{position:absolute;right:12px;bottom:10px;width:8px;height:8px;border-radius:50%;background:var(--lava-1);box-shadow:0 0 18px rgba(255,80,30,0.6);animation:ember 4s infinite}
.ember-bundle{right:18px;bottom:14px;background:#ffcf8a;box-shadow:0 0 22px rgba(255,210,150,0.9)}
@keyframes ember {0%{transform:translateY(0);opacity:0.25}50%{transform:translateY(-34px);opacity:0.95}100%{transform:translateY(0);opacity:0.25}}

/* Lineup - centered, polished cards */
.lineup-wrap{
  display:flex;
  justify-content:center;
  align-items:flex-start;
  width:100%;
  padding:40px 20px;
  margin:0 auto;
}

.lineup-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap:28px;
  justify-items:center;
  align-items:start;
  max-width:960px;
  width:100%;
  margin:0 auto;
  padding:0 12px;
  align-content:center;
  place-items:start center;
}

/* Card */
.artist-card{
  background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
  border:1px solid rgba(255,255,255,0.04);
  border-radius:16px;
  padding:22px;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  max-width:260px;
  transition: transform 0.28s cubic-bezier(.2,.9,.2,1), box-shadow 0.28s, border-color 0.28s;
  box-shadow: 0 8px 30px rgba(0,0,0,0.6), 0 14px 50px rgba(255,70,30,0.05);
  backdrop-filter: blur(6px);
  overflow:visible;
  justify-self:center;
  margin-bottom: 40px;
}
.artist-card:hover{
  transform: translateY(-12px) scale(1.02);
  box-shadow: 0 22px 80px rgba(0,0,0,0.7), 0 36px 120px rgba(255,70,30,0.14);
  border-color: rgba(255,140,60,0.12);
}

.artist-photo{
  width:160px;
  height:160px;
  border-radius:50%;
  margin-bottom:14px;
  border:6px solid rgba(255,255,255,0.02);
  background: radial-gradient(circle at center, rgba(255,40,10,0.04), transparent 40%);
  box-shadow: 0 10px 40px rgba(255,70,30,0.10), inset 0 6px 20px rgba(0,0,0,0.6);
  overflow:hidden;
  position:relative;
  display:block;
}
.artist-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  -webkit-user-drag:none;
  user-select:none;
  font-size:0;
  line-height:0;
  vertical-align:middle;
}
.artist-photo::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  pointer-events:none;
  background: radial-gradient(circle at 40% 30%, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0.45) 52%, rgba(0,0,0,0.65) 100%);
  mix-blend-mode:multiply;
  opacity:1;
}

.artist-name{
  font-weight:900;
  font-size:20px;
  margin:8px 0 6px;
  letter-spacing:0.3px;
  background: linear-gradient(90deg, var(--lava-1), var(--lava-2));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}

.artist-genre{
  font-size:13px;
  color:var(--muted);
  margin-bottom:10px;
}

.artist-meta{
  font-size:13px;
  color:var(--muted);
  margin-top:8px;
  display:flex;
  gap:8px;
  align-items:center;
}

.badge{
  display:inline-block;
  padding:6px 10px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(255,60,20,0.12), rgba(255,140,40,0.06));
  font-weight:700;
  font-size:12px;
  color:#ffd9c0;
}

/* Info split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:24px}

/* Modal */
.modal{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,0.6);z-index:300;visibility:hidden;opacity:0;transition:all .25s}
.modal[aria-hidden="false"]{visibility:visible;opacity:1}
.modal-card{width:520px;background:linear-gradient(180deg,#130606,#1a0b0b);padding:20px;border-radius:12px;border:1px solid rgba(255,255,255,0.04)}
.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.modal-close{background:none;border:0;color:var(--muted);font-size:18px;cursor:pointer}
.field{display:flex;flex-direction:column;margin-bottom:12px}
.field input, .field select{padding:10px;border-radius:8px;border:1px solid rgba(255,255,255,0.06);background:transparent;color:#fff}

/* Footer */
.site-footer{padding:22px 0;border-top:1px solid rgba(255,255,255,0.02);margin-top:40px}
.footer-inner{display:flex;justify-content:space-between;align-items:center}

/* Utilities */
.small{font-size:13px}
.muted small{color:var(--muted)}

/* Responsive: general */
@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr;gap:20px}
  .tickets-grid{grid-template-columns:1fr;gap:20px}
  .checkout-card{position:relative;top:0}
  .modal-card{width:92%}
  .hero-title{font-size:42px}
}

/* Responsive tweaks for lineup */
@media(max-width:780px){
  .lineup-grid{
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap:18px;
    max-width:780px;
    padding:0 14px;
  }
  .artist-card{
    max-width:220px;
    padding:18px;
  }
  .artist-photo{width:140px;height:140px}
}
@media(max-width:480px){
  .lineup-wrap{padding:24px 12px}
  .lineup-grid{
    grid-template-columns:1fr;
    gap:12px;
    padding:0 12px;
  }
  .artist-card{
    max-width:100%;
    padding:14px;
  }
  .artist-photo{width:120px;height:120px}
}

/* Small aesthetic tweaks for very large viewports */
@media(min-width:1400px){
  :root{--accent-glow: 0 0 36px rgba(255,70,30,0.18)}
  .artist-card{max-width:300px}
}

/* Lineup blok v hero vpravo */
.lineup-panel-hero{
  margin-top:10px;
  padding:14px 16px;
  border-radius:14px;
  background:radial-gradient(circle at top, rgba(255,120,60,0.18) 0%, rgba(15,5,5,0.98) 40%);
  border:1px solid rgba(255,170,100,0.35);
  box-shadow:0 18px 60px rgba(0,0,0,0.7);
}

.lineup-heading-hero{
  font-size:14px;
  font-weight:900;
  letter-spacing:1px;
  color:#ffb28a;
  margin-bottom:8px;
}

.lineup-list-hero{
  list-style:none;
  margin:0;
  padding:0;
  font-size:13px;
}

.lineup-list-hero li{
  margin-bottom:4px;
}

.lineup-time-hero{
  font-weight:800;
  color:#ffd9c0;
  margin-right:6px;
}

.lineup-artist-hero{
  font-weight:600;
  color:#ffffff;
}

/* End of file */