

.service-background-section {
   position: relative;
   overflow: hidden;
   background-image: var(--service-bg-image);
   background-size: cover;
   background-position: center center;
   background-repeat: no-repeat;
}

/* Imagen de fondo al 40% */
.service-background-section::before {
   content: "";
   position: absolute;
   inset: 0;
   background-image: var(--service-bg-image);
   background-size: cover;
   background-position: center center;
   background-repeat: no-repeat;
   opacity: 0.40;
   z-index: 0;
}

/* Capa para mejorar la lectura del contenido */
.service-bg-overlay {
   position: absolute;
   inset: 0;
   background: rgba(0, 0, 0, 0.597);
   z-index: 1;
}

/* El contenido queda encima del background */
.service-background-section .small-container {
   position: relative;
   z-index: 2;
}

/* Evita que los elementos decorativos antiguos aparezcan */
.service-background-section .bg-image,
.service-background-section .bg-shape-1,
.service-background-section .bg-shape-2,
.service-background-section .tab-bg-shape {
   display: none !important;
}



/* ==========================================
   MAIN SECTION
========================================== */

.professional-choose-section {

   background: #ffffff !important;

   position: relative;

   overflow: hidden;

}


/* Remove old template shapes */

.professional-choose-section > .shape-1,
.professional-choose-section .choose-3-image-area > .shape-1 {

   display: none !important;

}


/* ==========================================
   DECORATIVE WORKERS SILHOUETTE
========================================== */

.landscaping-workers-decoration {

   position: absolute;

   right: -40px;

   bottom: -10px;

   width: 520px;

   max-width: 40%;

   opacity: 0.055;

   pointer-events: none;

   z-index: 0;

}

.landscaping-workers-decoration img {

   width: 100%;

   height: auto;

   display: block;

}


/* ==========================================
   IMAGE AREA
========================================== */

.professional-image-area {

   padding: 20px 45px 20px 0;

   position: relative;

   z-index: 2;

}


/* Decorative border behind image */

.image-accent-shape {

   position: absolute;

   width: 82%;

   height: 88%;

   left: -15px;

   top: 45px;

   border: 2px solid #3abad7;

   border-radius: 18px;

   opacity: 0.35;

   z-index: 0;

}


/* Main image */

.professional-main-image {

   position: relative;

   z-index: 2;

   margin: 0;

   overflow: hidden;

   border-radius: 18px;

   box-shadow: 0 20px 50px rgba(0, 0, 0, 0.14);

}


.professional-main-image img {

   width: 100%;

   height: auto;

   display: block;

   border-radius: 18px;

   transition: transform 0.5s ease;

}


/* Image hover */

.professional-main-image:hover img {

   transform: scale(1.035);

}


/* ==========================================
   EXPERIENCE BADGE
========================================== */

.experience-badge {

   position: absolute;

   right: 15px;

   bottom: 35px;

   z-index: 5;

   background: #ffffff;

   border-radius: 12px;

   padding: 17px 22px;

   display: flex;

   align-items: center;

   gap: 12px;

   box-shadow: 0 12px 35px rgba(0, 0, 0, 0.15);

}


.experience-number {

   font-size: 34px;

   line-height: 1;

   font-weight: 800;

   color: #3abad7;

}


.experience-text {

   font-size: 13px;

   line-height: 1.3;

   font-weight: 600;

   color: #222222;

}


/* ==========================================
   CONTENT
========================================== */

.professional-content-area {

   position: relative;

   z-index: 2;

}


/* Subtitle */

.professional-sub-title {

   color: #050505 !important;

   font-weight: 700;

   letter-spacing: 1.5px;

   position: relative;

   padding-left: 42px;

}


.professional-sub-title::before {

   content: "";

   position: absolute;

   left: 0;

   top: 50%;

   width: 30px;

   height: 2px;

   background: #3abad7;

   transform: translateY(-50%);

}


/* Main title */

.professional-content-area .section-title {

   color: #1b1b1b;

   max-width: 600px;

   font-weight: 700;

}


/* Description */

.professional-description {

   color: #555555;

   font-size: 16px;

   line-height: 1.8;

   text-align: justify;

   max-width: 680px;

   margin-bottom: 12px;

}


/* ==========================================
   FEATURE BOXES
========================================== */

.professional-feature-box {

   display: flex;

   align-items: flex-start;

   gap: 15px;

   padding: 20px 15px;

   background: #ffffff;

   border: 1px solid #eeeeee;

   border-radius: 10px;

   transition: all 0.3s ease;

   height: 100%;

}


.professional-feature-box:hover {

   transform: translateY(-5px);

   box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);

   border-color: rgba(58, 186, 215, 0.35);

}


/* Feature icon */

.professional-icon-box {

   min-width: 52px;

   width: 52px;

   height: 52px;

   display: flex;

   align-items: center;

   justify-content: center;

   background: rgba(58, 186, 215, 0.10);

   border-radius: 50%;

}


.professional-icon-box i {

   color: #3abad7;

   font-size: 25px;

}


/* Feature title */

.professional-feature-content h5 {

   margin: 0 0 6px;

}


.professional-feature-content h5 a {

   color: #222222;

   font-size: 17px;

   font-weight: 700;

}


.professional-feature-content h5 a:hover {

   color: #3abad7;

}


/* Feature description */

.professional-feature-content p {

   margin: 0;

   color: #777777;

   font-size: 13px;

   line-height: 1.6;

}


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

@media (max-width: 1199px) {

   .professional-image-area {

      padding-right: 20px;

   }

   .landscaping-workers-decoration {

      width: 400px;

   }

}


@media (max-width: 991px) {

   .professional-image-area {

      padding: 20px;

      margin-bottom: 40px;

   }

   .image-accent-shape {

      left: 5px;

      width: 85%;

   }

   .professional-content-area {

      padding-left: 20px !important;

      padding-right: 20px;

   }

   .landscaping-workers-decoration {

      width: 350px;

      opacity: 0.04;

   }

}


@media (max-width: 767px) {

   .professional-image-area {

      padding: 10px;

   }

   .experience-badge {

      right: 5px;

      bottom: 20px;

      padding: 12px 15px;

   }

   .experience-number {

      font-size: 28px;

   }

   .experience-text {

      font-size: 11px;

   }

   .professional-description {

      text-align: left;

   }

   .landscaping-workers-decoration {

      width: 300px;

      max-width: 70%;

      right: -70px;

      bottom: 0;

   }

}
/* =========================================
   TREE MENDOZA SERVICES - MODERN PRELOADER
========================================= */

#preloader.tree-preloader {
   position: fixed;
   inset: 0;
   width: 100%;
   height: 100vh;
   z-index: 999999;
   background: #ffffff;
   display: flex;
   align-items: center;
   justify-content: center;
   overflow: hidden;
   transition: opacity .8s ease, visibility .8s ease;
}

/* Content */
.tree-loader-content {
   position: relative;
   z-index: 5;
   text-align: center;
   display: flex;
   flex-direction: column;
   align-items: center;
}

/* Tree icon */
.tree-loader-icon {
   position: relative;
   width: 100px;
   height: 115px;
   margin-bottom: 18px;
   animation: treeFloat 3s ease-in-out infinite;
}

/* Trunk */
.tree-trunk {
   position: absolute;
   width: 13px;
   height: 62px;
   left: 50%;
   bottom: 3px;
   transform: translateX(-50%);
   background: linear-gradient(
      90deg,
      #5c371f,
      #8a5a35,
      #4d2d1a
   );
   border-radius: 8px 8px 4px 4px;
   transform-origin: bottom;
   animation: trunkGrow 1.3s cubic-bezier(.65,0,.35,1) forwards;
}

/* Tree branches */
.tree-trunk::before,
.tree-trunk::after {
   content: "";
   position: absolute;
   background: #654027;
   height: 7px;
   border-radius: 10px;
   transform-origin: left center;
}

.tree-trunk::before {
   width: 34px;
   left: 4px;
   top: 15px;
   transform: rotate(-38deg);
}

.tree-trunk::after {
   width: 30px;
   right: 4px;
   top: 25px;
   transform: rotate(38deg);
}

/* Leaves */
.tree-leaf {
   position: absolute;
   width: 29px;
   height: 29px;
   border-radius: 50% 50% 50% 10%;
   background: linear-gradient(
      135deg,
      #49a942,
      #197c36
   );
   opacity: 0;
   transform: scale(0) rotate(20deg);
   animation: leafAppear .7s cubic-bezier(.34,1.56,.64,1) forwards;
}

