/* Shared page shell: mirrors the homepage header and footer without setting a background. */
.site-header {
  color: #ffffff;
  min-height: auto;
  padding: 28px 16px 90px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 20px;
  overflow: hidden;
  font-family: "Inter", Arial, sans-serif;
}


.site-header .tpwl-hero-brand {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
}

.site-header .tpwl-hero-logo,
.site-header .tpwl-logo__logo {
  width: 139px;
  height: 160px;
  background: no-repeat center / contain url("https://i.postimg.cc/W4bYyrCM/TICKETSANDFLY-LOGO-FINAL-(7).png");
  display: block;
  margin: 0 auto;
  position: relative;
  left: 50px;
  transform: translateX(-50%);
  z-index: 12;
}

.site-header .tpwl-hero-actions {
  position: absolute;
  right: 16px;
  top: 50%;
  display: flex;
  gap: 10px;
  transform: translateY(-50%);
}

.site-header .tpwl-hero-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  color: #ffffff;
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 50%;
  text-decoration: none;
}

.site-header .tpwl-hero-action:hover {
  background: rgba(255, 255, 255, 0.28);
}

.site-header .tpwl-hero-banner {
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
  padding: 24px;
  color: #ffffff;
  text-align: center;
  background: rgb(255 255 255 / 2%);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 30px;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.18);
}

.site-header .tpwl-hero-banner h2 {
  margin: 0;
  color: #ffffff;
  font-size: 28px;
  line-height: 1.15;
  font-weight: 800;
}

.site-header .tpwl-hero-banner p {
  max-width: 540px;
  margin: 14px auto 0;
  color: rgba(255, 255, 255, 0.9);
  font-size: 15px;
  line-height: 1.65;
}

.site-header .tpwl-hero-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 18px;
  padding: 10px 16px;
  color: #ffffff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.01em;
  background: #16a34a;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 999px;
}

.site-header .tpwl-hero-contact {
  display: none;
}

/* Older legal-page templates retain their original header markup for compatibility. */
.site-header > .container {
  display: none;
}

.site-header nav[aria-label="Primary"] {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin: 0 0 24px;
  padding: 12px 10px;
  overflow-x: visible;
  color: #ffffff;
  white-space: normal;
  background: rgba(15, 23, 42, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 28px;
  backdrop-filter: blur(8px);
}

.site-header nav[aria-label="Primary"] a {
  flex: 0 0 auto;
  padding: 10px 16px;
  color: #ffffff;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  transition: background 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
}

.site-header nav[aria-label="Primary"] a:hover,
.site-header nav[aria-label="Primary"] a.active {
  color: #ffffff;
  text-decoration: none;
  background: rgba(255, 255, 255, 0.22);
  border-color: rgba(255, 255, 255, 0.32);
  transform: translateY(-1px);
}

.site-footer {
  position: relative;
  overflow: hidden;
  margin-top: 60px;
  padding: 42px 18px 22px;
  color: #f8fafc;
  font-family: "Inter", Arial, sans-serif;
  background:
    radial-gradient(circle at top left, rgba(255, 82, 82, 0.2), transparent 28%),
    radial-gradient(circle at bottom right, rgba(59, 130, 246, 0.18), transparent 32%),
    linear-gradient(135deg, rgb(237 0 0 / 95%) 0%, rgb(0 0 0 / 90%) 100%);
}

.site-footer::before,
.site-footer::after {
  position: absolute;
  border-radius: 50%;
  filter: blur(40px);
  opacity: 0.45;
  pointer-events: none;
  content: "";
}

.site-footer::before {
  top: -60px;
  left: -60px;
  width: 260px;
  height: 260px;
  background: rgba(255, 80, 80, 0.22);
}

.site-footer::after {
  right: -90px;
  bottom: -90px;
  width: 320px;
  height: 320px;
  background: rgba(59, 130, 246, 0.18);
}

.site-footer .footer-cta,
.site-footer .footer-columns,
.site-footer .payment-badges,
.site-footer .footer-trust-highlights,
.site-footer .footer-partners,
.site-footer .newsletter,
.site-footer .footer-bottom {
  position: relative;
  z-index: 1;
}

.site-footer .footer-cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  max-width: 1100px;
  margin: 0 auto 36px;
  padding: 28px 30px;
  background: rgba(18, 18, 18, 0.75);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 24px;
}

.site-footer .footer-cta h3 {
  margin: 0;
  font-size: 24px;
  line-height: 1.2;
}

.site-footer .footer-cta p {
  max-width: 640px;
  margin: 8px 0 0;
  color: #e2e8f0;
  font-size: 15px;
}

