/**
 * Theme Name:     Morocco Zida Tours
 * Author:         Tom Usborne
 * Template:       generatepress
 * Text Domain:    morocco-zida-tours
 * Description:    GeneratePress is a lightweight WordPress theme built with a focus on speed and usability. Performance is important to us, which is why a fresh GeneratePress install adds less than 10kb (gzipped) to your page size. We take full advantage of the block editor (Gutenberg), which gives you more control over creating your content. If you use page builders, GeneratePress is the right theme for you. It is completely compatible with all major page builders, including Beaver Builder and Elementor. Thanks to our emphasis on WordPress coding standards, we can boast full compatibility with all well-coded plugins, including WooCommerce. GeneratePress is fully responsive, uses valid HTML/CSS, and is translated into over 25 languages by our amazing community of users. A few of our many features include 60+ color controls, powerful dynamic typography, 5 navigation locations, 5 sidebar layouts, dropdown menus (click or hover), and 9 widget areas. Learn more and check out our powerful premium version at https://generatepress.com
 */


/* Load Poppins font */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

/* Typography */
body {
  font-family: 'Poppins', sans-serif;
  color: #000;
  margin: 0;
  padding: 0;
}
body, button, input, select, textarea {
    font-family: 'Poppins', sans-serif !important;
}
h1, h2, h3, h4, h5, h6 {
  color: #000000;
  font-weight: 600;
  margin: 0 0 10px;
}

.section-subtitle, h4{
     font-family: 'Caveat', sans-serif;
     font-weight: 700;
}

p {
  color: #7D7D7D;
  line-height: 1.7;
  margin-bottom: 1em;
}

/* ========= HEADER STYLES ========= */

/* Containers */
.container {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 20px;
  width: 100%;
}

.header-top .container {
  max-width: 1400px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 20px;
  flex-wrap: wrap;
  gap: 6px;
  text-align: center;
  padding-bottom: 0px;
}

/* Top Bar */
.header-top {
  
  background-color: #19b3b4;
  color: #fff;
  font-size: 14px;
}

.top-bar-text {
  flex: 1;
  color: #fff;
  font-size: 14px;
}

.phone, .top-bar-badge{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  white-space: nowrap;
}

.phone span{
 margin-top: 2px;
}

.phone svg {
  width: 16px;
  height: 16px;
  fill: #fff;
}

.header-top i {
  margin-right: 5px;
  color: #fff; /* WhatsApp green for WhatsApp icon */
  font-size: 18px;
  
}

.top-bar-badge i {

}


/* Main Header */
.header-main {
  background: #fff;
  box-shadow: 0 1px 5px rgba(0,0,0,0.05);
  position: relative;
  z-index: 100;
}

.header-main .container {
  display: flex;
  justify-content: space-between;
  align-items: end;
  flex-wrap: wrap;
  padding: 10px 15px;
  padding-top: 0px;
}

.logo img {
  height: auto;
  width: 100px;
}

/* Nav Menu */
.nav-menu {
  display: flex;
  list-style: none;
  gap: 25px;
  margin: 0;
  padding: 0;
}

.nav-menu li {
  position: relative;
}

.nav-menu li a {
  text-decoration: none;
  color: #000;
  font-weight: 500;
  font-size: 20px;
  padding: 0px;
  display: inline-block;
}

.nav-menu li.menu-item-has-children > a::after {
  content: " ▼";
  font-size: 10px;
  margin-left: 4px;
}

/* Submenu */
.nav-menu .sub-menu {
  position: absolute;
  left: 0;
  top: 100%;
  background: #fff;
  padding: 10px 0;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
  display: none;
  min-width: 300px;
  z-index: 1000;
  list-style: none;
}

.nav-menu li:hover > .sub-menu {
  display: block;
}

.sub-menu li a {
  padding: 8px 20px;
  display: block;
  color: #000 !important;
  font-size: 15px;
}

.sub-menu li a:hover {
  background: #f4f4f4;
}

