/*
Theme Name: Kapela Sunset
Theme URI: https://kapelasunset.sk
Author: Kapela Sunset
Description: Oficiálna téma pre Kapelu Sunset — slovenská pop-rock kapela.
Version: 1.1.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GPLv2
Text Domain: kapela-sunset
*/
:root{--sun-gold:#E8A838;--deep-amber:#D4782F;--warm-coral:#C75B3A;--sunset-rose:#B0415A;--dusk-plum:#6B2D5B;--night-purple:#2D1B3D;--dark-bg:#1A1018;--cream:#FFF8F0;--text-light:#FFF8F0;--text-muted:rgba(255,248,240,0.6)}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'DM Sans',sans-serif;background:var(--dark-bg);color:var(--text-light);overflow-x:hidden;-webkit-font-smoothing:antialiased;line-height:1.6}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4,h5,h6{font-family:'Playfair Display',serif;font-weight:700;line-height:1.15}
.container{max-width:1100px;margin:0 auto;padding:0 2rem}
section{padding:6rem 2rem}
.ks-label{font-family:'DM Sans',sans-serif;font-size:.75rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--sun-gold);margin-bottom:.75rem}
.ks-title{font-size:clamp(2rem,5vw,3.2rem);margin-bottom:1.25rem}
.ks-subtitle{font-size:1.05rem;line-height:1.7;color:var(--text-muted);max-width:580px;font-weight:300}
.ks-text{font-size:1.05rem;line-height:1.8;color:rgba(255,248,240,0.75);font-weight:300}

/* BUTTONS */
.ks-cta{display:inline-flex;align-items:center;gap:.75rem;padding:1rem 2.5rem;background:linear-gradient(135deg,var(--sun-gold),var(--deep-amber));color:var(--night-purple);font-family:'DM Sans',sans-serif;font-weight:600;font-size:.9rem;letter-spacing:.08em;text-transform:uppercase;border-radius:50px;border:none;cursor:pointer;transition:all .4s ease}
.ks-cta:hover{transform:translateY(-2px);box-shadow:0 12px 40px rgba(232,168,56,.35);color:var(--night-purple)}
.ks-cta svg{width:18px;height:18px}
.ks-btn-outline{display:inline-block;padding:.6rem 1.5rem;background:0;border:1px solid rgba(232,168,56,.3);color:var(--sun-gold);font-family:'DM Sans',sans-serif;font-size:.8rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;border-radius:50px;cursor:pointer;transition:all .3s ease}
.ks-btn-outline:hover{background:var(--sun-gold);color:var(--night-purple)}

/* NAV */
.ks-nav{position:fixed;top:0;left:0;right:0;z-index:1000;padding:1.25rem 2.5rem;display:flex;justify-content:space-between;align-items:center;transition:all .4s ease}
.ks-nav.scrolled{background:rgba(26,16,24,.92);backdrop-filter:blur(20px);padding:.9rem 2.5rem;box-shadow:0 4px 30px rgba(0,0,0,.3)}
.ks-nav-logo{font-family:'Playfair Display',serif;font-size:1.4rem;font-weight:700;color:var(--cream)}
.ks-nav-logo span{color:var(--sun-gold)}
.ks-nav-links{display:flex;gap:2rem;list-style:none}
.ks-nav-links a{color:var(--text-muted);font-size:.85rem;font-weight:500;letter-spacing:.05em;text-transform:uppercase;transition:color .3s;position:relative}
.ks-nav-links a::after{content:'';position:absolute;bottom:-4px;left:0;width:0;height:2px;background:var(--sun-gold);transition:width .3s}
.ks-nav-links a:hover{color:var(--cream)}
.ks-nav-links a:hover::after{width:100%}
.ks-nav-burger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:0;border:0;padding:4px}
.ks-nav-burger span{display:block;width:24px;height:2px;background:var(--cream);transition:all .3s}