/* Individual leaves */
.leaf-1 {
   top: 3px;
   left: 35px;
   animation-delay: .25s;
}

.leaf-2 {
   top: 16px;
   left: 10px;
   animation-delay: .4s;
}

.leaf-3 {
   top: 17px;
   right: 9px;
   animation-delay: .5s;
}

.leaf-4 {
   top: 38px;
   left: 2px;
   animation-delay: .65s;
}

.leaf-5 {
   top: 36px;
   right: 2px;
   animation-delay: .75s;
}

.leaf-6 {
   top: 42px;
   left: 36px;
   animation-delay: .85s;
}

.leaf-7 {
   top: 12px;
   left: 36px;
   width: 25px;
   height: 25px;
   background: linear-gradient(
      135deg,
      #62b94e,
      #248a3d
   );
   animation-delay: 1s;
}

/* Brand */
.tree-loader-brand {
   display: flex;
   flex-direction: column;
   align-items: center;
   letter-spacing: 3px;
}

.tree-loader-brand span {
   font-family: Arial, sans-serif;
   font-size: 19px;
   font-weight: 800;
   color: #1b3524;
}

.tree-loader-brand small {
   margin-top: 4px;
   font-size: 10px;
   font-weight: 700;
   letter-spacing: 5px;
   color: #3c963e;
}

/* Loading line */
.tree-loader-line {
   width: 150px;
   height: 3px;
   margin-top: 22px;
   overflow: hidden;
   background: #e8eee8;
   border-radius: 50px;
}

.tree-loader-line span {
   display: block;
   width: 45%;
   height: 100%;
   background: linear-gradient(
      90deg,
      #287b36,
      #61b946
   );
   border-radius: inherit;
   animation: loadingLine 1.5s ease-in-out infinite;
}

/* Text */
.tree-loader-text {
   margin: 12px 0 0;
   font-family: Arial, sans-serif;
   font-size: 11px;
   color: #8a948b;
   letter-spacing: 1.5px;
   animation: textPulse 1.8s ease-in-out infinite;
}

/* Floating particles */
.loader-leaf-float {
   position: absolute;
   font-size: 18px;
   color: #4ba842;
   opacity: .15;
}

.float-1 {
   top: 28%;
   left: 25%;
   animation: floatingLeaf 5s ease-in-out infinite;
}

.float-2 {
   top: 65%;
   right: 27%;
   font-size: 14px;
   animation: floatingLeaf 6s ease-in-out infinite reverse;
}

.float-3 {
   top: 35%;
   right: 23%;
   font-size: 11px;
   animation: floatingLeaf 4s ease-in-out infinite;
}

/* =========================================
   ANIMATIONS
========================================= */

@keyframes trunkGrow {
   0% {
      transform: translateX(-50%) scaleY(0);
   }

   100% {
      transform: translateX(-50%) scaleY(1);
   }
}

@keyframes leafAppear {
   0% {
      opacity: 0;
      transform: scale(0) rotate(20deg);
   }

   70% {
      opacity: 1;
      transform: scale(1.15) rotate(-5deg);
   }

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

@keyframes treeFloat {
   0%,
   100% {
      transform: translateY(0);
   }

   50% {
      transform: translateY(-5px);
   }
}

@keyframes loadingLine {
   0% {
      transform: translateX(-110%);
   }

   50% {
      transform: translateX(80%);
   }

   100% {
      transform: translateX(240%);
   }
}

@keyframes textPulse {
   0%,
   100% {
      opacity: .45;
   }

   50% {
      opacity: 1;
   }
}

@keyframes floatingLeaf {
   0% {
      transform: translate(0, 0) rotate(0deg);
      opacity: .1;
   }

   50% {
      transform: translate(20px, -35px) rotate(180deg);
      opacity: .35;
   }

   100% {
      transform: translate(-10px, -70px) rotate(360deg);
      opacity: 0;
   }
}

/* Hidden state */
#preloader.tree-preloader.preloader-hidden {
   opacity: 0;
   visibility: hidden;
   pointer-events: none;
}

/* Mobile */
@media (max-width: 575px) {

   .tree-loader-icon {
      transform: scale(.9);
   }

   .tree-loader-brand span {
      font-size: 17px;
   }

   .tree-loader-line {
      width: 130px;
   }

   .float-1 {
      left: 12%;
   }

   .float-2 {
      right: 12%;
   }

   .float-3 {
      right: 10%;
   }
}


/* ============================================
   TREE MENDOZA SERVICES
   MODERN HEADER
============================================ */

:root{
   --tm-green:#1f7a3b;
   --tm-green-dark:#14552a;
   --tm-green-light:#58b957;
   --tm-dark:#16251b;
   --tm-text:#29362d;
   --tm-white:#ffffff;
}


/* ============================================
   TOP BAR
============================================ */

.tm-topbar{
   width:100%;
   background:#14231a;
   color:rgba(255,255,255,.8);
   font-size:12px;
   position:relative;
   z-index:1000;
}

.tm-topbar-inner{
   height:38px;
   display:flex;
   align-items:center;
   justify-content:space-between;
}

.tm-top-left,
.tm-top-right{
   display:flex;
   align-items:center;
   gap:15px;
}

.tm-topbar i{
   color:#66bd59;
   margin-right:5px;
}

.tm-topbar a{
   color:#fff;
   transition:.3s;
}

.tm-topbar a:hover{
   color:#66bd59;
}

.tm-top-divider{
   width:1px;
   height:14px;
   background:rgba(255,255,255,.18);
}


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

.tm-main-header{
   position:relative;
   width:100%;
   background:#fff;
   z-index:999;
   transition:
      background .35s ease,
      box-shadow .35s ease,
      transform .35s ease;
}

.tm-header-inner{
   min-height:92px;
   display:flex;
   align-items:center;
   justify-content:space-between;
   gap:30px;
}


/* ============================================
   LOGO
============================================ */

.tm-logo{
   flex:0 0 auto;
}

.tm-logo img{
   width:auto;
   max-width:185px;
   max-height:70px;
   object-fit:contain;
   display:block;
   transition:.35s ease;
}

.tm-logo:hover img{
   transform:scale(1.035);
}


/* ============================================
   NAVIGATION
============================================ */

.tm-navigation{
   margin-left:auto;
}

.tm-navigation ul{
   list-style:none;
   margin:0;
   padding:0;
   display:flex;
   align-items:center;
   gap:7px;
}

.tm-navigation ul li{
   position:relative;
}

.tm-navigation ul li > a{
   position:relative;
   display:flex;
   align-items:center;
   gap:7px;
   padding:34px 16px;
   color:var(--tm-text);
   font-size:14px;
   font-weight:600;
   text-transform:uppercase;
   letter-spacing:.3px;
   transition:.3s ease;
}


/* Animated line */

.tm-navigation ul li > a::after{
   content:"";
   position:absolute;
   left:16px;
   right:16px;
   bottom:22px;
   height:2px;
   border-radius:20px;
   background:var(--tm-green);
   transform:scaleX(0);
   transform-origin:center;
   transition:.3s ease;
}

.tm-navigation ul li:hover > a,
.tm-navigation ul li.active > a{
   color:var(--tm-green);
}

.tm-navigation ul li:hover > a::after,
.tm-navigation ul li.active > a::after{
   transform:scaleX(1);
}


/* ============================================
   DROPDOWN
============================================ */

.tm-dropdown-menu{
   position:absolute;
   top:calc(100% - 5px);
   left:0;
   width:245px;
   padding:12px;
   background:#fff;
   border-radius:12px;
   box-shadow:
      0 20px 50px rgba(0,0,0,.12);
   border:1px solid #edf2ed;

   opacity:0;
   visibility:hidden;
   transform:translateY(12px);

   transition:.3s ease;
}

.tm-dropdown:hover .tm-dropdown-menu{
   opacity:1;
   visibility:visible;
   transform:translateY(0);
}

.tm-dropdown-menu a{
   display:flex;
   align-items:center;
   gap:12px;
   padding:12px 13px;
   border-radius:8px;
   color:#344139;
   font-size:13px;
   font-weight:600;
   transition:.25s ease;
}

.tm-dropdown-menu a i{
   width:28px;
   height:28px;
   display:flex;
   align-items:center;
   justify-content:center;
   border-radius:7px;
   background:#eef8ef;
   color:var(--tm-green);
}

