/* ============================================================
   TravelGrid — Theme v4: Stripe / Linear inspired (tg-stripe.css)
   Loads AFTER applify.min.css, tg-redesign.css, tg-modern.css.

   Aesthetic:
     - Font: Inter (400–800) everywhere, tight tracking on display
     - Stripe-style text palette: #1a1f36 / #425466 / #697386 / #a2aab8
     - Crisp white canvas with a faint indigo mesh + dotted grid hero
     - Brand indigo #635bff (Stripe), soft tint #eef1ff
     - White cards, 14px radius, 1px cool border #e9ecf3, restrained shadow
     - Dark surfaces: near-black navy #0d0f1e with indigo glow (Linear)
     - Buttons: solid indigo primary, white secondary
   ============================================================ */

:root {
  --lg-primary: #635bff;
  --lg-primary-hover: #5851ef;
  --lg-primary-deep: #4640e6;
  --lg-primary-deeper: #3128c8;
  --lg-primary-soft: #eef1ff;
  --lg-primary-softer: #f7f8ff;
  --lg-accent: #8b7bff;
  --lg-ink: #1a1f36;
  --lg-ink-2: #3c4257;
  --lg-ink-3: #425466;
  --lg-ink-4: #697386;
  --lg-ink-5: #98a2b3;
  --lg-border: #e6e8ee;
  --lg-border-soft: #f0f1f5;
  --lg-border-strong: #d3d8e1;
  --lg-track: #0d0f1e;
  --lg-bg: #ffffff;
  --lg-bg-soft: #f7f8fb;

  /* Re-map the v3 tokens so every component that used them follows. */
  --m-bg: #ffffff;
  --m-bg-soft: #f7f8fb;
  --m-bg-lav: #fbfcfe;
  --m-ink: #1a1f36;
  --m-ink-2: #3c4257;
  --m-ink-3: #425466;
  --m-ink-4: #697386;
  --m-border: #e6e8ee;
  --m-border-soft: #f0f1f5;
  --m-border-strong: #d3d8e1;
  --m-primary: #635bff;
  --m-primary-deep: #5851ef;
  --m-primary-deeper: #3128c8;
  --m-primary-soft: #eef1ff;
  --m-primary-softer: #f7f8ff;
  --m-accent: #8b7bff;
  --m-track: #0d0f1e;
  --m-font-head: "Inter", -apple-system, "Segoe UI", sans-serif;
  --m-font-body: "Inter", -apple-system, "Segoe UI", sans-serif;
  --m-radius: 14px;
  --m-radius-sm: 9px;
  --m-shadow-sm: 0 1px 2px rgba(26, 31, 54, 0.05);
  --m-shadow-md: 0 8px 20px rgba(26, 31, 54, 0.08);
  --m-shadow-lg: 0 18px 40px rgba(26, 31, 54, 0.12);
  --m-glass-bg: #ffffff;
  --m-glass-bg-strong: #ffffff;
  --m-glass-border: #e6e8ee;
}

/* ---------- Base canvas ---------- */
html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--m-font-body);
  background: var(--lg-bg);
  color: var(--lg-ink-2);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  letter-spacing: -0.01em;
}

h1, h2, h3, h4, h5, h6,
.heading,
.card-title,
.form-card .card-header h3 {
  font-family: var(--m-font-head);
  color: var(--lg-ink);
  font-weight: 700;
  letter-spacing: -0.025em;
}

h1, h2, h3 { text-wrap: balance; }

a { color: var(--lg-primary); transition: color 150ms ease; }
a:hover, a:focus { color: var(--lg-primary-deep); }

::selection { background: rgba(99, 91, 255, 0.16); color: var(--lg-ink); }

.bg-light { background: var(--lg-bg-soft) !important; }
.text-indigo { color: var(--lg-ink) !important; }

img { max-width: 100%; }

:focus-visible {
  outline: 3px solid rgba(99, 91, 255, 0.4);
  outline-offset: 2px;
  border-radius: 6px;
}

/* ---------- Navbar: clean white, Inter ---------- */
.navbar-fixed-top,
.navbar.navbar-fixed-top {
  background: rgba(255, 255, 255, 0.9) !important;
  -webkit-backdrop-filter: saturate(180%) blur(16px);
  backdrop-filter: saturate(180%) blur(16px);
  border-bottom: 1px solid var(--lg-border-soft);
  box-shadow: 0 1px 0 rgba(26, 31, 54, 0.02);
}

