/* =========================
HEADER
========================= */

.site-header{
width:100%;
height:88px;
background:#fff;
border-bottom:1px solid #e9eee9;
position:relative;
z-index:9999;
}

.header-inner{
width:calc(100% - 70px);
max-width:1380px;
height:100%;
margin:auto;
display:flex;
align-items:center;
gap:35px;
}

/* LOGO */

.header-logo{
width:205px;
height:72px;
display:flex;
align-items:center;
flex-shrink:0;
}

.header-logo a{
width:100%;
height:100%;
display:flex;
align-items:center;
}

.header-logo img{
display:block;
width:100%;
height:68px;
object-fit:contain;
object-position:left center;
}

/* DESKTOP NAV */

.desktop-nav{
margin-left:auto;
height:100%;
display:flex;
align-items:center;
}

.desktop-nav ul{
height:100%;
display:flex;
align-items:center;
gap:38px;
margin:0;
padding:0;
list-style:none;
}

.desktop-nav li{
height:100%;
display:flex;
align-items:center;
position:relative;
}

.desktop-nav li>a{
height:100%;
display:flex;
align-items:center;
gap:5px;
position:relative;
color:#183c31;
font-size:14px;
font-weight:600;
text-decoration:none;
transition:.3s ease;
}

.desktop-nav li>a:hover,
.desktop-nav li>a.active{
color:#16733f;
}

.desktop-nav li>a.active:after{
content:"";
position:absolute;
left:0;
bottom:22px;
width:100%;
height:2px;
background:#16733f;
border-radius:10px;
}

.nav-dropdown>a span{
font-size:14px;
margin-top:-3px;
}

/* DROPDOWN */

.dropdown-box{
position:absolute;
top:75px;
left:50%;
width:225px;
padding:8px;
background:#fff;
border:1px solid #e5ebe6;
border-radius:10px;
box-shadow:0 18px 45px rgba(0,50,35,.10);
transform:translate(-50%,10px);
opacity:0;
visibility:hidden;
transition:.25s ease;
}

.nav-dropdown:hover .dropdown-box{
opacity:1;
visibility:visible;
transform:translate(-50%,0);
}

.dropdown-box a{
display:block;
padding:11px 13px;
color:#25483c;
font-size:13px;
font-weight:500;
border-radius:6px;
text-decoration:none;
transition:.2s ease;
}

.dropdown-box a:hover{
background:#f0f8e8;
color:#16733f;
}

/* RIGHT AREA */

.header-right{
display:flex;
align-items:center;
gap:18px;
flex-shrink:0;
}

/* CALL */

.call-box{
display:flex;
align-items:center;
gap:9px;
text-decoration:none;
}

.call-icon{
width:36px;
height:36px;
display:flex;
align-items:center;
justify-content:center;
background:#eff8eb;
color:#16733f;
border-radius:50%;
font-size:15px;
}

.call-info{
display:flex;
flex-direction:column;
line-height:1.2;
}

.call-info small{
font-size:9px;
color:#7b857f;
font-weight:500;
}

.call-info strong{
font-size:12px;
color:#173b30;
font-weight:700;
white-space:nowrap;
}

/* CTA */

.header-cta{
height:45px;
padding:0 17px 0 19px;
display:flex;
align-items:center;
justify-content:center;
gap:10px;
background:#16733f;
color:#fff;
border-radius:7px;
font-size:13px;
font-weight:700;
text-decoration:none;
transition:.3s ease;
}

.header-cta span{
width:25px;
height:25px;
display:flex;
align-items:center;
justify-content:center;
background:#c3f34b;
color:#064a32;
border-radius:50%;
font-size:14px;
}

.header-cta:hover{
background:#0b5530;
transform:translateY(-2px);
}

/* MOBILE BUTTON */

.menu-toggle{
display:none;
width:42px;
height:42px;
border:0;
border-radius:7px;
background:#eff8eb;
padding:0;
cursor:pointer;
align-items:center;
justify-content:center;
flex-direction:column;
gap:5px;
}

.menu-toggle span{
display:block;
width:21px;
height:2px;
background:#16733f;
border-radius:5px;
transition:.3s ease;
}