.tm-dropdown-menu a:hover{
   background:#f2f8f2;
   color:var(--tm-green);
   transform:translateX(4px);
}


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

.tm-header-actions{
   display:flex;
   align-items:center;
   gap:20px;
}


/* ============================================
   LANGUAGE
============================================ */

.tm-language{
   position:relative;
}

.tm-language-btn{
   border:0;
   background:#f4f7f4;
   border-radius:30px;
   height:42px;
   padding:0 12px;
   display:flex;
   align-items:center;
   gap:7px;
   cursor:pointer;
   color:#243229;
   font-weight:700;
   font-size:12px;
   transition:.3s;
}

.tm-language-btn img{
   width:22px;
   height:22px;
   object-fit:cover;
   border-radius:50%;
}

.tm-language-btn i{
   font-size:10px;
}

.tm-language-btn:hover{
   background:#eaf4eb;
}

.tm-language-menu{
   position:absolute;
   top:52px;
   right:0;
   width:145px;
   padding:8px;
   background:#fff;
   border-radius:10px;
   box-shadow:0 15px 40px rgba(0,0,0,.12);
   border:1px solid #edf1ed;

   opacity:0;
   visibility:hidden;
   transform:translateY(8px);
   transition:.25s;
}

.tm-language:hover .tm-language-menu{
   opacity:1;
   visibility:visible;
   transform:translateY(0);
}

.tm-language-menu a{
   display:flex;
   align-items:center;
   gap:8px;
   padding:9px;
   border-radius:7px;
   font-size:12px;
   color:#26352b;
}

.tm-language-menu a:hover{
   background:#f0f7f0;
}

.tm-language-menu img{
   width:22px;
   height:22px;
   border-radius:50%;
}


/* ============================================
   PHONE
============================================ */

.tm-phone{
   display:flex;
   align-items:center;
   gap:10px;
   color:#1b2b20;
}

.tm-phone-icon{
   width:43px;
   height:43px;
   display:flex;
   align-items:center;
   justify-content:center;
   border-radius:50%;
   background:#edf7ee;
   color:var(--tm-green);
   font-size:16px;
   transition:.3s;
}

.tm-phone:hover .tm-phone-icon{
   background:var(--tm-green);
   color:#fff;
   transform:rotate(-8deg);
}

.tm-phone-content{
   display:flex;
   flex-direction:column;
   gap:2px;
}

.tm-phone-content small{
   font-size:10px;
   color:#89938b;
   font-weight:500;
}

.tm-phone-content strong{
   font-size:13px;
   color:#1d3023;
   white-space:nowrap;
}


/* ============================================
   QUOTE BUTTON
============================================ */

.tm-quote-btn{
   min-height:48px;
   padding:0 19px;
   border-radius:6px;
   display:flex;
   align-items:center;
   justify-content:center;
   gap:12px;

   color:#fff !important;
   background:
      linear-gradient(
         135deg,
         #287f3e,
         #4eaa4c
      );

   font-size:11px;
   font-weight:800;
   letter-spacing:.5px;

   box-shadow:
      0 8px 22px rgba(31,122,59,.20);

   transition:
      transform .3s ease,
      box-shadow .3s ease;
}

.tm-quote-btn i{
   font-size:13px;
   transition:.3s;
}

.tm-quote-btn:hover{
   transform:translateY(-3px);
   box-shadow:
      0 12px 28px rgba(31,122,59,.28);
}

.tm-quote-btn:hover i{
   transform:translate(3px,-3px);
}


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

.tm-mobile-toggle{
   width:45px;
   height:45px;
   border:0;
   border-radius:7px;
   background:#eef7ef;
   display:none;
   flex-direction:column;
   align-items:center;
   justify-content:center;
   gap:5px;
   cursor:pointer;
}

.tm-mobile-toggle span{
   width:21px;
   height:2px;
   border-radius:10px;
   background:var(--tm-green);
   transition:.3s;
}


/* ============================================
   STICKY / SCROLL
============================================ */

.tm-main-header.is-sticky{
   position:fixed;
   top:0;
   left:0;
   right:0;

   background:rgba(255,255,255,.94);

   backdrop-filter:blur(14px);
   -webkit-backdrop-filter:blur(14px);

   box-shadow:
      0 8px 30px rgba(0,0,0,.08);

   animation:tmHeaderDown .45s ease;
}

.tm-main-header.is-sticky .tm-header-inner{
   min-height:76px;
}

.tm-main-header.is-sticky .tm-navigation ul li > a{
   padding-top:26px;
   padding-bottom:26px;
}

.tm-main-header.is-sticky .tm-navigation ul li > a::after{
   bottom:17px;
}

@keyframes tmHeaderDown{

   from{
      transform:translateY(-100%);
   }

   to{
      transform:translateY(0);
   }

}


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

@media(max-width:1199px){

   .tm-navigation{
      display:none;
   }

   .tm-phone{
      display:none;
   }

   .tm-mobile-toggle{
      display:flex;
   }

   .tm-header-actions{
      margin-left:auto;
   }

}


@media(max-width:767px){

   .tm-topbar{
      display:none;
   }

   .tm-header-inner{
      min-height:75px;
      gap:12px;
   }

   .tm-logo img{
      max-width:150px;
      max-height:58px;
   }

   .tm-header-actions{
      gap:8px;
   }

   .tm-language-btn{
      height:40px;
      padding:0 9px;
   }

   .tm-quote-btn{
      display:none;
   }

}


@media(max-width:450px){

   .tm-logo img{
      max-width:135px;
   }

   .tm-language{
      display:none;
   }

}

 /* =========================================
    TREE MENDOZA SERVICES
    MODERN PROJECT SLIDER
 ========================================= */

.tm-project-section{
   position:relative;
   overflow:hidden;
   padding:110px 0 100px;
   background:#14221a;
   color:#fff;
}


/* Background decoration */

.tm-project-bg{
   position:absolute;
   top:-250px;
   right:-200px;
   width:600px;
   height:600px;

   border-radius:50%;

   background:
      radial-gradient(
         circle,
         rgba(76,171,75,.15) 0%,
         rgba(76,171,75,0) 70%
      );

   pointer-events:none;
}


/* =========================================
   HEADING
 ========================================= */

.tm-project-heading{
   display:flex;
   align-items:flex-end;
   justify-content:space-between;
   gap:40px;
   margin-bottom:55px;
}

.tm-project-heading-left{
   max-width:650px;
}

.tm-section-label{
   display:flex;
   align-items:center;
   gap:10px;

   color:#68be5b;

   font-size:12px;
   font-weight:800;

   letter-spacing:2px;
   text-transform:uppercase;
}

.tm-section-label span{
   width:32px;
   height:2px;
   background:#68be5b;
   border-radius:20px;
}


.tm-project-heading h2{
   margin:14px 0 14px;

   font-size:52px;
   line-height:1.05;

   font-weight:700;

   letter-spacing:-1.5px;
}

.tm-project-heading h2 span{
   color:#65b957;
}

.tm-project-heading p{
   max-width:560px;

   margin:0;

   color:rgba(255,255,255,.58);

   font-size:15px;
   line-height:1.8;
}


/* =========================================
   VIEW ALL BUTTON
 ========================================= */

.tm-project-btn{
   display:flex;
   align-items:center;
   gap:15px;

   padding:16px 20px;

   border:1px solid rgba(255,255,255,.16);
   border-radius:5px;

   color:#fff;

   font-size:11px;
   font-weight:800;

   letter-spacing:.8px;

   transition:.35s ease;
}

.tm-project-btn i{
   width:34px;
   height:34px;

   display:flex;
   align-items:center;
   justify-content:center;

   border-radius:50%;

   background:#5aad50;

   transition:.35s ease;
}

.tm-project-btn:hover{
   color:#fff;

   border-color:#5aad50;

   background:rgba(90,173,80,.08);
}

.tm-project-btn:hover i{
   transform:translate(3px,-3px);
}


/* =========================================
   SLIDER
 ========================================= */

.tm-project-slider-wrap{
   position:relative;
}

.tm-project-slider{
   overflow:visible;
}

.tm-project-slider .swiper-slide{
   width:420px;

   transition:
      opacity .5s ease,
      transform .5s ease;
}

.tm-project-slider .swiper-slide:not(.swiper-slide-active){
   opacity:.7;
}


/* =========================================
   PROJECT CARD
 ========================================= */

.tm-project-card{
   position:relative;
}


/* Image */

