:root{
      /* tune these if you change paddings */
      --topbar-h: 36px;          /* approx height on desktop */
      --navbar-h: 72px;          /* approx height on desktop */
    }

    /* Fixed header wrapper */
    .site-header{
      position: fixed;
      top: 0; left: 0; right: 0;
      z-index: 1030;             /* above page content */
    }

    /* Load Orbitron from Google (CSS import) */

/* Global heading font (Orbitron) */
html, body{
font-family: "Inter", sans-serif;  font-weight: 400;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 1) Guard against sideways scroll globally (safe) */
html, body { overflow-x: clip; }        /* use hidden if clip isn't supported */

/* 2) Make all media never exceed the viewport width */
img, svg, video, iframe { max-width:100%; height:auto; display:block; }

/* 3) Map wrapper: prevent tiny overflow from the Google iframe */
.map-embed { overflow-x: clip; }        /* or hidden */
.map-embed .map-frame { width:100%; }   /* no 100vw here */
.map-embed iframe { width:100%; height:100%; border:0; display:block; }

/* 4) If you used a “full-bleed” breakout earlier, remove it or make it safe */
.full-bleed { width:100%; margin:0; }   /* instead of width:100vw / negative margins */


/* Apply to all headings + common title classes */
h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6,
.display-1,.display-2,.display-3,.display-4,.display-5,.display-6,
.navbar-brand, .card-title {
  font-family: "Orbitron", sans-serif !important;
  letter-spacing: .06em;       /* tweak tracking if needed */
  font-weight: 700;            /* adjust per design (400–900) */
}


