/* ==========================================================================
   Afghan Echoes / Tour template — FULL STYLESHEET
   ========================================================================== */

/* Base
/* -------------------------------------------------------------------------- */
:root{
  --primary:#1A374D;
  --primary-700:#1f425c;
  --bg-hero:#6998AB;
  --accent:#B1D0E0;
  --text:#000;
}

*,
*::before,
*::after{ box-sizing:border-box; }

html,body{ height:100%; }

body{
  font-family:"Inter",sans-serif;
  line-height:1.5;
  background:#fff;
  overflow-x:hidden;
  font-size:14px;
}

/* dark overlay for mobile menu */
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:99;
  background:rgba(0,0,0,.2);
  opacity:0; visibility:hidden;
  transition:.3s all ease;
}
body.offcanvas-menu::before{ opacity:1; visibility:visible; }

.bg-primary{ background-color:var(--primary)!important; }
.text-primary{ color:var(--primary)!important; }
.text-black{ color:#000!important; }

a{
  color:var(--primary);
  transition:.3s all ease;
}
a:hover{ color:var(--primary); text-decoration:none; }

::selection{ background:#000; color:#fff; }
::-moz-selection{ background:#000; color:#fff; }

h1,.h1,h2,.h2,h3,.h3,h4,.h4{ font-family:"Source Serif Pro",serif; }

/* Buttons
/* -------------------------------------------------------------------------- */
.btn{
  padding:12px 30px;
  border-radius:30px;
  font-size:14px;
}
.btn:active,.btn:focus{ outline:0; box-shadow:none; }
.btn.btn-primary{
  background:var(--primary);
  border-color:var(--primary);
}
.btn.btn-primary:hover{ background:var(--primary-700); border-color:var(--primary-700); }
.btn.btn-outline-white{ border:2px solid #fff; }
.btn.btn-outline-white:hover{ background:#fff; color:var(--primary)!important; }

.text-white-opacity{ opacity:.7; }

/* Forms
/* -------------------------------------------------------------------------- */
.form-control,.custom-select{
  border:2px solid #e9ecef;
  font-size:16px;
  height:45px;
}
.form-control:active,.form-control:focus,
.custom-select:active,.custom-select:focus{
  border-color:var(--primary);
  box-shadow:none;
}

/* Preloader (optional)
/* -------------------------------------------------------------------------- */
.spinner-border{ color:var(--primary); }
#overlayer{
  position:fixed; inset:0; z-index:7100; background:#fff;
}
.loader{
  z-index:7700; position:fixed; top:50%; left:50%;
  transform:translate(-50%,-50%);
}

/* NAV
/* -------------------------------------------------------------------------- */
.logo{ font-size:24px; color:#fff; font-weight:700; }
.logo:hover{ color:#fff; }

.site-nav{
  position:absolute; top:0; z-index:9; width:100%;
  padding:20px 0;
}
.site-nav .site-navigation .site-menu{ margin-bottom:0; }
.site-nav .site-navigation .site-menu>li{ display:inline-block; }
.site-nav .site-navigation .site-menu>li>a{
  font-size:14px; padding:10px 15px; display:inline-block;
  color:rgba(255,255,255,.7); text-decoration:none!important;
}
.site-nav .site-navigation .site-menu>li>a:hover{ color:#fff; }
.site-nav .site-navigation .site-menu>li.active>a{ color:#fff; }

.site-nav .site-navigation .site-menu .has-children{ position:relative; }
.site-nav .site-navigation .site-menu .has-children>a{ padding-right:20px; position:relative; }
.site-nav .site-navigation .site-menu .has-children>a:before{
  content:"\e313"; font-family:'icomoon'; position:absolute; right:0; top:50%;
  transform:translateY(-50%); font-size:14px;
}
.site-nav .site-navigation .site-menu .has-children .dropdown{
  position:absolute; top:100%; left:0; z-index:999; text-align:left;
  visibility:hidden; opacity:0; margin-top:20px; padding:20px 0; border-radius:20px;
  background:#fff; box-shadow:0 2px 10px -2px rgba(0,0,0,.1);
  transition:.2s;
}
.site-nav .site-navigation .site-menu .has-children:hover>.dropdown{
  visibility:visible; opacity:1; margin-top:0;
}
.site-nav .site-navigation .site-menu .has-children .dropdown>li{
  list-style:none; min-width:180px;
}
.site-nav .site-navigation .site-menu .has-children .dropdown>li>a{
  display:block; padding:5px 20px; color:#000;
}
.site-nav .site-navigation .site-menu .has-children .dropdown>li>a:hover{ color:var(--primary); }

/* Mobile menu */
.site-mobile-menu{
  width:300px; position:fixed; right:0; top:0; bottom:0; z-index:2000;
  background:#fff; transform:translateX(100%);
  transition:.8s cubic-bezier(0.23,1,0.32,1);
  padding-top:20px;
}
.offcanvas-menu .site-mobile-menu{
  transform:translateX(0%); box-shadow:-10px 0 20px -10px rgba(0,0,0,.1);
}
.site-mobile-menu-close{ position:relative; height:30px; width:30px; cursor:pointer; top:-20px; }
.site-mobile-menu-close>span{ position:absolute; height:30px; width:30px; }
.site-mobile-menu-close>span:before,
.site-mobile-menu-close>span:after{
  content:""; position:absolute; width:2px; height:30px; background:#000;
}
.site-mobile-menu-close>span:before{ transform:rotate(45deg); }
.site-mobile-menu-close>span:after{ transform:rotate(-45deg); }
.site-mobile-menu .site-mobile-menu-body{
  overflow-y:auto; height:calc(100vh - 52px); padding:0 20px 150px;
}

/* Burger */
.burger{ width:28px; height:32px; cursor:pointer; position:relative; }
.burger.light:before,.burger.light span,.burger.light:after{ background:#fff; }
.burger:before,.burger span,.burger:after{
  content:""; position:absolute; left:0; width:100%; height:2px; background:#000; border-radius:2px;
}
.burger:before{ top:4px; } .burger span{ top:15px; } .burger:after{ top:26px; }
.burger:hover:before{ top:7px; } .burger:hover:after{ top:23px; }
.burger.active span{ opacity:0; }
.burger.active:before,.burger.active:after{ top:40%; }
.burger.active:before{ transform:rotate(45deg); }
.burger.active:after{ transform:rotate(-45deg); }
.burger:focus{ outline:none; }

/* Sticky wrapper (optional) */
.sticky-wrapper{ position:absolute; z-index:100; width:100%; }
.sticky-wrapper .site-navbar{ transition:.3s all ease; }

/* HERO (left title + right circle slider)
/* -------------------------------------------------------------------------- */
.hero{
  padding:7rem 0 10rem;
  background:var(--bg-hero);
  margin-bottom:100px;
}
.hero.hero-inner{
  padding:9rem 0 7rem; margin-bottom:auto; background:var(--primary);
}
.hero h1{ color:#fff; font-size:60px; }
@media (max-width:991.98px){ .hero h1{ font-size:45px; } }

.hero h1 .typed-words{ position:relative; }
.hero h1 .typed-words:before{
  content:""; position:absolute; left:0; right:0; bottom:0; height:7px; background:var(--accent);
}

.hero .intro-wrap{ position:relative; z-index:1; }

/* circular image stack */
.hero .slides{
  background:#fff; max-width:800px; height:608px;
  position:relative; left:-100px; z-index:0; margin-bottom:-200px;
  border-radius:200px;
  box-shadow:0 25px 50px -10px rgba(26,55,77,.4);
}
@media (max-width:991.98px){ .hero .slides{ left:0; } }

.hero .slides img{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover;
  border-radius:200px;
  background:#fff;
  opacity:0; transition:4s opacity ease;
}
.hero .slides img.active{ opacity:1; z-index:1; }

/* Search card in hero */
.form{
  position:relative; z-index:9;
  padding:30px; background:#fff;
  border-radius:10px;
  box-shadow:0 15px 30px 0 rgba(0,0,0,.3);
}

/* Sections
/* -------------------------------------------------------------------------- */
.untree_co-section{ padding:70px 0; }

.section-title{
  position:relative; padding-bottom:20px; display:inline-block;
}
.section-title:before{
  content:""; position:absolute; left:0; bottom:0; width:30px; height:2px; background:var(--primary);
}
.section-title.text-center:before{
  left:50%; transform:translateX(-50%);
}

/* Media Thumb grid */
.media-thumb{ position:relative; display:block; cursor:pointer; overflow:hidden; border-radius:20px; }
.media-thumb:after{
  content:""; position:absolute; inset:0; background:rgba(26,55,77,.8);
  z-index:1; opacity:0; visibility:hidden; transition:.3s all ease;
}
.media-thumb img{
  transform:scale(1.03); transition:.3s transform ease; display:block; width:100%;
}
.media-thumb .media-text{
  position:absolute; top:20px; left:40px; z-index:2; margin-top:20px; transition:.3s all ease;
}
.media-thumb .media-text h3{ font-size:1rem; font-weight:900; color:var(--primary); margin:0; }
.media-thumb .media-text .location{ font-size:.8rem; color:rgba(26,55,77,.5); }
.media-thumb:hover{ z-index:3; }
.media-thumb:hover img{ transform:scale(1); }
.media-thumb:hover:after{ opacity:1; visibility:visible; }
.media-thumb:hover .media-text h3{ color:#fff; }
.media-thumb:hover .media-text .location{ color:rgba(255,255,255,.5); }

/* Owl 3 slider arrows */
.owl-3-slider .owl-nav{
  position:absolute; top:50%; transform:translateY(-50%); width:100%;
  opacity:0; visibility:hidden; transition:.3s all ease;
}
.owl-3-slider:hover .owl-nav{ opacity:1; visibility:visible; }
.owl-3-slider .owl-nav .owl-prev,
.owl-3-slider .owl-nav .owl-next{
  position:absolute; top:50%; transform:translateY(-50%); font-size:30px; transition:.3s all ease;
}
.owl-3-slider .owl-nav .owl-prev{ left:-50px; }
.owl-3-slider .owl-nav .owl-prev:hover{ left:-65px; color:var(--primary); }
.owl-3-slider .owl-nav .owl-next{ right:-50px; }
.owl-3-slider .owl-nav .owl-next:hover{ right:-65px; color:var(--primary); }
.owl-3-slider .owl-nav .owl-next span{ display:inline-block; transform:rotate(-180deg); }

.owl-dots{ position:relative; margin-top:25px; }
.owl-single .owl-dots,.owl-carousel .owl-dots{
  text-align:center; position:absolute; left:50%; transform:translateX(-50%); width:100%;
}
.owl-single .owl-dots .owl-dot span,
.owl-carousel .owl-dots .owl-dot span{
  width:8px; height:8px; display:inline-block; border-radius:50%; background:rgba(0,0,0,.2);
}
.owl-single .owl-dots .owl-dot.active span,
.owl-carousel .owl-dots .owl-dot.active span{ background:var(--primary); }

/* Features & counters */
.feature-1-wrap{ position:relative; }
.feature-1{
  padding:30px; background:rgba(26,55,77,.05); border-radius:20px;
  min-height:calc(50% - 15px); margin-bottom:30px!important;
}
.feature-1 h3{ font-size:1.2rem; font-weight:700; }

.counter-wrap .caption{ color:var(--primary); font-weight:bold; }
.counter-wrap .counter{ font-size:3rem; }
.counter-wrap .counter span{ color:var(--primary); }
@media (max-width:991.98px){ .counter-wrap{ margin-bottom:30px; } .counter-wrap .counter{ font-size:2.5rem; } }

.rounded-20{ border-radius:20px; }

/* CTA */
.cta-section{ background:var(--primary); }

/* List, quick contact, video play button (from template) */
.two-col li{
  display:inline-block; width:48%; position:relative; padding-left:30px; margin-bottom:10px; float:left;
}
.two-col li:before{
  content:""; position:absolute; width:7px; height:7px; border:1px solid var(--primary);
  left:0; top:7px; border-radius:50%;
}

.video-play-button{
  position:absolute; z-index:10; top:50%; left:50%; transform:translate(-50%,-50%);
  display:block; width:32px; height:44px; padding:18px 20px 18px 28px;
  border-radius:50%;
}
.video-play-button:before{
  content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:80px; height:80px; background:#204560; border-radius:50%; animation:pulse-border 1500ms ease-out infinite;
}
.video-play-button:after{
  content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:80px; height:80px; background:var(--primary); border-radius:50%; transition:all 200ms;
}
.video-play-button:hover:after{ background:#204560; }
.video-play-button span{
  position:relative; z-index:3; display:block; width:0; height:0; top:50%; left:50%;
  transform:translate(-50%,-50%);
  border-left:22px solid #fff; border-top:12px solid transparent; border-bottom:12px solid transparent;
}
@keyframes pulse-border{
  0%{ transform:translate(-50%,-50%) scale(1); opacity:1; }
  100%{ transform:translate(-50%,-50%) scale(1.5); opacity:0; }
}

/* Footer
/* -------------------------------------------------------------------------- */
.site-footer{ font-size:14px; color:#777; line-height:1.6; }
.site-footer .inner{ padding-top:0; padding-bottom:70px; background:#f8f9fa; }
.site-footer .inner.first{ padding-top:80px; }
.site-footer a{ color:#000; }
.site-footer a:hover{ color:#000; text-decoration:underline; }
.site-footer .widget{ margin-bottom:30px; }
.site-footer .widget h3{ font-size:14px; margin-bottom:20px; color:#000; font-family:"Inter",sans-serif; }
.site-footer .widget .social li{ display:inline-block; }
.site-footer .widget .social li a{
  width:30px; height:30px; border-radius:50%; background:var(--primary);
  display:inline-block; position:relative; color:#fff; box-shadow:0 5px 10px -2px rgba(0,0,0,.2);
}
.site-footer .widget .social li a span{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); font-size:16px;
}
.site-footer .widget .links li{ display:block; margin-bottom:10px; }
.site-footer .widget .links li a{ color:#000; }
.site-footer .widget .links li a:hover{ color:#000; text-decoration:underline; }

.site-footer ul.quick-info li{ position:relative; padding-left:30px; }
.site-footer ul.quick-info li:before{
  position:absolute; left:0; color:#6998AB; font-family:'icomoon'; content:"";
}
.site-footer ul.quick-info li.email:before{ content:"\f0e0"; }
.site-footer ul.quick-info li.phone:before{ content:"\f095"; }
.site-footer ul.quick-info li.address:before{ content:"\e8b4"; }

/* Utilities
/* -------------------------------------------------------------------------- */
.gutter-v1{ margin:0 -20px; }
.gutter-v1>.col, .gutter-v1>[class*="col-"]{ padding:0 20px; }
@media (max-width:991.98px){
  .gutter-v1{ margin:0 -15px; }
  .gutter-v1>.col, .gutter-v1>[class*="col-"]{ padding:0 15px; }
}

.gutter-v2{ margin:0 -5px; }
.gutter-v2>.col, .gutter-v2>[class*="col-"]{ padding:0 5px; }
@media (max-width:991.98px){
  .gutter-v2{ margin:0 -15px; }
  .gutter-v2>.col, .gutter-v2>[class*="col-"]{ padding:0 15px; }
}

/* Gallery simple thumb */
.gal-item{ display:block; margin-bottom:8px; }
.gal-item img{ border-radius:4px; transition:.3s all ease; opacity:1; display:block; width:100%; }
.gal-item:hover img{ opacity:.5; }

/* Social icons (light variant) */
.social-icons li{ display:inline-block; }
.social-icons li a{
  color:rgba(255,255,255,.5); width:40px; height:40px; border-radius:50%;
  background:#303030; display:inline-block; position:relative;
}
.social-icons li a span{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); }
.social-icons li a:hover{ color:#fff; }
.social-icons.light li a{ color:#000; background:#f8f9fa; }

/* List with checkmarks */
.list-check li{ display:block; padding-left:30px; position:relative; }
.list-check li:before{
  content:"\e5ca"; font-family:'icomoon'; position:absolute; left:0; top:-.3rem; font-size:20px;
}

/* Owl single arrows (optional) */
.owl-single .owl-nav{ position:absolute; top:50%; width:100%; transform:translateY(-50%); }
.owl-single .owl-nav .owl-prev, .owl-single .owl-nav .owl-next{ position:absolute; top:0; }
.owl-single .owl-nav .owl-prev span, .owl-single .owl-nav .owl-next span{ display:block; background:#fff; padding:15px; }
.owl-single .owl-nav .owl-prev{ left:-30px; }
.owl-single .owl-nav .owl-next{ right:-30px; }
.owl-single .owl-nav .owl-next>span{ transform:rotate(-180deg); }

/* Testimonial */
.testimonial{ max-width:500px; text-align:center; margin-bottom:30px; }
.testimonial .name{ font-size:18px; color:#000; }
.testimonial .img-wrap img{ margin:0 auto; width:70px; border-radius:50%; }

/* === FORCE SOLID DARK NAVBAR (all states/classes) === */
nav.site-navbar,
nav.site-navbar.bg-light,
nav.site-navbar.bg-white,
nav.site-navbar.bg-transparent,
nav.site-navbar.scrolled,
nav.site-navbar.awake,
nav.site-navbar.scrolled.awake,
.navbar.site-navbar,
.navbar-light.site-navbar,
.navbar-light.site-navbar.bg-light,
header nav.site-navbar {
  background: #123a49 !important;           /* dark teal */
  border-bottom: 1px solid rgba(255,255,255,.06);
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
}

/* kill any theme overlays */
nav.site-navbar::before,
nav.site-navbar::after { display: none !important; }

/* Brand + links (override .navbar-light defaults too) */
nav.site-navbar .navbar-brand,
nav.site-navbar .site-logo a,
.navbar-light.site-navbar .navbar-brand {
  color: #ffffff !important;
  font-weight: 700;
}

nav.site-navbar .nav-link,
.navbar-light.site-navbar .navbar-nav .nav-link,
nav.site-navbar .navbar-nav > li > a {
  color: #e8edf2 !important;
  font-weight: 600;
  padding: .75rem 1rem;
}

nav.site-navbar .nav-link:hover,
nav.site-navbar .nav-item.active .nav-link,
nav.site-navbar .nav-link.active,
.navbar-light.site-navbar .navbar-nav .nav-link:hover {
  color: #E0B65A !important;                /* gold highlight */
}

/* Mobile toggler contrast */
nav.site-navbar .navbar-toggler { border-color: rgba(255,255,255,.4) !important; }
nav.site-navbar .navbar-toggler-icon { filter: invert(1) brightness(2); }

/* === PLAIN DARK HERO FOR INNER PAGES (like Services) === */
.site-hero.inner-page {
  margin-top: 64px;                          /* keep hero below sticky nav */
  background: #123a49 !important;            /* same color as navbar */
  background-image: none !important;         /* ignore any inline image */
}
.site-hero.inner-page.overlay::after { display: none !important; }
.site-hero.inner-page h1 { color: #fff; text-shadow: none; }
.site-hero.inner-page .lead { color: rgba(255,255,255,.85); }

/* Solid dark navbar look (like Services) */
.ae-navbar--solid-dark{
  position: sticky; top: 0; z-index: 1030;
  background: #123a49 !important;            /* dark teal */
  border-bottom: 1px solid rgba(255,255,255,.06);
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
}

/* Keep it dark even when theme JS adds classes */
.ae-navbar--solid-dark.scrolled,
.ae-navbar--solid-dark.awake,
.ae-navbar--solid-dark.scrolled.awake { background: #123a49 !important; }

/* Link/brand colors (navbar-dark already sets good defaults, this reinforces) */
.ae-navbar--solid-dark .navbar-brand,
.ae-navbar--solid-dark .site-logo a { color:#fff !important; font-weight:700; }
.ae-navbar--solid-dark .nav-link { color:#e8edf2 !important; font-weight:600; }
.ae-navbar--solid-dark .nav-link:hover,
.ae-navbar--solid-dark .nav-item.active .nav-link,
.ae-navbar--solid-dark .nav-link.active { color:#E0B65A !important; }

/* Inner-page hero plain dark (optional; matches Services header) */
.site-hero.inner-page{
  margin-top: 64px;                           /* keep hero below sticky nav */
  background: #123a49 !important;
  background-image: none !important;
}
.site-hero.inner-page.overlay::after{ display:none !important; }
.site-hero.inner-page h1{ color:#fff; text-shadow:none; }
.site-hero.inner-page .lead{ color:rgba(255,255,255,.85); }

/* Remove the white gap under the navbar */
.ae-navbar--solid-dark,
.site-navbar,
.navbar.site-navbar {
  margin-bottom: 0 !important;          /* most common cause */
  border-bottom: 1px solid rgba(255,255,255,.06);
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
}

/* Some themes add body padding for fixed navbars – not needed for sticky */
body { padding-top: 0 !important; }

/* Make the hero start immediately after the navbar */
.site-hero.inner-page {
  margin-top: 0 !important;
  overflow: hidden;                      /* prevents margin-collapsing from children */
}

/* Defensive: ensure the first heading inside hero doesn't push up */
.site-hero.inner-page h1,
.site-hero.inner-page .display-4 {
  margin-top: 0 !important;
}

/* Optional: keep a little breathing room inside the hero */
.site-hero .site-hero-inner {
  padding-top: 40px;                     /* adjust to taste */
}

/* ===== AE NAVBAR (one style file) ===== */

/* Common base */
.ae-navbar {
  z-index: 1030;
  width: 100%;
  border-bottom: 0;
}
.ae-navbar .navbar-brand { font-weight: 700; }
.ae-navbar .nav-link { font-weight: 600; }

/* Homepage: transparent over hero (white text) */
.ae-navbar--home {
  position: absolute;      /* sits on top of the hero */
  top: 0; left: 0; right: 0;
  background: transparent !important;
  box-shadow: none !important;
}
.ae-navbar--home .navbar-brand,
.ae-navbar--home .site-logo a,
.ae-navbar--home .nav-link {
  color: #ffffff !important;
}
.ae-navbar--home .nav-link:hover,
.ae-navbar--home .nav-item.active .nav-link,
.ae-navbar--home .nav-link.active {
  color: #f1f5f9 !important;
}
.ae-navbar--home .dropdown-menu {
  background: rgba(0,0,0,.7);
  border: 0;
}
.ae-navbar--home .dropdown-item { color: #fff; }
.ae-navbar--home .dropdown-item:hover { background: rgba(255,255,255,.1); }

/* Other pages: solid dark bar */
.ae-navbar--solid {
  position: sticky; top: 0;
  background: #123a49 !important;
  border-bottom: 1px solid rgba(255,255,255,.06);
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
}
.ae-navbar--solid .navbar-brand,
.ae-navbar--solid .site-logo a { color: #fff !important; }
.ae-navbar--solid .nav-link { color: #e8edf2 !important; }
.ae-navbar--solid .nav-link:hover,
.ae-navbar--solid .nav-item.active .nav-link,
.ae-navbar--solid .nav-link.active { color: #E0B65A !important; }

/* Remove any white strip under the navbar */
.ae-navbar--home, .ae-navbar--solid { margin-bottom: 0 !important; }
body { padding-top: 0 !important; }

/* Hero spacing: homepage has nav overlay, inner pages start right away */
.site-hero { margin-top: 0 !important; }
.site-hero.inner-page { margin-top: 0 !important; }

/* Optional toggler contrast for transparent nav */
.ae-navbar--home .navbar-toggler { border-color: rgba(255,255,255,.5); }
.ae-navbar--home .navbar-toggler-icon { filter: invert(1) brightness(2); }


  .ae-fixed-logo{
    position: fixed;
    top: 8px;
    left: 16px;
    z-index: 1100;           /* above navbar (navbar is 1030) */
    line-height: 0;
    display: block;
  }
  .ae-fixed-logo img{
    height: 150px;           /* desktop logo height */
    width: auto;
    display: block;
  }
  @media (max-width: 991.98px){
    .ae-fixed-logo{ top: 8px; left: 12px; }
    .ae-fixed-logo img{ height: 56px; }  /* mobile logo height */
  }