.tm-project-image{
   position:relative;

   display:block;

   height:470px;

   overflow:hidden;

   border-radius:14px;

   background:#1e3025;
}

.tm-project-image img{
   width:100%;
   height:100%;

   object-fit:cover;

   display:block;

   transition:
      transform 1s cubic-bezier(.2,.7,.2,1);
}

.tm-project-card:hover
.tm-project-image img{
   transform:scale(1.08);
}


/* Image overlay */

.tm-project-image-overlay{
   position:absolute;
   inset:0;

   background:
      linear-gradient(
         to bottom,
         rgba(0,0,0,.05) 35%,
         rgba(0,0,0,.70) 100%
      );

   opacity:.85;

   transition:.4s ease;
}

.tm-project-card:hover
.tm-project-image-overlay{
   opacity:1;
}


/* Number */

.tm-project-number{
   position:absolute;

   top:22px;
   left:22px;

   display:flex;
   align-items:center;
   justify-content:center;

   width:48px;
   height:48px;

   border-radius:50%;

   color:#fff;

   font-size:12px;
   font-weight:700;

   background:rgba(20,34,26,.75);

   backdrop-filter:blur(8px);

   border:1px solid rgba(255,255,255,.18);

   transition:.4s ease;
}

.tm-project-card:hover
.tm-project-number{
   background:#58aa4d;

   transform:rotate(10deg);
}


/* View icon */

.tm-project-view{
   position:absolute;

   top:22px;
   right:22px;

   width:52px;
   height:52px;

   display:flex;
   align-items:center;
   justify-content:center;

   border-radius:50%;

   color:#fff;

   background:#58aa4d;

   opacity:0;

   transform:translateY(10px);

   transition:.4s ease;
}

.tm-project-card:hover
.tm-project-view{
   opacity:1;
   transform:translateY(0);
}

.tm-project-view i{
   font-size:16px;
}


/* =========================================
   PROJECT INFO
 ========================================= */

.tm-project-info{
   display:flex;
   align-items:center;
   justify-content:space-between;

   gap:20px;

   padding:22px 5px 0;
}

.tm-project-category{
   display:block;

   margin-bottom:7px;

   color:#63b857;

   font-size:10px;
   font-weight:800;

   letter-spacing:1.8px;
}

.tm-project-info h3{
   margin:0;

   font-size:21px;
   line-height:1.25;

   font-weight:600;
}

.tm-project-info h3 a{
   color:#fff;

   transition:.3s;
}

.tm-project-info h3 a:hover{
   color:#63b857;
}


/* Arrow */

.tm-project-arrow{
   flex:0 0 auto;

   width:44px;
   height:44px;

   display:flex;
   align-items:center;
   justify-content:center;

   border-radius:50%;

   border:1px solid rgba(255,255,255,.18);

   color:#fff;

   transition:.35s ease;
}

.tm-project-arrow:hover{
   color:#fff;

   background:#5aad50;

   border-color:#5aad50;

   transform:translate(3px,-3px);
}


/* =========================================
   CONTROLS
 ========================================= */

.tm-project-controls{
   display:flex;
   align-items:center;

   justify-content:center;

   gap:22px;

   margin-top:50px;
}

.tm-project-prev,
.tm-project-next{
   width:48px;
   height:48px;

   border:1px solid rgba(255,255,255,.18);

   border-radius:50%;

   display:flex;
   align-items:center;
   justify-content:center;

   background:transparent;

   color:#fff;

   cursor:pointer;

   transition:.35s ease;
}

.tm-project-prev:hover,
.tm-project-next:hover{
   background:#58aa4d;
   border-color:#58aa4d;

   transform:translateY(-3px);
}


/* Progress */

.tm-project-progress{
   min-width:190px;

   display:flex;
   align-items:center;

   gap:12px;
}

.tm-progress-current,
.tm-progress-total{
   font-size:11px;
   font-weight:700;

   color:#fff;
}

.tm-progress-total{
   color:rgba(255,255,255,.4);
}

.tm-progress-line{
   position:relative;

   flex:1;

   height:2px;

   background:rgba(255,255,255,.15);

   overflow:hidden;
}

.tm-progress-line span{
   position:absolute;

   left:0;
   top:0;

   width:25%;
   height:100%;

   background:#62b857;

   transition:
      width .5s ease;
}


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

@media(max-width:991px){

   .tm-project-section{
      padding:85px 0 80px;
   }

   .tm-project-heading{
      align-items:flex-start;
      flex-direction:column;
   }

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

   .tm-project-slider .swiper-slide{
      width:380px;
   }

}


@media(max-width:767px){

   .tm-project-section{
      padding:70px 0 65px;
   }

   .tm-project-heading{
      margin-bottom:35px;
   }

   .tm-project-heading h2{
      font-size:35px;
   }

   .tm-project-heading p{
      font-size:14px;
   }

   .tm-project-slider .swiper-slide{
      width:82vw;
   }

   .tm-project-image{
      height:420px;
   }

   .tm-project-controls{
      margin-top:35px;
   }

}


@media(max-width:480px){

   .tm-project-image{
      height:390px;
   }

   .tm-project-info h3{
      font-size:18px;
   }

   .tm-project-progress{
      min-width:130px;
   }

   .tm-project-prev,
   .tm-project-next{
      width:42px;
      height:42px;
   }

}





.modern-tree-footer {
   position: relative;
   overflow: hidden;
   background: #08251b;
   color: #ffffff;
   padding-top: 0;
}


/* Background pattern */

.tree-footer-bg-pattern {
   position: absolute;
   inset: 0;
   opacity: .06;
   background-image:
      url("assets/imgs/footer/shape-f-1.png");
   background-size: cover;
   background-position: center;
   pointer-events: none;
}


/* Decorative leaves */

.tree-footer-leaf {
   position: absolute;
   color: #7fb84d;
   opacity: .08;
   pointer-events: none;
   font-size: 180px;
}

.leaf-1 {
   right: -30px;
   top: 100px;
   transform: rotate(-25deg);
}

.leaf-2 {
   left: -50px;
   bottom: 100px;
   transform: rotate(25deg);
}

.leaf-3 {
   right: 25%;
   bottom: -80px;
   font-size: 250px;
}


/* CTA */

.tree-footer-cta {
   position: relative;
   z-index: 2;
   transform: translateY(-45px);
   background: #a5d65d;
   border-radius: 10px;
   padding: 42px 50px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 35px;
   box-shadow: 0 20px 50px rgba(0,0,0,.25);
}

.cta-small-title {
   font-size: 12px;
   font-weight: 700;
   letter-spacing: 2px;
   color: #193b28;
}

.tree-footer-cta h2 {
   margin: 8px 0 10px;
   font-size: 38px;
   line-height: 1.1;
   color: #09251a;
}

.tree-footer-cta h2 span {
   color: #ffffff;
}

.tree-footer-cta p {
   margin: 0;
   max-width: 650px;
   color: #244431;
}


/* Call Button */

.tree-call-btn {
   display: flex;
   align-items: center;
   gap: 15px;
   padding: 10px 22px 10px 10px;
   background: #08251b;
   border-radius: 60px;
   color: #ffffff;
   min-width: 225px;
   transition: .3s ease;
}

.tree-call-btn:hover {
   background: #ffffff;
   color: #08251b;
   transform: translateY(-3px);
}

.call-icon {
   width: 55px;
   height: 55px;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
   background: #a5d65d;
   color: #08251b;
   font-size: 21px;
}

.tree-call-btn small {
   display: block;
   font-size: 11px;
   opacity: .65;
}

.tree-call-btn strong {
   display: block;
   font-size: 17px;
}


/* Main Footer */

.tree-footer-main {
   position: relative;
   z-index: 2;
   padding: 20px 0 55px;
}

.tree-footer-logo img {
   max-width: 190px;
   height: auto;
}

.tree-footer-company p {
   color: rgba(255,255,255,.65);
   line-height: 1.8;
   margin-top: 25px;
   max-width: 390px;
}

.tree-footer-company p strong {
   color: rgba(255,255,255,.85);
   font-weight: 500;
}


/* Widgets */

.tree-footer-widget h4 {
   color: #ffffff;
   font-size: 20px;
   margin-bottom: 12px;
}

.footer-title-line {
   width: 42px;
   height: 3px;
   background: #a5d65d;
   border-radius: 5px;
   margin-bottom: 22px;
}

.tree-footer-widget ul {
   margin: 0;
   padding: 0;
   list-style: none;
}

