/* variables */
:root {
   --clr-very-dark-blue: #13274B; 
   --clr-dark-blue: #065E8F; 
   --clr-light-blue: #90A0AA; 
   --clr-very-light-blue: #EFF5ff; 
   --clr-dark-red: #BC2E31; 
   --clr-hover-red: rgb(201, 74, 76); 
   --clr-white: #FFFFFF; 
   --clr-text-black: #212529;
   --clr-black: #000000;

   --error-color: #dc3545;
   --success-color: #28a745;
   --warning-color: #ffc107;

   --box-shadow-1: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}


body {
   font-family: 'Poppins', sans-serif;
   line-height: 1.4;
   background-color: var(--clr-white);
   letter-spacing: .5pxs;
   color: var(--clr-text-black);
}

h1, h2, h3, h4, h5, h6 { font-family: 'Poppins', sans-serif; }
.box-shadow-1 { box-shadow: var(--box-shadow-1);}
.bg-blue{ background-color: var(--clr-dark-blue);}
.bg-brand-red{ background-color: var(--clr-dark-red);}
.text-brand-red { color: var(--clr-dark-red);}
.text-brand-black { color: var(--clr-text-black);}
.clr-brand-blue { color: var(--clr-dark-blue);}
.bg-light-blue{ background-color: var(--clr-very-light-blue);}
.list-style-none { list-style: none;}
.bg-light { background-color: var(--clr-very-light-blue) !important;}

.fw-600 { font-weight: 600 ;}
.fw-500 { font-weight: 500 ;}

.appointment-btn:hover { background-color: var(--clr-hover-red);}
.line-clamp {
   display: -webkit-box;
   -webkit-line-clamp: 4;
           line-clamp: 4;
   -webkit-box-orient: vertical;  
   overflow: hidden;
}

/* navigation */

.logo-image {
   max-width: 10rem;
}

.phone-dropdown .dropdown-toggle  {
   width: 2.5rem;
   aspect-ratio: 1;
   background-color: var(--clr-dark-blue);
   color: var(--clr-white);
}

.phone-dropdown .dropdown-toggle::after {
   display: none;
}

.phone-dropdown .dropdown-item {
   color: var(--clr-dark-blue);
}

.phone-dropdown .dropdown-item svg,
.header-desktop-list a svg {
   color: var(--clr-dark-red);
}

.header-desktop-list a {
   color: var(--clr-dark-blue);
}

.contact-us-text {
   font-weight: 500;
   color: var(--clr-dark-blue);
}


@media only screen and  (max-width: 991.98px) {
   .navbar {
      padding-block: .625rem;
   }

   .nav-link {
      padding: .625rem;
   }

   .navbar-nav {
      margin-top: .625rem;
      /* background-color: var(--clr-very-light-blue); */
   }
}


@media only screen and (min-width: 992px) {
   .navbar .logo-image {
      max-width: 11.5rem;
   }
}

.cta-btn {
   max-width: max-content;
}

/* form */
.form-field.error input {
   border-color: var(--error-color);
}

.form-field.success input {
   /* border-color: var(--success-color); */
   border-color: 1px solid lightgray;
}


.form-field small {
   color: var(--error-color);
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
  appearance: textfield;
}



/* section heading */
.section-heading {
   font-size: clamp(1.75rem, 1.4859rem + 1.1268vw, 2.5rem);
}

/*** Header ***/

.main-heading {
   font-weight: 600;
   font-size: 1.75rem;
   /* font-size: clamp(2rem, 1.6479rem + 1.5023vw, 3rem); */
}

@media (min-width: 768px) {
   .main-heading {
      font-weight: 700;
      font-size: 2rem;
   }
}


@media (min-width: 992px) {
   .main-heading {
      font-size: 2.5rem;
   }
}

@media (min-width: 1400px) {
   .main-heading {
      font-size: 3rem;
   }
}

.hero-grid {
   display: grid;
   grid-template-columns: 1fr;
}