/* Base */
.topbar { background:#7a7a7a; color:#fff; }
.topbar a { color:#fff; text-decoration:none; }
.tb-item { display:inline-flex; align-items:center; gap:.45rem; }
.tb-item i { flex:0 0 auto; font-size:1rem; }
.tb-text { display:inline-block; min-width:0; } /* min-width:0 enables truncation inside flex */

/* Mobile: two items on first row, email below; tighter spacing & smaller font */
@media (max-width: 575.98px){
  .topbar { font-size:.85rem; padding:.35rem 0; }
  

  /* Make flex children allow ellipsis */
  .tb-item { width:100%; }
  .tb-text {
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width: 100%;
    vertical-align: middle;
  }

  /* Hide "Call:" to save space on tiny screens */
  .xs-hide { display:none; }
}

/* ≥ md: normal three columns with tidy widths */
@media (min-width: 768px){
  .tb-item { width:auto; }
  .tb-text { max-width: 32ch; } /* keep long strings neat */
}

/* Optional: icon contrast */
.topbar .bi { opacity:.9; }




/* Navbar (black) */
.main-nav{ background:#000; }
.main-nav .nav-link{ color:#cfcfcf; font-weight:500; }
.main-nav .nav-link:hover,
.main-nav .nav-link.active{ color:#fff; }

/* Use our own caret (hide Bootstrap's) */
.main-nav .dropdown-toggle::after{ display:none; }

/* Caret base */
.nav-caret{
  transition: transform .2s ease;
  font-size: .9rem;
}

/* Rotate caret when dropdown is open via click/keyboard */
.navbar .dropdown.show .nav-caret,
.navbar .dropdown-toggle[aria-expanded="true"] .nav-caret{
  transform: rotate(180deg);
}

/* Desktop: open on hover + rotate caret */
@media (min-width: 992px){
  .navbar .dropdown:hover .dropdown-menu{
    display:block;
    margin-top:0; /* prevents jump */
  }
  .navbar .dropdown:hover .nav-caret{
    transform: rotate(180deg);
  }
}

/* Dark dropdown styling to match navbar */
.main-nav .dropdown-menu{
  background:#111;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 8px 30px rgba(0,0,0,.35);
}
.main-nav .dropdown-item{ color:#cfcfcf; }
.main-nav .dropdown-item:hover{
  color:#fff;
  background:rgba(255,255,255,.06);
}


    /* Make room for the fixed header */
    body{
      padding-top: calc(var(--topbar-h) + var(--navbar-h));
    }
    
    @media (max-width: 575.98px){
  .topbar{ display:none !important; }   /* hide topbar */
            
}

    /* Responsive tweaks */
    @media (max-width: 991.98px){     /* < lg */
      :root{ --navbar-h: 64px; }
      .topbar{ font-size:.85rem; }
      .brand-img{ height:30px; }
    }
    @media (max-width: 575.98px){     /* < sm */
      :root{ --topbar-h: auto; }      /* allow multi-line stack */
      body{ padding-top: calc(52px + var(--navbar-h)); } /* room for stacked topbar */
      .topbar .row > div{ padding-top:.25rem; padding-bottom:.25rem; }
    }


    /* more space between nav links (desktop) */
@media (min-width: 992px){
  .main-nav .navbar-nav{
    gap: 2rem;            /* tweak: 1.5rem–3rem as you like */
  }
}
@media (min-width: 992px){
  .main-nav .nav-link{ padding: .5rem 1rem; }  /* L/R space */
}
@media (min-width: 992px){
  .main-nav .navbar-nav{ gap: 1.25rem; }
  .main-nav .nav-link{ padding: .5rem .85rem; }
}
/* Full-bleed hero with dark left-to-right gradient over the image */
.hero-about{
  position: relative;
  min-height: 56vh;                         /* desktop height */
  padding: clamp(2rem, 6vw, 5rem) 0;        /* vertical breathing room */
  background-image:
    linear-gradient(
      90deg,
      rgba(0,0,0,.85) 0%,
      rgba(0,0,0,.65) 28%,
      rgba(0,0,0,.35) 52%,
      rgba(0,0,0,.12) 74%,
      rgba(0,0,0,0) 100%
    ),
    var(--hero-image);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Heading sizing: uses your global heading font (Orbitron) automatically.
   If you prefer Inter here, uncomment the next line. */
/* .hero-heading { font-family: var(--body-font); } */
.hero-heading{
  font-weight: 800;
  line-height: 1.1;
  /* responsive size: 32px → 72px */
  font-size: clamp(2rem, 5vw, 4.5rem);
  text-shadow: 0 2px 24px rgba(0,0,0,.25);
}

/* Mobile tweaks */
@media (max-width: 575.98px){
  .hero-about{ min-height: 42vh; }
}
/* Uses your global fonts: Orbitron for headings, Inter for body */

/* Contact split visuals */
.contact-underline{
  width: 56px; height: 4px; border-radius: 999px; background:#000;  /* accent line */
}

/* Icon list */
.contact-list li{
  display:flex; gap:.75rem; align-items:flex-start;
  padding:.5rem 0;
}
.contact-list i{
  color:#000;                 /* icon color */
  font-size:1.1rem;
  margin-top:.25rem;
}
.contact-list a{ color:inherit; text-decoration:none; }
.contact-list a:hover{ text-decoration:underline; }

/* Form look */
.contact-form .form-control{
  padding:.7rem .9rem;
  border:1px solid rgba(0,0,0,.15);
  border-radius:.5rem;
}
.contact-form .form-control:focus{
  border-color:#000;
  box-shadow:0 0 0 .25rem rgba(0,0,0,.08);
}

.map-embed iframe{ border:0; width:100%; height:100%; display:block; }

/* shorter map (height = % of width) */
.map-frame{ --bs-aspect-ratio: 30%; }              /* desktop ~30% of width */
@media (max-width: 991.98px){ .map-frame{ --bs-aspect-ratio: 38%; } }
@media (max-width: 575.98px){ .map-frame{ --bs-aspect-ratio: 48%; } }
.map-frame{ min-height: 340px; }
@media (max-width: 991.98px){ .map-frame{ min-height: 280px; } }
@media (max-width: 575.98px){ .map-frame{ min-height: 220px; } }
.site-footer{
  background:#000;
  color:#fff;
}
.footer-logo{ height: 100px; object-fit:contain; }

/* menu with separators */
.footer-menu li{
  position:relative;
  padding: .25rem 0;
}
.footer-menu li + li{ margin-left:1rem; padding-left:1rem; }
.footer-menu li + li::before{
  content:"|";
  position:absolute; left:0; top:0; bottom:0;
  margin:auto 0; height:1em; line-height:1;
  color:rgba(255,255,255,.35);
}
.footer-menu a{
  color:#fff; opacity:.85; text-decoration:none; font-weight:500;
}
.footer-menu a:hover{ opacity:1; }

/* socials */
.social-circle{
  width:34px; height:34px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.25);
  color:#fff; opacity:.9;
}
.social-circle:hover{ background:#fff; color:#000; }

/* legal */
.footer-legal a{
  color:#fff; opacity:.75; text-decoration:none;
}
.footer-legal a:hover{ opacity:1; }

/* responsive tweaks */
@media (max-width: 575.98px){
  .footer-menu{ justify-content:center; gap:.25rem .5rem; }
  .footer-menu li + li{ margin-left:.5rem; padding-left:.75rem; }
  .social-circle{ width:32px; height:32px; }
}



















.terms-section {
    background: #f8f9fa; /* light background */
    font-family: 'Poppins', sans-serif;
  }
  .terms-section h2 {
    color: #343a40;
    font-weight: 600;
  }
  .terms-section h5 {
    color: #212529;
    font-weight: 500;
  }
  .terms-section p {
    color: #555;
    line-height: 1.7;
    font-weight: 400;
  }
  .terms-section a {
    color: #007bff;
    text-decoration: none;
  }
  .terms-section a:hover {
    text-decoration: underline;
  }