.tree-footer-widget li {
   margin-bottom: 12px;
}

.tree-footer-widget li a {
   display: flex;
   align-items: center;
   gap: 10px;
   color: rgba(255,255,255,.62);
   transition: .3s ease;
}

.tree-footer-widget li a i {
   color: #a5d65d;
   font-size: 12px;
}

.tree-footer-widget li a:hover {
   color: #a5d65d;
   padding-left: 5px;
}


/* Social */

.tree-footer-social {
   margin-top: 28px;
}

.tree-footer-social > span {
   display: block;
   color: #ffffff;
   font-size: 14px;
   font-weight: 600;
   margin-bottom: 12px;
}

.social-icons {
   display: flex;
   gap: 9px;
}

.social-icons a {
   width: 43px;
   height: 43px;
   display: flex;
   align-items: center;
   justify-content: center;
   border: 1px solid rgba(255,255,255,.18);
   border-radius: 50%;
   color: #ffffff;
   background: rgba(255,255,255,.04);
   transition: .35s ease;
}

.social-icons a:hover {
   background: #a5d65d;
   color: #08251b;
   border-color: #a5d65d;
   transform: translateY(-5px);
}


/* Contact */

.tree-contact-item {
   display: flex;
   align-items: flex-start;
   gap: 13px;
   margin-bottom: 20px;
}

.contact-icon {
   min-width: 42px;
   height: 42px;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
   background: rgba(165,214,93,.10);
   color: #a5d65d;
   font-size: 17px;
}

.tree-contact-item span {
   display: block;
   color: rgba(255,255,255,.45);
   font-size: 11px;
   text-transform: uppercase;
   letter-spacing: 1px;
   margin-bottom: 4px;
}

.tree-contact-item p,
.tree-contact-item a {
   color: rgba(255,255,255,.75);
   margin: 0;
   line-height: 1.5;
}

.tree-contact-item a:hover {
   color: #a5d65d;
}


/* Service Area */

.tree-service-area {
   position: relative;
   z-index: 2;
   display: flex;
   align-items: center;
   gap: 18px;
   padding: 24px 0;
   border-top: 1px solid rgba(255,255,255,.10);
   border-bottom: 1px solid rgba(255,255,255,.10);
}

.service-area-icon {
   width: 50px;
   height: 50px;
   flex: 0 0 50px;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
   background: #a5d65d;
   color: #08251b;
   font-size: 21px;
}

.tree-service-area span {
   font-size: 11px;
   letter-spacing: 2px;
   color: #a5d65d;
   font-weight: 700;
}

.tree-service-area p {
   margin: 5px 0 0;
   color: rgba(255,255,255,.62);
   line-height: 1.6;
}


/* Bottom */

.tree-footer-bottom {
   position: relative;
   z-index: 2;
   display: flex;
   justify-content: space-between;
   align-items: center;
   gap: 20px;
   padding: 25px 0;
}

.tree-footer-bottom p {
   margin: 0;
   color: rgba(255,255,255,.45);
   font-size: 13px;
}

.tree-footer-bottom strong {
   color: rgba(255,255,255,.75);
}

.footer-bottom-links {
   display: flex;
   gap: 25px;
}

.footer-bottom-links a {
   color: rgba(255,255,255,.45);
   font-size: 13px;
   transition: .3s ease;
}

.footer-bottom-links a:hover {
   color: #a5d65d;
}


/* Responsive */

@media (max-width: 991px) {

   .tree-footer-cta {
      display: block;
      padding: 35px;
   }

   .cta-button-area {
      margin-top: 25px;
   }

   .tree-footer-cta h2 {
      font-size: 32px;
   }

}


@media (max-width: 767px) {

   .tree-footer-cta {
      transform: translateY(-30px);
      padding: 30px 25px;
   }

   .tree-footer-cta h2 {
      font-size: 28px;
   }

   .tree-footer-main {
      padding-top: 5px;
   }

   .tree-footer-bottom {
      display: block;
      text-align: center;
   }

   .footer-bottom-links {
      justify-content: center;
      margin-top: 12px;
   }

   .tree-service-area {
      align-items: flex-start;
   }

}

.mendoza-breadcrumb-area {

   position: relative;

   min-height: 390px;

   display: flex;

   align-items: center;

   overflow: hidden;

   background: #0b291d;

}


/* HD BACKGROUND */

.mendoza-breadcrumb-bg {

   position: absolute;

   inset: 0;

   background-size: cover;

   background-position: center center;

   background-repeat: no-repeat;

   transform: scale(1.02);

}


/* GREEN OVERLAY */

.mendoza-breadcrumb-overlay {

   position: absolute;

   inset: 0;

   background:
      linear-gradient(
         90deg,
         rgba(5,30,20,.92) 0%,
         rgba(5,30,20,.72) 45%,
         rgba(5,30,20,.38) 100%
      );

}


/* DECORATIVE TREE ICON */

.mendoza-breadcrumb-shape {

   position: absolute;

   right: 7%;

   bottom: -70px;

   width: 300px;

   height: 300px;

   display: flex;

   align-items: center;

   justify-content: center;

   border: 1px solid rgba(165,214,93,.20);

   border-radius: 50%;

   color: rgba(165,214,93,.12);

   font-size: 180px;

   transform: rotate(-5deg);

}


/* CONTENT */

.mendoza-breadcrumb-content {

   position: relative;

   z-index: 3;

   padding: 70px 0;

}


/* LABEL */

.mendoza-breadcrumb-label {

   display: flex;

   align-items: center;

   gap: 12px;

   color: #a5d65d;

   font-size: 12px;

   font-weight: 700;

   letter-spacing: 2.5px;

   margin-bottom: 14px;

}


.breadcrumb-line {

   width: 38px;

   height: 2px;

   display: inline-block;

   background: #a5d65d;

}


/* TITLE */

.mendoza-breadcrumb-title {

   margin: 0;

   color: #ffffff;

   font-size: 58px;

   font-weight: 700;

   line-height: 1.08;

   letter-spacing: -.5px;

}


/* BREADCRUMB LINKS */

.mendoza-breadcrumb-links {

   display: flex;

   align-items: center;

   gap: 13px;

   margin-top: 20px;

   font-size: 14px;

}


.mendoza-breadcrumb-links a {

   color: rgba(255,255,255,.68);

   transition: .3s ease;

}


.mendoza-breadcrumb-links a:hover {

   color: #a5d65d;

}


.mendoza-breadcrumb-links span {

   color: #a5d65d;

   font-size: 12px;

}


.mendoza-breadcrumb-links strong {

   color: #ffffff;

   font-weight: 500;

}


/* BOTTOM SHAPE */

.mendoza-breadcrumb-bottom-shape {

   position: absolute;

   left: 0;

   right: 0;

   bottom: -1px;

   height: 35px;

   background: #ffffff;

   clip-path: polygon(
      0 100%,
      0 45%,
      12% 65%,
      25% 42%,
      38% 67%,
      52% 40%,
      66% 65%,
      80% 43%,
      92% 62%,
      100% 40%,
      100% 100%
   );

}


/* TABLET */

@media (max-width: 991px) {

   .mendoza-breadcrumb-area {

      min-height: 350px;

   }

   .mendoza-breadcrumb-title {

      font-size: 48px;

   }

   .mendoza-breadcrumb-shape {

      right: -80px;

      opacity: .7;

   }

}


/* MOBILE */

@media (max-width: 767px) {

   .mendoza-breadcrumb-area {

      min-height: 300px;

   }

   .mendoza-breadcrumb-content {

      padding: 55px 0 60px;

   }

   .mendoza-breadcrumb-title {

      font-size: 38px;

   }

   .mendoza-breadcrumb-label {

      font-size: 10px;

      letter-spacing: 1.8px;

   }

   .mendoza-breadcrumb-shape {

      right: -100px;

      bottom: -100px;

      width: 250px;

      height: 250px;

      font-size: 140px;

   }

   .mendoza-breadcrumb-bottom-shape {

      height: 22px;

   }

}
/* =========================================
   MENDOZA TREE SERVICES
   LIGHT / PREMIUM SERVICES
========================================= */

.mendoza-light-services{
   position:relative;

   padding:115px 0 105px;

   background:#ffffff;

   overflow:hidden;
}


/* subtle background */

.mendoza-light-services:before{
   content:"";

   position:absolute;

   width:500px;
   height:500px;

   left:-280px;
   top:50px;

   border-radius:50%;

   background:
      radial-gradient(
         circle,
         rgba(92,174,77,.08),
         transparent 70%
      );

   pointer-events:none;
}


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

