/*
Theme Name: Detty December Fest
Theme URI: https://dettydecfest.com
Author: Livespot360
Description: Pixel-perfect Detty December Fest 2026 site, sticker-pop design system, events calendar, line-up, planner, VIP and lead capture. Content is editable via the DDF Content plugin (events, artists, vendors, partners, FAQs) and the Customizer (copy, video, contacts, socials).
Version: 1.0.0
Requires PHP: 7.4
License: GPL-2.0+
Text Domain: ddf
*/

/* Global shell styles that lived in the page helmets (tokens come from assets/ds/styles.css) */
html{scroll-padding-top:150px}
body{margin:0;background:var(--ink-900);color:var(--cream);font-family:var(--font-sans)}
a{color:var(--cream)}a:hover{color:var(--cream-bright)}
input::placeholder{color:rgba(255,237,222,.45)}
[data-surface="cream"] input::placeholder{color:rgba(22,22,22,.4)}

.ddf-spin{transition:transform .6s var(--ease-bounce)}
.ddf-spinhost:hover .ddf-spin{transform:rotate(360deg)}
.ddf-zoom{transition:transform .5s var(--ease-bounce)}
.ddf-zoomhost:hover .ddf-zoom{transform:scale(1.07)}
.ddf-swing{animation:ddfSwing 3.8s ease-in-out infinite;transform-origin:50% -10px}