.menu-toggle.open span:nth-child(1){
transform:translateY(7px) rotate(45deg);
}

.menu-toggle.open span:nth-child(2){
opacity:0;
}

.menu-toggle.open span:nth-child(3){
transform:translateY(-7px) rotate(-45deg);
}

/* MOBILE MENU */

.mobile-menu{
display:none;
position:absolute;
top:88px;
left:0;
width:100%;
padding:15px 25px 22px;
background:#fff;
border-top:1px solid #edf0ed;
box-shadow:0 18px 35px rgba(0,0,0,.08);
}

.mobile-menu.show{
display:block;
}

.mobile-menu nav{
display:flex;
flex-direction:column;
}

.mobile-menu nav a{
padding:13px 5px;
border-bottom:1px solid #edf1ed;
color:#183c31;
font-size:14px;
font-weight:600;
text-decoration:none;
}

.mobile-menu nav a:hover{
color:#16733f;
}

.mobile-call{
margin-top:17px;
padding:14px;
display:flex;
align-items:center;
justify-content:space-between;
background:#f3f9ed;
border-radius:8px;
}

.mobile-call div{
display:flex;
flex-direction:column;
}

.mobile-call small{
font-size:10px;
color:#7c857f;
}

.mobile-call strong{
font-size:13px;
color:#173b30;
}

.mobile-call>a{
padding:9px 13px;
background:#16733f;
color:#fff;
border-radius:6px;
font-size:12px;
font-weight:700;
text-decoration:none;
}

.mobile-quote{
height:46px;
margin-top:12px;
display:flex;
align-items:center;
justify-content:center;
gap:10px;
background:#16733f;
color:#fff;
border-radius:7px;
font-size:13px;
font-weight:700;
text-decoration:none;
}

.mobile-quote span{
font-size:17px;
}
/* FAQ RESPONSIVE */