.mendoza-light-header{

   display:flex;

   align-items:flex-end;

   justify-content:space-between;

   gap:50px;

   margin-bottom:55px;
}


.mendoza-light-title{
   max-width:650px;
}


.mendoza-light-eyebrow{

   display:flex;

   align-items:center;

   gap:10px;

   margin-bottom:14px;

   color:#5ba94d;

   font-size:10px;

   font-weight:800;

   letter-spacing:2px;
}


.mendoza-light-eyebrow span{

   width:28px;

   height:2px;

   background:#5ba94d;

   border-radius:10px;
}


.mendoza-light-title h2{

   margin:0;

   color:#142033;

   font-size:50px;

   line-height:1.05;

   font-weight:500;

   letter-spacing:-1.8px;
}


.mendoza-light-title h2 strong{

   color:#5aa94d;

   font-weight:700;
}


.mendoza-light-description{

   max-width:420px;

   padding-bottom:4px;
}


.mendoza-light-description p{

   margin:0 0 20px;

   color:#6c7480;

   font-size:14px;

   line-height:1.8;
}


.mendoza-light-view{

   display:inline-flex;

   align-items:center;

   gap:10px;

   color:#172235;

   font-size:10px;

   font-weight:800;

   letter-spacing:1px;

   transition:.3s;
}


.mendoza-light-view i{

   color:#5ba94d;

   transition:.3s;
}


.mendoza-light-view:hover{

   color:#5ba94d;
}


.mendoza-light-view:hover i{

   transform:translateX(5px);
}


/* =========================================
   CARD
========================================= */

.mendoza-light-card{

   position:relative;

   height:100%;

   background:#fff;

   border:1px solid #e8ece8;

   border-radius:12px;

   overflow:hidden;

   box-shadow:
      0 8px 35px rgba(17,35,26,.055);

   transition:
      transform .45s ease,
      box-shadow .45s ease,
      border-color .45s ease;
}


.mendoza-light-card:hover{

   transform:translateY(-9px);

   border-color:#d7e5d5;

   box-shadow:
      0 20px 50px rgba(17,35,26,.12);
}


/* =========================================
   IMAGE
========================================= */

.mendoza-light-image{

   position:relative;

   height:255px;

   overflow:hidden;
}


.mendoza-light-image img{

   width:100%;

   height:100%;

   display:block;

   object-fit:cover;

   transition:
      transform .8s cubic-bezier(.2,.7,.2,1);
}


.mendoza-light-card:hover
.mendoza-light-image img{

   transform:scale(1.08);
}


/* Image overlay */

.mendoza-light-image:after{

   content:"";

   position:absolute;

   inset:0;

   background:
      linear-gradient(
         to bottom,
         rgba(10,20,15,.05),
         rgba(10,20,15,.45)
      );

   pointer-events:none;
}


/* =========================================
   NUMBER
========================================= */

.mendoza-light-number{

   position:absolute;

   left:18px;

   top:18px;

   z-index:2;

   color:rgba(255,255,255,.9);

   font-size:12px;

   font-weight:800;

   letter-spacing:1px;
}


/* =========================================
   ARROW
========================================= */

.mendoza-light-arrow{

   position:absolute;

   right:16px;

   bottom:16px;

   z-index:3;

   width:45px;

   height:45px;

   display:flex;

   align-items:center;

   justify-content:center;

   border-radius:50%;

   background:#ffffff;

   color:#172235;

   opacity:0;

   transform:translateY(10px);

   transition:.4s;
}


.mendoza-light-card:hover
.mendoza-light-arrow{

   opacity:1;

   transform:translateY(0);
}


.mendoza-light-arrow:hover{

   background:#5ba94d;

   color:#fff;

   transform:translateY(-3px);
}


/* =========================================
   CONTENT
========================================= */

.mendoza-light-card-content{

   padding:25px 24px 27px;
}


.mendoza-light-category{

   display:block;

   margin-bottom:8px;

   color:#5ba94d;

   font-size:9px;

   font-weight:800;

   letter-spacing:1.6px;
}


.mendoza-light-card-content h3{

   margin:0 0 11px;

   font-size:22px;

   line-height:1.2;

   letter-spacing:-.3px;
}


.mendoza-light-card-content h3 a{

   color:#172235;

   transition:.3s;
}


.mendoza-light-card-content h3 a:hover{

   color:#5ba94d;
}


.mendoza-light-card-content p{

   min-height:70px;

   margin:0 0 19px;

   color:#727a83;

   font-size:13px;

   line-height:1.7;
}


/* Learn more */

.mendoza-light-more{

   display:inline-flex;

   align-items:center;

   gap:9px;

   color:#172235;

   font-size:10px;

   font-weight:800;

   letter-spacing:.7px;

   text-transform:uppercase;

   transition:.3s;
}


.mendoza-light-more i{

   color:#5ba94d;

   transition:.3s;
}


.mendoza-light-more:hover{

   color:#5ba94d;
}


.mendoza-light-more:hover i{

   transform:translateX(5px);
}


/* =========================================
   BOTTOM CTA
========================================= */

.mendoza-light-bottom{

   display:flex;

   align-items:center;

   gap:18px;

   margin-top:55px;

   padding:22px 25px;

   border-radius:10px;

   background:#f4f7f3;

   border:1px solid #e3eae1;
}


.mendoza-light-bottom-icon{

   width:48px;

   height:48px;

   flex-shrink:0;

   display:flex;

   align-items:center;

   justify-content:center;

   border-radius:50%;

   background:#5ba94d;

   color:#fff;

   font-size:20px;
}


.mendoza-light-bottom-text{

   flex:1;
}


.mendoza-light-bottom-text span{

   display:block;

   margin-bottom:3px;

   color:#5ba94d;

   font-size:9px;

   font-weight:800;

   letter-spacing:1.5px;
}


.mendoza-light-bottom-text h4{

   margin:0;

   color:#172235;

   font-size:18px;

   font-weight:600;
}


.mendoza-light-quote{

   display:flex;

   align-items:center;

   gap:12px;

   padding:14px 20px;

   border-radius:5px;

   background:#172235;

   color:#fff;

   font-size:10px;

   font-weight:800;

   letter-spacing:.8px;

   transition:.35s;
}


.mendoza-light-quote i{

   color:#73c263;

   transition:.3s;
}


.mendoza-light-quote:hover{

   background:#5ba94d;

   color:#fff;

   transform:translateY(-2px);
}


.mendoza-light-quote:hover i{

   transform:translateX(4px);
}


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

@media(max-width:991px){

   .mendoza-light-services{

      padding:85px 0;
   }


   .mendoza-light-header{

      align-items:flex-start;

      flex-direction:column;

      gap:20px;
   }


   .mendoza-light-title h2{

      font-size:43px;
   }


   .mendoza-light-description{

      max-width:600px;
   }


   .mendoza-light-image{

      height:280px;
   }

}


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

@media(max-width:767px){

   .mendoza-light-services{

      padding:70px 0;
   }


   .mendoza-light-title h2{

      font-size:35px;

      letter-spacing:-1px;
   }


   .mendoza-light-description p{

      font-size:13px;
   }


   .mendoza-light-card{

      max-width:500px;

      margin:auto;
   }


   .mendoza-light-image{

      height:280px;
   }


   .mendoza-light-card-content p{

      min-height:auto;
   }


   .mendoza-light-bottom{

      align-items:flex-start;

      flex-wrap:wrap;
   }


   .mendoza-light-bottom-text{

      width:calc(100% - 70px);

      flex:none;
   }


   .mendoza-light-quote{

      width:100%;

      justify-content:center;

      margin-top:8px;
   }

}



/* =========================================
   MENDOZA TREE SERVICES
   MOBILE MENU
========================================= */

.tm-mobile-menu{
   position:fixed;

   top:0;
   right:-100%;

   width:390px;
   max-width:90%;

   height:100vh;

   z-index:999999;

   display:flex;
   flex-direction:column;

   background:#fff;

   box-shadow:
      -20px 0 60px rgba(0,0,0,.18);

   overflow-y:auto;

   transition:
      right .45s cubic-bezier(.77,0,.18,1);
}


/* OPEN */

.tm-mobile-menu.active{
   right:0;
}


/* =========================================
   OVERLAY
========================================= */

