/* ==================================================================
   GLASS SYSTEM — shared glassmorphism utilities used by the v2 layout
   pass on every homepage section below the hero. One visual language
   (frosted translucent surface + soft colour-blob "aura" behind it so
   the blur has something to refract) reused everywhere instead of each
   section inventing its own. Prefix: .gl-*
   ================================================================== */

.gl-aura{ position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.gl-orb{ position: absolute; border-radius: 999px; filter: blur(60px); opacity: .42; }
.gl-orb--yellow{ background: radial-gradient(circle,#E8A200,transparent 70%); }
.gl-orb--blue{ background: radial-gradient(circle,#1D1912,transparent 70%); }
@media (prefers-reduced-motion: no-preference){
  .gl-orb--drift{ animation: gl-drift 16s ease-in-out infinite; }
}
@keyframes gl-drift{ 0%,100%{ transform: translate(0,0) scale(1); } 50%{ transform: translate(-18px,16px) scale(1.06); } }

.gl-card{
  position: relative;
  background: linear-gradient(155deg, rgba(36, 31, 22, .68), rgba(36, 31, 22, .34));
  backdrop-filter: blur(18px) saturate(160%);
  -webkit-backdrop-filter: blur(18px) saturate(160%);
  border: 1px solid rgba(232,162,0,0.22);
  box-shadow: 0 12px 36px rgba(232,162,0,0.16), inset 0 1px 0 rgba(232,162,0,0.22);
  border-radius: 24px;
  transition: transform .4s cubic-bezier(.2,.7,.15,1), box-shadow .4s ease, border-color .4s ease;
}
.gl-card:hover{ transform: translateY(-4px); box-shadow: 0 22px 50px rgba(232,162,0,0.16), inset 0 1px 0 rgba(232,162,0,0.22); border-color: rgba(232,162,0,0.22); }

/* Slightly stronger glass for surfaces sitting directly over a busy
   photo/gradient (needs more opacity to keep text legible). */
.gl-card--solid{
  background: rgba(36, 31, 22, .82);
  backdrop-filter: blur(20px) saturate(140%);
  -webkit-backdrop-filter: blur(20px) saturate(140%);
}

.gl-chip{
  display: inline-flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg,#FFC72C,#E8A200 55%,#C8860B);
  color: #F5EFE0; border-radius: 16px; box-shadow: 0 8px 20px rgba(200,134,11,0.22);
}
.gl-chip--bronze{ background: linear-gradient(135deg,#D9B666,#B5830F 55%,#8A5A0A); color: #FFF3D6; box-shadow: 0 8px 20px rgba(200,134,11,0.22); }

.gl-eyebrow-pill{
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(36, 31, 22, .55); border: 1px solid rgba(232,162,0,0.22);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border-radius: 999px; padding: 7px 16px; font-family: var(--vk-font-en);
  font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #C9BFA8;
}