/* ============================================
   UNITAS FLYING ACADEMY — Shared Site Header
   Used on every page. Keep this the single source
   of truth for header/nav markup + styling.
   ============================================ */

.site-header{position:fixed;top:0;left:0;width:100%;z-index:1000;transition:background var(--transition-base,300ms),box-shadow var(--transition-base,300ms),backdrop-filter var(--transition-base,300ms)}
.site-header.scrolled{background:rgba(255,255,255,0.95);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 1px 3px rgba(11,31,58,0.06)}

/* Pages with no image directly behind the header (e.g. Courses) force the solid state at all times */
.site-header.header-solid{background:rgba(255,255,255,0.95);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 1px 3px rgba(11,31,58,0.06)}

.header-inner{max-width:1440px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:16px 32px}

.logo{display:flex;align-items:center;gap:12px}
.logo-img{height:48px;width:auto;max-width:220px;object-fit:contain;filter:drop-shadow(0 2px 6px rgba(0,0,0,0.2));transition:transform 300ms ease}
.logo:hover .logo-img{transform:scale(1.03)}
.logo-icon{width:40px;height:40px;background:var(--color-primary,#0057B8);border-radius:8px;display:flex;align-items:center;justify-content:center}
.logo-icon svg{width:24px;height:24px;fill:#FFFFFF}
.logo-text{display:flex;flex-direction:column;line-height:1.15}
.logo-name{font-size:16px;font-weight:700;color:#FFFFFF;transition:color 300ms}
.scrolled .logo-name,.header-solid .logo-name{color:#0B1F3A}
.logo-tagline{font-size:11px;font-weight:500;color:rgba(255,255,255,0.7);letter-spacing:0.06em;transition:color 300ms}
.scrolled .logo-tagline,.header-solid .logo-tagline{color:#6B7280}

.nav-links{display:flex;align-items:center;gap:28px}
.nav-links a{font-size:15px;font-weight:500;color:rgba(255,255,255,0.85);position:relative;padding:4px 0;transition:color 300ms}
.scrolled .nav-links a,.header-solid .nav-links a{color:#6B7280}
.nav-links a:hover,.nav-links a.active{color:#FFFFFF}
.scrolled .nav-links a:hover,.scrolled .nav-links a.active,.header-solid .nav-links a:hover,.header-solid .nav-links a.active{color:var(--color-primary,#0057B8)}
.nav-links a::after{content:'';position:absolute;bottom:-2px;left:0;width:0;height:2px;background:var(--color-primary,#0057B8);border-radius:1px;transition:width 300ms}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}

.nav-cta{background:var(--color-primary,#0057B8)!important;color:#FFFFFF!important;padding:12px 24px!important;border-radius:14px!important;font-weight:600!important;font-size:16px!important;box-shadow:0 2px 8px rgba(0,87,184,0.3);transition:background 300ms,transform 300ms,box-shadow 300ms!important}
.nav-cta::after{display:none!important}
.nav-cta:hover{background:#004a9e!important;transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,87,184,0.4)}

.menu-toggle{display:none;flex-direction:column;gap:5px;padding:8px}
.menu-toggle span{display:block;width:24px;height:2px;background:#FFFFFF;border-radius:1px;transition:all 300ms}
.scrolled .menu-toggle span,.header-solid .menu-toggle span{background:#0B1F3A}

@media(max-width:1024px){
  .nav-links{display:none}
  .menu-toggle{display:flex}

  .nav-links.mobile-open{display:flex;flex-direction:column;position:fixed;top:0;left:0;width:100%;height:100vh;background:#0B1F3A;z-index:999;justify-content:center;align-items:center;gap:32px;padding:48px}
  .nav-links.mobile-open a{font-size:20px;color:rgba(255,255,255,0.85)}
  .nav-links.mobile-open .nav-cta{margin-top:16px}
  .mobile-close{position:absolute;top:24px;right:24px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:#FFFFFF;font-size:28px;cursor:pointer;background:none;border:none}
}

/* ============================================
   UNIFIED SITE FOOTER STYLING
   ============================================ */
.site-footer {
  background: #06101E !important;
  color: #FFFFFF !important;
  padding: 80px 0 32px !important;
  font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.footer-container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 32px;
}

.footer-grid {
  display: grid !important;
  grid-template-columns: 1.8fr 1fr 1.1fr 1.6fr !important;
  gap: 48px !important;
  margin-bottom: 64px !important;
}

.footer-brand-col {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.footer-logo {
  display: inline-block;
  margin-bottom: 4px;
}

.footer-logo-img {
  height: 52px;
  width: auto;
  max-width: 240px;
  object-fit: contain;
}

.footer-about-title {
  font-size: 18px;
  font-weight: 700;
  color: #FFFFFF;
  margin: 0;
}

.footer-description {
  font-size: 14px;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.65);
  margin: 0;
}

.footer-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(0, 87, 184, 0.2);
  border: 1px solid rgba(0, 87, 184, 0.4);
  padding: 8px 14px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 600;
  color: #38BDF8;
  width: fit-content;
}

.footer-badge svg {
  width: 16px;
  height: 16px;
  stroke: #38BDF8;
}

.footer-social-wrapper {
  margin-top: 8px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.footer-social-title {
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: rgba(255, 255, 255, 0.7);
}

.footer-social-links {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.social-icon-btn {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  transition: all 250ms ease;
  text-decoration: none;
}

.social-icon-btn svg {
  width: 18px;
  height: 18px;
}

.social-icon-btn:hover {
  background: #0057B8;
  border-color: #0057B8;
  transform: translateY(-3px);
  box-shadow: 0 4px 12px rgba(0, 87, 184, 0.4);
}

.social-icon-btn.instagram:hover { background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888); border-color: transparent; }
.social-icon-btn.facebook:hover { background: #1877F2; border-color: #1877F2; }
.social-icon-btn.whatsapp:hover { background: #25D366; border-color: #25D366; }
.social-icon-btn.youtube:hover { background: #FF0000; border-color: #FF0000; }
.social-icon-btn.linkedin:hover { background: #0A66C2; border-color: #0A66C2; }
.social-icon-btn.tiktok:hover { background: #000000; border-color: #FE2C55; box-shadow: 0 0 10px rgba(254, 44, 85, 0.5); }

.footer-col {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.footer-heading {
  font-size: 16px;
  font-weight: 700;
  color: #FFFFFF;
  margin: 0;
  position: relative;
  padding-bottom: 8px;
}

.footer-heading::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 28px;
  height: 2px;
  background: #0057B8;
  border-radius: 1px;
}

.footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.footer-links a {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.65);
  text-decoration: none;
  transition: color 200ms ease, transform 200ms ease;
  display: inline-block;
}

.footer-links a:hover {
  color: #FFFFFF;
  transform: translateX(4px);
}

.footer-link-highlight {
  color: #38BDF8 !important;
  font-weight: 600;
}

.footer-contact-block {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.footer-contact-block:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.contact-block-label {
  font-size: 13px;
  font-weight: 700;
  color: #38BDF8;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 2px;
}

.contact-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 13px;
  gap: 8px;
}

.sub-label {
  color: rgba(255, 255, 255, 0.55);
}

.contact-link {
  color: #FFFFFF;
  font-weight: 600;
  text-decoration: none;
  transition: color 200ms ease;
}

.contact-link:hover {
  color: #38BDF8;
  text-decoration: underline;
}

.contact-location-item {
  font-size: 13px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.75);
}

.contact-location-item strong {
  color: #FFFFFF;
}

.map-link {
  color: #38BDF8;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  display: inline-block;
  margin-top: 2px;
  transition: opacity 200ms ease;
}

.map-link:hover {
  opacity: 0.85;
  text-decoration: underline;
}

.footer-bottom {
  padding-top: 32px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
}

.footer-copyright {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.45);
}

.footer-legal {
  display: flex;
  gap: 24px;
}

.footer-legal a {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.45);
  text-decoration: none;
  transition: color 200ms ease;
}

.footer-legal a:hover {
  color: rgba(255, 255, 255, 0.85);
}

@media (max-width: 1024px) {
  .footer-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 40px !important;
  }
}

@media (max-width: 640px) {
  .footer-grid {
    grid-template-columns: 1fr !important;
    gap: 36px !important;
  }

  .footer-bottom {
    flex-direction: column;
    align-items: flex-start;
  }
}