.tm-mobile-overlay{

   position:fixed;

   inset:0;

   z-index:999998;

   background:rgba(8,20,15,.55);

   backdrop-filter:blur(5px);

   opacity:0;

   visibility:hidden;

   transition:
      opacity .35s ease,
      visibility .35s ease;
}


.tm-mobile-overlay.active{

   opacity:1;

   visibility:visible;
}


/* =========================================
   BODY
========================================= */

body.tm-menu-open{

   overflow:hidden;
}


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

.tm-mobile-menu-header{

   display:flex;

   align-items:center;

   justify-content:space-between;

   padding:20px 24px;

   border-bottom:1px solid #e8ede7;
}


.tm-mobile-logo img{

   display:block;

   width:auto;

   max-width:155px;

   max-height:55px;

   object-fit:contain;
}


/* CLOSE */

.tm-mobile-close{

   width:44px;

   height:44px;

   display:flex;

   align-items:center;

   justify-content:center;

   border:1px solid #e3e8e2;

   border-radius:50%;

   background:#f5f7f4;

   color:#172235;

   cursor:pointer;

   font-size:18px;

   transition:.35s;
}


.tm-mobile-close:hover{

   color:#fff;

   background:#5ba94d;

   border-color:#5ba94d;

   transform:rotate(90deg);
}


/* =========================================
   NAVIGATION
========================================= */

.tm-mobile-navigation{

   padding:20px 24px;
}


.tm-mobile-navigation ul{

   margin:0;

   padding:0;

   list-style:none;
}


.tm-mobile-navigation > ul > li{

   border-bottom:1px solid #edf0ed;
}


.tm-mobile-navigation > ul > li > a{

   display:flex;

   align-items:center;

   min-height:60px;

   color:#172235;

   font-size:17px;

   font-weight:600;

   transition:.3s;
}


.tm-mobile-navigation > ul > li > a:hover{

   color:#5ba94d;

   padding-left:6px;
}


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

.tm-mobile-link{

   display:flex;

   align-items:center;

   justify-content:space-between;

   min-height:60px;
}


.tm-mobile-link > a{

   flex:1;

   color:#172235;

   font-size:17px;

   font-weight:600;
}


.tm-mobile-submenu-toggle{

   width:40px;

   height:40px;

   display:flex;

   align-items:center;

   justify-content:center;

   border:0;

   border-radius:50%;

   background:#f0f5ef;

   color:#172235;

   cursor:pointer;

   transition:.35s;
}


.tm-mobile-submenu-toggle.active{

   background:#5ba94d;

   color:#fff;

   transform:rotate(180deg);
}


/* SUBMENU */

.tm-mobile-submenu{

   display:none;

   padding:5px 0 15px 10px !important;
}


.tm-mobile-submenu.active{

   display:block;
}


.tm-mobile-submenu li{

   border:0 !important;
}


.tm-mobile-submenu li a{

   display:flex;

   align-items:center;

   gap:12px;

   padding:11px 10px;

   color:#6c747b;

   font-size:14px;

   transition:.3s;
}


.tm-mobile-submenu li a i{

   width:22px;

   color:#5ba94d;

   text-align:center;
}


.tm-mobile-submenu li a:hover{

   color:#5ba94d;

   padding-left:17px;
}


/* =========================================
   BOTTOM AREA
========================================= */

.tm-mobile-bottom{

   margin-top:auto;

   padding:24px;

   background:#f4f7f3;

   border-top:1px solid #e4eae2;
}


/* CALL */

.tm-mobile-call{

   display:flex;

   align-items:center;

   gap:13px;

   margin-bottom:16px;

   color:#172235;
}


.tm-mobile-call-icon{

   width:46px;

   height:46px;

   flex-shrink:0;

   display:flex;

   align-items:center;

   justify-content:center;

   border-radius:50%;

   background:#5ba94d;

   color:#fff;
}


.tm-mobile-call small{

   display:block;

   margin-bottom:3px;

   color:#7a837b;

   font-size:9px;

   font-weight:800;

   letter-spacing:1.3px;
}


.tm-mobile-call strong{

   display:block;

   color:#172235;

   font-size:14px;
}


/* QUOTE */

.tm-mobile-quote{

   display:flex;

   align-items:center;

   justify-content:center;

   gap:11px;

   width:100%;

   padding:15px;

   border-radius:5px;

   background:#172235;

   color:#fff;

   font-size:10px;

   font-weight:800;

   letter-spacing:1px;

   transition:.35s;
}


.tm-mobile-quote i{

   color:#6ac35c;
}


.tm-mobile-quote:hover{

   background:#5ba94d;

   color:#fff;
}


/* =========================================
   HAMBURGER
========================================= */

.tm-mobile-toggle{

   display:none;

   width:46px;

   height:46px;

   padding:0;

   border:0;

   border-radius:5px;

   background:#5ba94d;

   cursor:pointer;

   align-items:center;

   justify-content:center;

   flex-direction:column;

   gap:5px;

   transition:.3s;
}


.tm-mobile-toggle span{

   display:block;

   width:21px;

   height:2px;

   border-radius:10px;

   background:#fff;

   transition:.3s;
}


/* Hamburger active */

.tm-mobile-toggle.active{

   background:#172235;
}


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

@media(max-width:1199px){

   .tm-mobile-toggle{

      display:flex;
   }

}


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

@media(max-width:767px){

   .tm-mobile-menu{

      width:380px;

      max-width:92%;
   }

}


@media(max-width:480px){

   .tm-mobile-menu{

      width:100%;

      max-width:100%;
   }


   .tm-mobile-menu-header{

      padding:18px 20px;
   }


   .tm-mobile-navigation{

      padding:15px 20px;
   }


   .tm-mobile-bottom{

      padding:20px;
   }

}



.mendoza-breadcrumb-area {

   position: relative;

   min-height: 390px;

   display: flex;

   align-items: center;

   overflow: hidden;

   background: #0b291d;

}


/* HD BACKGROUND */

.mendoza-breadcrumb-bg {

   position: absolute;

   inset: 0;

   background-size: cover;

   background-position: center center;

   background-repeat: no-repeat;

   transform: scale(1.02);

}


/* GREEN OVERLAY */

.mendoza-breadcrumb-overlay {

   position: absolute;

   inset: 0;

   background:
      linear-gradient(
         90deg,
         rgba(5,30,20,.92) 0%,
         rgba(5,30,20,.72) 45%,
         rgba(5,30,20,.38) 100%
      );

}


/* DECORATIVE TREE ICON */

.mendoza-breadcrumb-shape {

   position: absolute;

   right: 7%;

   bottom: -70px;

   width: 300px;

   height: 300px;

   display: flex;

   align-items: center;

   justify-content: center;

   border: 1px solid rgba(165,214,93,.20);

   border-radius: 50%;

   color: rgba(165,214,93,.12);

   font-size: 180px;

   transform: rotate(-5deg);

}


/* CONTENT */

.mendoza-breadcrumb-content {

   position: relative;

   z-index: 3;

   padding: 70px 0;

}


/* LABEL */

.mendoza-breadcrumb-label {

   display: flex;

   align-items: center;

   gap: 12px;

   color: #a5d65d;

   font-size: 12px;

   font-weight: 700;

   letter-spacing: 2.5px;

   margin-bottom: 14px;

}


.breadcrumb-line {

   width: 38px;

   height: 2px;

   display: inline-block;

   background: #a5d65d;

}


/* TITLE */

.mendoza-breadcrumb-title {

   margin: 0;

   color: #ffffff;

   font-size: 58px;

   font-weight: 700;

   line-height: 1.08;

   letter-spacing: -.5px;

}


/* BREADCRUMB LINKS */

.mendoza-breadcrumb-links {

   display: flex;

   align-items: center;

   gap: 13px;

   margin-top: 20px;

   font-size: 14px;

}


.mendoza-breadcrumb-links a {

   color: rgba(255,255,255,.68);

   transition: .3s ease;

}


.mendoza-breadcrumb-links a:hover {

   color: #a5d65d;

}


.mendoza-breadcrumb-links span {

   color: #a5d65d;

   font-size: 12px;

}


.mendoza-breadcrumb-links strong {

   color: #ffffff;

   font-weight: 500;

}


/* BOTTOM SHAPE */

.mendoza-breadcrumb-bottom-shape {

   position: absolute;

   left: 0;

   right: 0;

   bottom: -1px;

   height: 35px;

   background: #ffffff;

   clip-path: polygon(
      0 100%,
      0 45%,
      12% 65%,
      25% 42%,
      38% 67%,
      52% 40%,
      66% 65%,
      80% 43%,
      92% 62%,
      100% 40%,
      100% 100%
   );

}


