.green-color{
    color:#0a8709;
}
.consult_button {
    background-color: #0a8709;
    color: white;
}
.navbar-icons a{
    outline: none;
}
.ul-menu .nav-link {
    font-size: 1.2rem;
}
.ul-menu .nav-link:hover{
    color: #0a8709;
    font-weight: bold;
}
.phone-link {
    font-size: 1.9rem !important;
}
.logo-consult{
    font-size: 1.7rem !important;
}
.ul-menu .nav-link{
    font-size: 1.9rem !important;
}
.service-card h3{
    font-size: 1.9rem !important;
}
.service-card p{
    font-size: 1.5rem !important;
}
@media (min-width: 992px) {
    .phone-link {
      font-size: 1.25rem !important;
    }
    .logo-consult{
        font-size: 1.25rem !important;
    }
    .ul-menu .nav-link{
        font-size: 1.2rem !important;
    }
    .service-card h3{
        font-size: 1.2rem !important;
    }
    .service-card p{
        font-size: 1.1rem !important;
    }
    
}  
.banner-section {
    background: linear-gradient(to right, rgba(255,255,255,0.9) 30%, rgba(255,255,255,0.3)), 
                url('images/starter.png') no-repeat right center;
    background-size: cover;
    min-height: 600px;
    display: flex;
    align-items: center;
    padding: 0 5%;
    position: relative;
}
.banner-section h1{
    color: #0a8709;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.1);
    line-height: 1.2;
}
.banner-section h2{
    color: #333;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.1);
    line-height: 1.2;
}
.banner-section a{
    font-size: 1.2rem;
    background-color: #0a8709;
    color: white;
    font-weight: 600;
    border-radius: 50px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}
.banner-logo{
    height: 60px;
}
 .icon-circle {
    width: 70px;
    height: 70px;
    background-color: rgba(10,135,9, 0.1);
    color: #0a8709;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .icon-circle i {
    font-size: 2rem;
  }
  @media (max-width: 575.98px) {
    .icon-circle {
      width: 80px;
      height: 80px;
      margin-right: 1rem !important;
    }
    
    .icon-circle{
      font-size: 2.6rem;
    }
  }
  @media (min-width: 576px) and (max-width: 767.98px) {
    .icon-circle {
      width: 65px;
      height: 65px;
    } 
    .icon-circle i {
      font-size: 1.8rem;
    }
  }
  @media (min-width: 992px) {
    .icon-circle {
      width: 60px;
      height: 60px;
    }
    
    .icon-circle i {
      font-size: 1.5rem;
    }
  }
.price-section{
    background: linear-gradient(135deg, #e8f5e9, #c8e6c9)
}
.price-section h2{
    color:#0a8709;
}
.price-section h3{
    font-size: 2rem !important;
}
.price-section h5{
    font-size: 1.8rem !important;
}
.price-section p{
    font-size: 1.7rem !important;
}
.price-section button{
    font-size: 1.8rem !important;
}
.price-section a{
    font-size: 1.8rem !important;
}
.modal-body label{
    font-size: 1.8rem !important;
}
.modal-body input{
    font-size: 1.6rem !important;
}
.conf-policy a{
    font-size: 1.4rem !important;
}
.btn-close{
    box-shadow: none !important;
    outline: 0 !important;
}
@media (max-width: 992px) {
    .modal{
        --bs-modal-width:90%;
    } 
}    
@media (min-width: 992px) {
    .price-section h3{
        font-size: 1.3rem !important;
    }
    .price-section h5{
        font-size: 1.2rem !important;
    }
    .price-section p{
        font-size: 1.2rem !important;
    }
    .price-section button{
        font-size: 1.2rem !important;
    }
    .price-section a{
        font-size: 1.2rem !important;
    }
    .modal-body label{
        font-size: 1.2rem !important;
    }
    .conf-policy a{
        font-size: 1rem !important;
    }
    .modal-body input{
        font-size: 1.2rem !important;
    }
}
.green-timeline {
    position: relative;
    max-width: 800px;
    margin: 0 auto;
    padding-left: 50px;
}
.green-timeline::before {
    content: '';
    position: absolute;
    left: 25px;
    top: 0;
    height: 90%;
    width: 4px;
    background: linear-gradient(to bottom, #2e7d32, #81c784);
}
.timeline-item {
    position: relative;
    margin-bottom: 30px;
}
.timeline-number {
    position: absolute;
    left: -50px;
    top: 0;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: bold;
    z-index: 1;
}
.timeline-content {
    position: relative;
    border-left: 3px solid #4caf50 !important;
    transition: all 0.3s ease;
}
.timeline-content:hover {
    transform: translateX(10px);
    box-shadow: 0 10px 20px rgba(76, 175, 80, 0.1) !important;
}
@media (max-width: 768px) {
    .green-timeline {
    padding-left: 30px;
    }
    .timeline-number {
    left: -30px;
    width: 40px;
    height: 40px;
    font-size: 1.2rem;
    }
}
.icon-box {
    display: flex;
    align-items: center;
    justify-content: center;
}
.card {
    transition: transform 0.3s, box-shadow 0.3s;
    border-radius: 12px !important;
}
.card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 30px rgba(0,100,0,0.1) !important;
}
.consultation-form {
    transition: transform 0.3s ease;
}
.consultation-form:hover {
    transform: translateY(-5px);
}
.input-group-text {
    width: 50px;
    justify-content: center;
}
message-bubble {
    max-width: 80%;
    position: relative;
}
.client-message .message-bubble {
    background: linear-gradient(135deg, #2e7d32, #4caf50);
}
.company-message .message-bubble {
    box-shadow: 0 3px 10px rgba(0,0,0,0.05);
}
@media (max-width: 768px) {
    .message-bubble {
    max-width: 90%;
    }
}
.accordion-button:not(.collapsed) {
    background-color: rgba(46, 125, 50, 0.15);
}
.accordion-button:focus {
    box-shadow: 0 0 0 0.25rem rgba(46, 125, 50, 0.25);
}
.accordion-body {
    border-left: 3px solid #4caf50;
}
.contact-icon {
    width: 3.5rem;
    height: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50% !important;
}
footer a {
    transition: white 0.2s ease;
}
footer a:hover {
    color: #4caf50 !important;
}
footer {
    color: white;
}
.social-links a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: rgba(255,255,255,0.1);
    border-radius: 50%;
    transition: all 0.3s ease;
}
.social-links a:hover {
    transform: translateY(-2px);
}
.form-control:focus {
    box-shadow: none;
    outline: 0;
}