/* CTA Button */
.slider-content .btn-primary {
  background: #ec927e;
  color: #fff;
  padding: 15px 30px;
 
  text-decoration: none;
  font-weight: 600;
  font-size: 18px;
}
.btn-primary {
  background: #ec927e;
  color: #fff;
  padding: 10px 16px;
  border-radius: 5px;
  text-decoration: none;
  font-weight: 600;
  font-size: 14px;
}
.btn-primary {
  background: #ec927e;
  color: #fff;
  border: 2px solid transparent;
  box-shadow: 0 5px 0 #df5334;
  border-radius: 50px;
  transition: all 0.3s ease;
}

.btn-primary:hover {
    transform: translateY(5px);
    box-shadow: 0 0 0 #df5334 !important;
    color: #fff;
 
}





.cta-button {
  white-space: nowrap;
}

.nav-wrapper {
  flex: 1;
  display: flex;
  justify-content: center;
  overflow: hidden;
}


.sticky-header {
  position: sticky;
  top: 0;
  background: #fff;
  z-index: 9999;
  transform: translateY(0);
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
  transition: transform 0.5s ease, box-shadow 0.3s ease;
}

/* Hide state */
.sticky-header.hide {
  transform: translateY(-100%);
  box-shadow: none;
}

/* Default sticky header */
.sticky-header {
  position: sticky;
  top: 0;
  background: #fff;
  z-index: 9999;
  transition: background 0.3s ease, box-shadow 0.3s ease;
  box-shadow: 0 1px 5px rgba(0,0,0,0.05);
}

/* ===== Home page transparent mode ===== */
.home-header {
  background: transparent;
  box-shadow: none;
  position: absolute;
  width: 100%;
}

/* White text in transparent mode */

.home-header .cta-button {
  color: #fff;
}

/* Hamburger lines white */
.home-header .hamburger span {
  background: #fff;
}