/* TABLET */

@media (max-width: 991px) {

   .mendoza-breadcrumb-area {

      min-height: 350px;

   }

   .mendoza-breadcrumb-title {

      font-size: 48px;

   }

   .mendoza-breadcrumb-shape {

      right: -80px;

      opacity: .7;

   }

}


/* MOBILE */

@media (max-width: 767px) {

   .mendoza-breadcrumb-area {

      min-height: 300px;

   }

   .mendoza-breadcrumb-content {

      padding: 55px 0 60px;

   }

   .mendoza-breadcrumb-title {

      font-size: 38px;

   }

   .mendoza-breadcrumb-label {

      font-size: 10px;

      letter-spacing: 1.8px;

   }

   .mendoza-breadcrumb-shape {

      right: -100px;

      bottom: -100px;

      width: 250px;

      height: 250px;

      font-size: 140px;

   }

   .mendoza-breadcrumb-bottom-shape {

      height: 22px;

   }

}


/* =========================================
   WHATSAPP CONTAINER
========================================= */

.mendoza-whatsapp {
   position: fixed;

   left: 24px;
   bottom: 24px;

   z-index: 9999999;
}


/* =========================================
   MAIN LINK
========================================= */

.mendoza-whatsapp > a {
   position: relative;

   display: flex;

   align-items: center;
   justify-content: center;

   width: 62px;
   height: 62px;

   text-decoration: none;

   border-radius: 50%;

   background: #25D366;

   box-shadow:
      0 8px 25px rgba(37,211,102,.28),
      0 3px 8px rgba(0,0,0,.15);

   transition:
      transform .3s ease,
      box-shadow .3s ease;
}


/* =========================================
   HOVER
========================================= */

.mendoza-whatsapp > a:hover {
   transform: translateY(-5px) scale(1.04);

   box-shadow:
      0 14px 35px rgba(37,211,102,.35),
      0 5px 12px rgba(0,0,0,.15);
}


/* =========================================
   ICON
========================================= */

.mendoza-whatsapp-icon {
   position: relative;
   z-index: 3;

   display: flex;

   align-items: center;
   justify-content: center;

   width: 100%;
   height: 100%;

   border-radius: 50%;

   overflow: hidden;
}

.mendoza-whatsapp-icon img {
   width: 31px !important;
   height: 31px !important;

   max-width: none !important;

   object-fit: contain;

   display: block;

   transition: transform .3s ease;
}

.mendoza-whatsapp > a:hover .mendoza-whatsapp-icon img {
   transform: scale(1.08);
}


/* =========================================
   PULSE EFFECT
========================================= */

.mendoza-whatsapp-pulse {
   position: absolute;

   inset: 0;

   border-radius: 50%;

   border: 2px solid #25D366;

   animation: mendozaWhatsappPulse 2.2s infinite;

   pointer-events: none;
}

@keyframes mendozaWhatsappPulse {

   0% {
      transform: scale(1);
      opacity: .7;
   }

   70% {
      transform: scale(1.35);
      opacity: 0;
   }

   100% {
      transform: scale(1.35);
      opacity: 0;
   }

}


/* =========================================
   TOOLTIP
========================================= */

.mendoza-whatsapp-tooltip {
   position: absolute;

   left: 76px;

   top: 50%;

   transform:
      translateY(-50%)
      translateX(-8px);

   padding: 10px 15px;

   border-radius: 8px;

   background: #102039;

   color: #fff;

   font-size: 11px;

   font-weight: 600;

   white-space: nowrap;

   opacity: 0;

   visibility: hidden;

   transition:
      opacity .25s ease,
      transform .25s ease;
}


/* LITTLE ARROW */

.mendoza-whatsapp-tooltip::before {
   content: "";

   position: absolute;

   left: -5px;

   top: 50%;

   width: 10px;
   height: 10px;

   transform: translateY(-50%) rotate(45deg);

   background: #102039;
}


/* TOOLTIP HOVER */

.mendoza-whatsapp > a:hover .mendoza-whatsapp-tooltip {
   opacity: 1;

   visibility: visible;

   transform:
      translateY(-50%)
      translateX(0);
}


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

@media (max-width: 575px) {

   .mendoza-whatsapp {
      left: 16px;
      bottom: 16px;
   }

   .mendoza-whatsapp > a {
      width: 56px;
      height: 56px;
   }

   .mendoza-whatsapp-icon img {
      width: 28px !important;
      height: 28px !important;
   }

   .mendoza-whatsapp-tooltip {
      display: none;
   }

}


/* =========================================
   WHATSAPP CONTAINER
========================================= */

.modern-whatsapp {
   position: fixed;

   left: 25px;
   bottom: 85px;

   z-index: 9999999;
}


/* =========================================
   LINK
========================================= */

.modern-whatsapp > a {

   position: relative;

   display: flex;

   align-items: center;
   justify-content: center;

   width: 62px;
   height: 62px;

   text-decoration: none;

   border-radius: 50%;

}


/* =========================================
   MAIN BUTTON
========================================= */

.whatsapp-button {

   position: relative;

   z-index: 3;

   width: 60px;
   height: 60px;

   display: flex;

   align-items: center;
   justify-content: center;

   border-radius: 50%;

   background: #25D366;

   color: #fff;

   font-size: 30px;

   box-shadow:
      0 8px 25px rgba(37,211,102,.28),
      0 3px 10px rgba(0,0,0,.18);

   transition:
      transform .3s ease,
      box-shadow .3s ease;
}


/* =========================================
   HOVER
========================================= */

.modern-whatsapp > a:hover .whatsapp-button {

   transform:
      translateY(-4px)
      scale(1.05);

   box-shadow:
      0 14px 35px rgba(37,211,102,.38),
      0 5px 15px rgba(0,0,0,.18);

}


/* =========================================
   WHATSAPP ICON
========================================= */

.whatsapp-button i {

   line-height: 1;

   transition:
      transform .3s ease;
}

.modern-whatsapp > a:hover
.whatsapp-button i {

   transform:
      scale(1.08)
      rotate(-5deg);

}


/* =========================================
   PULSE EFFECT
========================================= */

.whatsapp-pulse {

   position: absolute;

   inset: 1px;

   z-index: 1;

   border-radius: 50%;

   border:
      2px solid #25D366;

   animation:
      whatsappPulse 2.2s infinite;

   pointer-events: none;
}


@keyframes whatsappPulse {

   0% {

      transform: scale(1);

      opacity: .7;

   }

   70% {

      transform: scale(1.38);

      opacity: 0;

   }

   100% {

      transform: scale(1.38);

      opacity: 0;

   }

}


/* =========================================
   TOOLTIP
========================================= */

.whatsapp-tooltip {

   position: absolute;

   left: 76px;

   top: 50%;

   transform:
      translateY(-50%)
      translateX(-10px);

   width: max-content;

   padding: 10px 15px;

   border-radius: 9px;


   color: #fff;

   font-size: 10px;

   line-height: 1.4;

   white-space: nowrap;

 

   visibility: hidden;

   transition:
      opacity .25s ease,
      transform .25s ease;

}


/* Tooltip title */

.whatsapp-tooltip strong {

   display: block;

   margin-bottom: 2px;

   color: #3abad7;

   font-size: 11px;

}


/* Tooltip arrow */

.whatsapp-tooltip::before {

   content: "";

   position: absolute;

   left: -5px;

   top: 50%;

   width: 10px;
   height: 10px;

   transform:
      translateY(-50%)
      rotate(45deg);


}


/* =========================================
   SHOW TOOLTIP
========================================= */

.modern-whatsapp > a:hover
.whatsapp-tooltip {

   opacity: 1;

   visibility: visible;

   transform:
      translateY(-50%)
      translateX(0);

}


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

@media (max-width: 575px) {

   .modern-whatsapp {

      left: 17px;

      bottom: 75px;

   }

   .modern-whatsapp > a {

      width: 56px;
      height: 56px;

   }

   .whatsapp-button {

      width: 56px;
      height: 56px;

      font-size: 27px;

   }

   .whatsapp-tooltip {

      display: none;

   }

}


/* =========================================
   SMALL PHONES
========================================= */

@media (max-width: 360px) {

   .modern-whatsapp {

      left: 14px;

      bottom: 70px;

   }

}


