/* ============================================================
   HERO — Hero section styles
   /assets/css/header.css
============================================================ */

/* ── Hero ── */
.ggn-hero {
  position: relative;
  min-height: 100svh;
  display: flex;
  align-items: center;
  overflow: hidden;
}

/* Background layers */
.ggn-hero__bg { position: absolute; inset: 0; z-index: 0; }
.ggn-hero__bg-img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center;
}
.ggn-hero__video {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center;
}
.ggn-hero__overlay {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(160deg,
    rgba(10,22,40,.87) 0%,
    rgba(6,51,72,.72)  55%,
    rgba(10,79,110,.48) 100%
  );
}
/* When no image, use CSS gradient background */
.ggn-hero:not([style*="--hero-bg"]) .ggn-hero__bg {
  background: linear-gradient(135deg, #0A4F6E 0%, #063348 55%, #0d1b2a 100%);
}
.ggn-hero[style*="--hero-bg"] .ggn-hero__bg {
  background: var(--hero-bg) center center / cover no-repeat;
}

/* Decorative orbs */
.ggn-hero__orb {
  position: absolute; border-radius: 50%; z-index: 1; pointer-events: none;
  animation: float 8s ease-in-out infinite;
}
.ggn-hero__orb--1 {
  top: 20%; left: 5%; width: 300px; height: 300px;
  background: radial-gradient(circle, rgba(232,131,42,.12) 0%, transparent 70%);
}
.ggn-hero__orb--2 {
  bottom: 15%; right: 8%; width: 250px; height: 250px;
  background: radial-gradient(circle, rgba(201,168,76,.10) 0%, transparent 70%);
  animation-duration: 6s; animation-delay: 2s;
}

/* Content */
.ggn-hero__inner {
  position: relative; z-index: 2;
  padding-top: calc(var(--header-h, 112px) + 3.5rem);
  padding-bottom: 5rem;
}
.ggn-hero__content { text-align: center; max-width: 860px; margin: 0 auto; }

/* Badge */
.ggn-hero__badge {
  display: inline-flex; align-items: center; gap: .55rem;
  background: rgba(232,131,42,.16); border: 1px solid rgba(232,131,42,.38);
  border-radius: 9999px; padding: .45rem 1.25rem; margin-bottom: 1.75rem;
  color: rgba(255,255,255,.92); font-size: .76rem; font-weight: 600;
  letter-spacing: .05em; backdrop-filter: blur(10px);
}
.ggn-hero__badge-dot { color: var(--flame, #E8832A); font-size: .7rem; }

/* Title */
.ggn-hero__title {
  color: #fff;
  font-family: var(--serif, 'Playfair Display', serif);
  font-size: clamp(2.5rem, 7vw, 5rem);
  line-height: 1.1;
  margin-bottom: 1.25rem;
  text-shadow: 0 4px 32px rgba(0,0,0,.28);
}

/* Subtitle */
.ggn-hero__subtitle {
  color: rgba(255,255,255,.82);
  font-size: clamp(1rem, 2.5vw, 1.3rem);
  max-width: 620px; margin: 0 auto 2.75rem;
  line-height: 1.75;
}

/* CTAs */
.ggn-hero__ctas {
  display: flex; gap: 1rem; justify-content: center;
  flex-wrap: wrap; margin-bottom: 2.25rem;
}

/* Trust row */
.ggn-hero__trust {
  display: flex; align-items: center; justify-content: center;
  gap: 1.375rem; flex-wrap: wrap; margin-bottom: 3rem;
}
.ggn-hero__trust-item {
  display: flex; align-items: center; gap: .35rem;
  color: rgba(255,255,255,.8); font-size: .78rem; font-weight: 500;
}

/* Scroll indicator */
.ggn-hero__scroll {
  position: absolute; bottom: 2.25rem; left: 50%; transform: translateX(-50%);
  z-index: 2; display: flex; flex-direction: column; align-items: center; gap: .4rem;
  color: rgba(255,255,255,.45); font-size: .65rem; letter-spacing: .12em;
  text-transform: uppercase; text-decoration: none;
  animation: heroFloat 2.5s ease-in-out infinite;
}
.ggn-hero__scroll:hover { color: rgba(255,255,255,.75); }
.ggn-hero__scroll-mouse {
  width: 22px; height: 36px; border: 1.5px solid rgba(255,255,255,.32);
  border-radius: 11px; display: flex; justify-content: center; padding-top: 6px;
}
.ggn-hero__scroll-dot {
  width: 3px; height: 8px; background: rgba(255,255,255,.5);
  border-radius: 2px; animation: scrollDot 2s ease infinite;
}

/* Animations */
@keyframes heroFloat {
  0%,100% { opacity:.45; transform: translateX(-50%) translateY(0); }
  50%      { opacity:.8;  transform: translateX(-50%) translateY(-4px); }
}
@keyframes scrollDot {
  0%   { opacity:1; transform: translateY(0); }
  100% { opacity:0; transform: translateY(14px); }
}

/* ── Hero Responsive ── */
@media (max-width: 768px) {
  :root { --header-h: 62px; }
  .ggn-hero__inner { padding-top: calc(var(--header-h,62px) + 2.5rem); padding-bottom: 3.5rem; }
  .ggn-hero__ctas  { flex-direction: column; align-items: center; }
  .ggn-hero__ctas .btn { width: 100%; max-width: 280px; }
  .ggn-hero__trust { gap: .875rem; }
  .ggn-hero__orb   { display: none; }
}
@media (max-width: 480px) {
  .ggn-hero__title { font-size: 2.25rem; }
  .ggn-hero__trust { flex-direction: column; align-items: flex-start; padding: 0 1rem; }
}