/* ===== Sticky active mode ===== */
.sticky-header.scrolled {
  background: #fff !important;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* Links turn black in sticky mode */
.sticky-header.scrolled .nav-menu li a {
  color: #000;
}

.sticky-header.scrolled .cta-button {
  background: #ec927e;
  color: #fff;
}

.sticky-header.scrolled .hamburger span {
  background: #000;
}

/* Mobile fix: force solid header */
@media (max-width: 768px) {
  .home-header {
    position: relative;
    background: #fff !important;
    box-shadow: 0 1px 5px rgba(0,0,0,0.05) !important;
  }

  .home-header .nav-menu li a {
    color: #000 !important;
  }

  .home-header .hamburger span {
    background: #000 !important;
  }
}

/* Disable sticky header on mobile */
@media (max-width: 768px) {
  .sticky-header {
    position: relative !important;
    transform: none !important;
    box-shadow: none !important;
  }
}




/* ====== Responsive ====== */
@media (max-width: 1024px) {
  .header-top .container {
    flex-direction: column;
    text-align: center;
    padding: 12px 0;
  }

  .phone {
    margin-top: 6px;
    justify-content: center;
  }

  .nav-menu {
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    width: 100%;
    padding: 15px 0;
    flex-direction: column;
    display: none;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  }

  .nav-menu.active {
    display: flex;
  }

  

  .nav-menu .sub-menu {
    position: static;
    box-shadow: none;
    padding-left: 15px;
  }

  .hamburger {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 25px;
    height: 20px;
    cursor: pointer;
    margin-left: auto;
  }

  .hamburger span {
    height: 3px;
    background: #000;
    border-radius: 2px;
  }
  
   .header-main .container {
    flex-wrap: nowrap;
    gap: 10px;
  }

  .cta-button {
    margin-left: auto;
    margin-right: 10px;
    white-space: nowrap;
  }

  .hamburger {
    margin-left: 0;
  }
  
  .banner-buttons {
    align-items: center;
    justify-content: center;
}
}

@media (min-width: 1025px) and (max-width: 1292px) {
    
    
  .nav-wrapper {
    justify-content: flex-end;
    overflow-x: auto; /* Add scroll if needed */
  }

.nav-menu {
    flex-wrap: wrap;
    gap: 0px 15px;
    justify-content: center;
    vertical-align: middle;
 }

  .nav-menu li {
    flex-shrink: 0;
  }
}


@media (min-width: 1025px) {
  .hamburger {
    display: none;
  }
}



/* === Royal Footer Styling === */
.royal-footer {
  background-color: #441461;
  color: #ffffff;
  padding: 70px 20px 30px;
  font-family: 'Poppins', sans-serif;
}

.footer-container {
  max-width: 1400px;
  margin: auto;
  padding: 0 20px;
}

.footer-columns {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 70px 40px;
}

.footer-column {
  flex: 1 1 220px;
  min-width: 220px;
}

.footer-column h4 {
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 16px;
  text-transform: uppercase;
  color: #ffffff;
}

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

.footer-column ul li {
  margin-bottom: 10px;
}

.footer-column ul li a {
  color: #fff;
  text-decoration: none;
  font-size: 14px;
  transition: color 0.2s ease;
  font-weight: 400;
}

.footer-column ul li a:hover {
  color: #ffb347;
}

.footer-column p {
  font-size: 14px;
  color: #fff;
  max-width: 280px;
  line-height: 1.6;
}

.logo-column img {
  width: 120px;
  height: auto;
  margin-bottom: 20px;
}

/* === Social Buttons === */
.social-column {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* === Corrected Social Button Styles === */
.social-button {
  background-color: #1e3b68;
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  padding: 8px 16px;
  border-radius: 6px;
  font-size: 14px;
  gap: 12px;
  transition: background 0.3s ease;
  min-width: 160px;
  margin-bottom: 15px;
}

.social-button i {
  font-size: 16px;
}

/* Divider between icon and text */
.social-button span {
  position: relative;
  padding-left: 12px;
  margin-left: 4px;
}

.social-button span::before {
  content: '';
  position: absolute;
  left: 0;
  top: 3px;
  bottom: 3px;
  width: 1px;
  background-color: rgba(255, 255, 255, 0.4);
}

/* Hover style matching footer background */
.social-button:hover {
  background-color: #054FCC;
  color: #ffffff;
}


/* === Footer Bottom === */
.footer-bottom {
  margin-top: 40px;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  text-align: center;
  font-size: 14px;
  color: #ffffff;
}


.footer-contact .contact-item {
  display: flex;
  
  align-items: start;
  gap: 0px 10px;
  margin-bottom: 15px;
}

.footer-contact .contact-item i {
  color: #ec927e; /* change if needed */
  font-size: 14px;
  margin-top: 3px;
}

.footer-contact a {
  color: #fff;
  text-decoration: none;
}

.footer-contact .contact-item span {
  font-size: 14px;
  display: block;
  
}

/* === Responsive Styles === */
@media (max-width: 768px) {
  .footer-columns {
    flex-direction: column;
    gap: 30px;
  }

  .footer-column {
    width: 100%;
  }

  .social-button {
    width: auto;
    justify-content: center;
  }

  .social-button::before {
    display: none;
  }
}

@media (min-width: 769px) and (max-width: 1024px) {
  .footer-columns {
    display: flex;
    flex-wrap: wrap;
    gap: 40px 20px;
  }

  .footer-columns > * {
    width: calc(50% - 10px); /* 2 columns with 20px horizontal gap */
  }
}




/* Homepage Style */




.wp-block-social-links li a{
  font-size: 22px !important;
  back
}

/* Homepage Slider */
.home-slider {
    position: relative;
    width: 100%;
    overflow: hidden;
}
.home-slider .item {
    position: relative;
}
.home-slider img {
    width: 100%;
    height: 650px;
    object-fit: cover;
}
.home-slider .slider-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: #fff;
    
}
.home-slider .slider-content h2 {
    font-size: 22px;
    font-weight: 400;
    color: #ff5722;
    margin-bottom: 10px;
}
.home-slider .slider-content h1 {
    font-size: 58px;
    font-weight: 700;
    margin-bottom: 15px;
    color: #fff;
    line-height: 60px;
  
}
.home-slider .slider-content p {
    font-size: 18px;
    color: #fff;
    padding: 30px 0px;
    padding-top: 10px;
}






/* Overlay on slider images */
.home-slider .item::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4); /* dark overlay */
    z-index: 1;
}

