:root {
            --primary: #0E1F33;
            --gold: #CFA534;
            --gold-light: #D2AB43;
            --heading: #0e1f33;
            --white:#fff;
            --bde-section-width: 1120px;
             --column-width: 33.33%;
        }

        .gold{
            color:var(--gold);
            font-family: 'brother-1816', sans-serif;
        }

        .blue{
            color:var(--heading);
            font-family: 'brother-1816', sans-serif;

        }

        .st0{fill:#34E0A1;}

          .cls-1 {
        fill: #db2115;
      }

      .cls-2, .cls-3 {
        fill: #fff;
      }

      .cls-3 {
        isolation: isolate;
        opacity: .8;
      }

      .social-links li {
  transition: transform 0.2s;
}

.social-links li:hover {
  transform: translateY(-3px);
}

.social-links .icon svg {
  width: 24px;
  height: 24px;
}


        .blue-bg{
            background-color:var(--primary);
        }
        
        body {
            font-family: 'Lato', sans-serif;
        }
        
        h1, h2, h4, h5, h6 {
            font-family: 'Alegreya', serif;
            font-weight: 700;
            color: var(--heading);
        }

        h3{
             font-family: 'pacifico', cursive;
             font-weight: 100;
             color:#cfa534;
        }

        .bde-section{
            background-color:#CFA5341A;
        }

       .bde-columns {
    display: flex;
    gap: 16px; /* space between columns */
    --columnCount: 3;
    margin-top: 16px;
}

.bg-cover {
   
    background-size: cover; /* make image fill div */
    background-position: center; /* center image */
    transition: transform 0.3s;
}

.bde-columns .column:hover {
    transform: translateY(-5px);
}

/* Specific background images */
.local-attractions {
    background-image: url('../images/GettyImages-1271859253-1920x1200-1.webp');
}

.sturgis {
    background-image: url('../images/W2SVS3W2JJDKNAXAARF2UB3HZA.avif');
}

.special-events {
    background-image: url('../images/multigenerational-family-at-the-outdoor-wedding-party-.jpg');
}

.bde-button{
    background-color:#fff;
    border-radius: 15px;
    color:var(--primary);
    padding:8px 16px;
    font-family: 'Alegreya', serif;
    font-weight: 600;
    text-decoration: none;
    font-size: 21px;
}


        .section-container{
            max-width: var(--bde-section-width);
            background-size: cover;
            position: relative;
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            text-align: left;
            margin: 0 auto;
            padding: var(--bde-section-vertical-padding) var(--bde-section-horizontal-padding)
        }
        
        /* Top Banner */
        .top-banner {
            background: var(--gold);
            color: white;
            text-align: center;
            padding: 10px 0;
            font-weight: 600;
            text-transform: uppercase;
            font-size: 14px;
        }
        
        /* Header */
        .header-top {
            background: rgba(14, 31, 51, 0.95);
            color: white;
            font-size: 14px;
            padding: 10px 0;
        }
        
        .navbar {
            background: var(--primary) !important;
            padding: 15px 0;
        }
        
        .navbar-brand {
            font-family: 'Alegreya', serif;
            font-size: 1.8rem;
            font-weight: 800;
            color: white !important;
        }
        
        .navbar-nav .nav-link {
            color: white !important;
            font-family: 'Alegreya', serif;
            font-size: 1.1rem;
            font-weight: 600;
            text-transform: uppercase;
            margin: 0 15px;
            transition: 0.3s;
        }
        
        .navbar-nav .nav-link:hover {
            color: var(--gold) !important;
        }
        @media (min-width: 992px) {
    .navbar .dropdown:hover .dropdown-menu {
        display: block;
        margin-top: 0; /* Optional: remove gap */
    }

    .navbar .dropdown-menu {
        transition: all 0.3s ease;
    }
}

        /* Buttons */
        .btn-gold {
            background: var(--gold);
            color: white;
            border: 2px solid var(--gold);
            border-radius: 15px;
            padding: 12px 30px;
            font-family: 'Alegreya', serif;
            font-weight: 600;
            text-transform: uppercase;
            transition: 0.3s;
        }
        
        .btn-gold:hover {
            background: var(--gold-light);
            color: white;
            border-color: var(--gold-light);
            transform: translateY(-2px);
            box-shadow: 0 4px 12px rgba(207,165,52,0.3);
        }
        
        .btn-outline-light-custom {
            border: 2px solid white;
            border-radius: 15px;
            padding: 12px 30px;
            font-family: 'Alegreya', serif;
            font-weight: 600;
            text-transform: uppercase;
            color:#fff;
        }
        
        .btn-outline-light-custom:hover {
            background: white;
            color: var(--primary);
        }

        .ways-to-stay{
            background: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4)),
                        url('../images/black-hills-paha-sapa.jpg');
            background-size: cover;
            background-position: center;
            
            min-height: 600px;
            display: flex;
        }
        
        /* Hero */
        .hero {
            background: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4)),
                        url('../images/111test-1.webp');
            background-size: cover;
            background-position: center;
            background-attachment: fixed;
            min-height: 600px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            text-align: center;
        }
        
        .hero h1 {
            color: white;
            text-shadow: 2px 2px 8px rgba(0,0,0,0.5);
            font-size: clamp(2rem, 5vw, 3.5rem);
        }
        
        /* Section Titles */
        .section-title {
            text-align: center;
            margin-bottom: 3rem;
        }
        
        .section-subtitle {
            color: var(--gold);
            text-transform: uppercase;
            letter-spacing: 2px;
            font-size: 1.2rem;
            margin-bottom: 0.5rem;
        }
        
        /* Stay Cards */
        .stay-card {
            position: relative;
            height: 400px;
            border-radius: 15px;
            overflow: hidden;
            cursor: pointer;
            transition: 0.3s;
        }
        
        .stay-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 20px 40px rgba(0,0,0,0.3);
        }
        
        .stay-card img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        
        .stay-card-overlay {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            background: linear-gradient(to top, rgba(0,0,0,0.8), transparent);
            padding: 2rem;
            color: white;
        }
        
        .stay-card-overlay h3 {
            color: white;
            font-size: 2rem;
        }
        
        /* Black Hills Banner */
        .black-hills-banner {
            background: linear-gradient(rgba(14,31,51,0.85), rgba(14,31,51,0.85)),
                        url('https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=1920&h=400&fit=crop');
            background-size: cover;
            background-position: center;
            background-attachment: fixed;
            padding: 80px 0;
            color: white;
            text-align: center;
        }
        
        .black-hills-banner h2 {
            color: white;
            font-size: clamp(1.5rem, 3vw, 2.5rem);
        }
        
        /* Amenity Cards */

        .amenity-card h4 {
            color: white; /* base color */
            transition: color 0.3s ease;
        }

        .amenity-card:hover h4 {
            color: var(--primary); /* hover color */
        }
        .amenity-card {
            text-align: center;
            padding: 2rem;
            border-radius: 15px;
            transition: 0.3s;
            height: 100%;
        }
        
        .amenity-card:hover {
            background: #f8f9fa;
            transform: translateY(-5px);
            box-shadow: 0 5px 15px rgba(0,0,0,0.1);
            color: #0E1F33;
        }
        
        .amenity-icon {
            width: 80px;
            height: 80px;
            background: var(--gold);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 1.5rem;
            transition: 0.3s;
        }
        
        .amenity-card:hover .amenity-icon {
            background: var(--primary);
            transform: scale(1.1);
        }
         .amenity-card:hover h4 {
           color:var(--primary);
        }
        
        .amenity-icon i {
            font-size: 2rem;
            color: white;
        }
        
        /* Swiper */
        .swiper {
            padding-bottom: 50px;
        }
        
        .swiper-slide img {
            width: 100%;
            height: 400px;
            object-fit: cover;
            border-radius: 15px;
        }
        
        .swiper-button-prev,
        .swiper-button-next {
            color: var(--gold);
            background: rgba(255,255,255,0.9);
            width: 44px;
            height: 44px;
            border-radius: 50%;
        }
        
        .swiper-button-prev:after,
        .swiper-button-next:after {
            font-size: 20px;
        }
        
        .swiper-pagination-bullet-active {
            background: var(--gold);
        }
        
        /* Testimonial Cards */
        .testimonial-card {
            background: #f8f9fa;
            padding: 2rem;
            border-radius: 15px;
            height: 100%;
            transition: 0.3s;
        }
        
        .testimonial-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 30px rgba(0,0,0,0.1);
        }
        
        .quote-mark {
            font-size: 4rem;
            color: var(--gold);
            font-family: 'Alegreya', serif;
            line-height: 1;
            
        }

         .thanks-hero {
            background: url('../images/111test-1.webp');
            background-size: cover;
            background-position: center;
            min-height: 400px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            text-align: center;
        }
 .amenities-hero {
            background: url('../images/Playground-2.webp');
            background-size: cover;
            background-position: center;
            min-height: 400px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            text-align: center;
        }
        
        .amenities-hero h1 {
            color: white;
            font-size: clamp(2.5rem, 5vw, 4rem);
            text-shadow: 2px 2px 8px rgba(0,0,0,0.5);
        }
         /* Page Hero */
        .page-hero {
            background: url('../images/DSC05580-s.webp');
            background-size: cover;
            background-position: center;
            min-height: 400px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            text-align: center;
        }
        
        .page-hero h1 {
            color: white;
            font-size: clamp(2.5rem, 5vw, 4rem);
            text-shadow: 2px 2px 8px rgba(0,0,0,0.5);
        }

         /* Contact Info Cards */
        .contact-card {
            background: white;
            padding: 2.5rem 2rem;
            border-radius: 15px;
            text-align: center;
            height: 100%;
            transition: 0.3s;
            border: 2px solid #f8f9fa;
        }
        
        .contact-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 30px rgba(0,0,0,0.15);
            border-color: var(--gold);
        }
        
        .contact-card .icon-wrapper {
            width: 80px;
            height: 80px;
            background: var(--gold);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 1.5rem;
            transition: 0.3s;
        }
        
        .contact-card:hover .icon-wrapper {
            background: var(--primary);
            transform: scale(1.1);
        }
        
        .contact-card .icon-wrapper i {
            font-size: 2rem;
            color: white;
        }
        
        .contact-card h3 {
            color: var(--heading);
            margin-bottom: 1rem;
        }
        
        .contact-card p {
            color: #666;
            margin-bottom: 1.5rem;
        }
        
        /* Form */
        .form-control:focus {
            border-color: var(--gold);
            box-shadow: 0 0 0 0.2rem rgba(207,165,52,0.25);
        }
        
        .form-label {
            font-weight: 600;
            color: var(--heading);
        }
        
        .required {
            color: #dc3545;
        }

        /* Amenity Cards */
        .amenity-card {
            text-align: center;
            padding: 2.5rem 1.5rem;
            border-radius: 15px;
            transition: 0.3s;
            height: 100%;
            background: white;
            box-shadow: 0 2px 10px rgba(0,0,0,0.05);
        }
        
        .amenity-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 30px rgba(0,0,0,0.15);
        }
        
        .amenity-icon {
            width: 80px;
            height: 80px;
            background: var(--gold);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 1.5rem;
            transition: 0.3s;
        }
        
        .amenity-card:hover .amenity-icon {
            background: var(--primary);
            transform: scale(1.1);
        }
        
        .amenity-icon i {
            font-size: 2rem;
            color: white;
        }
        
        .amenity-card h4 {
            color: var(--heading);
            margin-bottom: 1rem;
            font-size: 1.3rem;
        }
        
        .amenity-card p {
            color: #666;
            margin: 0;
        }
        
        /* Featured Amenity */
        .featured-amenity {
            background: linear-gradient(135deg, var(--primary) 0%, #1a3a5c 100%);
            color: white;
            border-radius: 15px;
            padding: 3rem;
            margin-bottom: 4rem;
        }
        
        .featured-amenity h2 {
            color: white;
            margin-bottom: 1.5rem;
        }
        
        .featured-amenity .badge {
            background: var(--gold);
            color: white;
            padding: 8px 16px;
            border-radius: 20px;
            font-size: 0.9rem;
            margin-bottom: 1rem;
            display: inline-block;
        }

         /* CTA Section */
        .cta-section {
            background: var(--gold);
            color: white;
            padding: 60px 0;
            text-align: center;
        }
        
        .cta-section h2 {
            color: white;
            margin-bottom: 1.5rem;
        }
        
        .btn-white {
            background: white;
            color: var(--primary);
            border: 2px solid white;
            border-radius: 15px;
            padding: 15px 40px;
            font-family: 'Alegreya', serif;
            font-weight: 600;
            text-transform: uppercase;
            transition: 0.3s;
        }
        
        .btn-white:hover {
            background: transparent;
            color: white;
            border-color: white;
        }




        
        
        /* Contact Form */
        .form-control:focus {
            border-color: var(--gold);
            box-shadow: 0 0 0 0.2rem rgba(207,165,52,0.25);
        }
        
        /* Footer */
        .footer {
            background: var(--primary);
            color: white;
            padding: 80px 0 30px;
        }
        
        .footer h5 {
            color: var(--gold);
            text-transform: uppercase;
            margin-bottom: 1.5rem;
        }
        
        .footer a {
            color: rgba(255,255,255,0.8);
            text-decoration: none;
            transition: 0.3s;
        }
        
        .footer a:hover {
            color: var(--gold);
        }
        
        .footer-bottom {
            border-top: 1px solid rgba(255,255,255,0.1);
            padding-top: 2rem;
            margin-top: 3rem;
            text-align: center;
            color: rgba(255,255,255,0.6);
        }

        /*--------------------------------------------------------------
# Why Us
--------------------------------------------------------------*/
.section-bg {
  background-color: #f3f5fa;
}
.why-us .content {
  padding: 60px 100px 0 100px;
}

.why-us .content h3 {
  font-weight: 400;
  font-size: 34px;
  color: #37517e;
}

.why-us .content h4 {
  font-size: 20px;
  font-weight: 700;
  margin-top: 5px;
}

.why-us .content p {
  font-size: 15px;
  color: #848484;
}

.why-us .img {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}

.why-us .accordion-list {
  padding: 0 100px 60px 100px;
}

.why-us .accordion-list ul {
  padding: 0;
  list-style: none;
}

.why-us .accordion-list li+li {
  margin-top: 15px;
}

.why-us .accordion-list li {
  padding: 20px;
  background: #fff;
  border-radius: 4px;
}

.why-us .accordion-list a {
  display: block;
  position: relative;
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
  padding-right: 30px;
  outline: none;
  cursor: pointer;
}

.why-us .accordion-list span {
  color: #47b2e4;
  font-weight: 600;
  font-size: 18px;
  padding-right: 10px;
}

.why-us .accordion-list i {
  font-size: 24px;
  position: absolute;
  right: 0;
  top: 0;
}

.why-us .accordion-list p {
  margin-bottom: 0;
  padding: 10px 0 0 0;
}

.why-us .accordion-list .icon-show {
  display: none;
}

.why-us .accordion-list a.collapsed {
  color: #343a40;
}

.why-us .accordion-list a.collapsed:hover {
  color: #47b2e4;
}

.why-us .accordion-list a.collapsed .icon-show {
  display: inline-block;
}

.why-us .accordion-list a.collapsed .icon-close {
  display: none;
}

@media (max-width: 1024px) {

  .why-us .content,
  .why-us .accordion-list {
    padding-left: 0;
    padding-right: 0;
  }
}

@media (max-width: 992px) {
  .why-us .img {
    min-height: 400px;
  }

  .why-us .content {
    padding-top: 30px;
  }

  .why-us .accordion-list {
    padding-bottom: 30px;
  }
}

@media (max-width: 575px) {
  .why-us .img {
    min-height: 200px;
  }
}