@keyframes ddfBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes ddfSwing{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
@keyframes ddfPulse{0%{box-shadow:0 0 0 0 rgba(51,171,255,.55)}100%{box-shadow:0 0 0 16px rgba(51,171,255,0)}}
@keyframes ddfQPulse{0%,100%{transform:scale(1);opacity:.72}50%{transform:scale(1.16);opacity:1}}
@keyframes ddfSummer{0%,100%{background-position:0% 50%;transform:translateY(0) rotate(-1.5deg)}25%{transform:translateY(-7px) rotate(1.3deg) scale(1.05)}50%{background-position:100% 50%;transform:translateY(0) rotate(-1deg)}75%{transform:translateY(-7px) rotate(1.5deg) scale(1.05)}}
@keyframes ddfLabelGlow{0%,100%{opacity:.5;text-shadow:0 0 0 rgba(51,171,255,0)}50%{opacity:1;text-shadow:0 0 14px rgba(51,171,255,.95)}}
@keyframes ddfMatchGlow{0%,100%{box-shadow:var(--shadow-sticker),0 0 0 2px rgba(0,255,180,.35),0 0 16px 2px rgba(0,255,180,.22)}50%{box-shadow:var(--shadow-sticker),0 0 0 3px rgba(0,255,180,.9),0 0 42px 9px rgba(0,255,180,.6)}}
.ddf-match-glow{animation:ddfMatchGlow 1.5s ease-in-out infinite}
@keyframes ddfQGlow{0%,100%{transform:scale(1);text-shadow:0 0 0 rgba(0,255,180,0);-webkit-text-stroke-color:rgba(255,237,222,.5)}50%{transform:scale(1.09);text-shadow:0 0 30px rgba(0,255,180,.7);-webkit-text-stroke-color:#00FFB4}}
@keyframes ddfKenA{0%{opacity:0;transform:scale(1.06)}6%{opacity:1}33%{opacity:1;transform:scale(1.16)}40%{opacity:0;transform:scale(1.18)}100%{opacity:0}}
@keyframes ddfKen{0%{opacity:0;transform:scale(1.06)}7%{opacity:1}34%{opacity:1;transform:scale(1.17)}42%{opacity:0;transform:scale(1.19)}100%{opacity:0;transform:scale(1.06)}}
@keyframes ddfPopIn{0%{opacity:0;transform:scale(.92) translateY(10px)}100%{opacity:1;transform:scale(1) translateY(0)}}
.ddf-pop{animation:ddfPopIn .28s var(--ease-bounce)}

/* Featured crossfade slides */
.ddf-fade-track{display:grid}
.ddf-fade-slide{grid-area:1/1;min-width:0;transition:opacity 1.1s ease,transform 1.1s ease;opacity:0;transform:scale(1.045);z-index:0;pointer-events:none}
.ddf-fade-slide.is-active{opacity:1;transform:scale(1);z-index:1;pointer-events:auto}

/* Utility state classes toggled by main.js */
.ddf-hidden{display:none!important}
@media(max-width:880px){.ddf-hero-icons{display:none!important}}
@keyframes ddfWaveGlow{0%,100%{box-shadow:var(--shadow-sticker-sm),0 0 0 0 rgba(0,255,180,.55)}50%{box-shadow:var(--shadow-sticker-sm),0 0 28px 6px rgba(0,255,180,.72)}}
.ddf-wave-live{animation:ddfWaveGlow 1.8s ease-in-out infinite}
.ddf-modal-open{overflow:hidden}

/* FAQ accordion */
details.ddf-faq summary{list-style:none;cursor:pointer}
details.ddf-faq summary::-webkit-details-marker{display:none}
details.ddf-faq[open] .ddf-faq-plus{transform:rotate(45deg)}
.ddf-faq-plus{transition:transform .2s var(--ease-bounce)}

/* Burger */
.ddf-burger{display:none;position:relative;margin-left:auto;z-index:60}
.ddf-burger summary{list-style:none}
.ddf-burger summary::-webkit-details-marker{display:none}
.ddf-bottombar{display:none}

@media (max-width:880px){
.ddf-desktopnav{display:none!important}
.ddf-headcta{display:none!important}
.ddf-modechips{display:none!important}
.ddf-hide-m{display:none!important}
.ddf-burger{display:block}
header img.ddf-logo{height:52px!important}
.ddf-bottombar{display:flex!important;position:fixed;left:14px;right:14px;bottom:calc(6px + env(safe-area-inset-bottom,0px));z-index:80;background:var(--cream);border:var(--outline-ink);border-radius:999px;box-shadow:var(--shadow-sticker);padding:4px 6px;justify-content:space-around;align-items:center}
.ddf-bottombar span{color:var(--ink)!important;font-size:8.5px!important}
.ddf-bottombar a{border-radius:999px;padding:5px 11px;border:2px solid transparent;display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none}
.ddf-bottombar a img{width:25px!important;height:25px!important}
.ddf-bottombar a[aria-current]{background:var(--accent-soft);border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink)}
.ddf-chatfab{bottom:112px!important;width:54px!important;height:54px!important}
.ddf-chatfab img{width:46px!important;height:46px!important}
footer.ddf-footer{padding-bottom:150px!important}
.ddf-snap{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px!important;padding:4px 2px 16px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.ddf-snap::-webkit-scrollbar{display:none}
.ddf-snap>.ddf-zoomhost{height:230px!important}
.ddf-snap>*{flex:0 0 78%!important;scroll-snap-align:center;min-width:0}
}

.ddf-cat .ddf-cat-head{transform-origin:48px 46px;animation:ddfCatTilt 7s ease-in-out infinite}
.ddf-cat .ddf-cat-earL{transform-origin:28px 20px;animation:ddfCatEar 5.5s ease-in-out infinite}
.ddf-cat .ddf-cat-earR{transform-origin:68px 20px;animation:ddfCatEar 5.5s ease-in-out 2.7s infinite}
.ddf-cat .ddf-cat-whL{transform-origin:27px 51px;animation:ddfCatWhisk 4.6s ease-in-out infinite}
.ddf-cat .ddf-cat-whR{transform-origin:69px 51px;animation:ddfCatWhisk 4.6s ease-in-out 2.3s infinite}
.ddf-cat-scoot .ddf-cat-head{transform-origin:68px 42px}
.ddf-cat-scoot .ddf-cat-earL{transform-origin:54px 16px}
.ddf-cat-scoot .ddf-cat-earR{transform-origin:82px 16px}
.ddf-cat-scoot .ddf-cat-whL{transform-origin:52px 47px}
.ddf-cat-scoot .ddf-cat-whR{transform-origin:84px 47px}
@keyframes ddfCatTilt{0%,100%{transform:rotate(0deg)}30%{transform:rotate(-3.5deg)}64%{transform:rotate(2.5deg)}}
@keyframes ddfCatEar{0%,86%,100%{transform:rotate(0deg)}90%{transform:rotate(-11deg)}95%{transform:rotate(5deg)}}
@keyframes ddfCatWhisk{0%,82%,100%{transform:rotate(0deg)}88%{transform:rotate(7deg)}94%{transform:rotate(-4deg)}}
.ddf-cat .ddf-cat-smile{animation:ddfCatSmile 9s ease-in-out infinite}
.ddf-cat .ddf-cat-open{transform-origin:48px 56px;transform:scaleY(0);animation:ddfCatOpen 9s ease-in-out infinite}
.ddf-cat-scoot .ddf-cat-open{transform-origin:68px 49px}
@keyframes ddfCatSmile{0%,54%,75%,100%{opacity:1}57%,72%{opacity:0}}
@keyframes ddfCatOpen{0%,54%,75%,100%{transform:scaleY(0)}59%,70%{transform:scaleY(1)}}

/* WP native menus (Appearance -> Menus) */
.ddf-desktopnav li{list-style:none;display:flex;margin:0}
.ddf-desktopnav li a{color:rgba(255,237,222,.7);font-size:14.5px;font-weight:600;padding:9px 13px;border-radius:var(--radius-pill);text-decoration:none}
.ddf-desktopnav li a:hover{color:var(--cream);background:rgba(255,237,222,.08)}
.ddf-desktopnav li.current-menu-item>a,.ddf-desktopnav li.current_page_item>a{color:var(--cream);background:rgba(255,237,222,.12)}
.ddf-burger li{list-style:none;margin:0}
.ddf-burger li a{display:block;color:var(--ink);font-size:15px;font-weight:700;padding:11px 14px;border-radius:12px;text-decoration:none}
.ddf-burger li a:hover{background:rgba(22,22,22,.07)}
.ddf-burger li.current-menu-item>a,.ddf-burger li.current_page_item>a{background:rgba(22,22,22,.07)}
.ddf-footer-menu{display:flex;gap:18px;font-size:13px;flex-wrap:wrap;justify-content:center;margin:0;padding:0}
.ddf-footer-menu li{list-style:none;display:flex;align-items:center;margin:0}
.ddf-footer-menu li+li::before{content:"|";opacity:.4;margin-right:18px}
.ddf-footer-menu li a{color:var(--text-secondary);text-decoration:none}
.ddf-footer-menu li a:hover{color:var(--cream)}

.ddf-cat-shades{animation:ddfShadeGlow 2.4s ease-in-out infinite}
@keyframes ddfShadeGlow{0%,100%{filter:drop-shadow(0 0 1px rgba(0,255,180,.55))}50%{filter:drop-shadow(0 0 5px rgba(0,255,180,1))}}