/* Make sure content stays above overlay */
.home-slider .slider-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: #fff;
    width: 100%;
    max-width: 700px;
    padding: 20px;
    z-index: 2; /* higher than overlay */
}

/* Zoom animation effect for active slide */
.home-slider .owl-carousel .item img {
    transform: scale(1);
    transition: transform 10s ease;
}



.home-slider .owl-carousel .active img {
    animation: zoomEffect 10s ease forwards;
}

@keyframes zoomEffect {
    from {
        transform: scale(1);
    }
    to {
        transform: scale(1.1);
    }
}




/* Section Styles */
.travel-destination {
  text-align: center;
  padding: 60px 20px;
}

.section-subtitle {
  font-size: 22px;
  color: #1abc9c;
  margin-bottom: 5px;
  letter-spacing: 2px;
  text-align: center;
}

.section-title {
  font-size: 28px;
  font-weight: 700;
  color: #0c2340;
  margin-bottom: 10px;
  text-align: center;
}

.travel-destination .underline {
  width: 60px;
  height: 3px;
  background: none;
  border-bottom: 3px solid #d94a33;
  border-radius: 3px;
  margin: 0 auto 40px;
  position: relative;
}
.travel-destination .underline::after {
  content: "~~~~~";
  position: absolute;
  top: -18px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 22px;
  color: #d94a33;
}
.section-description {
  max-width: 1000px;
  margin: auto;
  font-size: 16px;
  line-height: 1.7;
  color: #555;
  text-align: center;
}

/* Grid Layout */
.destination-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  justify-content: center;
  padding-top: 30px;
  
}

.destination-item {
  position: relative;
  overflow: hidden;
  border-radius: 5px;
  cursor: pointer;
}
.destination-item::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.3); /* black overlay with 50% opacity */
  z-index: 1;
}
.destination-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 2s ease;
}

.destination-item:hover img {
  transform: scale(1.1);
}

.destination-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  color: #fff;
  z-index: 2;
}

.destination-content h3 {
  font-size: 25px;
  font-weight: 700; /* bold */
  color: #fff;
  margin-bottom: 5px;
  text-transform: uppercase;
}




.destination-content p {
  font-size: 14px;
  color: white;
}

/* View All */
.view-all {
  display: inline-block;
  margin-top: 40px;
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  color: #d94a33;
  border-bottom: 2px dashed #d94a33;
  padding-bottom: 3px;
  transition: color 0.3s ease, border-color 0.3s ease;
}

.view-all:hover {
  color: #000;
  border-color: #000;
}

.section-divider {
  text-align: center;
  
  padding: 20px 0px;
  
}

.section-divider img,
.section-divider svg {
  width: 120px;
  height: auto;
}

@media (min-width: 992px) and (max-width: 1433px) {
  .destination-content h3 {
    font-size: 20px;
  
  }
}

/* Responsive */
@media (max-width: 991px) {
  .destination-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .destination-grid {
    grid-template-columns: 1fr;
  }
  .destination-content h3 {
    font-size: 18px;
  }
}



/* About Section */
.about-us {
  padding: 80px 0;
  position: relative;
  color: #333;
}