@media (max-width: 1100px) {
    .faq-container {
        width: min(100% - 50px, 950px);
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .faq-left {
        max-width: 700px;
    }

    .faq-image {
        height: 380px;
    }
}

@media (max-width: 768px) {
    .faq-section {
        padding: 70px 0;
    }

    .faq-container {
        width: calc(100% - 30px);
        gap: 35px;
    }

    .faq-left h2 {
        font-size: 38px;
    }

    .faq-image {
        height: 330px;
        border-radius: 18px;
    }

    .faq-contact {
        align-items: flex-start;
    }

    .faq-question {
        min-height: 62px;
        padding: 0 20px;
        font-size: 14px;
    }

    .faq-answer {
        padding: 0 20px 22px;
    }

    .faq-answer p {
        font-size: 13px;
    }
}

@media (max-width: 575px) {
    .faq-section {
        padding: 55px 0;
    }

    .faq-container {
        width: calc(100% - 24px);
    }

    .faq-left h2 {
        font-size: 32px;
        letter-spacing: -1px;
    }

    .faq-image {
        height: 260px;
    }

    .faq-contact {
        flex-direction: column;
        gap: 18px;
    }

    .faq-contact h4 {
        font-size: 17px;
    }

    .faq-btn {
        width: 100%;
    }

    .faq-right {
        gap: 12px;
    }

    .faq-question {
        min-height: 60px;
        padding: 0 16px;
        font-size: 13px;
        line-height: 1.4;
    }

    .faq-answer {
        padding: 0 16px 18px;
    }

    .faq-answer p {
        padding-top: 16px;
        font-size: 13px;
        line-height: 1.6;
    }
}

/* TESTIMONIAL RESPONSIVE */

@media (max-width: 1100px) {

    .testimonial-container {
        width: min(100% - 50px, 900px);
        grid-template-columns: 1fr 1fr;
    }

    .testimonial-intro {
        min-height: 400px;
    }

    .testimonial-slider {
        min-height: 400px;
    }

    .testimonial-services {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }

    .service-mini {
        min-height: 85px;
    }

}

@media (max-width: 768px) {

    .testimonial-section {
        padding: 70px 0;
    }

    .testimonial-container {
        width: calc(100% - 30px);
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .testimonial-intro {
        min-height: 370px;
        padding: 35px 30px;
    }

    .testimonial-intro h2 {
        font-size: 40px;
    }

    .testimonial-rating strong {
        font-size: 60px;
    }

    .testimonial-slider {
        min-height: 400px;
    }

    .testimonial-slide {
        padding: 30px;
    }

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

    .testimonial-services {
        grid-column: auto;
    }

}

@media (max-width: 575px) {

    .testimonial-section {
        padding: 55px 0;
    }

    .testimonial-container {
        width: calc(100% - 24px);
    }

    .testimonial-intro {
        min-height: 330px;
        padding: 28px 25px;
    }

    .testimonial-intro h2 {
        font-size: 34px;
    }

    .testimonial-rating {
        gap: 20px;
    }

    .testimonial-rating strong {
        font-size: 52px;
    }

    .testimonial-rating p {
        font-size: 11px;
    }

    .testimonial-slider {
        min-height: 430px;
    }

    .testimonial-slide {
        padding: 25px;
    }

    .testimonial-content p {
        font-size: 14px;
        line-height: 1.7;
    }

    .testimonial-bottom h4 {
        font-size: 13px;
    }

    .quote-mark {
        font-size: 75px;
    }

    .testimonial-services {
        display: flex;
        gap: 10px;
    }

    .service-mini {
        min-height: 75px;
        padding: 15px;
    }

}

/* HOW IT WORKS RESPONSIVE */

@media (max-width: 1100px) {

    .how-work-container {
        width: min(100% - 50px, 950px);
    }

    .how-work-heading h2 {
        font-size: 42px;
    }

    .process-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .process-card:last-child {
        grid-column: 1 / -1;
    }

}

@media (max-width: 768px) {

    .how-work-section {
        padding: 70px 0;
    }

    .how-work-container {
        width: calc(100% - 30px);
    }

    .how-work-heading {
        margin-bottom: 40px;
    }

    .how-work-heading h2 {
        font-size: 36px;
        letter-spacing: -1px;
    }

    .process-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .process-card:last-child {
        grid-column: auto;
    }

    .process-card {
        min-height: 280px;
        padding: 32px 24px;
    }

}

@media (max-width: 575px) {

    .how-work-section {
        padding: 55px 0;
    }

    .how-work-container {
        width: calc(100% - 24px);
    }

    .how-work-heading {
        margin-bottom: 32px;
    }

    .how-work-heading h2 {
        font-size: 30px;
        line-height: 1.2;
    }

    .process-card {
        min-height: 260px;
        padding: 28px 22px;
        border-radius: 17px;
    }

    .process-number {
        width: 58px;
        height: 58px;
        margin-bottom: 24px;
        font-size: 17px;
    }

    .process-icon {
        top: 27px;
        right: 20px;
        font-size: 48px;
    }

    .process-card h3 {
        font-size: 20px;
        margin-bottom: 13px;
    }

    .process-card p {
        font-size: 14px;
        line-height: 1.65;
    }

}
/* =========================
   EXPERTISE RESPONSIVE
========================= */

@media(max-width:1100px){

.expertise-container{
    width:min(100% - 50px,950px);
}

.expertise-top{
    grid-template-columns:1fr 1fr;
    gap:35px;
}

.expertise-heading h2{
    font-size:42px;
}

.specialization-grid{
    grid-template-columns:repeat(2,1fr);
}

.preservation-banner{
    grid-template-columns:auto 1fr;
}

.preservation-banner p{
    grid-column:2;
}

}


@media(max-width:800px){

.expertise-section{
    padding:75px 0;
}

.expertise-container{
    width:calc(100% - 30px);
}

.expertise-top{
    grid-template-columns:1fr;
    gap:35px;
    margin-bottom:60px;
}

.expertise-heading h2{
    font-size:40px;
}

.research-card{
    min-height:350px;
}

.specialization-title{
    display:block;
}

.specialization-title>p{
    margin-top:18px;
}

}


@media(max-width:600px){

.expertise-section{
    padding:60px 0;
}

.expertise-container{
    width:calc(100% - 24px);
}

.expertise-heading h2{
    margin-top:20px;
    font-size:32px;
    letter-spacing:-1px;
}

.expertise-heading>p{
    font-size:14px;
    line-height:1.7;
}

.research-card{
    min-height:350px;
    padding:27px;
    border-radius:19px;
}

.research-card h3{
    font-size:24px;
}

.specialization-title h3{
    font-size:30px;
}

.specialization-grid{
    grid-template-columns:1fr;
    gap:12px;
}

.specialization-card{
    min-height:195px;
}

.preservation-banner{
    display:block;
    padding:25px;
}

.preservation-icon{
    margin-bottom:18px;
}

.preservation-banner h3{
    font-size:19px;
}

.preservation-banner p{
    margin-top:15px;
}

}


@media(max-width:380px){

.expertise-heading h2{
    font-size:29px;
}

.research-card h3{
    font-size:22px;
}

.specialization-title h3{
    font-size:27px;
}

}
@media(max-width:1100px){

    .hero-slider{
        height:620px;
    }

    .hero-container{
        width:min(100% - 50px,950px);
    }

    .hero-content h1{
        font-size:50px;
    }

    .hero-content p{
        max-width:570px;
    }

    .hero-feature{
        padding:18px;
        gap:12px;
    }

    .feature-icon{
        width:45px;
        height:45px;
        min-width:45px;
    }

}


@media(max-width:800px){

    .hero-slider{
        height:650px;
    }

    .hero-container{
        width:calc(100% - 30px);
    }

    .hero-overlay{
        background:
            linear-gradient(
                90deg,
                rgba(0,58,45,.94),
                rgba(0,65,50,.72)
            );
    }

    .hero-content{
        max-width:650px;
    }

    .hero-content h1{
        font-size:44px;
        letter-spacing:-1.5px;
    }

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

    .hero-bottom{
        grid-template-columns:repeat(2,1fr);
    }

    .hero-feature{
        min-height:90px;
        border-bottom:1px solid #e4e8e2;
    }

    .hero-feature:nth-child(2){
        border-right:0;
    }

    .hero-feature:nth-child(3){
        border-bottom:0;
    }

    .hero-feature:nth-child(4){
        border-right:0;
        border-bottom:0;
    }

    .hero-dots{
        right:20px;
    }

}


@media(max-width:600px){

    .hero-slider{
        height:590px;
    }

    .hero-container{
        width:calc(100% - 24px);
    }

    .hero-content h1{
        font-size:36px;
        line-height:1.12;
    }

    .hero-content p{
        font-size:13px;
        line-height:1.7;
        margin-bottom:25px;
    }

    .hero-tag{
        font-size:9px;
        padding:8px 12px;
    }

    .hero-actions{
        flex-wrap:wrap;
        gap:18px;
    }

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

    .hero-feature{
        min-height:78px;
        padding:15px 18px;
        border-right:0 !important;
        border-bottom:1px solid #e4e8e2 !important;
    }

    .hero-feature:last-child{
        border-bottom:0 !important;
    }

    .feature-icon{
        width:40px;
        height:40px;
        min-width:40px;
    }

    .hero-dots{
        top:auto;
        bottom:125px;
        right:18px;
        transform:none;
        flex-direction:row;
    }

    .hero-dot.active{
        width:28px;
        height:8px;
    }

}


@media(max-width:380px){

    .hero-slider{
        height:570px;
    }

    .hero-content h1{
        font-size:32px;
    }

    .hero-content p{
        font-size:12px;
    }

}

/* =========================
   FOOTER RESPONSIVE
========================= */

@media(max-width:1100px){

    .footer-container{
        width:min(100% - 50px,950px);
    }

    .footer-main{
        grid-template-columns:1.2fr 1fr;
        gap:45px;
    }

}


@media(max-width:700px){

    .site-footer{
        padding-top:40px;
    }

    .footer-container{
        width:calc(100% - 30px);
    }

    .footer-top{
        align-items:flex-start;
        gap:20px;
    }

    .footer-brand{
        font-size:21px;
    }

    .footer-logo{
        width:43px;
        height:43px;
    }

    .footer-socials{
        gap:6px;
    }

    .footer-socials a{
        width:36px;
        height:36px;
        font-size:13px;
    }

    .footer-main{
        grid-template-columns:1fr;
        gap:35px;
        padding:40px 0;
    }

    .footer-column h3{
        margin-bottom:17px;
        font-size:17px;
    }

    .footer-about p{
        max-width:100%;
    }

    .footer-bottom{
        padding:20px 0;
        flex-direction:column;
        align-items:flex-start;
        gap:12px;
    }

}


@media(max-width:450px){

    .footer-container{
        width:calc(100% - 24px);
    }

    .footer-top{
        flex-direction:column;
    }

    .footer-socials{
        margin-top:4px;
    }

    .footer-main{
        padding-bottom:30px;
    }

    .footer-bottom-links{
        flex-direction:column;
        gap:8px;
    }

}

/* =========================================
   GEL TREATMENT RESPONSIVE
========================================= */

@media (max-width: 1150px) {

    .gel-treatment-container {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .gel-treatment-content {
        max-width: 950px;
        margin: 0 auto;
    }

    .gel-treatment-visual {
        max-width: 650px;
        width: 100%;
        margin: 0 auto;
    }

    .gel-image-wrap {
        height: 550px;
    }

}


@media (max-width: 800px) {

    .gel-treatment-section {
        padding: 70px 0 55px;
    }

    .gel-treatment-container,
    .gel-bottom-message {
        width: calc(100% - 35px);
    }

    .gel-treatment-content h2 {
        font-size: 55px;
        letter-spacing: -2px;
    }

    .gel-treatment-content h3 {
        font-size: 27px;
    }

    .gel-pests {
        grid-template-columns: repeat(5, 1fr);
        gap: 6px;
    }

    .gel-pest-card {
        padding: 7px 4px 10px;
    }

    .gel-pest-image {
        height: 60px;
    }

    .gel-pest-card h4 {
        font-size: 10px;
    }

    .gel-benefits {
        grid-template-columns: repeat(2, 1fr);
    }

    .gel-benefit {
        padding: 16px 10px 16px 0;
    }

    .gel-benefit:nth-child(2) {
        border-right: 0;
    }

    .gel-benefit:nth-child(3),
    .gel-benefit:nth-child(4) {
        border-top: 1px solid rgba(0,77,59,.12);
    }

    .gel-benefit:nth-child(3) {
        border-right: 1px solid rgba(0,77,59,.12);
    }

    .gel-cta-row {
        flex-wrap: wrap;
    }

    .gel-image-wrap {
        height: 500px;
    }

    .gel-bottom-message {
        padding: 15px 20px;
    }

}


@media (max-width: 550px) {

    .gel-treatment-section {
        padding: 55px 0 45px;
    }

    .gel-treatment-container,
    .gel-bottom-message {
        width: calc(100% - 24px);
    }

    .gel-section-tag {
        font-size: 10px;
        padding: 9px 13px;
    }

    .gel-treatment-content h2 {
        margin-top: 17px;
        font-size: 46px;
    }

    .gel-treatment-content h3 {
        font-size: 23px;
        line-height: 1.2;
    }

    .gel-badge {
        font-size: 12px;
        padding: 10px 14px;
    }

    .gel-intro {
        font-size: 13px;
    }

    .gel-pests {
        grid-template-columns: repeat(2, 1fr);
        gap: 9px;
    }

    .gel-pest-card:last-child {
        grid-column: span 2;
    }

    .gel-pest-image {
        height: 85px;
    }

    .gel-pest-card h4 {
        font-size: 12px;
    }

    .gel-benefits {
        grid-template-columns: 1fr;
    }

    .gel-benefit,
    .gel-benefit:nth-child(3),
    .gel-benefit:nth-child(4) {
        border-right: 0;
        border-top: 0;
        border-bottom: 1px solid rgba(0,77,59,.12);
    }

    .gel-benefit:last-child {
        border-bottom: 0;
    }

    .gel-cta-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 18px;
    }

    .gel-image-wrap {
        height: 450px;
        border-radius: 22px;
    }

    .gel-floating-badge {
        width: 100px;
        height: 100px;
        top: 18px;
        right: 18px;
    }

    .gel-image-caption {
        left: 12px;
        right: 12px;
        bottom: 12px;
        padding: 18px;
    }

    .gel-image-caption strong {
        font-size: 18px;
    }

    .gel-bottom-message {
        flex-wrap: wrap;
        gap: 12px;
        padding: 17px;
    }

    .gel-bottom-message p {
        font-size: 12px;
    }

}
/* =========================================
   CONTACT RESPONSIVE
========================================= */

@media (max-width: 1100px) {

    .contact-hero-container {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .contact-hero {
        padding: 90px 0;
    }

    .contact-hero-card {
        max-width: 500px;
    }

    .contact-info-grid {
        grid-template-columns: 1fr;
    }

    .contact-form-container {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .contact-form-intro {
        max-width: 700px;
    }

    .contact-bottom-container {
        grid-template-columns: 1fr;
    }

}


@media (max-width: 800px) {

    .contact-hero-container,
    .contact-section-container,
    .contact-form-container,
    .contact-bottom-container {
        width: calc(100% - 35px);
    }

    .contact-hero {
        min-height: auto;
        padding: 75px 0;
    }

    .contact-hero h1 {
        font-size: 54px;
    }

    .contact-hero-actions {
        flex-wrap: wrap;
    }

    .contact-info-section,
    .contact-form-section {
        padding: 70px 0;
    }

    .contact-form-box {
        padding: 25px;
    }

}


@media (max-width: 550px) {

    .contact-hero-container,
    .contact-section-container,
    .contact-form-container,
    .contact-bottom-container {
        width: calc(100% - 24px);
    }

    .contact-hero {
        padding: 55px 0;
        background-position: 65% center;
    }

    .contact-hero h1 {
        margin-top: 18px;
        font-size: 43px;
        letter-spacing: -1.5px;
    }

    .contact-hero p {
        font-size: 13px;
    }

    .contact-hero-actions {
        flex-direction: column;
        align-items: flex-start;
    }

    .contact-hero-card {
        padding: 25px;
        border-radius: 20px;
    }

    .contact-hero-card strong {
        font-size: 24px;
    }

    .contact-heading h2,
    .contact-form-intro h2 {
        font-size: 42px;
    }

    .contact-info-card {
        padding: 18px;
    }

    .contact-info-icon {
        flex-basis: 45px;
        width: 45px;
        height: 45px;
    }

    .contact-info-card h3 {
        font-size: 13px;
    }

    .contact-form-box {
        padding: 20px;
        border-radius: 18px;
    }

    .form-row {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .contact-bottom-section {
        padding: 50px 0;
    }

    .contact-bottom-container h2 {
        font-size: 32px;
    }

    .contact-primary-btn {
        font-size: 12px;
    }

}

/* =========================================
   ABOUT RESPONSIVE
========================================= */

@media (max-width: 1100px) {

    .about-hero-container {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .about-hero {
        padding: 85px 0;
    }

    .about-hero-card {
        max-width: 520px;
    }

    .about-story .about-container {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .about-story-image {
        max-width: 650px;
    }

    .approach-grid,
    .why-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .about-specialization .about-container {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .specialization-left {
        position: static;
    }

}


@media (max-width: 800px) {

    .about-container,
    .about-hero-container,
    .about-final-container {
        width: calc(100% - 35px);
    }

    .about-hero {
        min-height: auto;
        padding: 70px 0;
    }

    .about-hero h1 {
        font-size: 55px;
    }

    .about-story,
    .about-approach,
    .about-specialization,
    .about-why {
        padding: 75px 0;
    }

    .about-story-image img {
        height: 450px;
    }

    .mission-grid {
        grid-template-columns: 1fr;
    }

    .about-final-container {
        flex-direction: column;
        align-items: flex-start;
    }

}


@media (max-width: 550px) {

    .about-container,
    .about-hero-container,
    .about-final-container {
        width: calc(100% - 24px);
    }

    .about-hero {
        padding: 55px 0;
    }

    .about-hero h1 {
        font-size: 43px;
        letter-spacing: -1.5px;
    }

    .about-hero-content > p {
        font-size: 13px;
    }

    .about-hero-buttons {
        flex-direction: column;
        align-items: flex-start;
    }

    .about-hero-card {
        padding: 25px;
    }

    .about-hero-card h3 {
        font-size: 24px;
    }

    .about-story-image img {
        height: 380px;
        border-radius: 20px;
    }

    .about-experience-card {
        right: 12px;
        bottom: 12px;
    }

    .about-story-content h2,
    .about-section-heading h2,
    .specialization-left h2 {
        font-size: 42px;
    }

    .approach-grid,
    .why-grid {
        grid-template-columns: 1fr;
    }

    .approach-card {
        min-height: auto;
    }

    .specialization-item {
        grid-template-columns: 35px 1fr 30px;
        padding: 20px 16px;
    }

    .specialization-item:hover {
        padding-left: 20px;
    }

    .specialization-item strong {
        font-size: 12px;
    }

    .specialization-item small {
        font-size: 9px;
    }

    .mission-card {
        padding: 30px 25px;
    }

    .mission-card h3 {
        font-size: 25px;
    }

    .about-final-cta {
        padding: 65px 0;
    }

    .about-final-container h2 {
        font-size: 40px;
    }

}

/* =====================================================
   SERVICES RESPONSIVE
===================================================== */

@media (max-width: 1100px) {

    .services-page .container {
        width: min(94%, 1100px);
    }

    .gel-grid {
        gap: 45px;
    }

    .pest-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .preservation-grid {
        gap: 50px;
    }

}


/* ================= TABLET ================= */

@media (max-width: 900px) {

    .services-hero {
        min-height: 520px;
    }

    .services-hero-content {
        padding: 70px 20px;
    }

    .services-hero h1 {
        font-size: 58px;
    }

    .gel-section,
    .pests-section,
    .preservation-section,
    .why-gel-section {
        padding: 80px 0;
    }

    .gel-grid {
        grid-template-columns: 1fr;
    }

    .gel-visual {
        min-height: 480px;
    }

    .pest-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .preservation-grid {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .why-gel-box {
        grid-template-columns: 1fr;
        padding: 50px;
        gap: 35px;
    }

}


/* ================= MOBILE ================= */

@media (max-width: 600px) {

    .services-page .container {
        width: calc(100% - 30px);
    }

    .services-hero {
        min-height: 520px;
        border-radius: 0 0 25px 25px;

        background:
            linear-gradient(
                180deg,
                rgba(0,72,56,.95),
                rgba(0,72,56,.88)
            ),
            url("images/services-hero.jpg") center/cover no-repeat;
    }

    .services-hero-content {
        padding: 60px 0;
    }

    .services-hero h1 {
        margin-top: 22px;
        font-size: 43px;
        letter-spacing: -1.5px;
    }

    .services-hero p {
        font-size: 15px;
        line-height: 1.6;
    }


    .gel-section,
    .pests-section,
    .preservation-section,
    .why-gel-section {
        padding: 65px 0;
    }

    .gel-content h2 {
        font-size: 43px;
    }

    .gel-lead {
        font-size: 17px !important;
    }

    .gel-features {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .gel-visual {
        min-height: 390px;
    }

    .gel-circle {
        width: 250px;
        height: 250px;
    }

    .gel-card {
        width: 270px;
        min-height: 350px;
        padding: 40px 30px;
    }

    .gel-card h3 {
        margin-top: 45px;
        font-size: 62px;
    }


    .center-heading {
        margin-bottom: 40px;
    }

    .center-heading h2 {
        font-size: 39px;
    }

    .pest-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .pest-card {
        min-height: 350px;
    }


    .preservation-heading h2 {
        font-size: 43px;
    }

    .protection-list {
        grid-template-columns: 1fr;
    }


    .why-gel-box {
        padding: 38px 25px;
        border-radius: 25px;
    }

    .why-gel-content h2 {
        font-size: 40px;
    }


    .services-cta {
        padding: 80px 20px;
    }

    .services-cta h2 {
        font-size: 42px;
    }

}