@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;900&family=Space+Grotesk:wght@500;600;700;900&display=swap');

body {
  font-family: 'Inter', system-ui, sans-serif;
  background: #0a0503;
  color: #fff;
  margin: 0;
}

.hero-font {
  font-family: 'Fjalla One', sans-serif;
  letter-spacing: 0.08em;
}

.glass {
  background: rgba(255, 103, 0, 0.08);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 135, 0, 0.15);
}

.pumpkin-glow {
  box-shadow: 0 0 40px rgba(255, 103, 0, 0.6), 0 0 80px rgba(255, 167, 0, 0.4);
}

.tg-emoji{
width:22px;
height:22px;
vertical-align:-4px;
}

.tg-btn{
display:inline-block;
padding:6px 12px;
margin:4px;
background:#2481cc;
color:white;
border-radius:6px;
text-decoration:none;
}

.neon-card {
  position: relative;
  /* overflow: hidden; <--- removed so glow bleeds outside the border nicely */
}

.neon-card::before {
  content: '';
  position: absolute;
  inset: -1px;
  background: linear-gradient(45deg, #ff6700, #ff4500, #ff8c00);
  filter: blur(20px);
  opacity: 0;
  transition: opacity 0.4s ease;
  z-index: -1;
}

.neon-card:hover::before {
  opacity: 0.6;
}

@keyframes glow {
  0% { background-position: 0% 50%; }
  100% { background-position: 100% 50%; }
}

.social-card {
  position: relative;
  overflow: hidden;
  transition: transform .45s cubic-bezier(.175,.885,.32,1.275), box-shadow .45s;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.07);
}

.social-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,103,0,0.08) 0%, transparent 60%);
  opacity: 0;
  transition: opacity .4s;
  pointer-events: none;
}

.social-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 24px 48px -12px rgba(255, 103, 0, 0.25);
}
.social-card:hover::before { opacity: 1; }

.social-card > *:not(.card-border-glow) {
  position: relative;
  z-index: 1;
}

.icon-glow {
  transition: all 0.4s;
}

.social-card:hover .icon-glow {
  transform: scale(1.2) rotate(10deg);
  filter: drop-shadow(0 0 20px #ff6700);
}

.hero-bg {
  background: radial-gradient(circle at 20% 30%, rgba(255, 103, 0, 0.3) 0%, transparent 60%),
              radial-gradient(circle at 80% 70%, rgba(255, 167, 0, 0.25) 0%, transparent 60%);
}

.spoiler-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.7s ease, opacity 0.7s ease;
  opacity: 0;
}

.spoiler-open .spoiler-content {
  max-height: 1600px;
  opacity: 1;
  overflow: visible;
}

@media (max-width: 640px) {
  h1 { font-size: 3.5rem; line-height: 0.95; }
  .text-9xl { font-size: 4rem; }
  .text-7xl { font-size: 2.75rem; }
  .text-3xl { font-size: 1.4rem; }
  .p-8 { padding: 1.25rem; }
  .py-24 { padding-top: 3.5rem; padding-bottom: 3.5rem; }
  .gap-8 { gap: 1.25rem; }
  .mt-10 { margin-top: 1.5rem; }
  .w-16 { width: 64px !important; height: 64px !important; }
  .min-w-\[64px\] { min-width: 64px !important; }
}