.about-flex {
  max-width: 1100px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

.about-left {
  flex: 1;
  max-width: 500px;
}
.about-image img {
  width: 100%;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(0,0,0,0.15);
  margin-top: 25px;
}

.about-content {
  flex: 1;
  max-width: 550px;
  text-align: left;
}

.about-content h2,       /* Title */
.about-content h4,       /* Subtitle */
.about-content .section-divider { /* Divider */
    text-align: left;
    margin-left: 0;
    margin-right: auto;
}
.about-content .why-title {
  margin: 20px 0 15px;
  font-weight: 600;
}
.why-list {
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
}
.why-list li {
  display: flex;
  align-items: center;
  margin-bottom: 12px;
  font-weight: 500;
}
.why-list li .icon {
  font-size: 22px;
  margin-right: 12px;
}

.why-list .icon {
  font-size: 18px;
  color: #25D366; /* or your brand accent */
}

.whatsapp-contacts {
  margin-top: 20px;
  margin-bottom: 20px;
}

.whatsapp-heading {
  font-size: 28px;
  font-weight: 600;
  margin-bottom: 10px;
  color: #000;
  text-align: left;
}

.whatsapp-number {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  margin-bottom: 8px;
  color: #000; /* WhatsApp green */
  font-weight: 500;
}

.whatsapp-number i {
  font-size: 18px;
  color: #25D366;
}


.more-about {
  display: inline-block;
  color: #e74c3c;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 2px dashed #e74c3c;
  padding-bottom: 3px;
}

@media(max-width: 991px) {
  .about-flex {
    flex-direction: column;
    text-align: center;
  }
  .about-left {
    margin-bottom: 40px;
  }
}






.tours-section {
  padding: 60px 0px;
  text-align: center;
}

.tours-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* Always 3 items per row */
  gap: 30px;
  margin-top: 40px;
}

.tour-item {
  background: #fff;
  border-radius: 15px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  transition: transform 0.3s ease;
}



.tour-img {
  overflow: hidden;
}

.tour-img img {
  width: 100%;
  height: 250px; /* Fixed height for uniform size */
  object-fit: cover; /* Prevent stretching */
  transition: transform 2s ease;
}

.tour-item:hover img {
  transform: scale(1.1);
}

.tour-content {
  padding: 20px;
  text-align: left;
}

.tour-content .meta {
  display: block;
  font-size: 13px;
  color: #d94a33;
  font-weight: 600;
  margin-bottom: 10px;
}

.tour-content h3 {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 10px;
  color: #000;
}

.tour-content a {
text-decoration: none;
}

.tour-content p {
  font-size: 14px;
  color: #666;
  margin-bottom: 15px;
  line-height: 1.6;
}

.btn-primary {
  background: #ec927e;
  color: #fff;
  border: 2px solid transparent;
  border-radius: 50px;
  font-size: 14px;
  padding: 8px 20px;
  display: inline-block;
  transition: all 0.3s ease;
  text-decoration: none;
}

.header-main .btn-primary {

  font-size: 14px;
  padding: 8px 30px;

}


.hidden {
  display: none;
}

/* Responsive Fixes */
@media (max-width: 991px) {
  .tours-grid {
    grid-template-columns: repeat(2, 1fr); /* 2 items per row */
  }
}

@media (max-width: 575px) {
  .tours-grid {
    grid-template-columns: 1fr; /* 1 item per row */
  }
}



.why-choose-us {
  padding: 80px 20px;
  background: #fdfaf7; /* subtle warm background */
  text-align: center;
}

.features-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
  margin-top: 50px;
}

.feature-item {
  background: #fff;
  border-radius: 15px;
  padding: 30px 20px;
  box-shadow: 0 4px 15px rgba(0,0,0,0.05);
  transition: all 0.3s ease;
}

.feature-item:hover {
  transform: translateY(-8px);
  box-shadow: 0 6px 20px rgba(0,0,0,0.1);
}

.feature-item .icon {
  font-size: 36px;
  color: #d94a33;
  margin-bottom: 20px;
}

.feature-item h3 {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 15px;
  color: #000;
}

.feature-item p {
  font-size: 15px;
  color: #666;
  line-height: 1.6;
}