.navbar .nav > li > a,
.navbar .nav.navbar-nav > li > a {
  font-family: var(--m-font-head);
  color: var(--lg-ink-3) !important;
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: -0.01em;
}

.navbar .nav > li > a:hover,
.navbar .nav > li > a:focus,
.navbar .nav > li.active > a,
.navbar .nav > li.active > a:focus,
.navbar .nav > li.active > a:hover {
  color: var(--lg-primary) !important;
}

@media (min-width: 992px) {
  .navbar .nav > li.active > a::after {
    height: 2px;
    border-radius: 2px;
    background: var(--lg-primary);
    margin-top: 2px;
  }
}

.navbar-light .navbar-toggler { border-color: var(--lg-border); }
.uk-close,
.ui-mobile-nav-toggle::before,
.ui-mobile-nav-toggle::after { background: var(--lg-ink-2); }

.ui-collapsible-nav,
.ui-collapsible-nav .navbar-nav { background: #fff !important; }
.ui-collapsible-nav .toggle,
.ui-collapsible-nav .toggle.current-page { color: var(--lg-ink-2) !important; }

/* ---------- Buttons: Stripe solid indigo ---------- */
.btn,
a[role="button"] {
  font-family: var(--m-font-body);
  font-weight: 600;
  font-size: 0.9rem;
  border-radius: 9px;
  border: 1px solid transparent;
  letter-spacing: -0.01em;
  transition: background 160ms ease, transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
  box-shadow: none;
}

.btn:active { transform: translateY(0); }

.ui-gradient-green.btn,
.btn.ui-gradient-green,
.ui-gradient-green {
  background: var(--lg-primary) !important;
  color: #fff !important;
  box-shadow: 0 1px 2px rgba(26, 31, 54, 0.12), 0 4px 14px rgba(99, 91, 255, 0.28);
}

.ui-gradient-green.btn:hover,
.btn.ui-gradient-green:hover,
.ui-gradient-green:hover,
.ui-gradient-green:focus-visible {
  background: var(--lg-primary-hover) !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(26, 31, 54, 0.12), 0 10px 22px rgba(99, 91, 255, 0.34);
}

.ui-gradient-purple.btn,
.btn.ui-gradient-purple,
.ui-gradient-purple.btn.btn-circle,
.ui-gradient-peach.btn,
.btn.ui-gradient-peach {
  background: var(--lg-primary) !important;
  color: #fff !important;
  box-shadow: 0 1px 2px rgba(26, 31, 54, 0.12), 0 4px 14px rgba(99, 91, 255, 0.28);
}
.ui-gradient-peach.btn:hover,
.btn.ui-gradient-peach:hover {
  background: var(--lg-primary-hover) !important;
}

.ui-gradient-blue.btn,
.btn.ui-gradient-blue,
.ui-gradient-blue {
  background: #fff !important;
  color: var(--lg-ink-2) !important;
  border-color: var(--lg-border-strong) !important;
  box-shadow: 0 1px 2px rgba(26, 31, 54, 0.04);
}

.ui-gradient-blue.btn:hover,
.btn.ui-gradient-blue:hover,
.ui-gradient-blue:hover {
  background: var(--lg-primary-softer) !important;
  color: var(--lg-primary-deep) !important;
  border-color: var(--lg-primary) !important;
  transform: translateY(-1px);
}

.btn-circle.ui-gradient-blue,
.btn-circle.ui-gradient-green,
.btn-circle.ui-gradient-purple {
  background: var(--lg-primary-soft) !important;
  color: var(--lg-primary) !important;
  border: 1px solid var(--lg-border);
  box-shadow: none;
}
.btn-circle.ui-gradient-blue:hover,
.btn-circle.ui-gradient-green:hover,
.btn-circle.ui-gradient-purple:hover {
  background: var(--lg-primary) !important;
  color: #fff !important;
}

/* ---------- Hero: crisp white + faint indigo mesh ---------- */
.ui-hero.ui-gradient-purple,
.ui-hero-slider.ui-gradient-purple,
.page-hero.ui-gradient-purple,
.hero-lg.ui-gradient-purple,
.ui-hero.ui-gradient-purple .slider-pro {
  background-color: #fff !important;
  background-image:
    radial-gradient(rgba(99, 91, 255, 0.09) 1px, transparent 1.1px),
    radial-gradient(1000px 520px at 88% -14%, #edeffff 0%, rgba(237, 239, 255, 0) 60%),
    radial-gradient(820px 460px at -8% 108%, #f2f4ff 0%, rgba(242, 244, 255, 0) 52%) !important;
  background-size: 26px 26px, auto, auto;
  background-repeat: repeat, no-repeat, no-repeat;
  border-bottom: 1px solid var(--lg-border-soft);
}

.page-hero.ui-gradient-purple {
  background-image:
    radial-gradient(rgba(99, 91, 255, 0.08) 1px, transparent 1.1px),
    radial-gradient(720px 340px at 92% -24%, #edeffff 0%, rgba(237, 239, 255, 0) 55%) !important;
  background-size: 26px 26px, auto;
  background-repeat: repeat, no-repeat;
}

.ui-hero .heading,
.ui-hero-slider .heading {
  color: var(--lg-ink) !important;
  font-family: var(--m-font-head);
  font-weight: 700;
  letter-spacing: -0.035em;
  font-size: clamp(2.4rem, 4.6vw, 3.6rem);
  line-height: 1.08;
}

.ui-hero .paragraph,
.ui-hero-slider .paragraph {
  color: var(--lg-ink-3) !important;
  font-size: 1.1rem;
  max-width: 56ch;
}

.tg-gradient-text {
  background: linear-gradient(110deg, var(--lg-primary) 20%, var(--lg-accent) 85%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.tg-chip.tg-chip-orange,
.tg-chip.tg-chip-purple {
  background: var(--lg-primary-soft);
  color: var(--lg-primary-deeper);
  border: 1px solid #dfe3ff;
  font-weight: 600;
  border-radius: 999px;
  font-size: 0.82rem;
}

.tg-hero-stat .tg-hero-stat-num {
  color: var(--lg-primary);
  font-family: var(--m-font-head);
  font-weight: 700;
  letter-spacing: -0.02em;
}
.tg-hero-stat .tg-hero-stat-lbl { color: var(--lg-ink-4); }

.ui-hero .sp-slide img.responsive-on-sm,
.ui-hero img.responsive-on-sm {
  border-radius: 16px;
  border: 1px solid var(--lg-border);
  box-shadow: 0 32px 72px -28px rgba(26, 31, 54, 0.35), 0 6px 16px rgba(26, 31, 54, 0.06);
}

.ui-hero .sp-arrow,
.ui-hero-slider .sp-arrow {
  background: #fff !important;
  border: 1px solid var(--lg-border) !important;
  box-shadow: var(--m-shadow-md);
}
.ui-hero .sp-arrow::before,
.ui-hero-slider .sp-arrow::before { border-color: var(--lg-ink) !important; }
.ui-hero .sp-previous-arrow::after,
.ui-hero .sp-next-arrow::after,
.ui-hero-slider .sp-previous-arrow::after,
.ui-hero-slider .sp-next-arrow::after { border-color: var(--lg-ink) !important; }
.ui-hero .slider-pro .sp-dot,
.ui-hero-slider .slider-pro .sp-dot { background: var(--lg-border-strong) !important; }
.ui-hero .slider-pro .sp-dot.sp-selected-dot,
.ui-hero-slider .slider-pro .sp-dot.sp-selected-dot { background: var(--lg-primary) !important; }

/* ---------- Section headings + eyebrows ---------- */
.section-heading { margin-bottom: 2rem; }

.section-heading .heading {
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--lg-ink);
}

.section-heading .paragraph {
  color: var(--lg-ink-3);
  font-size: 1.06rem;
  max-width: 60ch;
  margin-left: auto;
  margin-right: auto;
}

.tg-subheading { color: var(--lg-ink) !important; }

.tg-eyebrow {
  display: inline-block;
  font-family: var(--m-font-body);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--lg-primary-deep);
  background: var(--lg-primary-soft);
  border: 1px solid #e0e3ff;
  border-radius: 999px;
  padding: 0.32rem 0.85rem;
  margin-bottom: 1rem;
}

/* ---------- Proof strip / stats ---------- */
.tg-proof-strip {
  background: var(--lg-primary-softer) !important;
  border-top: 1px solid var(--lg-border-soft);
  border-bottom: 1px solid var(--lg-border-soft);
}

.tg-proof {
  background: #fff !important;
  border: 1px solid var(--lg-border) !important;
  border-radius: var(--m-radius);
  box-shadow: var(--m-shadow-sm);
}

.tg-proof h3 {
  color: var(--lg-primary) !important;
  font-family: var(--m-font-head);
  font-weight: 700;
  letter-spacing: -0.02em;
}
.tg-proof p { color: var(--lg-ink-3) !important; }

/* ---------- Cards: crisp Linear-style white cards ---------- */
.tg-feature-card,
.tg-client-item,
.tg-sector-card,
.tg-sector-logo,
.tg-module-card,
.tg-blog-card,
.tg-capability-card,
.tg-journey-node,
.tg-role-card,
.tg-ai-cap-col,
.tg-faq details,
.tg-global-map-card,
.ui-card,
.card,
.form-card {
  background: #fff !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  border: 1px solid var(--lg-border) !important;
  box-shadow: var(--m-shadow-sm) !important;
  border-radius: var(--m-radius) !important;
}

.tg-feature-card::after,
.tg-module-card::after,
.tg-blog-card::after,
.tg-capability-card::after,
.form-card::after { background: none; }

.tg-feature-card,
.tg-module-card,
.tg-capability-card,
.tg-journey-node,
.tg-sector-card,
.tg-ai-cap-col {
  position: relative;
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.tg-feature-card:hover,
.tg-module-card:hover,
.tg-capability-card:hover,
.tg-journey-node:hover,
.tg-sector-card:hover,
.tg-ai-cap-col:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(26, 31, 54, 0.08) !important;
  border-color: #ccd1ff !important;
}

.tg-module-card::before,
.tg-feature-card::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 3px;
  border-radius: var(--m-radius) var(--m-radius) 0 0;
  background: linear-gradient(90deg, var(--lg-primary), var(--lg-accent));
  opacity: 0;
  transition: opacity 180ms ease;
  pointer-events: none;
}
.tg-module-card:hover::before,
.tg-feature-card:hover::before { opacity: 1; }

.tg-feature-card h4,
.tg-module-card h4,
.tg-journey-node h4,
.tg-capability-card h4 { color: var(--lg-ink) !important; }

.tg-feature-card p,
.tg-module-card p,
.tg-capability-card > p,
.tg-role-card p { color: var(--lg-ink-3) !important; }

.tg-module-card a {
  display: inline-block;
  margin-top: 0.4rem;
  font-weight: 600;
  text-decoration: none;
  color: var(--lg-primary);
}
.tg-module-card a:hover { text-decoration: underline; text-underline-offset: 3px; }

.tg-module-icon {
  background: var(--lg-primary-soft) !important;
  color: var(--lg-primary) !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 10px;
}

/* Module overview */
.tg-module-overview { margin: 2.5rem 0 1rem; }
.tg-module-overview-heading h2 { color: var(--lg-ink); }
.tg-module-overview-heading p { color: var(--lg-ink-3); }
.tg-module-overview-grid .tg-module-card h3,
.tg-module-card h4,
.tg-feature-card h4 {
  font-family: var(--m-font-head);
  letter-spacing: -0.02em;
}

/* ---------- Feature/sector icons ---------- */
.tg-feature-icon {
  background: var(--lg-primary-soft) !important;
  color: var(--lg-primary) !important;
}
.tg-feature-icon-accent {
  background: #eef0ff !important;
  color: #4038cf !important;
}

.tg-capability-stat {
  background: var(--lg-primary-soft);
  color: var(--lg-ink-2);
}
.tg-capability-stat span { color: var(--lg-primary); }

.tg-sector-card h4 span {
  color: var(--lg-primary-deep);
  background: var(--lg-primary-soft);
}
.tg-sector-logo { background: #fff !important; border: 1px solid var(--lg-border-soft) !important; }

/* ---------- Pills ---------- */
.tg-pill,
.tg-location-pill {
  background: #fff !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  border: 1px solid var(--lg-border-strong) !important;
  color: var(--lg-ink-2) !important;
  box-shadow: none !important;
}
.tg-pill:hover { border-color: var(--lg-primary); color: var(--lg-primary) !important; }

/* ---------- Journey ---------- */
.tg-journey-grid { gap: 1.25rem; }

.tg-journey-num,
.tg-journey-num-yellow,
.tg-journey-num-blue,
.tg-journey-num-green,
.tg-journey-num-purple {
  background: var(--lg-primary) !important;
  box-shadow: 0 4px 12px rgba(99, 91, 255, 0.26) !important;
}
.tg-journey-num-blue { background: #4b6bfb !important; }
.tg-journey-num-green { background: #16a085 !important; }
.tg-journey-num-purple { background: #8b7bff !important; }
.tg-journey-num-yellow { background: #f5a623 !important; box-shadow: 0 4px 12px rgba(245, 166, 35, 0.28) !important; }

.tg-journey-icon {
  border-radius: 10px;
  font-size: 1.35rem;
  background: var(--lg-primary-soft) !important;
  color: var(--lg-primary);
}
.tg-journey-icon-orange { background: #eef0ff !important; color: #4038cf; }
.tg-journey-icon-yellow { background: var(--lg-primary-soft) !important; color: var(--lg-primary); }
.tg-journey-icon-blue { background: #e8edff !important; color: #3b5bdb; }
.tg-journey-icon-green { background: #e7f6f1 !important; color: #0f7a5d; }
.tg-journey-icon-purple { background: #f0edff !important; color: #6d5ef7; }

/* ---------- AI section (Linear dark band) ---------- */
.tg-ai-section {
  background:
    radial-gradient(760px 460px at 80% 12%, rgba(99, 91, 255, 0.28), transparent 66%),
    radial-gradient(620px 460px at 6% 92%, rgba(139, 123, 255, 0.16), transparent 70%),
    linear-gradient(160deg, #0d0f1e 0%, #12142a 55%, #171a38 100%) !important;
  border-top: 1px solid rgba(139, 123, 255, 0.22);
  border-bottom: 1px solid rgba(139, 123, 255, 0.22);
}
.tg-ai-section::before { background: none; }

.tg-ai-section .section-heading { max-width: 820px; margin-left: auto; margin-right: auto; }
.tg-ai-section .section-heading .heading { color: #fff; }
.tg-ai-section .section-heading .paragraph { color: #aab3d2; }
.tg-ai-eyebrow {
  color: #e3e6ff !important;
  background: rgba(99, 91, 255, 0.24) !important;
  border-color: rgba(180, 185, 255, 0.36) !important;
}
.tg-ai-copy p, .tg-ai-copy .tg-lead { color: #c6cbe6; }
.tg-ai-copy .tg-lead strong { color: #fff; }
.tg-ai-examples li { color: #c6cbe6; }

.tg-ai-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  margin-top: 1.25rem;
  color: #1a1f36 !important;
  background: #fff !important;
  border-color: rgba(255, 255, 255, 0.85) !important;
  box-shadow: 0 12px 28px rgba(9, 10, 24, 0.3);
}
.tg-ai-cta:hover,
.tg-ai-cta:focus {
  color: #fff !important;
  background: var(--lg-primary) !important;
  border-color: var(--lg-primary) !important;
}

.tg-ai-chat {
  border-color: rgba(180, 185, 255, 0.4);
  box-shadow: 0 28px 70px rgba(9, 10, 24, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.tg-ai-cap-heading { color: #fff !important; font-size: 1.15rem; }
.tg-ai-cap-card { background: rgba(255, 255, 255, 0.92) !important; border-color: rgba(255, 255, 255, 0.7) !important; }
.tg-ai-cap-card h5 { color: var(--lg-primary-deep) !important; }
.tg-ai-cap-card p { color: var(--lg-ink-3) !important; }

.tg-ai-cap-grid .tg-ai-cap-heading { grid-column: 1 / -1; margin: 0; color: var(--lg-ink) !important; }
.tg-ai-cap-col h4 { margin: 0 0 0.7rem; font-size: 1.1rem; }
.tg-ai-cap-list li { color: var(--lg-ink-2); }
.tg-ai-cap-list li::before { background: var(--lg-primary) !important; }
.tg-ai-cap-note {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  color: #c6cbe6 !important;
}

/* ---------- Roles / trust strip ---------- */
.tg-role-note {
  background: #fff;
  border: 1px solid var(--lg-border);
  border-left: 4px solid var(--lg-primary);
}
.tg-role-note p { color: var(--lg-ink-3); }

.tg-trust-strip {
  background: linear-gradient(135deg, #f6f7ff 0%, #eef1ff 52%, #e8ebff 100%) !important;
  border: 1px solid var(--lg-border);
  box-shadow: var(--m-shadow-md) !important;
  border-radius: 18px;
}
.tg-trust-item > .icon { color: var(--lg-primary) !important; }
.tg-trust-item h5 { color: var(--lg-ink) !important; }
.tg-trust-item p { color: var(--lg-ink-3) !important; }

/* ---------- Inline CTA band ---------- */
.tg-cta-band {
  background:
    radial-gradient(700px 320px at 85% 0%, rgba(139, 123, 255, 0.35), transparent 62%),
    linear-gradient(155deg, #12142a 0%, #1a1d3f 55%, #272a5c 100%) !important;
  border: 1px solid rgba(180, 185, 255, 0.2) !important;
  border-radius: 20px;
  box-shadow: var(--m-shadow-lg) !important;
}
.tg-cta-band h3 { color: #fff; }
.tg-cta-band p { color: #b8bfdd; }

/* ---------- Prose / content ---------- */
.tg-prose h2 { color: var(--lg-ink); }
.tg-prose h3 { color: var(--lg-ink); }
.tg-prose p, .tg-prose li, .tg-policy-body p, .tg-policy-body li { color: var(--lg-ink-2); }
.tg-prose .tg-lead { color: var(--lg-ink); font-weight: 500; }
.tg-prose a { text-decoration-color: rgba(99, 91, 255, 0.35); text-underline-offset: 3px; }
.tg-prose table { color: var(--lg-ink-2); }

.tg-note { border-left: 3px solid var(--lg-primary); background: var(--lg-primary-softer); }
.tg-note .tg-label { color: var(--lg-primary-deep); }

.tg-prose th {
  background: var(--lg-primary-soft);
  color: var(--lg-ink);
  font-family: var(--m-font-head);
  font-weight: 600;
}
.tg-prose td { border-bottom: 1px solid var(--lg-border-soft); }

/* ---------- FAQ ---------- */
.tg-faq details {
  border: 1px solid var(--lg-border);
  border-radius: var(--m-radius-sm);
  background: #fff !important;
  box-shadow: var(--m-shadow-sm) !important;
}
.tg-faq summary { font-family: var(--m-font-body); font-weight: 600; color: var(--lg-ink); }
.tg-faq details[open] summary { color: var(--lg-primary-deep); }
.tg-faq summary::after { color: var(--lg-primary); }

/* ---------- Breadcrumb ---------- */
.tg-breadcrumb { color: var(--lg-ink-4); font-weight: 500; }
.tg-breadcrumb a { color: var(--lg-primary) !important; text-decoration: none; font-weight: 600; }

/* ---------- Testimonials ---------- */
.ui-testimonials .ui-card {
  background: #fff !important;
  border: 1px solid var(--lg-border) !important;
  border-radius: var(--m-radius);
  box-shadow: var(--m-shadow-sm) !important;
}
.ui-testimonials .ui-card p { color: var(--lg-ink-2); font-size: 0.98rem; }
.ui-testimonials .user h6 { color: var(--lg-ink) !important; }
.ui-testimonials .user .sub-heading { color: var(--lg-ink-4) !important; }

.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span { background: var(--lg-primary) !important; }

/* ---------- App screens ---------- */
.ui-app-screens .ui-card {
  background: #fff !important;
  border: 1px solid var(--lg-border) !important;
  border-radius: 18px;
  box-shadow: var(--m-shadow-md) !important;
}

/* ---------- Contact form ---------- */
#contact_form .card-body { background: #fff; }
#contact_form .form-control {
  border: 1px solid var(--lg-border-strong);
  border-radius: var(--m-radius-sm);
}
#contact_form .form-control:focus {
  border-color: var(--lg-primary);
  box-shadow: 0 0 0 3px rgba(99, 91, 255, 0.14);
  outline: none;
}

/* ---------- Footer (Linear dark navy) ---------- */
.ui-footer .footer-bg,
.ui-footer.footer-bg,
.footer-bg.ui-gradient-purple {
  background:
    radial-gradient(800px 420px at 85% -10%, rgba(99, 91, 255, 0.32), transparent 62%),
    #0d0f1e !important;
}
.ui-footer .section-heading .heading,
.ui-footer .download-section .heading { color: #fff; }

.download-section .btn-download.ui-gradient-blue.btn,
.download-section .btn-download.ui-gradient-green.btn {
  background: var(--lg-primary) !important;
  color: #fff !important;
}
.download-section .btn-download.ui-gradient-blue.btn:hover,
.download-section .btn-download.ui-gradient-green.btn:hover {
  background: var(--lg-primary-hover) !important;
}

.tg-footer-col h4 { color: #eef0ff; }
.tg-footer-col a { color: #a5accc; }
.tg-footer-col a:hover { color: #fff; }

/* ---------- Sticky CTA ---------- */
.tg-sticky-cta {
  background: rgba(13, 15, 30, 0.94) !important;
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  border-radius: 999px;
  box-shadow: var(--m-shadow-lg) !important;
}
.tg-sticky-cta p { color: #c6cbe6 !important; }
.tg-sticky-cta a { background: var(--lg-primary) !important; color: #fff !important; font-weight: 700; }
.tg-sticky-cta a:hover { background: var(--lg-primary-hover) !important; color: #fff !important; }

/* Keep the WhatsApp FAB above the sticky CTA on mobile */
@media (max-width: 920px) {
  a[aria-label="Chat with TravelGrid on WhatsApp"] {
    bottom: 78px !important;
  }
}

/* ---------- Contact card header ---------- */
.form-card .card-header.ui-gradient-peach {
  background: #fff !important;
  border-bottom: 1px solid var(--lg-border-soft);
}
.form-card .card-header.ui-gradient-peach .heading { color: var(--lg-ink) !important; }
.form-card .card-header.ui-gradient-peach .paragraph { color: var(--lg-ink-3) !important; }

/* ---------- Video section ---------- */
.bg-overlay-gradient-peach::before,
.bg-overlay-gradient-purple::before,
.bg-overlay-gradient-blue::before,
.bg-overlay-gradient-green::before {
  background: linear-gradient(180deg, rgba(13, 15, 30, 0.55), rgba(13, 15, 30, 0.78)) !important;
}
.ui-video-toggle .icon,
.ui-video-toggle .fa {
  background: #fff !important;
  color: var(--lg-primary) !important;
}

/* ---------- Misc ---------- */
.ui-icon-blocks .ui-icon-block .icon,
.ui-icon-blocks h5 { color: var(--lg-ink); }

.form-control,
.input,
select,
textarea { border-radius: var(--m-radius-sm); }

/* Alternating white / soft rhythm */
#how-it-works, #app, #roles, .bg-light { background: var(--lg-bg-soft) !important; }

.ui-icon-blocks, .tg-global-footprint { border-top: 1px solid var(--lg-border-soft); border-bottom: 1px solid var(--lg-border-soft); }

/* ---------- Demo form ---------- */
.tg-demo-form {
  padding: 1.5rem;
  background: #fff;
  border: 1px solid var(--lg-border);
  border-radius: var(--m-radius);
  box-shadow: var(--m-shadow-sm);
}
.tg-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.tg-demo-form label {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-bottom: 1rem;
  color: var(--lg-ink);
  font-size: 0.88rem;
  font-weight: 600;
}
.tg-demo-form input,
.tg-demo-form select,
.tg-demo-form textarea {
  width: 100%;
  min-height: 44px;
  padding: 0.7rem 0.85rem;
  color: var(--lg-ink);
  background: #fff;
  border: 1px solid var(--lg-border-strong);
  border-radius: var(--m-radius-sm);
  font: inherit;
  font-weight: 400;
}
.tg-demo-form textarea { resize: vertical; }
.tg-demo-form input:focus,
.tg-demo-form select:focus,
.tg-demo-form textarea:focus {
  border-color: var(--lg-primary);
  outline: 3px solid rgba(99, 91, 255, 0.15);
  outline-offset: 1px;
}
.tg-form-actions { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.tg-form-actions .btn { min-height: 46px; }
.tg-form-note, .tg-form-status { margin: 0; color: var(--lg-ink-3); font-size: 0.82rem; }
.tg-form-status.is-error { color: #d92d20; }
.tg-form-status.is-success { color: var(--lg-primary-deep); }

/* ---------- Responsive ---------- */
@media (max-width: 768px) {
  .ui-hero .heading { font-size: clamp(1.7rem, 8vw, 2.4rem); }
  .ui-hero .paragraph { font-size: 1rem; }
  .tg-hide-mobile { display: none !important; }
}

@media (max-width: 640px) {
  .tg-form-grid { grid-template-columns: 1fr; gap: 0; }
  .tg-demo-form { padding: 1rem; }
  .tg-form-actions { align-items: stretch; flex-direction: column; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}