:root{box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);background:#0a0f0b}
html{scroll-behavior:smooth;scroll-padding-top:calc(5rem + env(safe-area-inset-top,0px))}
body{background:#0a0f0b}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:#0a0f0b;z-index:60}
.gold-text{background:linear-gradient(135deg,#fff7c2 0%,#e5c158 40%,#b88e28 80%,#fef3a3 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.gold-bg{background:linear-gradient(135deg,#fef0a0 0%,#d4af37 50%,#997519 100%)}
.glow{filter:drop-shadow(0 0 30px rgba(212,175,55,.4)) drop-shadow(0 0 14px rgba(255,85,0,.3))}
.hero-bg{background:radial-gradient(circle at 50% 30%,rgba(255,120,0,.12),transparent 45%),radial-gradient(circle at 50% 20%,rgba(212,175,55,.15),transparent 60%),radial-gradient(circle at 80% 10%,rgba(46,125,50,.25),transparent 50%),linear-gradient(180deg,#0e1811,#15251a 50%,#0a0f0b)}
.gb{border:1px solid rgba(212,175,55,.25);transition:.3s}
.gb:hover{border-color:rgba(212,175,55,.7);box-shadow:0 10px 30px -10px rgba(212,175,55,.15)}
@keyframes pulse2{0%,100%{transform:scale(1);opacity:.92}50%{transform:scale(1.02);opacity:1}}
.flame{animation:pulse2 4s infinite ease-in-out}
.ic{width:3.5rem;height:3.5rem;font-size:1.6rem}

.fx{position:absolute;left:3%;right:48%;bottom:9%;height:32%;pointer-events:none;z-index:5;clip-path:inset(-300% -20% 0 -20%)}
.fx .glow{position:absolute;left:0;right:0;bottom:0;height:70%;background:radial-gradient(ellipse at 50% 100%,rgba(255,110,20,.62),rgba(255,110,20,.18) 45%,rgba(255,110,20,0) 72%);mix-blend-mode:screen;animation:flick 2s ease-in-out infinite}
.fx .flame{position:absolute;bottom:0;border-radius:50% 50% 40% 40%/80% 80% 20% 20%;background:radial-gradient(ellipse at 50% 88%,#fff6bf 0%,#ffbf3a 32%,#ff6a10 62%,rgba(255,70,0,0) 78%);filter:blur(3px);mix-blend-mode:screen;transform-origin:50% 100%;animation:fl var(--d) ease-in-out infinite alternate;animation-delay:var(--dl)}
.fx .smoke{position:absolute;bottom:0;width:clamp(50px,12%,170px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(250,248,243,.9),rgba(250,248,243,0) 70%);filter:blur(5px);opacity:0;animation:smk var(--d) linear infinite;animation-delay:var(--dl)}
.fx .ember{position:absolute;bottom:0;border-radius:50%;background:#ffcf6a;box-shadow:0 0 12px 4px rgba(255,125,20,.95);opacity:0;mix-blend-mode:screen;animation:emb var(--d) ease-out infinite;animation-delay:var(--dl)}
.fx .spark{position:absolute;bottom:2%;width:4px;height:4px;border-radius:50%;background:#fff7cf;box-shadow:0 0 9px 3px rgba(255,210,90,1);opacity:0;animation:spk var(--d) ease-out infinite;animation-delay:var(--dl)}
@keyframes flick{0%,100%{opacity:.65}30%{opacity:1}55%{opacity:.72}80%{opacity:1}}
@keyframes fl{0%{transform:scale(1,.78) skewX(-4deg);opacity:.85}50%{transform:scale(.92,1.12) skewX(3deg);opacity:1}100%{transform:scale(1.05,.9) skewX(-2deg);opacity:.9}}
@keyframes smk{0%{bottom:0;transform:translateX(0) scale(.6);opacity:0}20%{opacity:.9}100%{bottom:90%;transform:translateX(var(--dx)) scale(2.4);opacity:0}}
@keyframes emb{0%{bottom:0;transform:translateX(0) scale(1);opacity:0}12%{opacity:1}100%{bottom:105%;transform:translateX(var(--dx)) scale(.2);opacity:0}}
@keyframes spk{0%{bottom:2%;transform:translateX(0) scale(.4);opacity:0}8%{opacity:1}35%{bottom:34%;transform:translateX(calc(var(--dx)*.6)) scale(1.1);opacity:1}100%{bottom:6%;transform:translateX(var(--dx)) scale(.2);opacity:0}}
@media (prefers-reduced-motion:reduce){.fx .smoke,.fx .ember,.fx .spark{animation:none;opacity:0}.fx .flame{animation:none}.fx .glow{animation:none;opacity:.7}}
#imgB{-webkit-mask-image:linear-gradient(to right,#000 0,#000 58%,transparent 70%),linear-gradient(to bottom,transparent 14%,#000 27%);-webkit-mask-composite:source-in;mask-image:linear-gradient(to right,#000 0,#000 58%,transparent 70%),linear-gradient(to bottom,transparent 14%,#000 27%);mask-composite:intersect}