.site-footer .cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.site-footer .cta-actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 20px;
  color: #ffffff;
  font-weight: 700;
  text-decoration: none;
  background: linear-gradient(135deg, #dc2626 0%, #2563eb 100%);
  border-radius: 999px;
}

.site-footer .footer-columns {
  display: grid;
  grid-template-columns: 1.8fr 1fr 1fr 1fr 1fr;
  gap: 28px;
  max-width: 1100px;
  margin: 0 auto 28px;
}

.site-footer .column h4 {
  margin: 0 0 16px;
  color: #f8fafc;
  font-size: 18px;
  font-weight: 700;
}

.site-footer .column p,
.site-footer .column li,
.site-footer .footer-bottom {
  color: #e2e8f0;
  font-size: 14px;
  line-height: 1.6;
}

.site-footer .column ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-footer .column li + li {
  margin-top: 8px;
}

.site-footer a {
  color: #ffffff;
  text-decoration: none;
}

.site-footer a:hover {
  color: #fecaca;
}

.site-footer .footer-bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  max-width: 1100px;
  margin: 0 auto;
  padding-top: 28px;
  border-top: 1px solid rgba(255, 255, 255, 0.18);
}

.site-footer .footer-links,
.site-footer .social-icons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}

.site-footer .social-icons img {
  width: 32px;
  height: 32px;
  margin: 0;
  object-fit: cover;
  border-radius: 10px;
}

@media (min-width: 769px) {
  .site-header .tpwl-hero-brand {
    flex: 1;
    justify-content: center;
    width: auto;
  }

  .site-header .tpwl-hero-actions {
    display: none;
  }
}

@media (max-width: 768px) {
  .site-header {
    padding-top: 12px;
    padding-bottom: 40px;
  }

  .site-header .tpwl-hero-topbar {
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px;
  }


  .site-header .tpwl-hero-banner {
    padding: 1px;
    border-radius: 18px;
  }

  .site-header .tpwl-hero-banner h2 {
    font-size: 22px;
  }

  .site-header nav[aria-label="Primary"] {
    display: none;
  }

  .site-footer {
    padding: 36px 16px 20px;
  }

  .site-footer::before,
  .site-footer::after {
    display: none;
  }

  .site-footer .footer-cta {
    padding: 20px;
  }

  .site-footer .footer-columns {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .site-footer .footer-bottom,
  .site-footer .footer-links,
  .site-footer .social-icons {
    justify-content: center;
    text-align: center;
  }
}

/* Homepage footer details shared by every page. */
.site-footer .payment-badges,
.site-footer .footer-trust-highlights,
.site-footer .footer-partners,
.site-footer .newsletter,
.site-footer .security-badges {
  position: relative;
  z-index: 1;
  max-width: 1100px;
  margin: 0 auto 22px;
  padding: 0 10px;
}

.site-footer .payment-badges,
.site-footer .footer-trust-highlights,
.site-footer .security-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}

.site-footer .payment-badge,
.site-footer .trust-pill,
.site-footer .security-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  color: #f8fafc;
  font-size: 13px;
  font-weight: 600;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
}

.site-footer .trust-pill {
  padding: 10px 16px;
  border-color: rgba(255, 255, 255, 0.16);
}

.site-footer .payment-badge i {
  color: #34d399;
}

.site-footer .footer-partners h4 {
  margin: 0 0 14px;
  color: #f8fafc;
}

.site-footer .partner-logos {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
}

.site-footer .partner-item {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  padding: 5px 8px;
  color: #e2e8f0;
  font-size: 10px;
  line-height: 1.2;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
}

.site-footer .partner-item img {
  width: 16px;
  height: 16px;
  object-fit: contain;
  border-radius: 6px;
}

.site-footer .partner-item span {
  max-width: 72px;
  overflow: hidden;
  color: #f8fafc;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.site-footer .newsletter p {
  margin: 0 0 10px;
  color: #cbd5e1;
}