/* HERO */
.ks-hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.ks-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(.3) saturate(.8)}
.ks-hero-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(45,27,61,.6) 0%,rgba(26,16,24,.4) 40%,rgba(26,16,24,.85) 80%,var(--dark-bg) 100%)}
.ks-hero-particles{position:absolute;inset:0;overflow:hidden;z-index:1;pointer-events:none}
.ks-particle{position:absolute;background:var(--sun-gold);border-radius:50%;opacity:0;animation:ksFloat 8s ease-in infinite}
@keyframes ksFloat{0%{opacity:0;transform:translateY(100vh) scale(0)}10%{opacity:.8}90%{opacity:.2}100%{opacity:0;transform:translateY(-10vh) scale(1)}}
.ks-hero-content{position:relative;z-index:2;padding:2rem}
.ks-hero-content h1{font-size:clamp(3rem,10vw,7rem);font-weight:800;line-height:1.1;margin-bottom:1.5rem;padding-bottom:.1em;background:linear-gradient(135deg,var(--cream) 30%,var(--sun-gold) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:ksFadeUp 1s ease .3s both}
.ks-hero-tagline{font-size:clamp(1rem,2.5vw,1.3rem);color:rgba(255,248,240,.8);font-weight:300;letter-spacing:.15em;text-transform:uppercase;margin-bottom:2.5rem;animation:ksFadeUp 1s ease .6s both}
.ks-hero .ks-cta{animation:ksFadeUp 1s ease .9s both}
.ks-hero-scroll{position:absolute;bottom:2.5rem;left:50%;transform:translateX(-50%);animation:ksBounce 2s ease infinite;z-index:2;cursor:pointer}
.ks-hero-scroll svg{width:24px;height:24px;stroke:var(--text-muted)}
@keyframes ksBounce{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(8px)}}
@keyframes ksFadeUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}

/* ABOUT */
.ks-about-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.ks-about-img{border-radius:16px;overflow:hidden}
.ks-about-img img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform .6s ease}
.ks-about-img:hover img{transform:scale(1.03)}
.ks-stats{display:flex;gap:2.5rem;margin-top:2rem;padding-top:2rem;border-top:1px solid rgba(255,248,240,.08)}
.ks-stat-number{font-family:'Playfair Display',serif;font-size:2.2rem;font-weight:700;color:var(--sun-gold);display:block}
.ks-stat-label{font-size:.78rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;margin-top:.25rem}

/* MUSIC */
.ks-music-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:3rem}
.ks-music-card{background:rgba(255,248,240,.04);border:1px solid rgba(255,248,240,.06);border-radius:16px;overflow:hidden;transition:all .4s ease}
.ks-music-card:hover{transform:translateY(-4px);border-color:rgba(232,168,56,.2);box-shadow:0 16px 48px rgba(0,0,0,.3)}
.ks-music-thumb{position:relative;overflow:hidden}
.ks-music-thumb img{width:100%;aspect-ratio:16/9;object-fit:cover;filter:brightness(.7);transition:all .5s ease}
.ks-music-card:hover .ks-music-thumb img{transform:scale(1.05);filter:brightness(.85)}
.ks-play-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:56px;height:56px;background:rgba(232,168,56,.85);border-radius:50%;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s}
.ks-music-card:hover .ks-play-btn{opacity:1}
.ks-music-info{padding:1.25rem}
.ks-music-info h4{font-size:1rem;color:var(--cream);margin-bottom:.4rem}
.ks-music-info p{font-size:.82rem;color:var(--text-muted);font-weight:300}

/* GALLERY */
.ks-gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:220px;gap:1rem;margin-top:3rem}
.ks-gallery-item{border-radius:12px;overflow:hidden;position:relative;cursor:pointer;transition:all .4s ease}
.ks-gallery-item:first-child{grid-column:span 2;grid-row:span 2}
.ks-gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.ks-gallery-item:hover img{transform:scale(1.05)}
.ks-gallery-item:hover{box-shadow:0 8px 32px rgba(0,0,0,.4)}
.ks-gallery-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(26,16,24,.85) 100%);opacity:0;transition:opacity .3s;display:flex;align-items:flex-end;padding:1.25rem}
.ks-gallery-item:hover .ks-gallery-overlay{opacity:1}
.ks-gallery-overlay span{font-size:.85rem;color:var(--cream);font-weight:500}

