::selection { background: rgba(212,43,43,.2); color: #D42B2B; }
html { scroll-behavior: smooth; }
body { font-family: 'Inter', sans-serif; color: #e0e0e0; background: #0A0A0A; overflow-x: hidden; }
.font-serif { font-family: 'Playfair Display', serif; }

/* Hero Zoom & Background */
@keyframes slowZoom {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}
.hero-bg {
    position: absolute;
    inset: 0;
    background: url('../images/hero.jpg') no-repeat center center / cover;
    animation: slowZoom 25s ease-in-out infinite;
    z-index: -1;
}

.smoke-wrap { position: absolute; inset: 0; overflow: hidden; z-index: 0; }
.smoke-blob {
    position: absolute; border-radius: 50%;
    filter: blur(100px); opacity: 0;
    animation: smokeDrift 18s ease-in-out infinite;
}
.smoke-blob.s1 { width: 500px; height: 500px; background: rgba(30,140,58,.45); top: 10%; left: -5%; animation-delay: 0s; animation-duration: 20s; }
.smoke-blob.s2 { width: 600px; height: 600px; background: rgba(245,197,24,.35); top: 20%; left: 30%; animation-delay: -4s; animation-duration: 22s; }
.smoke-blob.s3 { width: 500px; height: 500px; background: rgba(212,43,43,.4); top: 5%; right: -5%; animation-delay: -8s; animation-duration: 19s; }
.smoke-blob.s4 { width: 400px; height: 400px; background: rgba(30,140,58,.3); bottom: 10%; left: 20%; animation-delay: -12s; animation-duration: 24s; }
.smoke-blob.s5 { width: 450px; height: 450px; background: rgba(245,197,24,.25); bottom: 5%; right: 15%; animation-delay: -6s; animation-duration: 21s; }
.smoke-blob.s6 { width: 350px; height: 350px; background: rgba(212,43,43,.25); top: 40%; left: 50%; animation-delay: -15s; animation-duration: 23s; }

@keyframes smokeDrift {
    0%   { opacity: 0; transform: translate(0, 0) scale(0.8); }
    15%  { opacity: 1; }
    50%  { opacity: 0.8; transform: translate(60px, -40px) scale(1.15); }
    85%  { opacity: 1; }
    100% { opacity: 0; transform: translate(-30px, 30px) scale(0.9); }
}

.smoke-mini {
    position: absolute; border-radius: 50%;
    filter: blur(80px); pointer-events: none;
    animation: miniSmoke 12s ease-in-out infinite alternate;
}
@keyframes miniSmoke {
    0%   { transform: translate(0,0) scale(1); }
    100% { transform: translate(20px,-15px) scale(1.1); }
}

.fu { opacity: 0; transform: translateY(28px); transition: all .85s cubic-bezier(.16,1,.3,1); }
.fu.v { opacity: 1; transform: translateY(0); }
.st .fu:nth-child(1){transition-delay:.05s} .st .fu:nth-child(2){transition-delay:.12s}
.st .fu:nth-child(3){transition-delay:.19s} .st .fu:nth-child(4){transition-delay:.26s}
.st .fu:nth-child(5){transition-delay:.33s} .st .fu:nth-child(6){transition-delay:.4s}

.flame { animation: fl 1.8s ease-in-out infinite alternate; }
@keyframes fl {
    0%{transform:scale(1) rotate(-1deg);opacity:1} 50%{transform:scale(1.06) rotate(1deg);opacity:.88} 100%{transform:scale(.94) rotate(-1.5deg);opacity:1}
}
.bslow { animation: bsl 2.5s ease-in-out infinite; }
@keyframes bsl { 0%,100%{transform:translateY(0)} 50%{transform:translateY(10px)} }

.ptcl { position:absolute; border-radius:50%; animation: rise linear infinite; }
@keyframes rise {
    0%{transform:translateY(0) scale(1);opacity:0} 8%{opacity:.8} 85%{opacity:.4} 100%{transform:translateY(-110vh) scale(.2);opacity:0}
}

.mc { transition: all .3s ease; border: 1px solid #222; }
.mc:hover { transform: translateY(-4px); border-color: rgba(212,43,43,.25); box-shadow: 0 12px 40px rgba(0,0,0,.4); }

.btn-sh { position:relative; overflow:hidden; }
.btn-sh::after { content:''; position:absolute; inset:0; background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.12) 50%,transparent 60%); transform:translateX(-120%); transition:transform .5s ease; }
.btn-sh:hover::after { transform:translateX(120%); }

.tl-dot { transition: all .25s ease; }
.tl-dot:hover { background:#D42B2B!important; transform:scale(1.5); box-shadow:0 0 0 6px rgba(212,43,43,.15); }

.tst { transform:translateY(20px); opacity:0; transition:all .4s cubic-bezier(.16,1,.3,1); }
.tst.sh { transform:translateY(0); opacity:1; }

.nav-s { background:rgba(10,10,10,.95)!important; backdrop-filter:blur(16px)!important; box-shadow:0 2px 30px rgba(0,0,0,.5); }

.pf { transition:all .5s cubic-bezier(.16,1,.3,1); }
.pf:hover { transform:translateY(-5px); box-shadow:0 16px 40px rgba(0,0,0,.4); }

.tri-line { height: 3px; background: linear-gradient(90deg, #1E8C3A, #F5C518, #D42B2B); border-radius: 2px; }

.phf { background:#111; border:1px dashed rgba(255,255,255,.1); }

.glow-r { text-shadow: 0 0 40px rgba(212,43,43,.3); }
.glow-y { text-shadow: 0 0 40px rgba(245,197,24,.25); }

/* Lightbox Styles */
#lb { position: fixed; inset: 0; background: rgba(5,5,5,.98); backdrop-filter: blur(20px); z-index: 1000; opacity: 0; pointer-events: none; transition: all .4s cubic-bezier(.16,1,.3,1); display: flex; align-items: center; justify-content: center; }
#lb.v { opacity: 1; pointer-events: auto; }
#lb-img { max-height: 85vh; max-width: 90vw; border-radius: 12px; transform: scale(.9); transition: transform .5s cubic-bezier(.16,1,.3,1); box-shadow: 0 30px 60px rgba(0,0,0,.8); border: 1px solid rgba(255,255,255,.05); }
#lb.v #lb-img { transform: scale(1); }
.lb-btn { position: absolute; background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.08); color: white; width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: all .2s ease; cursor: pointer; }
.lb-btn:hover { background: rgba(255,255,255,.1); transform: scale(1.1); }
#lb-close { top: 30px; right: 30px; }
#lb-prev { left: 30px; }
#lb-next { right: 30px; }