.site-footer .newsletter-form {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.site-footer .newsletter-form input {
  flex: 1 1 240px;
  min-width: 200px;
  padding: 12px 14px;
  color: #f8fafc;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 999px;
  outline: none;
}

.site-footer .newsletter-form button {
  padding: 12px 20px;
  color: #ffffff;
  font-weight: 700;
  cursor: pointer;
  background: linear-gradient(135deg, #dc2626 0%, #2563eb 100%);
  border: 0;
  border-radius: 999px;
}

.site-footer .security-badge {
  display: block;
  max-width: 320px;
  border-radius: 16px;
}

.mobile-app-nav {
  display: none;
}

@media (max-width: 768px) {
  .site-footer .partner-logos {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .site-footer .partner-item {
    justify-content: flex-start;
  }

  .mobile-app-nav {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 999;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 4px;
    padding: 8px 10px;
    background: linear-gradient(180deg, rgba(183, 28, 28, 0.92), rgba(237, 18, 18, 0.98));
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.22);
    backdrop-filter: blur(14px);
  }

  .mobile-nav-item {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-width: 0;
    padding: 10px 4px;
    color: #ffffff;
    font-size: 9px;
    font-weight: 700;
    text-decoration: none;
    border-radius: 18px;
  }

  .mobile-nav-item i {
    font-size: 18px;
  }

  .mobile-nav-item.active,
  .mobile-nav-item:hover {
    background: rgba(255, 255, 255, 0.12);
  }

  body {
    padding-bottom: 70px;
  }
}

    /* Mobile-friendly tweaks: stack hero, shrink logo, nav pills touch targets */
    @media (max-width: 768px) {
      .tpwl-logo-header { padding-top: 12px; padding-bottom: 40px; }
      .tpwl-hero-logo, .tpwl-logo__logo { width: 64px; height: 64px; border-radius: 16px; }
      .tpwl-hero-banner { padding: 1px; border-radius: 18px; }
      nav { margin: 12px; overflow-x: auto; gap: 8px; padding: 8px; }
      nav a { min-width: 140px; padding: 12px 14px; border-radius: 16px; display: inline-flex; align-items: center; justify-content: center; }
      .tpwl-search__wrapper { padding: 0 12px; }
      #tpwl-search { padding: 14px; }
    }
    @media (max-width: 420px) {
      nav a { min-width: 120px; font-size: 14px; }
    }

    /* Mobile slide-in menu styles */
    /* Static centered menu panel (no sliding) */
    .mobile-menu {
      position: fixed;
      left: 50%;
      top: 28px;
      transform: translateX(-50%);
      height: auto;
      max-height: calc(100% - 140px);
      width: calc(92% - 40px);
      max-width: 440px;
      background: linear-gradient(180deg, rgba(6,10,20,0.96), rgba(6,10,20,0.98));
      padding: 18px;
      z-index: 110;
      box-shadow: 0 12px 36px rgba(0,0,0,0.6);
      border-radius: 16px;
      overflow-y: auto;
      display: none;
    }
    .mobile-menu[aria-hidden="false"] { display: block; }
    .mobile-menu-close { background: transparent; color: #fff; font-size: 28px; border: none; line-height:1; padding:4px 8px; float:right; }
    .mobile-menu-nav { margin-top: 18px; }
    /* pill group at top of menu to match screenshot */
    .mobile-menu-panel { display:flex; flex-direction:column; align-items:center; gap:14px; }
    .mobile-menu-topbox { width: calc(100% - 40px); max-width: 420px; display:flex; justify-content:center; }
    .mobile-menu-pill-group { display:flex; gap:10px; background: rgba(255,255,255,0.03); padding:8px; border-radius:28px; box-shadow: inset 0 1px 0 rgba(255,255,255,0.02); }
    .mobile-menu-pill { display:inline-flex; align-items:center; gap:10px; padding:10px 18px; border-radius:26px; background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01)); border:1px solid rgba(255,255,255,0.06); color:#fff !important; font-weight:700; min-width:120px; justify-content:center; }
    .mobile-menu-pill i { width:22px; text-align:center; }

    /* centered rounded list box for vertical links */
    .mobile-menu-listbox { width: calc(100% - 40px); max-width: 420px; background: rgba(255,255,255,0.02); border-radius: 18px; padding: 12px; box-shadow: 0 6px 22px rgba(0,0,0,0.45); }
    .mobile-menu-listbox .mobile-menu-item { background: rgba(255,255,255,0.03); margin: 8px 0; border-radius: 10px; padding: 12px 14px; }
    /* Ensure menu links are stacked vertically (override header nav rules) */
    .mobile-menu-nav .mobile-menu-item,
    .mobile-menu-nav a { display: flex !important; align-items: center; gap: 12px; width: 100% !important; box-sizing: border-box; color: #fff !important; padding: 12px 14px !important; text-decoration: none !important; border-radius: 10px; font-weight:600; background: rgba(255,255,255,0.03); }
    .mobile-menu-nav .mobile-menu-item + .mobile-menu-item { margin-top: 10px; }
    .mobile-menu-nav .mobile-menu-item i { width: 28px; text-align:left; margin-right:6px; font-size:16px; }

    .mobile-menu-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,0.45); z-index: 100; opacity: 0; pointer-events: none; transition: opacity .18s ease; }
    .mobile-menu-backdrop[aria-hidden="false"] { opacity: 1; pointer-events: auto; }

    @media (max-width: 768px) {
      /* hide the top page nav pills on mobile devices */
      header nav[aria-label="Primary"] {
        display: none;
      }
    }