/* SETLIST TABS */
.ks-setlist{background:rgba(255,248,240,.02);border:1px solid rgba(255,248,240,.06);border-radius:20px;overflow:hidden;margin-top:3rem}
.ks-tabs{display:flex;position:relative;background:rgba(255,248,240,.03);border-bottom:1px solid rgba(255,248,240,.06);padding:.5rem;gap:.5rem}
.ks-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:.6rem;padding:.9rem 1.5rem;background:0;border:0;color:var(--text-muted);font-family:'DM Sans',sans-serif;font-size:.88rem;font-weight:500;cursor:pointer;border-radius:12px;transition:all .35s ease;position:relative;z-index:2}
.ks-tab svg{opacity:.5;transition:opacity .3s}
.ks-tab.active{color:var(--night-purple);background:linear-gradient(135deg,var(--sun-gold),var(--deep-amber));font-weight:600}
.ks-tab.active svg{opacity:1;stroke:var(--night-purple)}
.ks-tab:not(.active):hover{color:var(--cream);background:rgba(255,248,240,.05)}
.ks-tab-count{font-size:.7rem;font-weight:700;padding:.15rem .5rem;border-radius:50px;background:rgba(255,248,240,.1);transition:all .3s}
.ks-tab.active .ks-tab-count{background:rgba(45,27,61,.2);color:var(--night-purple)}
.ks-tab-panel{display:none;padding:.75rem 0;max-height:520px;overflow-y:auto}
.ks-tab-panel.active{display:block}
.ks-tab-panel::-webkit-scrollbar{width:3px}
.ks-tab-panel::-webkit-scrollbar-track{background:0}
.ks-tab-panel::-webkit-scrollbar-thumb{background:rgba(232,168,56,.25);border-radius:3px}
.ks-track{display:flex;align-items:center;gap:1rem;padding:.65rem 1.75rem;transition:all .25s ease;cursor:default;border-left:3px solid transparent}
.ks-track:hover{background:rgba(232,168,56,.05);border-left-color:var(--sun-gold)}
.ks-track-num{font-family:'DM Sans',sans-serif;font-size:.72rem;font-weight:600;color:rgba(232,168,56,.35);min-width:22px;text-align:right;transition:color .25s}
.ks-track:hover .ks-track-num{color:var(--sun-gold)}
.ks-track-vinyl{width:32px;height:32px;border-radius:50%;background:rgba(255,248,240,.04);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .4s ease}
.ks-track-vinyl svg{stroke:rgba(232,168,56,.4);transition:all .3s}
.ks-track:hover .ks-track-vinyl{background:rgba(232,168,56,.12);transform:rotate(45deg)}
.ks-track:hover .ks-track-vinyl svg{stroke:var(--sun-gold)}
.ks-track-info{flex:1;min-width:0;display:flex;align-items:baseline;gap:.5rem;flex-wrap:wrap}
.ks-track-title{font-size:.92rem;font-weight:500;color:var(--cream);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ks-track-artist{font-size:.78rem;color:var(--text-muted);font-weight:300;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ks-tab-panel.active .ks-track{animation:ksTrackIn .4s ease both}
@keyframes ksTrackIn{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:translateX(0)}}

/* EVENTS */
.ks-event-row{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:2rem;padding:1.5rem 2rem;background:rgba(255,248,240,.03);border:1px solid rgba(255,248,240,.06);border-radius:12px;transition:all .3s ease;margin-bottom:1rem}
.ks-event-row:hover{border-color:rgba(232,168,56,.15);background:rgba(255,248,240,.05)}
.ks-event-date{text-align:center;min-width:60px}
.ks-event-day{font-family:'Playfair Display',serif;font-size:1.8rem;font-weight:700;color:var(--sun-gold);display:block;line-height:1}
.ks-event-month{font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-top:.2rem}
.ks-event-row h4{font-size:1.05rem;color:var(--cream);margin-bottom:.3rem}
.ks-event-location{font-size:.85rem;color:var(--text-muted);font-weight:300}
.ks-badge{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;font-weight:600;padding:.4rem 1rem;border-radius:50px;display:inline-block}
.ks-badge-green{color:#4ADE80;background:rgba(74,222,128,.1);border:1px solid rgba(74,222,128,.2)}
.ks-badge-red{color:var(--warm-coral);background:rgba(199,91,58,.1);border:1px solid rgba(199,91,58,.2)}

/* REVIEWS */
.ks-reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:3rem}
.ks-review-card{background:rgba(255,248,240,.03);border:1px solid rgba(255,248,240,.06);border-radius:16px;padding:2rem}
.ks-review-stars{display:flex;gap:.25rem;margin-bottom:1rem}
.ks-review-stars svg{width:16px;height:16px;fill:var(--sun-gold);stroke:none}
.ks-review-card blockquote{font-size:.95rem;line-height:1.7;color:rgba(255,248,240,.75);font-style:italic;font-weight:300;margin-bottom:1.25rem}
.ks-review-author{font-size:.82rem;font-weight:600;color:var(--cream)}
.ks-review-role{font-size:.75rem;color:var(--text-muted);margin-top:.15rem}

/* CTA BAND */
.ks-cta-band{position:relative;padding:5rem 2rem;text-align:center;overflow:hidden}
.ks-cta-band-bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(.25)}
.ks-cta-band-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(107,45,91,.7),rgba(26,16,24,.7))}
.ks-cta-band .container{position:relative;z-index:2}