/* Responsive */
@media (max-width: 991px) {
  .features-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 575px) {
  .features-grid {
    grid-template-columns: 1fr;
  }
}










/* Hero Section */
.about-hero {
  position: relative;
  padding: 80px 20px;
  text-align: center;
  color: #fff;
  overflow: hidden; /* keeps zoom effect inside section */
  background-size: cover;
  background-position: center;
}

.single-post .about-hero {
  position: relative;
  padding: 150px 20px 150px;
  text-align: center;
  color: #fff;
  overflow: hidden; /* keeps zoom effect inside section */
  background-size: cover;
  background-position: center;
}

/* Animated background (zoom back) */
.about-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: inherit; /* use same background */
  background-size: cover;
  background-position: center;
  z-index: 0;
  transform: scale(1.1); /* start zoomed in */
  animation: zoomBack 10s ease-in-out forwards;
}

/* Dark overlay */
.about-hero .overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.2);
  z-index: 1;
}

/* Hero content */
.about-hero .hero-content {
  position: relative;
  z-index: 2;
}

.about-hero h1 {
  color: #fff;
  font-size: 42px;
  font-weight: 700;
  margin-bottom: 10px;
}

.about-hero p {
  color: #fff;
  font-size: 18px;
  font-weight: 400;
}

/* Breadcrumbs styling */
#breadcrumbs {
  color: #fff;
  font-size: 14px;
  margin-bottom: 15px;
}
#breadcrumbs a {
  color: #fff;
  text-decoration: underline;
}

/* Keyframes for zoom-back effect */
@keyframes zoomBack {
  0%   { transform: scale(1.1); }
  100% { transform: scale(1); }
}


/* Features Section */

.about-intro{
    padding: 60px 0px;
}
.about-features {
  padding: 50px 0px;
  padding-top: 20px;
  background: #fdfaf7;
}
.about-features .features-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}
.about-features .feature-item {
  background: #fff;
  padding: 30px;
  border-radius: 15px;
  box-shadow: 0 4px 15px rgba(0,0,0,0.05);
  text-align: center;
  transition: all 0.3s ease;
}
.about-features .feature-item:hover {
  transform: translateY(-6px);
}
.about-features .feature-item .icon {
  font-size: 40px;
  color: #d94a33;
  margin-bottom: 15px;
}

/* Tailored Experience */
.tailored-experiences {
  padding: 50px 0px;
}
.tailored-experiences .about-flex {
  align-items: center;
}
.tailored-experiences .rounded-img {
      width: 100%;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
    margin-top: 25px;
}

/* CTA */
.about-cta {
  padding: 100px 0px;
  text-align: center;
  color: #fff;
  position: relative;
}
.about-cta .overlay {
  position: absolute;
  inset: 0;
  
}
.about-cta .container {
  position: relative;
  z-index: 2;
}
.about-cta h2 {
  font-size: 32px;
  margin-bottom: 15px;
}
.about-cta p {
  max-width: 700px;
  margin: 0 auto 25px;
  font-size: 18px;
}


.team-section {
  padding: 80px 0px;
  background: #fafafa;
}

.team-section .container {
  max-width: 1400px;
  margin: 0 auto;
}

.section-header {
  text-align: center;
  margin-bottom: 50px;
}



.team-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
}

.team-member {
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0px 4px 12px rgba(0,0,0,0.08);
  
}



.team-image { height: 400px; overflow: hidden; }
.team-image img { width: 100%; height: 100%; object-fit: cover; object-position: center; }


.team-content {
  padding: 20px;
  text-align: center;
}

.team-content h4{
  font-size: 18px;
  color: #1abc9c;
  line-height: 1;
}
.team-name {
  font-size: 24px;
  font-weight: 700;
  color: #222;
  margin-bottom: 5px;
}

.team-name span {
  font-weight: 500;
  font-size: 14px;
  color: #d94a33;
}

