/*
Theme Name: Transit Consultant Child
Theme URI: https://transitconsultancyservices.com
Description: Custom Child Theme for Transit Consultancy, built for Elementor & Elementor Pro.
Author: Spaces and Places IT Work Solutions
Author URI: https://transitconsultancyservices.com
Template: hello-elementor
Version: 1.1.0
License: GNU General Public License v2 or later
Text Domain: transit-consultant-child
*/

/* Reset & Box Sizing */
*, *:before, *:after {
  box-sizing: border-box;
}

:root {
  --transit-primary: #0F2C59;
  --transit-primary-dark: #071933;
  --transit-secondary: #008080;
  --transit-accent: #E3A754;
  --transit-accent-hover: #C98F3C;
  --transit-dark: #0F172A;
  --transit-light: #F8FAFC;a
  --transit-gray: #64748B;
  --transit-card-bg: #FFFFFF;
  --transit-shadow: 0 10px 25px -5px rgba(15, 44, 89, 0.1), 0 8px 10px -6px rgba(15, 44, 89, 0.05);
  --transit-radius: 12px;
}

html, body {
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  color: var(--transit-dark);
  background-color: var(--transit-light);
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
  line-height: 1.7;
}

/* Ensure WordPress Site Wrapper Doesn't Constrain Full-Width Sections */
#page, .site, .site-main, .page-content, .entry-content, #content, .elementor, .elementor-section-wrap {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
}

/* User Explicit Rule: Elementor Column Padding Zero */
.elementor-column-gap-default > .elementor-column > .elementor-element-populated,
.elementor-column-gap-default > .elementor-row > .elementor-column > .elementor-element-populated,
.elementor-column > .elementor-element-populated {
  padding: 0px !important;
}

/* Custom Header Styling - Zero Gap */
.transit-header {
  background: #0F2C59 !important;
  color: #ffffff;
  position: sticky;
  top: 0;
  z-index: 1000;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  border-bottom: none !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.15) !important;
}

header, .site-header, #content, .site-main, main, article, .elementor-section, .elementor-section-wrap, .elementor-element {
  margin-top: 0 !important;
  border-top: none !important;
}

.transit-hero-wrapper, .transit-page-hero-wrapper {
  margin-top: 0 !important;
  border-top: none !important;
}

@media (max-width: 650px) {
  .transit-header-container {
    padding: 10px 16px !important;
    min-height: 56px !important;
    align-items: center !important;
  }
}

.transit-nav-menu ul {
  display: flex;
  gap: 20px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.transit-nav-menu a {
  color: #ffffff;
  text-decoration: none;
  font-weight: 600;
  font-size: 15px;
  transition: color 0.3s ease;
}

.transit-nav-menu a:hover {
  color: var(--transit-accent);
}

/* Footer Styling */
.transit-footer {
  background: var(--transit-dark);
  color: #CBD5E1;
  padding: 60px 0 30px;
  width: 100%;
  max-width: 100%;
}

.transit-footer a {
  color: #94A3B8;
  text-decoration: none;
  transition: color 0.2s ease;
}

.transit-footer a:hover {
  color: var(--transit-accent);
}

/* Mobile Hamburger & Drawer Controls */
#transit-mobile-drawer.active {
  right: 0 !important;
}

#transit-drawer-overlay.active {
  display: block !important;
  opacity: 1 !important;
}

/* Mobile & Tablet Responsive Media Queries */
@media (max-width: 880px) {
  .transit-nav-menu, .transit-desktop-cta {
    display: none !important;
  }
  #transit-hamburger-btn {
    display: flex !important;
  }
}

/* Fluid Responsive Typography for Mobile, Tablet, and Desktop */
h1, .transit-hero-title {
  font-size: clamp(28px, 5vw, 48px) !important;
  line-height: 1.2 !important;
}

h2, .transit-blogs-title, .transit-contact-title {
  font-size: clamp(22px, 4vw, 34px) !important;
  line-height: 1.25 !important;
}

h3 {
  font-size: clamp(18px, 3vw, 24px) !important;
}

p, .transit-hero-description, .transit-blogs-desc {
  font-size: clamp(14px, 2vw, 16.5px) !important;
  text-align: justify !important;
  text-justify: inter-word !important;
  text-align-last: left;
}

/* Desktop Header Navigation - Horizontal Row */
@media (min-width: 881px) {
  .transit-nav-menu {
    display: block !important;
  }
  .transit-nav-menu ul, ul.transit-menu-list {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 28px !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .transit-desktop-cta {
    display: inline-flex !important;
  }
  #transit-hamburger-btn {
    display: none !important;
  }
}

/* User Explicit Directive: Full-Width Justify-Between Alignment */
.transit-header-container,
.transit-footer-container,
.transit-contact-card,
.transit-service-impact-banner {
  justify-content: space-between !important;
  width: 100% !important;
}

.transit-hero-buttons {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 15px !important;
  width: auto !important;
}