/* CONTACT */
.ks-contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;margin-top:3rem}
.ks-form{display:flex;flex-direction:column;gap:1.25rem}
.ks-form label{display:block;font-size:.78rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);margin-bottom:.5rem}
.ks-form input,.ks-form textarea,.ks-form select{width:100%;padding:.9rem 1.25rem;background:rgba(255,248,240,.04);border:1px solid rgba(255,248,240,.08);border-radius:10px;color:var(--cream);font-family:'DM Sans',sans-serif;font-size:.95rem;transition:border-color .3s;outline:0}
.ks-form input:focus,.ks-form textarea:focus,.ks-form select:focus{border-color:var(--sun-gold)}
.ks-form textarea{resize:vertical;min-height:120px}
.ks-form select option{background:var(--dark-bg)}
.ks-contact-info{display:flex;flex-direction:column;gap:2rem}
.ks-contact-item{display:flex;gap:1rem;align-items:flex-start}
.ks-contact-icon{width:44px;height:44px;border-radius:12px;background:rgba(232,168,56,.1);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ks-contact-icon svg{width:20px;height:20px;stroke:var(--sun-gold);fill:none}
.ks-contact-item h4{font-size:.95rem;color:var(--cream);margin-bottom:.25rem}
.ks-contact-item p,.ks-contact-item a{font-size:.9rem;color:var(--text-muted);font-weight:300}
.ks-contact-item a:hover{color:var(--sun-gold)}

/* SOCIAL */
.ks-socials{display:flex;gap:.75rem;margin-top:1rem}
.ks-social{width:44px;height:44px;border-radius:12px;background:rgba(255,248,240,.04);border:1px solid rgba(255,248,240,.08);display:flex;align-items:center;justify-content:center;transition:all .3s ease}
.ks-social:hover{background:rgba(232,168,56,.15);border-color:rgba(232,168,56,.3)}
.ks-social svg{width:18px;height:18px;stroke:var(--text-muted);fill:none;transition:stroke .3s}
.ks-social:hover svg{stroke:var(--sun-gold)}

/* FOOTER */
.ks-footer{text-align:center;padding:3rem 2rem;border-top:1px solid rgba(255,248,240,.06)}
.ks-footer p{font-size:.82rem;color:var(--text-muted);font-weight:300}

/* ANIMATIONS */
.ks-fade{opacity:0;transform:translateY(24px);transition:all .7s cubic-bezier(.16,1,.3,1)}
.ks-fade.ks-visible{opacity:1;transform:translateY(0)}

/* BACKGROUNDS */
.ks-bg-dark{background:var(--dark-bg)}
.ks-bg-gradient{background:linear-gradient(180deg,var(--dark-bg) 0%,rgba(45,27,61,.3) 50%,var(--dark-bg) 100%)}
.ks-bg-gradient-light{background:linear-gradient(180deg,var(--dark-bg) 0%,rgba(45,27,61,.2) 50%,var(--dark-bg) 100%)}

/* COMING SOON */
.ks-coming-soon{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;position:relative;overflow:hidden}
.ks-coming-soon-bg{position:absolute;inset:0;background-size:cover;background-position:center}
.ks-coming-soon-bg::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% 50%,rgba(107,45,91,.4) 0%,transparent 60%),linear-gradient(180deg,rgba(26,16,24,.85) 0%,rgba(26,16,24,.7) 50%,rgba(26,16,24,.9) 100%)}
.ks-coming-content{position:relative;z-index:2;padding:2rem;max-width:650px}
.ks-coming-content h1{font-size:clamp(2.5rem,8vw,5rem);font-weight:800;margin-bottom:1.5rem;background:linear-gradient(135deg,var(--cream) 30%,var(--sun-gold) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:ksFadeUp 1s ease .2s both}
.ks-divider{width:60px;height:3px;background:linear-gradient(135deg,var(--sun-gold),var(--deep-amber));margin:0 auto 2rem;border-radius:2px;animation:ksFadeUp 1s ease .4s both}
.ks-coming-content p{font-size:1.15rem;color:rgba(255,248,240,.7);font-weight:300;line-height:1.8;margin-bottom:2.5rem;animation:ksFadeUp 1s ease .6s both}
.ks-coming-contact{animation:ksFadeUp 1s ease .8s both}
.ks-coming-contact a{color:var(--sun-gold);font-weight:500;transition:color .3s}
.ks-coming-contact a:hover{color:var(--cream)}
.ks-countdown{display:flex;justify-content:center;gap:2rem;margin-bottom:3rem;animation:ksFadeUp 1s ease .5s both}
.ks-countdown-number{font-family:'Playfair Display',serif;font-size:clamp(2rem,5vw,3.5rem);font-weight:700;color:var(--sun-gold);display:block;line-height:1}
.ks-countdown-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;color:var(--text-muted);margin-top:.5rem}
.ks-pulse-ring{position:absolute;border:1px solid rgba(232,168,56,.08);border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%);animation:ksPulse 4s ease-in-out infinite;pointer-events:none}
.ks-pulse-ring:nth-child(1){width:300px;height:300px}
.ks-pulse-ring:nth-child(2){width:500px;height:500px;animation-delay:1s}
.ks-pulse-ring:nth-child(3){width:700px;height:700px;animation-delay:2s}
@keyframes ksPulse{0%,100%{opacity:.3;transform:translate(-50%,-50%) scale(1)}50%{opacity:.1;transform:translate(-50%,-50%) scale(1.05)}}