/* Bio & Button */
.team-bio {
  display: inline;
  font-size: 14px;
  line-height: 1;
  color: #444;
}
.read-more {
  display: inline;
  background: none;
  border: none;
  color: #ec927e;
  font-weight: 600;
  cursor: pointer;
  padding-left: 5px;
  font-size: 14px;
}
.read-more:hover {
  color: #b93b25;
}

.read-more:hover,
.read-more:focus {
  background: none !important;
  color: #b93b25;
 
}
/* Responsive */
@media (min-width: 768px) {
  .team-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .team-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Responsive */
@media(max-width: 991px) {
  .about-features .features-grid {
    grid-template-columns: 1fr 1fr;
  }
  .tailored-experiences .about-flex {
    flex-direction: column;
    text-align: center;
  }
}
@media(max-width: 576px) {
  .about-features .features-grid {
    grid-template-columns: 1fr;
  }
  .about-hero h1 {
    font-size: 32px;
  }
  .about-cta h2 {
    font-size: 26px;
  }
}





/* Blog Archive */
.blog-archive {
  padding: 80px 0px;
}

.blog-archive .section-header {
  text-align: center;
  margin-bottom: 50px;
}

.posts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 30px;
}

.archive-post {
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  transition: transform 0.3s ease;
}

.archive-post:hover {
  transform: translateY(-5px);
}

.archive-post .post-thumbnail {
  overflow: hidden;
}

.archive-post .post-thumbnail img {
  width: 100%;
  height: 250px;
  object-fit: cover;
  transition: transform 6s ease; /* slow zoom effect */
}

.archive-post:hover .post-thumbnail img {
  transform: scale(1.2);
}

.post-content {
  padding: 20px;
  padding-top: 60px;
}

.post-title {
  font-size: 20px;
  margin: 0 0 10px;
}

.post-title a {
  color: #222;
  text-decoration: none;
  transition: color 0.3s ease;
}

.post-title a:hover {
  color: #d94a33;
}

.post-meta {
  font-size: 14px;
  color: #777;
  margin-bottom: 15px;
}

.post-excerpt {
  font-size: 15px;
  color: #444;
  margin-bottom: 20px;
}

.pagination {
  text-align: center;
  margin-top: 40px;
}

.pagination .page-numbers {
  display: inline-block;
  margin: 0 6px;
  padding: 10px 16px;
  border-radius: 50px;
  background: #f2f2f2;
  color: #333;
  text-decoration: none;
  transition: all 0.3s ease;
}

.pagination .page-numbers.current,
.pagination .page-numbers:hover {
  background: #d94a33;
  color: #fff;
}



/* Post Meta */
.post-meta {
  margin-bottom: 20px;
  font-size: 14px;
  color: #777;
}

/* Post Navigation */
.post-navigation {
  display: flex;
  justify-content: space-between;
  margin: 40px 0;
  font-weight: 600;
}
.post-navigation .prev a,
.post-navigation .next a {
  color: #333;
  text-decoration: none;
}
.post-navigation .prev a:hover,
.post-navigation .next a:hover {
  color: #d35400;
}

/* Related Posts */
.related-posts {
  margin: 60px 0px;
}

.post-content h2{
    color: #f5bcaf;
    padding: 25px 0px;
    font-size: 28px;
}

.post-content h3{
    font-size: 22px;
    color: #6abcb0;
    padding: 25px 0px;
}

.post-content .uagb-icon-list__wrap{
    
    padding: 30px 20px !important;
    background: #ffc7bb;
    
}


/* Single Post Layout */
.post-layout {
  display: grid;
  grid-template-columns: 2fr 1fr; /* content left, sidebar right */
  gap: 40px;
}

/* Main content */
.post-main {
  min-width: 0; /* prevent overflow in grid */
}

/* Sidebar */
.post-sidebar {
  position: relative;
  margin-top: 60px;
}

