body {
       margin: 0;
       font-family: 'Hind', sans-serif;
       background-color: #fff;
   }

   h2 {

       font-family: 'Yeseva One', serif;
       font-size: 2.5rem;
   }

   .header-wrapper {
       background: #fff;
       padding: 8px 20px;
       /* reduced padding */
       display: flex;
       justify-content: space-between;
       align-items: center;
       flex-wrap: wrap;
       border-bottom: 1px solid #eee;
       box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
       position: relative;
   }


   .text-gradient {
       /* background: #820203; */
       background: #000;
       -webkit-background-clip: text;
       -webkit-text-fill-color: transparent;
       background-clip: text;
       text-fill-color: transparent;
       font-size: 14px;
       font-weight: 500;
   }

   .contact-block {
       display: flex;
       align-items: center;
       gap: 25px;
   }

   .contact-block i {
       margin-right: 6px;
   }

   .button-center {
       position: absolute;
       left: 50%;
       transform: translateX(-50%);
   }

   .appointment-btn {
       background: #820203;
       /* Solid color */
       color: #fff;
       font-weight: 700;
       font-size: 16px;
       padding: 10px 34px;
       border: none;
       border-radius: 30px;
       text-decoration: none;
       transition: all 0.4s ease;
       box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
       position: relative;
       overflow: hidden;
       z-index: 1;
   }


   .appointment-btn::before {
       content: "";
       position: absolute;
       top: 0;
       left: -75%;
       width: 200%;
       height: 100%;
       background: rgba(255, 255, 255, 0.05);
       transform: skewX(-25deg);
       transition: 0.5s;
       z-index: 0;
   }

   .appointment-btn:hover::before {
       left: 125%;
   }

   .appointment-btn:hover {
       box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25);
       transform: scale(1.03);
   }

   .social-icons-wrapper {
       display: flex;
       align-items: center;
       gap: 15px;
   }

   .social-icons-wrapper a {
       text-decoration: none;
       width: 36px;
       height: 36px;
       border-radius: 50%;
       display: inline-flex;
       align-items: center;
       justify-content: center;
       color: white;
       font-size: 16px;
       transition: all 0.3s ease;
       box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
   }

   .social-icons-wrapper a.facebook {
       background: linear-gradient(45deg, #1877f2, #3b5998, #0a3d91);
   }

   .social-icons-wrapper a.youtube {
       background: linear-gradient(45deg, #ff0000, #ff4d4d, #cc0000, #990000);
   }

   .social-icons-wrapper a.instagram {
       background: linear-gradient(45deg, #feda75, #fa7e1e, #d62976, #962fbf, #4f5bd5);
   }


   .social-icons-wrapper a:hover {
       transform: scale(1.15) rotateZ(5deg);
       box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
   }

   @media (max-width: 767px) {

       .contact-block,
       .social-icons-wrapper {
           display: none;
       }

       .button-center {
           position: static;
           transform: none;
           margin: 10px auto;
       }

       .header-wrapper {
           flex-direction: column;
           gap: 10px;
           justify-content: center;
           align-items: center;
       }
   }

   /* navbar start */
   .navbar-custom {
       background: #820203;
       /* Pure solid color */
       padding: 5px 0;
       box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
   }

   .navbar-brand {
       font-size: 1.8rem;
       color: #fff;
       font-weight: 700;
       letter-spacing: 1px;
       margin-left: -28px;
   }

   .navbar-nav .nav-link {
       color: #fff;
       font-weight: 500;
       margin: 0 10px;
       transition: color 0.3s;
   }

   .navbar-nav .nav-link:hover {
       color: #000;
   }

   .pay-now-btn {
       background: #fff;
       color: #820203;
       padding: 8px 18px;
       border-radius: 30px;
       font-weight: bold;
       transition: all 0.3s ease;
       text-decoration: none;
       display: inline-block;
   }

   .pay-now-btn:hover {
       background: #c33b3b;
       color: #fff;
   }

   /* Dropdown Styling */
   .dropdown-menu {
       background: #fff8ef;
       border-radius: 0;
       border: none;
       padding: 0;
       box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
   }

   .dropdown-item {
       padding: 10px 20px;
       color: #820203;
       font-weight: 500;
       transition: all 0.3s ease;
   }

   .dropdown-item:hover {
       background-color: #ffe2c0;
       color: #000;
   }

   /* Custom Toggle Icon */
   /* Custom Toggle Style */
   .custom-toggler {
       border: none;
       background: transparent;
       padding: 0;
       outline: none;
       z-index: 999;
   }

   .toggler-icon {
       width: 30px;
       height: 24px;
       position: relative;
       display: flex;
       flex-direction: column;
       justify-content: space-between;
   }

   .toggler-icon span {
       height: 3px;
       width: 100%;
       background-color: #ffffff;
       /* Change to white or #182332 if needed */
       border-radius: 3px;
       transition: all 0.4s ease;
   }

   /* Animation on toggle */
   .custom-toggler.open .toggler-icon span:nth-child(1) {
       transform: rotate(45deg) translate(5px, 5px);
   }

   .custom-toggler.open .toggler-icon span:nth-child(2) {
       opacity: 0;
   }

   .custom-toggler.open .toggler-icon span:nth-child(3) {
       transform: rotate(-45deg) translate(6px, -6px);
   }

   /* Responsive Center Fix */
   @media (max-width: 991.98px) {
       .navbar-nav {
           background: #fff8ef;
           padding: 15px;
           border-radius: 0 0 10px 10px;
       }

       .navbar-nav .nav-link {
           color: #820203 !important;
           padding: 10px 0;
           text-align: center;
       }

       .pay-now-btn {
           margin: 15px auto 0;
           display: block;
           text-align: center;
           width: 80%;
           font-size: 18px;
           padding: 12px;
           border-radius: 50px;
       }
   }

   .pay-now-btn {
       animation: bounceIn 0.5s ease;
   }

   @keyframes bounceIn {
       0% {
           transform: scale(0.95);
           opacity: 0.7;
       }

       100% {
           transform: scale(1);
           opacity: 1;
       }
   }

   /* navbar end */

   .carousel-inner img {
       width: 100%;
       /* height: 500px; */
       height: 205px;
       object-fit: cover;
   }

   @media (max-width: 767px) {
       .carousel-inner img {
           height: 250px;
       }
   }

   /* crousel start */
   .banner-slider {
       position: relative;
       width: 100%;
       height: 70vh;
       overflow: hidden;
   }

   .banner-slides {
       display: flex;
       transition: transform 0.5s ease-in-out;
   }

   .banner-slides img {
       width: 100%;
       height: 70vh;
       object-fit: cover;
       flex-shrink: 0;
   }

   /* Buttons */
   .banner-prev,
   .banner-next {
       position: absolute;
       top: 50%;
       transform: translateY(-50%);
       background: #820203;
       color: white;
       border: none;
       width: 40px;
       height: 40px;
       border-radius: 50%;
       cursor: pointer;
       font-size: 20px;
       text-align: center;
       line-height: 40px;
       transition: background 0.3s;
       z-index: 10;
   }

   .banner-prev:hover,
   .banner-next:hover {
       background: #cc830f;
   }

   .banner-prev {
       left: 15px;
   }

   .banner-next {
       right: 15px;
   }

   /* Dots */
   .banner-dots {
       position: absolute;
       bottom: 15px;
       width: 100%;
       text-align: center;
   }

   .banner-dot {
       display: inline-block;
       width: 12px;
       height: 12px;
       margin: 0 5px;
       background: rgba(255, 163, 25, 0.5);
       border-radius: 50%;
       cursor: pointer;
       transition: background 0.3s;
   }

   .banner-dot:hover {
       background: rgba(255, 163, 25, 0.8);
   }

   .banner-dot.active {
       background: #820203;
   }

   @media (max-width: 600px) {

       .banner-slider,
       .banner-slides img {
           height: 30vh;
       }
   }

   /* crousel end */

   /* stats section start */
   .stats-section {
       /* background: linear-gradient(135deg, #ff9a00 0%, #ff7a00 100%); */
       background: #820203;
       color: white;
       /* padding: 60px 20px; */
       padding: 19px 2px;
       text-align: center;
   }

   .stats-title {
       font-size: 2.5rem;
       font-family: 'Playfair Display', serif;
       margin-bottom: 40px;
       position: relative;
   }

   .stats-title::after {
       content: '';
       display: block;
       width: 80px;
       height: 4px;
       background: white;
       margin: 10px auto 0;
       border-radius: 2px;
   }

   .stats-container {
       display: grid;
       grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
       gap: 30px;
       max-width: 1200px;
       margin: auto;
   }

   .stat-box {
       background: rgba(255, 255, 255, 0.1);
       padding: 30px 20px;
       border-radius: 15px;
       backdrop-filter: blur(5px);
       box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
       transition: transform 0.3s ease, box-shadow 0.3s ease;
   }

   .stat-box:hover {
       transform: translateY(-8px);
       box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
   }

   .stat-box i {
       font-size: 40px;
       margin-bottom: 15px;
       color: white;
   }

   .stat-number {
       font-size: 2.5rem;
       font-weight: bold;
       margin: 10px 0;
       font-family: 'Playfair Display', serif;
   }

   .stat-number span {
       font-size: 2.5rem;
   }

   .stat-label {
       font-size: 1rem;
       text-transform: uppercase;
       letter-spacing: 1px;
   }

   @media (max-width: 600px) {
       .stats-title {
           font-size: 2rem;
       }

       .stat-box i {
           font-size: 30px;
       }

       .stat-number {
           font-size: 2rem;
       }

       .stat-number span {
           font-size: 2rem;
       }
   }

   /* stats section end  */


   /* about index .start */
   .about-section {
       display: flex;
       flex-wrap: wrap;
       align-items: center;
       padding: 50px 20px;
       background-color: #fff;
   }

   .about-img {
       flex: 1 1 50%;
       padding: 20px;
       display: flex;
       flex-direction: column;
       align-items: center;
   }

   .about-img img {
       max-height: 400px;
       height: auto;
       object-fit: contain;
       border-radius: 10px;
       box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
   }

   .about-content {
       flex: 1 1 50%;
       /* padding: 20px; */
       display: flex;
       flex-direction: column;
       justify-content: center;
   }

   .about-content h2 {
       font-size: 36px;
       color: #820203;
       margin-bottom: 20px;
       position: relative;
   }

   .about-content h2::after {
       content: '';
       display: block;
       width: 80px;
       height: 4px;
       background: #820203;
       margin: 10px auto 0;
       /* auto se center align ho jayega */
       border-radius: 2px;
   }

   .about-content p {
       /* font-size: 18px; */
       line-height: 1.8;
       color: #000!important;
       margin-bottom: 30px;
     
   }

   .read-more-btn {
       /* background: linear-gradient(135deg, #ff9a00 0%, #ff7a00 100%); */
       background: #820203;
       border: none;
       padding: 12px 25px;
       font-size: 16px;
       color: #fff;
       cursor: pointer;
       border-radius: 50px;
       text-decoration: none;
       transition: 0.3s;
       display: inline-block;
       margin: 0 auto;
       /* center the button */
   }

   .read-more-btn:hover {
       background: #820203;
       transform: scale(1.05);
   }

   .button-wrapper {
       text-align: center;
   }

   @media (max-width: 768px) {
       .about-section {
           flex-direction: column;
       }

       .about-img,
       .about-content {
           flex: 1 1 100%;
       }

       .about-content h2 {
           font-size: 28px;
       }

       .about-content p {
           font-size: 16px;
           color:#000!important;
       }
       
       .para{
           color: red !important;
       }

       .about-img img {
           max-height: 300px;
       }
   }

   /* about index end */

  


   /* see what the future start */

   .astro-section-title {
       font-size: 36px;
       color: #820203;
       margin-bottom: 20px;
       position: relative;
       text-align: center;
   }

   .astro-section-title::after {
       content: "";
       display: block;
       width: 60px;
       height: 3px;
       background: #820203;
       margin: 8px auto;
   }

   .astro-subtitle {
       text-align: center;
       color: #000!important;
       font-size: 16px !important;
       margin-bottom: 50px;
       max-width: 700px;
       margin-left: auto;
       margin-right: auto;
   }

   .astro-service-icon {
       font-size: 32px;
       color: #820203;
       margin-bottom: 10px;
   }

   .astro-service-title {
       font-weight: 600;
       color: #820203;
       font-size: 16px;
   }

   .astro-service-desc {
       font-size: 16px;
       color: #000000;
       margin-top: 5px;
       margin-bottom: 5px;
   }

   .astro-underline {
       width: 25px;
       height: 3px;
       background-color: #820203;
       margin: 8px auto;
   }

   .astro-image {
       max-width: 100%;
       height: auto;
       display: block;
       margin: 0 auto;
   }

   @media (max-width: 767px) {
       .order-md-2 {
           order: 2 !important;
       }

       .order-md-1 {
           order: 1 !important;
       }
   }

   /* see what the future end */

   /* banner start */

   .appointment-banner {
       display: flex;
       align-items: center;
       justify-content: space-between;
       padding: 50px 10%;
       /* background: linear-gradient(135deg, #ff9800, #ff6600); */
       background: #820203;
       border-radius: 20px;
       box-shadow: 0 12px 25px rgba(0, 0, 0, 0.25);
       color: #fff;
       flex-wrap: wrap;
       gap: 30px;
       position: relative;
       overflow: hidden;
   }

   /* Decorative animated circles */
   .appointment-banner::before,
   .appointment-banner::after {
       content: "";
       position: absolute;
       border-radius: 50%;
       background: rgba(255, 255, 255, 0.15);
       z-index: 0;
       animation: moveCircle 8s ease-in-out infinite alternate;
   }

   .appointment-banner::before {
       width: 220px;
       height: 220px;
       top: -60px;
       left: -60px;
   }

   .appointment-banner::after {
       width: 320px;
       height: 320px;
       bottom: -90px;
       right: -90px;
   }

   @keyframes moveCircle {
       0% {
           transform: translate(0, 0);
       }

       50% {
           transform: translate(20px, 20px);
       }

       100% {
           transform: translate(0, 0);
       }
   }

   .banner-content {
       flex: 1;
       max-width: 500px;
       position: relative;
       z-index: 1;
   }

   .banner-content h2 {
       font-size: 36px;
       font-weight: 800;
       margin-bottom: 15px;
       background: linear-gradient(90deg, #fff, #ffe066, #fff);
       -webkit-background-clip: text;
       -webkit-text-fill-color: transparent;
       animation: gradientText 3s ease infinite;
   }

   @keyframes gradientText {
       0% {
           background-position: 0% 50%;
       }

       50% {
           background-position: 100% 50%;
       }

       100% {
           background-position: 0% 50%;
       }
   }

   .banner-content p {
       font-size: 16px;
       margin-bottom: 25px;
       line-height: 1.5;
       color: #fff;
   }

   .banner-action-btn {
       display: inline-block;
       padding: 12px 28px;
       background: #25d366;
       color: #fff;
       font-size: 16px;
       font-weight: 700;
       border-radius: 50px;
       text-decoration: none;
       box-shadow: 0 6px 15px rgba(0, 0, 0, 0.3);
       transition: all 0.3s ease-in-out;
   }

   .banner-action-btn:hover {
       background: #1ebe5b;
       transform: scale(1.08);
       box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4);
   }

   .banner-image {
       flex: 1;
       text-align: right;
       position: relative;
       z-index: 1;
   }

   .banner-image img {
       width: 345px;
       height: auto;
       max-height: 300px;
       border-radius: 20px;
       box-shadow: 0 12px 30px rgba(0, 0, 0, 0.4);
       animation: floatImg 6s ease-in-out infinite;
       transition: transform 0.5s ease, box-shadow 0.5s ease;
   }

   .banner-image img:hover {
       transform: scale(1.05) rotate(-1deg);
       box-shadow: 0 16px 35px rgba(0, 0, 0, 0.5);
   }

   /* Responsive */
   @media (max-width: 1200px) {
       .banner-content h2 {
           font-size: 34px;
       }

       .banner-content p {
           font-size: 15px;
       }

       .banner-action-btn {
           font-size: 15px;
           padding: 10px 25px;
       }

       .banner-image img {
           width: 350px;
           max-height: 280px;
       }
   }

   @media (max-width: 992px) {
       .appointment-banner {
           flex-direction: column;
           text-align: center;
           padding: 40px 20px;
       }

       .banner-image {
           text-align: center;
           margin-top: 20px;
       }

       .banner-image img {
           width: 300px;
           max-height: 220px;
       }

       .banner-content h2 {
           font-size: 30px;
       }

       .banner-content p {
           font-size: 14px;
       }

       .banner-action-btn {
           font-size: 14px;
           padding: 10px 22px;
       }
   }

   @media (max-width: 768px) {
       .banner-image img {
           width: 260px;
           max-height: 200px;
       }

       .banner-content h2 {
           font-size: 28px;
       }

       .banner-content p {
           font-size: 14px;
       }

       .banner-action-btn {
           font-size: 13px;
           padding: 8px 20px;
       }
   }

   @media (max-width: 480px) {
       .banner-image img {
           width: 220px;
           max-height: 180px;
       }

       .banner-content h2 {
           font-size: 24px;
       }

       .banner-content p {
           font-size: 13px;
       }

       .banner-action-btn {
           font-size: 12px;
           padding: 7px 18px;
       }
   }

   /* banner end */

   /* stone index start */
   .custom-stone-section {
       padding: 60px 0;
       background-color: #fff;
   }

   .custom-stone-title {
       font-size: 36px;
       font-weight: bold;
       text-align: center;
       color: #820203;
   }

   .custom-stone-subtitle {
       text-align: center;
       font-size: 18px;
       margin-bottom: 40px;
       color: #555;
   }

   .custom-stone-box {
       background: #fff;
       border-radius: 10px;
       /* padding: 20px; */
       padding: 0px;
       box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
       text-align: center;
       /* height: 100%; */
       height: 370px;
       transition: 0.3s ease-in-out;
   }

   .custom-stone-box:hover {
       transform: translateY(-5px);
       box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
   }

   .custom-stone-img {
       width: 100%;
       height: 200px;
       object-fit: cover;
       border-radius: 10px;
       margin-bottom: 15px;
   }

   .custom-stone-name {
       color: #820203;
       font-weight: bold;
       margin-bottom: 10px;
   }

   .custom-stone-desc {
       font-size: 14px;
       color: #333;
       margin-bottom: 15px;
   }

   .custom-stone-btn {
       padding: 8px 16px;
       font-size: 14px;
       border-radius: 25px;
       margin: 5px;
       font-weight: 500;
       display: inline-block;
   }

   .custom-btn-send-enquiry {
       background-color: #820203;
       color: #fff;
       border: none;
       text-decoration: none;
   }

   .custom-btn-view-more {
       border: 2px solid #820203;
       color: #820203;
       background-color: transparent;
       text-decoration: none;
   }

   .custom-btn-view-more:hover {
       background-color: #820203;
       color: #fff;
   }

   /* Carousel controls */
   .custom-carousel-control {
       width: 45px;
       height: 45px;
       background-color: #820203;
       border-radius: 50%;
       color: #fff;
       top: 50%;
       transform: translateY(-50%);
   }

   .stone-buttons {
       display: flex;
       justify-content: flex-start;
       align-items: center;
       gap: 8px;
   }

   .custom-stone-btn {
       text-decoration: none;
       padding: 9px 17px;
       /* background: #866154; */
       /* color: #fff; */
       border-radius: 35px;
       font-size: 12px;
       margin-left: 35px;
   }

   /* stone index end */

  




   /* enquiry index start */

   /* Section Header */
   .latest-enquiry {
       text-align: center;
       padding: 40px 20px;
   }

   .astro-section-title {
       font-size: 28px;
       font-weight: bold;
       color: #820203;
   }

   .astro-subtitle {
       font-size: 16px !important;
       color: #000000;
       margin-bottom: 30px;
   }

   /* Wrapper Layout */
   .enquiry-wrapper {
       display: flex;
       gap: 20px;
       max-width: 1000px;
       margin: auto;
       flex-direction: row;
       /* side by side on desktop */
   }

   /* Video Styling */
   .enquiry-image {
       flex: 1;
       display: flex;
       align-items: center;
       justify-content: center;
   }

   .enquiry-image video {
       width: 100%;
       height: 100%;
       border-radius: 20px;
       object-fit: cover;
       box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
       display: block;
       max-height: 585px;
       /* limit height for better scaling */
   }

   /* Form Container */
   .enquiry-form-container {
       flex: 1;
       background: #fff1e0;
       padding: 30px;
       border-radius: 20px;
       box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
       text-align: left;
   }

   .enquiry-form-container h3 {
       color: #820203;
       margin-bottom: 20px;
   }

   /* Form Inputs */
   .form-group {
       display: flex;
       align-items: center;
       background: white;
       border-radius: 50px;
       padding: 10px 15px;
       margin-bottom: 15px;
       box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
   }

   .textarea-group {
       border-radius: 20px;
       align-items: flex-start;
   }

   .form-group i {
       margin-right: 10px;
       font-size: 16px;
       color: #820203;
   }

   input,
   textarea {
       border: none;
       outline: none;
       flex: 1;
       font-size: 14px;
       background: transparent;
       resize: none;
       min-width: 0;
       /* fix flex overflow on small screens */
   }

   /* Submit Button */
   .submit-btn {
       /* background: linear-gradient(to right, #ff6a00, #ff9900); */
       background: #820203;
       color: white;
       padding: 12px;
       width: 100%;
       border: none;
       border-radius: 50px;
       font-size: 16px;
       cursor: pointer;
       transition: 0.3s;
       font-weight: bold;
   }

   .submit-btn:hover {
       transform: scale(1.02);
   }

   /* Responsive: Stack vertically on tablets and smaller */
   @media (max-width: 991px) {
       .enquiry-wrapper {
           flex-direction: column;
           gap: 30px;
       }

       .enquiry-image,
       .enquiry-form-container {
           flex: unset;
           width: 100%;
       }

       .enquiry-image video {
           max-height: 300px;
           height: auto;
       }
   }

   /* Responsive tweaks for small mobiles */
   @media (max-width: 480px) {
       .enquiry-form-container {
           padding: 20px 15px;
       }

       input,
       textarea {
           font-size: 16px;
       }

       .form-group i {
           font-size: 18px;
           margin-right: 8px;
       }

       .submit-btn {
           font-size: 18px;
           padding: 14px;
       }
   }


   /* enquiry index end */


   /* about page start */

   /* .top-banner {
       position: relative;
       background: url('assets/images/bg.jpg') center/cover no-repeat;
       height: 250px;
       display: flex;
       justify-content: center;
       align-items: center;
       color: white;
       overflow: hidden;
   }

   
   .top-banner::before {
       content: "";
       position: absolute;
       inset: 0;
       background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.6));
       z-index: 1;
   }

   .breadcrumb-container {
       position: relative;
       z-index: 2;
       background: rgba(255, 255, 255, 0.15);
       padding: 12px 25px;
       font-size: 18px;
       border-radius: 30px;
       backdrop-filter: blur(6px);
       box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
       animation: fadeIn 1s ease-out;
       transition: all 0.3s ease;
   }

   .breadcrumb-container:hover {
       background: rgba(255, 255, 255, 0.25);
       transform: scale(1.05);
   }

   .breadcrumb-container a {
       color: #fff;
       text-decoration: none;
       font-weight: 500;
   }

   .breadcrumb-container a:hover {
       text-decoration: underline;
   }

   @keyframes fadeIn {
       from {
           opacity: 0;
           transform: translateY(20px);
       }

       to {
           opacity: 1;
           transform: translateY(0);
       }
   } */

   .vastu-about-section {
       padding: 60px 20px;
       background: #f9f9f9;
   }

   .vastu-about-image {
       width: 100%;
       height: auto;
       max-height: 350px;
       border-radius: 10px;
       box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
       opacity: 0;
       transform: translateX(-30px);
       transition: opacity 1.2s ease-in-out, transform 1.2s ease-in-out;
       object-fit: contain;
       max-width: 100%;
   }

   .vastu-about-content {
       opacity: 0;
       transform: translateX(30px);
       transition: opacity 1.2s ease-in-out, transform 1.2s ease-in-out;
   }

   /* Active state when visible */
   .vastu-visible {
       opacity: 1 !important;
       transform: translateX(0) !important;
   }

   .vastu-about-content h2 {
       color: #820203;
       font-weight: 700;
       margin-bottom: 20px;
   }

   .btn-primary {
       background-color: #820203;
       border-color: #820203;
       transition: background-color 0.3s ease, border-color 0.3s ease;
   }

   .btn-primary:hover,
   .btn-primary:focus {
       background-color: #820203;
       border-color: #820203;
       box-shadow: 0 0 8px #820203;
   }

   @media (max-width: 767px) {

       .vastu-about-image,
       .vastu-about-content {
           transform: translateY(20px);
       }

       .vastu-visible {
           transform: translateY(0) !important;
       }
   }


   /* Colored background added here */
   .choose-section {
       /* background: linear-gradient(135deg, #ffbc3d 0%, #ffa319 100%); */
       background: #820203;
       /* padding: 60px 20px; */
       padding: 17px 5px;
       border-radius: 0;
       /* no rounded corners for full width */
       box-shadow: 0 12px 40px rgba(255, 163, 25, 0.6);
       width: 100vw;
       /* full viewport width */
       margin: 0;
       /* no margin */
       overflow-x: hidden;
       /* prevent horizontal scroll */
   }

   .choose-container {
       width: 100%;
       max-width: none;
       /* remove max-width */
       text-align: center;
       padding: 0 20px;
       /* inner padding */
   }

   .choose-title {
       font-size: 3rem;
       font-weight: 800;
       margin-bottom: 60px;
       letter-spacing: 1.5px;
       text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.25);
       line-height: 1.2;
       color: #fff;
   }

   .choose-title span {
       color: #fff8e1;
       text-shadow: 1px 1px 6px #820203;
   }

   /* Features Grid */
   .choose-features {
       display: grid;
       grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
       gap: 35px;
       justify-content: center;
       width: 100%;
       max-width: 1200px;
       /* optional max content width for features */
       margin: 0 auto;
       /* center features grid */
   }

   /* Feature Card */
   .choose-card {
       background: rgba(255, 255, 255, 0.15);
       border-radius: 20px;
       padding: 35px 25px 40px;
       box-shadow: 0 8px 25px rgba(0, 0, 0, 0.22);
       cursor: default;
       user-select: none;
       color: #fff8e1;
       transition: transform 0.35s ease, box-shadow 0.35s ease, background-color 0.35s ease;
       opacity: 0;
       transform: translateY(20px);
       animation: fadeInUp 0.8s forwards;
   }

   .choose-card:nth-child(1) {
       animation-delay: 0.15s;
   }

   .choose-card:nth-child(2) {
       animation-delay: 0.3s;
   }

   .choose-card:nth-child(3) {
       animation-delay: 0.45s;
   }

   .choose-card:hover {
       background: rgba(255, 163, 25, 0.18);
       transform: translateY(-15px) scale(1.04);
       box-shadow: 0 20px 40px rgba(255, 163, 25, 0.75);
       color: #fff8e1;
   }

   /* Icon */
   .choose-icon {
       font-size: 4rem;
       margin-bottom: 22px;
       filter: drop-shadow(1px 2px 2px rgba(0, 0, 0, 0.4));
       transition: color 0.3s ease, filter 0.3s ease;
       user-select: none;
   }

   .choose-card:hover .choose-icon {
       color: #ffa319;
       filter: drop-shadow(0 0 12px #820203);
   }

   /* Heading */
   .choose-card h3 {
       font-size: 1.5rem;
       font-weight: 700;
       margin-bottom: 14px;
       text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
       transition: color 0.3s ease;
   }

   .choose-card:hover h3 {
       color: #820203;
   }

   /* Paragraph */
   .choose-card p {
       font-size: 1.1rem;
       line-height: 1.6;
       color: #fff8e1;
       text-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
       transition: color 0.3s ease;
   }

   .choose-card:hover p {
       color: #ffdb94;
   }

   /* Responsive */
   @media (max-width: 480px) {
       .choose-title {
           font-size: 2.2rem;
           margin-bottom: 40px;
       }

       .choose-card {
           padding: 28px 18px 30px;
       }

       .choose-card h3 {
           font-size: 1.3rem;
       }

       .choose-card p {
           font-size: 1rem;
       }

       .choose-icon {
           font-size: 3.2rem;
       }
   }

   /* Fade in animation */
   @keyframes fadeInUp {
       to {
           opacity: 1;
           transform: translateY(0);
       }
   }



   .mission-section,
   .vision-section {
       max-width: 1200px;
       margin: 60px auto;
       padding: 20px;
   }

   /* Common Container */
   .mission-container,
   .vision-container {
       display: flex;
       align-items: center;
       flex-wrap: wrap;
       gap: 40px;
   }

   /* Common Content */
   .mission-content,
   .vision-content {
       flex: 1 1 450px;
       color: #333;
   }



   /* Mission Animation */
   .mission-content,
   .mission-image {
       opacity: 0;
       transform: translateY(30px);
       animation-fill-mode: forwards;
       animation-timing-function: ease-out;
   }

   .mission-content {
       animation-name: fadeInUp;
       animation-duration: 1s;
       animation-delay: 0.3s;
   }

   .mission-image {
       animation-name: fadeInUp;
       animation-duration: 1s;
       animation-delay: 0.6s;
   }

   /* Mission Image */
   .mission-image {
       flex: 1 1 400px;
       text-align: right;
   }

   .mission-image img {
       width: 100%;
       max-width: 400px;
       border-radius: 15px;
       box-shadow: 0 8px 25px rgba(255, 163, 25, 0.4);
       object-fit: cover;
   }

   /* Vision Image */
   .vision-image {
       flex: 1 1 450px;
   }

   .vision-image img {
       width: 100%;
       max-width: 400px;
       border-radius: 15px;
       box-shadow: 0 8px 25px rgba(255, 163, 25, 0.4);
       object-fit: cover;
   }

   /* Fade in up animation */
   @keyframes fadeInUp {
       to {
           opacity: 1;
           transform: translateY(0);
       }
   }

   /* Responsive */
   @media (max-width: 1024px) {

       .mission-container,
       .vision-container {
           gap: 20px;
       }

       .mission-content p,
       .vision-content p {
           font-size: 17px;
           color: #000;
           text-align: start;
       }
   }

   @media (max-width: 768px) {

       .mission-container,
       .vision-container {
           flex-direction: column;
           text-align: center;
           gap: 20px;
       }

       .mission-image,
       .vision-image {
           text-align: center;
           margin-top: 15px;
           max-height: 180px;
       }

       .mission-image img,
       .vision-image img {
           max-width: 100%;
           height: auto;
           max-height: 200px;
           object-fit: cover;
       }

       .mission-content,
       .vision-content {
           flex: 1 1 100%;
       }
   }

   @media (max-width: 480px) {

       .mission-section,
       .vision-section {
           margin: 40px auto;
           padding: 15px;
       }

       .mission-image img,
       .vision-image img {
           max-height: 160px;
       }
   }

   .custom-banner {
       display: flex;
       justify-content: space-between;
       align-items: center;
       background: linear-gradient(90deg,
               rgba(130, 2, 3, 0.85) 0%,
               rgba(205, 179, 112, 0.65) 100%),
           url("assets/images/vastu.webp") no-repeat center/cover;

       padding: 20px 30px;
       color: white;
       box-sizing: border-box;
       min-height: 110px;
   }

   .custom-banner h2 {
       font-weight: 600;
       font-size: 1.8rem;
   }

   .custom-banner h2 strong {
       font-weight: 900;
   }

   .action-btn {
       background-color: #111;
       color: white;
       /* padding: 10px 24px; */
       padding: 5px 13px;
       border-radius: 30px;
       font-weight: 600;
       font-size: 1rem;
       cursor: pointer;
       border: none;
       display: flex;
       align-items: center;
       gap: 8px;
       box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
       transition: background-color 0.3s ease;
   }

   .action-btn:hover {
       background-color: #333;
   }

   .action-btn svg {
       width: 16px;
       height: 16px;
       stroke: white;
       stroke-width: 2;
       stroke-linecap: round;
       stroke-linejoin: round;
   }

   /* Responsive */
   @media (max-width: 600px) {
       .banner-wrapper {
           flex-direction: column;
           gap: 15px;
           text-align: center;
       }

       .banner-wrapper h2 {
           font-size: 1.5rem;
       }

       .action-btn {
           width: 100%;
           justify-content: center;
       }
   }

   /* about page end */


   /* contact page start */
   .contact-section {
       max-width: 1100px;
       margin: 0 auto;
       display: flex;
       gap: 30px;
       background: #fff;
       border-radius: 12px;
       padding: 30px;
       box-shadow: 0 8px 24px rgb(0 0 0 / 0.1);
       flex-wrap: wrap;
   }

   /* Left form side */
   .form-wrapper {
       flex: 1 1 320px;
       display: flex;
       flex-direction: column;
       gap: 20px;
   }

   .form-wrapper h2 {
       margin: 0 0 20px 0;
       font-weight: 700;
       font-size: 1.7rem;
       color: #043b72;
   }

   /* Inputs container to hold icon and input */
   .field-wrapper {
       position: relative;
       width: 100%;
   }

   /* Icons inside inputs */
   .field-wrapper svg {
       position: absolute;
       top: 50%;
       left: 14px;
       transform: translateY(-50%);
       fill: #820203;
       width: 18px;
       height: 18px;
       pointer-events: none;
       opacity: 0.75;
   }

   /* Inputs and textarea */
   input[type="text"],
   input[type="email"],
   input[type="tel"],
   textarea {
       width: 100%;
       padding: 14px 14px 14px 44px;
       font-size: 1rem;
       /* border: 1.5px solid #ccc; */
       border-radius: 8px;
       outline-offset: 2px;
       transition: border-color 0.25s ease;
       resize: vertical;
       font-family: inherit;
   }

   input[type="text"]:focus,
   input[type="email"]:focus,
   input[type="tel"]:focus,
   textarea:focus {
       border-color: #820203;
       box-shadow: 0 0 6px #820203;
       outline: none;
       background: #fff;
   }

   textarea {
       min-height: 110px;
   }

   /* Submit button */
   .btn-send {
       background-color: #820203;
       border: none;
       color: #222;
       font-weight: 700;
       font-size: 1.1rem;
       padding: 14px 32px;
       border-radius: 50px;
       cursor: pointer;
       box-shadow: 0 10px 30px #820203;
       transition: background-color 0.3s ease, box-shadow 0.3s ease;
       display: block;
       margin: 0 auto;
       user-select: none;
   }

   .btn-send:hover,
   .btn-send:focus {
       background-color: #820203;
       box-shadow: 0 14px 40px #820203;
       outline: none;
   }

   /* Right map side */
   .map-wrapper {
       flex: 1 1 320px;
       border-radius: 12px;
       overflow: hidden;
       box-shadow: 0 8px 20px rgb(0 0 0 / 0.1);
       min-height: 300px;
   }

   .map-wrapper iframe {
       width: 100%;
       height: 100%;
       border: 0;
       display: block;
       border-radius: 12px;
       min-height: 300px;
   }

   /* Responsive */
   @media (max-width: 740px) {
       .contact-section {
           flex-direction: column;
       }

       .btn-send {
           align-self: stretch;
       }
   }

   @media (max-width: 400px) {
       /* body {
           margin: 20px 10px;
       } */

       .form-wrapper h2 {
           font-size: 1.4rem;
       }
   }

   /* contact page end  */


   /* socials presence start */

   .unique-section-title {
       font-weight: bold;
       text-align: center;
       margin-bottom: 50px;
       font-size: 1.8rem;
   }

   .unique-card {
       color: #fff;
       border-radius: 15px;
       text-align: center;
       padding: 40px 20px 30px;
       position: relative;
       box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
       transition: transform 0.3s ease, box-shadow 0.3s ease;
       height: 100%;
       display: flex;
       flex-direction: column;
       justify-content: space-between;
   }

   .unique-card:hover {
       transform: translateY(-10px);
       box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);
   }

   .unique-profile-img {
       width: 130px;
       height: 130px;
       border-radius: 50%;
       border: 6px solid #fff;
       object-fit: cover;
       margin-top: 20px;
       margin-bottom: 20px;
       box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
       transition: transform 0.3s ease;
   }

   .unique-card:hover .unique-profile-img {
       transform: scale(1.05);
   }

   .unique-btn {
       display: inline-flex;
       align-items: center;
       background: #fff;
       color: #000;
       padding: 10px 18px;
       border-radius: 30px;
       font-size: 14px;
       font-weight: bold;
       text-decoration: none;
       gap: 8px;
       box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
       transition: all 0.3s ease;
   }

   .unique-btn img {
       width: 20px;
   }

   .unique-btn:hover {
       transform: scale(1.05);
       box-shadow: 0 6px 15px rgba(0, 0, 0, 0.3);
   }

   .unique-youtube {
       background: linear-gradient(135deg, #b40000, #ff3c3c);
   }

   .unique-facebook {
       background: linear-gradient(135deg, #0d47a1, #3b82f6);
   }

   .unique-instagram {
       background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
   }

   .unique-card p {
       font-size: 16px;
       font-weight: 500;
       margin-bottom: 15px;
   }

   .unique-handle {
       display: block;
       margin-top: 10px;
       font-size: 14px;
       color: #fff;
       opacity: 0.9;
   }

   /*socials presence end */

   /* product start */
   /* Wrapper */
   .wrapper {
       max-width: 1200px;
       margin: 40px auto;
       padding: 0 15px;
   }

   /* Product Section */
   .product-section {
       display: flex;
       flex-wrap: wrap;
       gap: 40px;
   }

   .images-block {
       flex: 1 1 45%;
   }

   .primary-img {
       width: 100%;
       height: 400px;
       border-radius: 12px;
       box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
       object-fit: contain;
       background: #fff;
   }

   .thumb-row {
       display: flex;
       gap: 10px;
       margin-top: 15px;
   }

   .thumb-row img {
       width: 70px;
       height: 70px;
       object-fit: contain;
       background: #fff;
       border-radius: 6px;
       cursor: pointer;
       border: 2px solid transparent;
       transition: border-color 0.3s ease;
   }

   .thumb-row img:hover,
   .thumb-row img.active {
       border-color: #820203;
   }

   .info-block {
       flex: 1 1 50%;
   }

   .info-block h1 {
       font-size: 28px;
       font-weight: 700;
       color: #aa6d1a;
       /* darker warm orange */
   }

   .price-details .main-price {
       color: #820203;
       font-weight: 700;
       font-size: 22px;
       margin: 15px 0;
   }

   .price-details .mrp {
       text-decoration: line-through;
       color: #999;
       margin-left: 10px;
       font-weight: 400;
   }

   .price-details .discount {
       color: #e63946;
       /* keep original red */
       font-weight: 700;
       margin-left: 10px;
   }

   .price-details .alt-price {
       font-size: 14px;
       color: #444;
       margin-top: 5px;
   }

   .button-group {
       margin-top: 20px;
       display: flex;
       gap: 15px;
   }

   .button-group a.enquiry-btn {
       color: #820203;
       background: #fff;
       border: 2px solid #820203;
       border-radius: 30px;
       font-weight: 600;
       padding: 10px 25px;
       text-align: center;
       display: inline-block;
       transition: all 0.3s ease;
       text-decoration: none;
   }

   .button-group a.enquiry-btn:hover {
       background: #820203;
       color: #fff;
   }

   .button-group a.purchase-btn {
       background: #820203;
       color: #fff;
       border-radius: 30px;
       font-weight: 600;
       border: 2px solid #820203;
       padding: 10px 25px;
       text-align: center;
       display: inline-block;
       transition: background 0.3s ease;
       text-decoration: none;
   }

   .button-group a.purchase-btn:hover {
       background: #820203;
   }

   /* Tabs */
   .tab-section {
       margin-top: 50px;
   }

   .tab-header {
       display: flex;
       gap: 20px;
       flex-wrap: wrap;
       /* allows wrapping on very small screens */
       margin-bottom: 15px;
   }

   .tab-header button {
       background: none;
       border: none;
       font-size: 16px;
       font-weight: bold;
       cursor: pointer;
       padding: 10px 15px;
       color: #aa6d1a;
       border-bottom: 2px solid transparent;
       transition: color 0.3s ease, border-color 0.3s ease;
       white-space: nowrap;
       /* prevent text wrap inside buttons */
       flex-shrink: 0;
       /* prevent shrinking too much */
   }

   .tab-header button.active {
       border-color: #820203;
       color: #820203;
   }

   .tab-panel {
       display: none;
   }

   .tab-panel.active {
       display: block;
       animation: fadeIn 0.4s ease;
   }

   @keyframes fadeIn {
       from {
           opacity: 0;
       }

       to {
           opacity: 1;
       }
   }

   /* Testimonials */
   .review-card {
       background: #fff7e1;
       border-radius: 10px;
       padding: 20px;
       margin-bottom: 20px;
       box-shadow: 0 4px 10px rgba(255, 170, 44, 0.15);
   }

   .review-card p {
       font-size: 15px;
       color: #444;
       margin-bottom: 15px;
       line-height: 1.6;
   }

   .review-footer {
       display: flex;
       align-items: center;
       gap: 15px;
   }

   .review-footer img {
       width: 50px;
       height: 50px;
       border-radius: 50%;
       object-fit: cover;
   }

   .review-footer h4 {
       font-size: 16px;
       margin: 0;
       color: #aa6d1a;
   }

   .review-footer span {
       font-size: 13px;
       color: #777;
   }

   .star-rating {
       color: #ffaa2c;
       font-size: 16px;
   }

   /* Related Items */
   .related-section {
       margin-top: 60px;
   }

   .related-section h2 {
       color: #aa6d1a;
       margin-bottom: 25px;
       font-weight: 700;
       font-size: 28px;
       text-align: center;
   }

   .related-grid {
       display: grid;
       grid-template-columns: repeat(3, 1fr);
       gap: 25px;
   }

   .related-card {
       background: #fff7e1;
       border-radius: 12px;
       box-shadow: 0 4px 15px rgba(255, 170, 44, 0.15);
       padding: 15px;
       text-align: center;
       transition: box-shadow 0.3s ease;
       cursor: pointer;
   }

   .related-card:hover {
       box-shadow: 0 8px 30px rgba(255, 170, 44, 0.35);
   }

   .related-card img {
       width: 100%;
       height: 180px;
       object-fit: contain;
       border-radius: 10px;
       margin-bottom: 15px;
       background: #fff;
   }

   .related-card h3 {
       font-size: 18px;
       color: #aa6d1a;
       margin-bottom: 8px;
   }

   .related-card .price {
       font-size: 16px;
       font-weight: 700;
       color: #ffaa2c;
   }

   @media (max-width: 992px) {
       .related-grid {
           grid-template-columns: repeat(2, 1fr);
       }
   }

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

   /* Responsive */
   @media (max-width: 768px) {
       .product-section {
           flex-direction: column;
       }

       .tab-header {
           flex-direction: column;
           gap: 10px;
       }
   }

   @media (max-width: 480px) {
       .thumb-row img {
           width: 50px;
           height: 50px;
       }
   }

   /* Responsive tweaks */

   /* Medium tablets and below */
   @media (max-width: 992px) {
       .product-section {
           flex-direction: column;
       }

       .images-block,
       .info-block {
           flex: 1 1 100%;
       }

       .primary-img {
           height: auto;
           max-height: 400px;
       }

       .thumb-row img {
           width: 60px;
           height: 60px;
       }

       .button-group {
           flex-wrap: wrap;
           gap: 10px;
       }
   }

   /* Small tablets and large phones */
   /* On very small screens, slightly reduce font size and padding */
   @media (max-width: 480px) {
       .tab-header {
           gap: 12px;
       }

       .tab-header button {
           font-size: 14px;
           padding: 8px 12px;
       }

       /* Tab panel text adjustments */
       .tab-panel p,
       .tab-panel ul li {
           font-size: 14px;
           line-height: 1.5;
       }

       .tab-panel h3,
       .tab-panel h4 {
           font-size: 18px !important;
       }

       /* Review cards */
       .review-card {
           padding: 15px;
       }

       .review-footer img {
           width: 40px;
           height: 40px;
       }

       .review-footer h4 {
           font-size: 15px;
       }

       .review-footer span {
           font-size: 12px;
       }

       .star-rating {
           font-size: 14px;
       }
   }

   /* product end */

   /* service index start */


   /* service index end */


   /* gallery start */
   .premium-gallery {
       padding: 50px 20px;
       background-color: #fff8f0;
       text-align: center;
       font-family: 'Arial', sans-serif;
   }

   .premium-gallery h2 {
       font-size: 2.5rem;
       margin-bottom: 40px;
       color: #820203;
       font-weight: bold;
   }

   /* Image Styles */
   .premium-gallery img {
       width: 100%;
       height: 250px;
       object-fit: cover;
       cursor: pointer;
       border-radius: 12px;
       transition: transform 0.5s, filter 0.5s;
       box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);
   }

   .premium-gallery img:hover {
       transform: scale(1.08);
       filter: brightness(1.1);
   }

   /* Modal Styles */
   .custom-modal {
       display: none;
       position: fixed;
       z-index: 1000;
       padding-top: 60px;
       left: 0;
       top: 0;
       width: 100%;
       height: 100%;
       overflow: auto;
       background-color: rgba(0, 0, 0, 0.9);
       animation: fadeIn 0.5s;
   }

   @keyframes fadeIn {
       from {
           opacity: 0;
       }

       to {
           opacity: 1;
       }
   }

   .custom-modal-content {
       margin: auto;
       display: block;
       max-width: 25%;
       max-height: 80vh;
       border-radius: 12px;
       box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
       animation: zoomIn 0.5s;
   }

   @keyframes zoomIn {
       from {
           transform: scale(0.7);
       }

       to {
           transform: scale(1);
       }
   }

   .custom-modal-close {
       position: absolute;
       top: 20px;
       right: 35px;
       color: #fff;
       font-size: 45px;
       font-weight: bold;
       cursor: pointer;
       transition: color 0.3s;
   }

   .custom-modal-close:hover {
       color: #820203;
   }

   /* Responsive Modal Image */
   @media (max-width: 600px) {
       .custom-modal-content {
           width: 95%;
       }
   }

   /* gallery end */

   /* nav logo start */
   .brand-text {
       color: #fff;
       font-size: 22px;
       font-weight: 700;
       letter-spacing: -1px;
       font-family: 'Georgia', serif;
       /* Premium serif font */
       text-transform: uppercase;
       text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.4);
       /* Glow effect */
       transition: all 0.3s ease-in-out;
       cursor: pointer;
   }

   /* .brand-text:hover {
    color: #ff6600; 
    text-shadow: 2px 2px 12px rgba(255, 102, 0, 0.8);
} */
   /* nav logo end */

   /* about start */
   .sub-title {
       font-size: 22px;
       font-weight: 700;
       color: #820203;
       /* Orange */
       text-align: justify;
       font-family: 'Georgia', serif;
       /* Premium font */
       letter-spacing: 0.8px;
       position: relative;
       display: inline-block;
       margin-top: 10px;
       text-transform: capitalize;
       /* text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.3); */
   }

   /* 📱 Tablet & Mobile Media Query */
   @media (max-width: 768px) {
       .sub-title {

           text-align: start;
           /* left-align text */
       }
   }

   @media (max-width: 480px) {
       .sub-title {

           text-align: start;
       }
   }


   /* about end */

   /* popup start */
   /* popup start */
   .popup-overlay {
       position: fixed;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       background: rgba(0, 0, 0, 0.6);
       display: flex;
       justify-content: center;
       align-items: center;
       z-index: 10000;
       animation: fadeBg 0.5s ease;
   }

   .popup {
       background: #fff;
       width: 450px;
       max-width: 90%;
       border-radius: 20px;
       overflow: hidden;
       padding: 40px 30px;
       box-shadow: 0 15px 50px rgba(0, 0, 0, 0.5);
       animation: fadeIn 0.5s ease;
       position: relative;
   }

   .popup h2 {
       color: #820203;
       margin-bottom: 25px;
       font-weight: 700;
   }

   .close-btn {
       position: absolute;
       top: 12px;
       right: 18px;
       font-size: 24px;
       cursor: pointer;
       color: #820203;
       transition: color 0.3s ease;
   }

   .close-btn:hover { color: #820203; }

   .input-group {
       position: relative;
       margin: 10px 0;
   }

   .input-group i {
       position: absolute;
       top: 50%;
       left: 12px;
       transform: translateY(-50%);
       color: #820203;
       font-size: 16px;
       padding: 8px;
       border-radius: 50%;
   }

   .input-group input,
   .input-group textarea {
       width: 100%;
       padding: 12px 12px 12px 45px;
       border-radius: 8px;
       border: 1px solid #e0ca94;
       font-size: 15px;
       font-family: 'Segoe UI', sans-serif;
   }

   .input-group input:focus,
   .input-group textarea:focus {
       border-color: #820203;
       box-shadow: 0 0 8px rgba(255, 107, 0, 0.3);
       outline: none;
   }

   .input-group textarea {
       height: 90px;
       resize: none;
   }

   .popup .submit-btn {
       display: block;
       width: 60%;
       margin: 20px auto 0 auto;
       background: linear-gradient(45deg, #820203, #efd697);
       color: #fff;
       border: none;
       cursor: pointer;
       font-weight: 700;
       transition: all 0.3s ease;
       box-shadow: 0 6px 20px rgba(255, 107, 0, 0.5);
       padding: 14px 0;
       font-size: 17px;
       border-radius: 25px;
       letter-spacing: 1px;
       text-transform: uppercase;
       text-align: center;
   }

   .popup .submit-btn:hover {
       transform: scale(1.1);
       box-shadow: 0 12px 30px rgba(255, 107, 0, 0.6);
       background: linear-gradient(45deg, #820203, #f4db9d);
   }

   @keyframes fadeIn {
       from { opacity: 0; transform: scale(0.9); }
       to   { opacity: 1; transform: scale(1); }
   }

   @keyframes fadeBg {
       from { opacity: 0; }
       to   { opacity: 1; }
   }

   @media(max-width:480px) {
       .popup { width: 90%; padding: 30px 20px; }
       .popup .submit-btn { width: 80%; }
   }
   /* popup end */
   /* popup end */

   /* our product start */
   .card {
       border: none;
       border-radius: 15px;
       overflow: hidden;
       box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.1);
       transition: transform 0.3s ease, box-shadow 0.3s ease;
   }

   .card:hover {
       transform: translateY(-8px);
       box-shadow: 0px 8px 25px rgba(255, 102, 0, 0.4);
   }

   .card img {
       height: 220px;
       object-fit: cover;
       border-bottom: 3px solid #820203;
   }

   .card-body {
       text-align: center;
       padding: 20px;
   }

   .card-title {
       font-size: 1.2rem;
       font-weight: bold;
       color: #820203;
   }

   .product-price {
       font-size: 18px;
       margin: 0;
   }

   .price-old {
       text-decoration: line-through;
       color: #888;
       margin-right: 8px;
   }

   .price-current {
       color: #bba05a;
       font-weight: bold;
   }


   .btn-box {
       display: flex;
       justify-content: center;
       gap: 15px;
       margin-top: 15px;
   }

   .btn-custom {
       /* background: linear-gradient(135deg, #ff7e5f, #feb47b); */
       background: #820203;
       color: #fff;
       padding: 6px 10px;
       border-radius: 30px;
       text-decoration: none;
       font-size: 14px;
       font-weight: 600;
       letter-spacing: 0.5px;
       position: relative;
       transition: all 0.3s ease-in-out;
       box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
   }

   .btn-custom:hover {
       transform: translateY(-3px) scale(1.05);
       box-shadow: 0 6px 15px rgba(0, 0, 0, 0.25);
   }

   .btn-custom:active {
       transform: scale(0.97);
   }

   /* Swiper navigation buttons */
   /* Swiper buttons custom design */
   .swiper-button-next,
   .swiper-button-prev {
       width: 35px;
       /* chhoti width */
       height: 35px;
       /* chhoti height */
       /* background: linear-gradient(135deg, #ff7e5f, #feb47b); */
       background: #820203;
       border-radius: 50%;
       /* gol button */
       box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
       display: flex;
       align-items: center;
       justify-content: center;
       transition: all 0.3s ease;
   }

   .swiper-button-next::after,
   .swiper-button-prev::after {
       font-size: 18px !important;
       /* default usually 20-25 hota hai, isse chhota ho jayega */
       color: #fff;
       /* arrow color */
       font-weight: bold;
   }

   .swiper-button-next,
   .swiper-rtl .swiper-button-prev {
       right: var(--swiper-navigation-sides-offset, 10px);
       left: auto;
       height: 35px;
       /* yahan height chhoti kar di */
       width: 35px;
       /* optional - gol banane ke liye */
   }

   .swiper-button-next:hover,
   .swiper-button-prev:hover {
       transform: scale(1.1);
       box-shadow: 0 6px 15px rgba(0, 0, 0, 0.3);
   }


   .swiper-wrapper {
       position: relative;
       width: 100%;
       /* height: 100%; */
       z-index: 1;
       display: flex;
       transition-property: transform;
       transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
       box-sizing: content-box;
   }

   /* our product end */

   /* Product Section start */
   .prod-images {
       width: 100%;
       height: 400px;
       border-radius: 10px;
       box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
       object-fit: cover;
       transition: transform 0.3s ease;
   }

   .prod-main-image {
       width: 100%;
       height: 400px;
       border-radius: 10px;
       box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
       object-fit: contain;
       transition: transform 0.3s ease;
   }

   .prod-main-image:hover {
       transform: scale(1.02);
   }

   .prod-thumb {
       width: 120px;
       height: 100px;
       object-fit: cover;
       border-radius: 8px;
       border: 2px solid transparent;
       box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
       cursor: pointer;
       transition: transform 0.3s ease;
   }

   .prod-thumb:hover {
       transform: scale(1.05);
   }

   .prod-thumb.active {
       border: 2px solid #820203;
   }

   /* Product Info Section */
   .prod-info-title {
       /* font-weight: bold;     */
       color: #820203;
   }

   .prod-price {
       font-size: 1.5rem;
       font-weight: bold;
       color: #a37000;
       margin: 15px 0;
   }

   .prod-btn {
       border-radius: 30px;
       padding: 10px 20px;
       font-weight: 500;
       box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
   }

   .prod-btn-enquiry {
       background-color: #820203;
       color: white;
       border: none;
   }

   .prod-btn-enquiry:hover {
       background-color: #820203;
   }

   .prod-btn-buy {
       background-color: #820203;
       color: white;
       border: none;
   }

   .prod-btn-buy:hover {
       background-color: #820203;
   }

   /* product section end */

   /* footer logo and name start */
   .premium-brand {
       display: flex;
       align-items: center;
     
       /* padding: 25px 0px; */
       border-radius: 12px;
       transition: transform 0.3s ease, box-shadow 0.3s ease;
   }

   .premium-logo {
       height: 65px;
       width: auto;
       border-radius: 8px;
   }

   .premium-name {
       font-size: 26px;
       font-weight: 800;
       color: #820203;
       letter-spacing: 1px;
   }

   /* footer logo and name end */

   /* video basnner start */

   /* 🌟 Video Banner */
  

   /* video banner end */