.transit-blogs-grid,
.transit-services-container,
.transit-locations-grid,
.transit-case-grid,
.transit-testimonials-grid {
  width: 100% !important;
  box-sizing: border-box !important;
}

/* =========================================================================
   ELEMENTOR EDITOR & FULL-WIDTH SECTION COMPATIBILITY
   ========================================================================= */
body.elementor-page #content,
body.elementor-page .site-main,
body.elementor-editor-active #content,
body.elementor-editor-active .site-main,
.elementor-entry-content,
.elementor-section-wrap,
.elementor-section-full_width,
.elementor-section-stretched {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* =========================================================================
   FULL-WIDTH EDGE-TO-EDGE & JUSTIFY-BETWEEN CONTAINER RULES (NO SIDE GAPS)
   ========================================================================= */
.tc-container,
.transit-header-container,
.transit-footer-container,
.tc-main-contact-wrap,
.elementor-section.elementor-section-boxed > .elementor-container,
.e-con.e-con-boxed,
.e-con-full,
.elementor-container {
  max-width: 1380px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: clamp(16px, 2.5vw, 36px) !important;
  padding-right: clamp(16px, 2.5vw, 36px) !important;
  box-sizing: border-box !important;
}

/* Force Flex rows to justify-between edge-to-edge */
.transit-header-container,
.transit-footer-container,
.tc-dest-detail-banner,
.tc-form-btn-row,
.tc-global-pill,
.transit-contact-card,
.transit-service-impact-banner {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
}

/* Eliminate awkward side margins in Elementor sections */
.elementor-section {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.elementor-section.elementor-section-stretched,
.elementor-section-full_width {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.elementor-row,
.elementor-container {
  display: flex !important;
  justify-content: space-between !important;
}

/* Service & Destination Grids stretch full width */
.tc-pathways-grid,
.tc-dest-grid,
.tc-why-grid,
.tc-process-grid,
.tc-global-grid,
.transit-blogs-grid,
.transit-services-container,
.transit-locations-grid,
.transit-case-grid,
.transit-testimonials-grid {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* =========================================================================
   GLOBAL BRAND ACCENT COLOR (#E3A754) OVERRIDES FOR BUTTONS & STATS
   ========================================================================= */
.transit-btn-primary,
.transit-hero-slide .transit-btn-primary,
.transit-hero-wrapper .transit-btn-primary,
.transit-hero-buttons .transit-btn-primary {
  background: #E3A754 !important;
  color: #FFFFFF !important;
  border: none !important;
  box-shadow: 0 6px 20px rgba(227, 167, 84, 0.35) !important;
}

.transit-btn-primary:hover,
.transit-hero-slide .transit-btn-primary:hover,
.transit-hero-wrapper .transit-btn-primary:hover,
.transit-hero-buttons .transit-btn-primary:hover {
  background: #C98F3C !important;
  color: #FFFFFF !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(227, 167, 84, 0.45) !important;
}

.transit-stat-number,
.transit-stats-grid .transit-stat-number {
  color: #E3A754 !important;
}

.transit-service-link:hover,
.transit-nav-menu a:hover,
.transit-footer a:hover {
  color: #E3A754 !important;
}

/* =========================================================================
   FIX FOR FEATURED POST / WHITEPAPER (EXACT 50% / 50% BALANCED LAYOUT)
   ========================================================================= */
.transit-blog-featured-card,
.transit-featured-card,
.transit-featured-post,
.tc-featured-post-card {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important; /* Exact 50% 50% split */
  gap: 0 !important;
  align-items: stretch !important;
  background: #FFFFFF !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  border: 1.5px solid #E2E8F0 !important;
  box-shadow: 0 14px 35px rgba(15, 44, 89, 0.08) !important;
  width: 100% !important;
  margin-bottom: 35px !important;
  min-height: 380px !important;
}

.transit-featured-image,
.transit-blog-featured-card > .transit-featured-image,
.transit-blog-featured-img {
  width: 100% !important;
  height: 100% !important;
  min-height: 380px !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  position: relative !important;
  padding: 24px !important;
  display: flex !important;
  align-items: flex-start !important;
  border-radius: 0 !important;
}

.transit-blog-tag {
  background: #0F2C59 !important;
  color: #FFFFFF !important;
  padding: 8px 18px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: 0.8px !important;
  text-transform: uppercase !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.transit-featured-body,
.transit-blog-featured-content {
  width: 100% !important;
  padding: clamp(28px, 4vw, 50px) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  background: #FFFFFF !important;
  box-sizing: border-box !important;
}

.transit-blog-meta {
  color: #64748B !important;
  font-size: 13.5px !important;
  margin-bottom: 14px !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.transit-page-hero-wrapper .transit-blog-meta {
  display: none !important;
}

.single .transit-page-hero-wrapper {
  min-height: 600px !important;
  background-position: center 25% !important;
  background-size: cover !important;
  display: flex !important;
  align-items: center !important;
  padding: clamp(120px, 15vw, 180px) 20px clamp(100px, 12vw, 150px) 20px !important;
}

.transit-featured-title,
.transit-featured-title a {
  font-size: clamp(22px, 2.8vw, 30px) !important;
  font-weight: 800 !important;
  color: #0F2C59 !important;
  line-height: 1.25 !important;
  margin: 0 0 16px 0 !important;
  text-decoration: none !important;
}

.transit-featured-title a:hover {
  color: #E3A754 !important;
}

.transit-blog-excerpt,
.transit-featured-body p {
  font-size: 15px !important;
  color: #475569 !important;
  line-height: 1.7 !important;
  margin: 0 0 24px 0 !important;
  text-align: justify !important;
  text-justify: inter-word !important;
  text-align-last: left !important;
}

.transit-btn-primary {
  background: #E3A754 !important;
  color: #FFFFFF !important;
  padding: 13px 26px !important;
  border-radius: 10px !important;
  font-weight: 800 !important;
  font-size: 14.5px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: fit-content !important;
  text-decoration: none !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 6px 18px rgba(227, 167, 84, 0.35) !important;
}

.transit-btn-primary:hover {
  background: #C98F3C !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 25px rgba(227, 167, 84, 0.45) !important;
}

/* Mobile & Tablet Responsive: Stacks 1-Column on small screens */
@media (max-width: 860px) {
  .transit-blog-featured-card,
  .transit-featured-card,
  .transit-featured-post,
  .tc-featured-post-card {
    grid-template-columns: 1fr !important;
  }

  .transit-featured-image,
  .transit-blog-featured-card > .transit-featured-image {
    min-height: 250px !important;
    height: 250px !important;
    width: 100% !important;
  }

  .transit-featured-body {
    padding: 30px 22px !important;
  }
}
/* ----------------------------------------------------
   CONTACT & LEGAL PAGES FULL-WIDTH BREAKOUT RULES
   ---------------------------------------------------- */
.tc-contact-page-root,
.tc-legal-wrapper {
  width: 100vw !important;
  max-width: 100vw !important;
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
}

.tc-contact-hero,
.tc-legal-hero {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

/* =========================================================================
   HERO BANNER CUSTOMIZATIONS: HIDE ARROWS, BADGE, & SECONDARY BUTTON
   ========================================================================= */
.transit-hero-nav-btn,
.transit-hero-prev-btn,
.transit-hero-next-btn,
#transit-hero-slider .transit-hero-nav-btn {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

.transit-hero-badge,
.transit-hero-content .transit-hero-badge {
  display: none !important;
  visibility: hidden !important;
}

.transit-btn-secondary,
.transit-hero-buttons .transit-btn-secondary,
.transit-hero-slide .transit-btn-secondary {
  display: none !important;
  visibility: hidden !important;
}

/* =========================================================================
   HERO BANNER & CONTACT BUTTON RESPONSIVE PERFECTION
   ========================================================================= */
@media (max-width: 860px) {
  .transit-hero-wrapper,
  .transit-hero-slider-wrapper,
  .transit-hero-slide {
    text-align: center !important;
    justify-content: center !important;
    padding: clamp(35px, 6vw, 65px) clamp(16px, 3vw, 24px) clamp(45px, 7vw, 75px) clamp(16px, 3vw, 24px) !important;
    min-height: 480px !important;
  }

  .transit-hero-content {
    margin: 0 auto !important;
    text-align: center !important;
    max-width: 100% !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  .transit-hero-title {
    text-align: center !important;
    font-size: clamp(24px, 5.5vw, 36px) !important;
    line-height: 1.25 !important;
    margin: 0 auto 16px auto !important;
    width: 100% !important;
  }

  .transit-hero-description {
    text-align: center !important;
    font-size: clamp(14px, 2.5vw, 16px) !important;
    line-height: 1.6 !important;
    margin: 0 auto 24px auto !important;
    max-width: 600px !important;
    width: 100% !important;
  }

  .transit-hero-buttons {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 auto !important;
  }

  .transit-hero-buttons .transit-btn-primary,
  .transit-hero-slide .transit-btn-primary,
  .transit-btn-primary {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: auto !important;
    min-width: min(280px, 100%) !important;
    max-width: 100% !important;
    padding: 14px 28px !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    border-radius: 10px !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 480px) {
  .transit-hero-buttons .transit-btn-primary,
  .transit-hero-slide .transit-btn-primary {
    width: 100% !important;
    min-width: 100% !important;
    padding: 14px 20px !important;
    font-size: 14.5px !important;
  }
}

/* Hero Section Black Opacity Overlay & High Contrast */
.transit-hero-slide::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.82) 0%, rgba(0, 0, 0, 0.65) 50%, rgba(0, 0, 0, 0.70) 100%) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

.transit-hero-container {
  position: relative !important;
  z-index: 5 !important;
}

.transit-hero-content {
  position: relative !important;
  z-index: 5 !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.transit-hero-title {
  color: #ffffff !important;
  text-shadow: 0 3px 15px rgba(0, 0, 0, 0.9) !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.transit-hero-description {
  color: #F8FAFC !important;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.9) !important;
  opacity: 1 !important;
  visibility: visible !important;
}