.post-sidebar .sidebar-inner {
  position: sticky;
  top: 100px; /* space from top when scrolling */
  background: #fff;
  padding: 25px;
  border: 1px solid #eee;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}

.sidebar-title {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 20px;
  color: #333;
  text-align: center;
}

/* Responsive adjustments */
@media (max-width: 991px) {
  .post-layout {
    grid-template-columns: 1fr; /* stack */
  }

  .post-sidebar {
    margin-top: 40px;
  }

  .post-sidebar .sidebar-inner {
    position: static; /* disable sticky on small screens */
  }
}


/* Contact Section */
.contact-block {
  padding: 80px 20px;
  background: #fff;
}
.contact-block-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: stretch;
}
.contact-map iframe {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.1);
}
.contact-form-box {
  background: #f7f1e9;
  padding: 30px;
  border-radius: 12px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.05);
}
.contact-form-box h2 {
  font-size: 24px;
  margin-bottom: 20px;
}

/* WPForms input fields */
.wpforms-container .wpforms-form input[type=text],
.wpforms-container .wpforms-form input[type=email],
.wpforms-container .wpforms-form input[type=tel],
.wpforms-container .wpforms-form input[type=url],
.wpforms-container .wpforms-form input[type=number],
.wpforms-container .wpforms-form input[type=password],
.wpforms-container .wpforms-form select,
.wpforms-container .wpforms-form textarea {
  width: 100%;
  padding: 14px 16px;
  border-radius: 8px;
  border: 1px solid #ddd;
  background: #fff;
  font-size: 15px;
  color: #333;
  transition: border 0.3s, box-shadow 0.3s;
  margin-bottom: 15px;
}

/* Focus effect */
.wpforms-container .wpforms-form input:focus,
.wpforms-container .wpforms-form select:focus,
.wpforms-container .wpforms-form textarea:focus {
  border-color: #ec927e;
  box-shadow: 0 0 0 3px rgba(236,146,126,0.25);
  outline: none;
}

/* Labels */
.wpforms-container .wpforms-form .wpforms-field-label {
  font-weight: 600;
  margin-bottom: 6px;
  display: block;
  font-size: 14px;
  color: #444;
}

/* Submit Button */
.wpforms-container .wpforms-form button[type=submit],
.wpforms-container .wpforms-form .wpforms-submit {
  background-color: #ec927e !important;
  color: #fff;
  border: 2px solid transparent;
  box-shadow: 0 5px 0 #df5334;
  border-radius: 50px;
  padding: 12px 28px;
  font-weight: 600;
  font-size: 15px;
  cursor: pointer;
  transition: all 0.3s ease;
  display: inline-block;
}

/* Hover effect */
.wpforms-container .wpforms-form button[type=submit]:hover,
.wpforms-container .wpforms-form .wpforms-submit:hover {
  transform: translateY(5px);
  box-shadow: 0 0 0 #df5334 !important;
  color: #fff;
}


/* Info Cards */
.contact-info-cards {
  padding: 60px 20px;
  background: #f7f1e9;
}
.cards-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 30px;
}
.info-card {
  background: #fff;
  border-radius: 12px;
  padding: 30px;
  text-align: center;
  box-shadow: 0 4px 20px rgba(0,0,0,0.05);
  transition: transform 0.3s ease;
}

.info-card a{
 color: #1abc9c;
}
.info-card:hover {
  transform: translateY(-5px);
}
.info-card .icon {
  font-size: 28px;
  display: inline-block;
  margin-bottom: 15px;
  color: #ec927e;
}
.info-card h3 {
  font-size: 20px;
  margin-bottom: 10px;
}

/* Responsive */
@media (max-width: 900px) {
  .contact-block-grid {
    grid-template-columns: 1fr;
  }
  .cards-grid {
    grid-template-columns: 1fr;
  }
  

}



@media (max-width: 992px) {
 .header-top .top-center {
    display: none !important;
}
  
.home-slider .slider-content h1
 {
    font-size: 39px;
    font-weight: 700;
    margin-bottom: 15px;
    color: #fff;
    line-height: 40px;
}
  
.home-slider img {
    width: 100%;
    height: 500px;
    object-fit: cover;
}
}