.header {
   background-image: url('./assets/images/hero-bg.jpg');
   background-position: left;
   background-size: cover;
   background-repeat: no-repeat;
   box-shadow: inset 0 0 0 2000px #065f8fa3;
}

.hero-list {
   list-style-type: square;
   list-style-position: inside;
   gap: 1rem;
}

.hero-list li::marker {
   color: var(--clr-dark-red);
}

.hero-list li {
   font-size: clamp(1rem, 0.912rem + 0.3756vw, 1.25rem);
}

.form {
   max-width: 31.25rem;
}

@media (min-width: 992px) {
   .hero-grid {
      grid-template-columns: 1.4fr 1fr;
      align-items: center;
   } 
}


/*** Service ***/
.services-card-grid {
   display: grid;
   grid-template-columns: 1fr;
   gap: 1.5rem;
}

.ribbon {
   position: relative;
}

.service-card h4 {
   font-family: 'Poppins', sans-serif;
   /* font-weight: 700; */
   font-size: clamp(1.25rem, 1.162rem + 0.3756vw, 1.5rem);
}

.service-card p {
   font-size: clamp(1rem, 0.912rem + 0.3756vw, 1.25rem);
}

.service-card .market-price {
   text-decoration: line-through;
}

.ribbon1 {
   position: absolute;
   top: -6.1px;
   right: 10px;
 }
 
 .ribbon1:after {
   position: absolute;
   content: "";
   width: 0;
   height: 0;
   border-left: 5rem solid transparent;
   border-right: 5rem solid transparent;
   border-top: 10px solid var(--clr-dark-red);
 }

 .ribbon1 span {
   position: relative;
   display: block;
   text-align: center;
   background: var(--clr-dark-red);
   line-height: 1.3;
   text-align: center;
   padding: .75rem .5rem .25rem;
   border-top-right-radius: 8px;
   width: 10rem;
 }

 .ribbon1 span:before, .ribbon1 span:after {
   position: absolute;
   content: "";
 }

 .ribbon1 span:before {
  height: 6px;
  width: 6px;
  left: -6px;
  top: 0;
  background: var(--clr-dark-red);
 }

 .ribbon1 span:after {
  height: 6px;
  width: 8px;
  left: -8px;
  top: 0;
  border-radius: 8px 8px 0 0;
  background: var(--clr-dark-red);
 }

@media (min-width: 768px) {
   .services-card-grid {
      grid-template-columns: 1fr 1fr;
      gap: 2rem;
   }
}

/* cta */
.cta-container-blue {
   background-image: url('./assets/images/wave-blue.svg');
   background-position: center;
   background-repeat: no-repeat;
   background-size: cover;
}

/* about */
.prepare-grid {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 1rem;
   place-items: center;
   max-width: 35rem;
}


@media (min-width: 992px) {
   .prepare-grid {
      gap: 2rem;
   }

   .grid-image {
      aspect-ratio: 1;
      object-fit: cover;
      max-width: 17rem;
   }
}

/* details */
.expect-list li span{
   font-weight: 500;
   color: var(--clr-black);
}

/* testimonials */
.testimonial-card .card {
   min-height: 13rem;
}

.testimonial-card .card button,
.user-content p{
   font-size: .875rem;
}

.ratings i{
   color: goldenrod;
}

@media (min-width: 768px) {
   .testimonial-card .card {
      position: relative;
   }
   
}

/* faqs */
.accordion-button {
   font-size: clamp(1rem, 0.956rem + 0.1878vw, 1.125rem);
   padding-block: 1.125rem;
   color: var(--clr-text-black);
}

.accordion-button::after {
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1em' fill='%23000000' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/%3E%3C/svg%3E");
}

.accordion-button:not(.collapsed)::after {
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1em' fill='%23ffffff' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/%3E%3C/svg%3E");

}


/* .accordion-button::after  {
   display: none;
} */

.accordion-button:not(.collapsed) {
   background-color: var(--clr-dark-blue);
   color: var(--clr-white);
}

.accordion-item {
   border-color: var(--clr-dark-blue);
}