/* RESPONSIVE */
@media(max-width:968px){
  .ks-nav-links{display:none}
  .ks-nav-burger{display:flex}
  .ks-nav-links.open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:rgba(26,16,24,.97);backdrop-filter:blur(20px);padding:1.5rem 2.5rem;gap:1.25rem}
  .ks-about-grid{grid-template-columns:1fr;gap:2.5rem}
  .ks-music-grid{grid-template-columns:1fr 1fr}
  .ks-gallery-grid{grid-template-columns:repeat(3,1fr);grid-auto-rows:180px}
  .ks-gallery-item:first-child{grid-column:span 1;grid-row:span 1}
  .ks-reviews-grid{grid-template-columns:1fr}
  .ks-contact-grid{grid-template-columns:1fr;gap:3rem}
  .ks-event-row{grid-template-columns:auto 1fr;gap:1rem}
  .ks-event-row .ks-badge{grid-column:2}
  .ks-event-row .ks-btn-outline{grid-column:2;justify-self:start}
  .ks-tabs{flex-direction:column}
  .ks-track{padding:.65rem 1.25rem}
  .ks-track-info{flex-direction:column;gap:.15rem}
  .ks-countdown{gap:1.5rem}
}
@media(max-width:640px){
  .ks-music-grid{grid-template-columns:1fr}
  .ks-gallery-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:160px}
  .ks-stats{flex-direction:column;gap:1.5rem;align-items:flex-start}
  section{padding:4rem 1.25rem}
  .ks-nav{padding:1rem 1.25rem}
  .ks-countdown{gap:1rem}
}