 .highlight-text {
   color: var(--theme-color) !important;
   font-weight: 500;
 }
 .highlight1-text{
color: var(--theme-color2);
 }

 .highlight2-text{
  color: red;
 }
 .highlight-text-title {
   color: var(--theme-color2);
 }
.forcontact{
  font-size: 20px !important;
}

 .sec-text {
   text-align: justify;
   font-size: 16px;
 }

 .about-tag {
   position: relative;
   display: inline-block;
   font-size: 14px;
   font-weight: 600;
   color: #ffffff;
   text-transform: uppercase;
   letter-spacing: 2px;
   padding: 2px 16px;
   margin-left: 35px;
   /* space for the line */
   background: var(--theme-color2);
   /* text background */
   border-radius: 12px;
 }

 .about-tag::before {
   content: "";
   position: absolute;
   left: -30px;
   /* distance from text */
   top: 50%;
   transform: translateY(-50%);
   width: 25px;
   /* length of line */
   height: 2px;
   /* thickness of line */
   background: var(--theme-color2);
   border-radius: 1px;
   /* smooth edges */
 }

 .about-badge-home {
   position: absolute;
   left: 50%;
   /* center horizontally */
   top: 50%;
   transform: translate(-50%, -100%);
   width: 110px;
   height: 110px;
   border-radius: 50%;
   background: #016564;
   display: flex;
   align-items: center;
   justify-content: center;
   color: white;
   z-index: 2;
 }

 .about-badge-about {
   position: absolute;
   left: 50%;
   /* center horizontally */
   /* top: 50%; */
   transform: translate(-50%, -50%);
   width: 110px;
   height: 110px;
   border-radius: 50%;
   background: #016564;
   display: flex;
   align-items: center;
   justify-content: center;
   color: white;
   z-index: 2;
 }


 /* circular text */
 .badge-text-home {
   position: absolute;
   width: 100%;
   height: 100%;
   animation: rotateBoth 3s linear infinite alternate;
 }

 .badge-text-home text {
   font-size: 16px;
   letter-spacing: 2px;
   fill: white;
   text-transform: uppercase;
 }

 /* center icon */
 .badge-icon-home {
   width: 60px;
   height: 60px;
   border-radius: 50%;
   display: flex;
   border: 1px solid white;
   align-items: center;
   justify-content: center;
   font-size: 29px;
   /* size of icon */
 }

 /* rotate left right */
 @keyframes rotateBoth {
   0% {
     transform: rotate(-90deg);
   }

   100% {
     transform: rotate(90deg);
   }
 }

 .hero-p {
   font-size: 20px;
 }

 /* gallery */


 /* my css */

 /* ===== GALLERY CARD ===== */
 .gallery-card {
   position: relative;
   border-radius: 18px;
   overflow: hidden;
   cursor: pointer;
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
   transition: all 0.4s ease;
 }

 .gallery-card:hover {
   transform: translateY(-8px);
   box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
 }

 /* ===== IMAGE ===== */
 .gallery-img {
   position: relative;
 }


 /* Zoom effect */
 .gallery-card:hover img {
   transform: scale(1.12);
 }

 /* ===== OVERLAY ===== */
 .gallery-overlay {
   position: absolute;
   inset: 0;
   background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
   display: flex;
   align-items: flex-end;
   padding: 20px;
   opacity: 0;
   transition: 0.4s;
 }

 .gallery-card:hover .gallery-overlay {
   opacity: 1;
 }

 /* ===== TEXT ===== */
 .gallery-overlay h3 {
   color: #fff;
   font-size: 18px;
   margin: 0;
   transform: translateY(20px);
   transition: 0.4s;
 }

 .gallery-card:hover .gallery-overlay h3 {
   transform: translateY(0);
 }

 /* ===== VIEW BUTTON ===== */
 .view-btn {
   display: inline-block;
   margin-top: 8px;
   font-size: 14px;
   color: #fff;
   text-decoration: none;
   border-bottom: 1px solid #fff;
   opacity: 0;
   transform: translateY(20px);
   transition: 0.4s;
 }

 .gallery-card:hover .view-btn {
   opacity: 1;
   transform: translateY(0);
 }

 .gallery-img::after {
   content: "+";
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%) scale(0);
   width: 55px;
   height: 55px;
   background: rgba(255, 255, 255, 0.9);
   color: #000;
   font-size: 28px;
   font-weight: bold;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   transition: 0.3s;
   z-index: 2;
   pointer-events: none;
 }

 .appointment-btn i {
   margin-right: 8px;
 }

 .gallery-card:hover .gallery-img::after {
   transform: translate(-50%, -50%) scale(1);
 }

 @media (max-width: 768px) {
   .nav-height {
     height: 150px !important;
   }

   .logo-img {
     bottom: 19px !important;

   }

   .footer-about-row {
     width: 100% !important;
     margin-bottom: 40px;
   }
 }

 /* ===== RESPONSIVE ===== */
 @media (max-width: 600px) {
   .gallery-img img {
     /* height: 200px; */
   }

   .info-box_icon {
     width: 0;
     height: 0;
     min-width: 31px;
     /* line-height: 15px; */
     font-size: 20px;
     /* background-color: rgba(255, 255, 255, 0.08); */
     color: var(--theme-color);
     border-radius: 30px;
     text-align: center;
     border: 0;
   }

   .info-box_link {
     display: inline-block;
     color: white;
     font-size: 14px;
     font-weight: 300;
   }

   .info-box_text {
     font-size: 12px;
     font-weight: 300;
   }

   .responsive-toggle {
     position: relative;
     top: -21px;
   }

   .nav-height {
     /* height: 140px !important; */
   }
 }

 .shape2 {
   position: absolute;
   z-index: 1;
   /* top: 0; */
   right: 0;
   pointer-events: none;
 }

 /* navbar */


 .marquee {
   width: 100%;
   overflow: hidden;
 }

 /* 🔥 FIX HERE */
 .marquee-track {
   display: flex;
   width: 100%;
   /* important */
   animation: marqueeMove 20s linear infinite;
 }

 .marquee-group {
   display: flex;
   gap: 60px;
   padding-right: 60px;
 }

 .marquee-group span {
   white-space: nowrap;
   font-size: 18px;
   color: white;
   font-weight: 500;
 }

 /* 🔥 NO GAP ANIMATION */
 @keyframes marqueeMove {
   0% {
     transform: translateX(100%);
   }

   100% {
     transform: translateX(-100%);
   }
 }

 .nav-height {
   height: 103px;
 }

 .logo-img {
   position: relative;
   /* margin-bottom: 2px; */
   bottom: 41px;
   left: 34px;
 }

 .hover:hover {
   color: var(--theme-color);
 }

 .info-box_link i {
   margin-right: 8px;
   color: #ffffff;
 }

 .hero-p {
   text-align: justify;
   color: gray;
 }

 .th-social a img {
   width: 35px;
   height: 35px;
   object-fit: contain;
   transition: transform 0.5s;
 }

 .th-social a:hover img {
   transform: rotateY(180deg);
 }


 /* FAB Container */
 .fab-container {
   position: fixed;
   bottom: 20px;
   right: 20px;
   z-index: 9999;
 }

 /* Main + Button */
 .fab-main {
   width: 60px;
   height: 60px;
   border-radius: 50%;
   background: var(--theme-color);
   color: #fff;
   border: none;
   font-size: 24px;
   cursor: pointer;
   box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
   transition: transform 0.3s ease;
 }

 /* Child Icons */
 .fab-item {
   position: absolute;
   right: 6px;
   width: 48px;
   height: 48px;
   border-radius: 50%;
   color: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   text-decoration: none;
   font-size: 20px;
   opacity: 0;
   visibility: hidden;
   transform: translateY(0);
   transition: all 0.3s ease;
 }

 /* WhatsApp */
 .fab-item.whatsapp {
   background: #25d366;
 }

 /* Phone */
 .fab-item.phone {
   background: var(--theme-color);
 }

 /* Active State */
 .fab-container.active .fab-item {
   opacity: 1;
   visibility: visible;
 }

 .fab-container.active .fab-item.whatsapp {
   transform: translateY(-118px);
 }

 .fab-container.active .fab-item.phone {
   transform: translateY(-177px);
 }

 .fab-container.active .fab-main {
   transform: rotate(45deg);
 }


 .footer-row {
   display: flex;
   align-content: flex-start;
   justify-content: space-evenly;
 }

 .footer-about-row {
   width: 26%;
 }


 .appointment-btn {
   position: relative;
   background: var(--theme-color);
   color: white;
   border: 2px solid var(--theme-color);
   padding: 10px 18px;
   border-radius: 5px;
   overflow: hidden;
   z-index: 1;
 }

 .appointment-btn::before {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 0%;
   height: 100%;
   background: transparent;
   transition: 0.4s;
   z-index: -1;
 }

 .appointment-btn:hover {
   color: var(--theme-color);
   background-color: transparent;
 }

 .appointment-btn:hover::before {
   width: 100%;
 }

 /* Align button nicely in menu */
 .nav-btn {
   margin-left: 15px;
   display: flex;
   align-items: center;
 }

 /* Overlay */
 .modal-overlay {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   display: none;
   /* important */
   justify-content: center;
   align-items: center;
   background: rgba(0, 0, 0, 0.6);
   z-index: 9999;
 }

 /* Modal Box */
 .modal-box {
   background: #fff;
   width: 500px;
   max-width: 95%;
   padding: 25px;
   border-radius: 10px;
   position: relative;
   animation: fadeIn 0.3s ease;
 }

 /* Title */
 .modal-title {
   text-align: center;
   margin-bottom: 20px;
   font-size: 20px;
 }

 /* Close Button */
 .close-btn {
   position: absolute;
   right: 15px;
   top: 10px;
   font-size: 20px;
   cursor: pointer;
 }

 /* Form Layout */
 .form-row {
   display: flex;
   flex-wrap: wrap;
   gap: 12px;
 }

 .form-group {
   width: 48%;
 }

 .form-group2 {
   width: 100% !important;
 }

 .form-group3 {
   width: 50%;
 }

 .form-group.full {
   width: 100%;
 }

 /* Inputs */
 input,
 select,
 textarea {
   width: 100%;
   padding: 10px;
   border: 1px solid #ccc;
   border-radius: 6px;
   font-size: 14px;
 }

 /* Button */
 .submit-btn {
   background: var(--theme-color2);
   color: #fff;
   border: none;
   padding: 12px;
   border-radius: 6px;
   cursor: pointer;
   display: block;
  margin: 0 auto;

   font-weight: 600;
 }


 /* Animation */
 @keyframes fadeIn {
   from {
     opacity: 0;
     transform: scale(0.85);
   }

   to {
     opacity: 1;
     transform: scale(1);
   }
 }

 /* Responsive */
 @media (max-width: 576px) {
   .form-group {
     width: 100%;
   }
 }



 .legal-section {
   padding: 80px 0;
   background: #f8fafc;
 }

 .legal-container {
   width: 90%;
   max-width: 1200px;
   margin: auto;
 }

 .legal-header {
   max-width: 600px;
   margin: 0 auto 50px;
 }




 .legal-grid {
   display: flex;
   gap: 30px;
 }

 .legal-col {
   flex: 1;
   display: flex;
   flex-direction: column;
   gap: 20px;
 }

 /* CARD */
 .legal-card {
   display: flex;
   gap: 15px;
   padding: 18px 20px;
   background: #fff;
   border-radius: 14px;
   box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);
   transition: all 0.35s ease;
   position: relative;
   overflow: hidden;
 }

 /* HOVER */
 .legal-card:hover {
   transform: translateY(-6px);
   box-shadow: 0 18px 40px rgba(0, 0, 0, 0.12);
 }

 /* LEFT BORDER */
 .legal-card::before {
   content: "";
   position: absolute;
   left: 0;
   top: 0;
   height: 100%;
   width: 4px;
   background: var(--theme-color);
   transform: scaleY(0);
   transform-origin: bottom;
   transition: 0.4s;
 }

 .legal-card:hover::before {
   transform: scaleY(1);
 }

 /* ICON */
 .legal-icon {
   min-width: 50px;
   height: 50px;
   background: var(--theme-color2);
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
 }

 .legal-icon i {
   color: #fff;
   font-size: 20px;
 }

 /* TEXT */
 .legal-content h6 {
   font-size: 20px;
   font-weight: 600;
   margin-bottom: 6px;
 }



 /* ANIMATION */
 .legal-card {
   opacity: 0;
   transform: translateY(30px);
   animation: fadeUp 0.6s ease forwards;
 }

 .legal-col .legal-card:nth-child(1) {
   animation-delay: 0.1s;
 }

 .legal-col .legal-card:nth-child(2) {
   animation-delay: 0.2s;
 }

 .legal-col .legal-card:nth-child(3) {
   animation-delay: 0.3s;
 }

 .legal-col .legal-card:nth-child(4) {
   animation-delay: 0.4s;
 }

 .legal-col .legal-card:nth-child(5) {
   animation-delay: 0.5s;
 }

 @keyframes fadeUp {
   to {
     opacity: 1;
     transform: translateY(0);
   }
 }

 /* RESPONSIVE */
 @media (max-width: 992px) {
   .legal-grid {
     flex-direction: column;
   }
 }

 .prac-area-img {
   height: 55px;
   width: 55px;
 }

 /*    <!-- alert agree or not --> */


 /* POPUP BACKGROUND */
 .legal-popup {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100vh;
   background: rgba(0, 0, 0, 0.7);

   display: flex;
   justify-content: center;
   align-items: center;

   z-index: 9999;
   padding: 15px;
   /* prevent overflow on mobile */
 }

 /* BOX */
 .legal-box {
   background: #fff;
   padding: 30px;
   max-width: 600px;
   width: 100%;
   /* responsive width */
   border-radius: 10px;
   text-align: center;

   max-height: 90vh;
   /* avoid overflow */
   overflow-y: auto;
   /* scroll if content long */
 }

 /* TEXT */
 .legal-box p {
   font-size: 15px;
   color: #444;
   line-height: 1.6;
 }

 /* BUTTONS */
 .legal-btns {
   margin-top: 20px;
   display: flex;
   justify-content: center;
   gap: 15px;
   flex-wrap: wrap;
   /* wrap on small screens */
 }

 .legal-btns button {
   padding: 10px 20px;
   border: 2px solid var(--theme-color2);
   background: transparent;
   color: var(--theme-color2);
   cursor: pointer;
   border-radius: 5px;
   transition: 0.3s;
   font-size: 14px;
 }

 .legal-btns button:hover {
   background: var(--theme-color2);
   color: #fff;
 }

 .height {
   height: 40px !important;
 }

 .color-white {
   color: white;
 }

 /* 📱 MOBILE FIX */
 @media (max-width: 576px) {

   .legal-box {
     padding: 20px;
     border-radius: 8px;
   }

   .legal-box p {
     font-size: 14px;
     text-align: justify;
   }

   .legal-btns {
     flex-direction: column;
     gap: 10px;
   }

   .legal-btns button {
     width: 100%;
     /* full width buttons */
   }

   .legal-content p {
     text-align: justify;
   }

   .text-end {
     text-align: center !important;
   }
 }

 .floating-icon {
   display: none;
 }


 /* floatoing appointment */
 @media (max-width: 576px) {
   .floating-icon {
     display: block;
     padding: 0 15px;
     position: fixed;
     bottom: 32%;
     right: -9px;
     width: 68px;
     height: 50px;
     background: var(--theme-color2);
     color: #fff;
     border: none;
     border-radius: 10px;
     font-size: 32px;
     display: flex;
     align-items: center;
     justify-content: center;
     box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
     cursor: pointer;
     z-index: 9999;
     animation: slideBounceRight 2s infinite;
   }

   @keyframes slideBounceRight {
     0% {
       right: -9px;
     }

     50% {
       right: 5px;
     }

     70% {
       right: 0px;
     }

     100% {
       right: -9px;
     }
   }

   /* Hover Effect */
   .floating-icon:hover {
     background: #000;
     transform: scale(1.1);
   }
 }


 /* Contact page */

 .breadcumb-menu li i {
   margin-right: 6px;
   color: #ffffff;
   /* golden */
 }

 .about-info_subtitle a {
   color: inherit;
   text-decoration: none;
 }

 .about-info_subtitle a:hover {
   color: var(--theme-color);
   /* golden hover */
   /* margin-left: 5px; */
 }

 .about-info_subtitle i {
   margin-right: 8px;
   color: var(--theme-color);
   /* golden */
   font-size: 14px;
 }

 .map-full {
   width: 100%;
   margin: 0;
   padding: 0;
 }

 .map-full iframe {
   width: 100%;
   height: 450px;
   border: 0;
   display: block;
 }

 .bottom-space {
   padding-bottom: 40px;
 }

 @media (max-width: 576px) {
   .about-info_subtitle i {
     display: none;
   }

   .about-info_subtitle a {
     font-size: 14px;
   }

   .about-info_icon {
     margin-bottom: 15px;
   }

   .arrow-fix {
     font-size: 17px !important;
   }
 }

 .box-text a {
   color: inherit;
   text-decoration: none;
 }

 .box-text a:hover {
   color: var(--theme-color);
   /* optional hover color */
 }

 /* gallary page */


 .gallery-card2 .card-img-gallery {
   aspect-ratio: 2 / 1.2;
 }
 

 /* practices-area pages */

 .align-justify {
   text-align: justify;
 }

 .arrow-fix {
   display: flex;
   align-items: center;
   gap: 6px;
   /* color: black; */
   font-size: 18px;
   direction: ltr;
   /* force left-to-right */
 }

 .top-space-footer {
   margin-top: 50px;
 }

 @media (max-width: 768px) {
   .footer-widget {
     margin-bottom: 26px;

   }

   .top-space-footer {
     margin-top: 0;
     margin-bottom: 40px;

   }
 }


 .footer-logo-img {
   max-width: 100%;
   height: auto;
   background: #fff;
   padding: 20px 28px 20px;
   border: 1px solid var(--bs-cyan);
   border-radius: 30%;

 }


 /* Questions About Your Case? */

 /* Input placeholder */
.form-control::placeholder {
  color: #fff !important;
  opacity: 1; /* important for full visibility */
}

/* For different browsers */
.form-control::-webkit-input-placeholder {
  color: #fff;
}

.form-control:-ms-input-placeholder {
  color: #fff;
}

.form-control::-ms-input-placeholder {
  color: #fff;
}


/* faq */

/* Default header color */
.accordion-button {
    background-color: var(--theme-color); /* light gray */
    transition: background-color 0.3s;
}

/* Change background when the accordion is open */
.accordion-collapse.show + .accordion-button,
.accordion-button[aria-expanded="true"] {
    background-color: var(--theme-color); /* yellow or any color you like */
}

