/*
====================================================
 FRANCISCO'S PAINTING SERVICE LLC
 Complete dynamic stylesheet — consolidated version
 Same HTML classes; duplicate selectors were merged.
====================================================
*/

:root{
  --navy:#082b63;
  --navy-2:#0d3f86;
  --blue:#1263d7;
  --red:#f13f4f;
  --yellow:#ffbd18;
  --green:#22a65a;
  --purple:#8b3fd6;
  --ink:#14213d;
  --muted:#667085;
  --line:#e7ecf3;
  --soft:#f6f9fd;
  --white:#fff;
  --shadow:0 18px 50px rgba(8, 43, 99, .12);
  --radius:22px;
}

*{
  box-sizing:border-box;
  margin:0;
  padding:0;
}



/*==================================================
CORRECCIÓN DEL DESPLAZAMIENTO HORIZONTAL
==================================================*/

html{
    width:100%;
    max-width:100%;
    overflow-x:hidden;
    scroll-behavior:smooth;
}

body{
    width:100%;
    max-width:100%;
    overflow-x:clip;
}

/* Compatibilidad con navegadores que no soportan clip */

@supports not (overflow-x:clip){

    body{
        overflow-x:hidden;
    }

}

img,
iframe,
video,
svg{
    max-width:100%;
}


/*==================================================
OFF-CANVAS CORREGIDO
==================================================*/

.fps-mobile-menu{
    position:fixed;
    top:0;
    right:0;
    z-index:2000;

    display:flex;
    flex-direction:column;

    width:min(420px,92%);
    max-width:100%;

    height:100dvh;

    overflow-x:hidden;
    overflow-y:auto;

    color:var(--ink);
    background:#fff;

    box-shadow:-20px 0 60px rgba(3,15,37,.22);

    transform:translate3d(100%,0,0);

    opacity:0;
    visibility:hidden;
    pointer-events:none;

    transition:
        transform .42s cubic-bezier(.22,.8,.25,1),
        opacity .3s ease,
        visibility .3s ease;

    contain:layout paint;
    will-change:transform;
}

.fps-mobile-menu.fps-open{
    transform:translate3d(0,0,0);

    opacity:1;
    visibility:visible;
    pointer-events:auto;
}


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

.fps-menu-overlay{
    position:fixed;
    inset:0;
    z-index:1990;

    width:100%;
    height:100%;

    background:rgba(3,15,37,.74);

    backdrop-filter:blur(5px);

    opacity:0;
    visibility:hidden;
    pointer-events:none;

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

.fps-menu-overlay.fps-open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
}


/*==================================================
CONTENEDORES PRINCIPALES
==================================================*/

.container{
    width:min(1180px,92%);
    max-width:100%;
    margin-inline:auto;
}

.fps-header,
.fps-topbar,
.modern-hero,
.modern-trust-section,
.home-about,
.home-services,
.home-why,
.home-before-after,
.home-projects,
.footer{
    max-width:100%;
}


/*==================================================
EVITAR DESBORDAMIENTO EN GRIDS Y FLEX
==================================================*/

.modern-hero-grid,
.modern-hero-content,
.modern-hero-visual,
.home-about-grid,
.home-why-grid,
.home-services-grid,
.home-comparison-grid,
.home-projects-grid,
.service-detail-layout,
.service-main-content,
.service-sidebar-modern{
    min-width:0;
    max-width:100%;
}


/*==================================================
TARJETA FLOTANTE DEL HERO
==================================================*/

.modern-card-quality{
    right:0;
}


/*==================================================
AJUSTE MÓVIL
==================================================*/

@media(max-width:767px){

    .fps-mobile-menu{
        width:min(400px,94%);
        max-width:94%;
    }

    .modern-main-image{
        right:0;
        left:0;
    }

    .modern-card-quality{
        right:10px;
    }

}

a{
  text-decoration:none;
  color:inherit;
}

img{
  max-width:100%;
  display:block;
}

.container{
  width:min(1180px, 92%);
  margin:auto;
}

.topbar{
  background:var(--navy);
  color:#fff;
  font-size:.84rem;
}

.topbar-inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  padding:8px 0;
  flex-wrap:wrap;
}

.topbar-group{
  display:flex;
  gap:22px;
  align-items:center;
  flex-wrap:wrap;
}

.topbar i{
  color:var(--yellow);
  margin-right:7px;
}

.nav{
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.logo{
  display:flex;
  align-items:center;
  gap:12px;
  font-weight:900;
  color:var(--navy);
  line-height:1.05;
}

.logo-mark{
  width:48px;
  height:48px;
  border-radius:14px;
  background:linear-gradient(135deg, var(--red), var(--blue));
  display:grid;
  place-items:center;
  color:#fff;
  font-size:1.5rem;
  box-shadow:0 10px 24px rgba(18, 99, 215, .25);
}

.logo small{
  display:block;
  font-size:.64rem;
  letter-spacing:1.5px;
  margin-top:5px;
}

.menu{
  display:flex;
  align-items:center;
  gap:28px;
  font-weight:800;
  font-size:.88rem;
}

.menu a{
  position:relative;
  padding:29px 0;
}

.menu a:after{
  content:"";
  position:absolute;
  left:0;
  right:100%;
  bottom:18px;
  height:3px;
  border-radius:4px;
  background:linear-gradient(90deg, var(--red), var(--yellow), var(--blue));
  transition:.3s;
}

.menu a:hover:after, .menu a.active:after{
  right:0;
}

.dropdown{
  position:relative;
}

.dropdown-menu{
  position:absolute;
  top:72px;
  left:-20px;
  min-width:280px;
  background:#fff;
  border-radius:16px;
  padding:12px;
  box-shadow:var(--shadow);
  opacity:0;
  visibility:hidden;
  transform:translateY(12px);
  transition:.25s;
  border:1px solid var(--line);
}

.dropdown:hover .dropdown-menu{
  opacity:1;
  visibility:visible;
  transform:none;
}

.dropdown-menu a{
  display:block;
  padding:11px 13px;
  border-radius:10px;
  color:var(--ink);
}

.dropdown-menu a:hover{
  background:var(--soft);
  color:var(--blue);
}

.dropdown-menu a:after{
  display:none;
}

.nav-actions{
  display:flex;
  align-items:center;
  gap:12px;
}

.phone-pill{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:800;
  color:var(--navy);
}

.phone-icon{
  width:38px;
  height:38px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--blue);
  color:#fff;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border:0;
  border-radius:12px;
  padding:14px 22px;
  font-weight:900;
  cursor:pointer;
  transition:.25s;
}

.btn:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 24px rgba(8, 43, 99, .18);
}

.btn-primary{
  background:linear-gradient(90deg, var(--blue), var(--navy-2));
  color:#fff;
}

.btn-accent{
  background:linear-gradient(90deg, var(--yellow), var(--red));
  color:#fff;
}

.btn-light{
  background:#fff;
  color:var(--navy);
  border:1px solid var(--line);
}

.mobile-toggle{
  display:none;
  width:44px;
  height:44px;
  border-radius:12px;
  border:1px solid var(--line);
  background:#fff;
  font-size:1.2rem;
  color:var(--navy);
}

.hero{
  position:relative;
  overflow:hidden;
  background:linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, .95) 42%, rgba(255, 255, 255, .15) 70%), url("https://images.unsplash.com/photo-1600585154340-be6161a56a0c?auto=format&fit=crop&w=1800&q=85") center/cover;
  min-height:650px;
  display:flex;
  align-items:center;
}

.hero:after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:18px;
  background:linear-gradient(90deg, var(--blue) 0 38%, var(--yellow) 38% 60%, var(--red) 60%);
}

.hero-content{
  position:relative;
  z-index:2;
  max-width:620px;
  padding:90px 0 105px;
}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--red);
  font-size:.78rem;
  font-weight:900;
  letter-spacing:1.5px;
  text-transform:uppercase;
  margin-bottom:16px;
}

.eyebrow:after{
  content:"";
  width:42px;
  height:2px;
  background:currentColor;
}

.hero h1, .page-hero h1{
  font-size:clamp(3rem, 6vw, 5.8rem);
  line-height:.96;
  color:var(--navy);
  letter-spacing:-3px;
  margin-bottom:18px;
}

.script{
  font-family:"Brush Script MT", cursive;
  font-weight:400;
  color:var(--red);
  display:block;
  font-size:.8em;
  letter-spacing:0;
}

.hero p{
  max-width:560px;
  font-size:1.1rem;
  color:#465269;
  margin:24px 0 30px;
}

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

.trust-strip{
  margin-top:-52px;
  position:relative;
  z-index:4;
}

.trust-grid{
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  border-radius:18px;
  padding:20px;
}

.trust-item{
  display:flex;
  gap:12px;
  padding:12px 16px;
  border-right:1px solid var(--line);
}

.trust-item:last-child{
  border-right:0;
}

.icon-bubble{
  min-width:44px;
  height:44px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--soft);
  font-size:1.1rem;
}

.trust-item:nth-child(1) .icon-bubble{
  color:var(--blue);
}

.trust-item:nth-child(2) .icon-bubble{
  color:var(--red);
}

.trust-item:nth-child(3) .icon-bubble{
  color:var(--yellow);
}

.trust-item:nth-child(4) .icon-bubble{
  color:var(--green);
}

.trust-item:nth-child(5) .icon-bubble{
  color:var(--purple);
}

.trust-item strong{
  font-size:.78rem;
  display:block;
  color:var(--navy);
}

.trust-item span{
  font-size:.72rem;
  color:var(--muted);
  line-height:1.3;
  display:block;
  margin-top:5px;
}

.section{
  padding:100px 0;
}

.section-soft{
  background:var(--soft);
}

.about-grid, .why-grid, .contact-grid, .service-detail-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:64px;
  align-items:center;
}

.image-card{
  position:relative;
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow);
}

.image-card img{
  width:100%;
  height:520px;
  object-fit:cover;
}

.experience-badge{
  position:absolute;
  left:24px;
  bottom:24px;
  width:145px;
  height:145px;
  border-radius:20px;
  background:var(--navy);
  color:#fff;
  display:grid;
  place-items:center;
  text-align:center;
  border:6px solid #fff;
}

.experience-badge strong{
  font-size:2.7rem;
  line-height:1;
}

.content h2{
  font-size:clamp(2.2rem, 4vw, 3.5rem);
  line-height:1.08;
  color:var(--navy);
  letter-spacing:-1.5px;
  margin-bottom:20px;
}

.content p{
  color:var(--muted);
  margin-bottom:18px;
}

.mini-features{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:16px;
  margin:28px 0;
}

.mini-feature{
  padding:18px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
}

.mini-feature i{
  color:var(--blue);
  font-size:1.2rem;
  margin-bottom:8px;
}

.mini-feature strong{
  display:block;
  color:var(--navy);
}

.services-grid{
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:18px;
}

.service-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(8, 43, 99, .06);
  transition:.3s;
}

.service-card:hover{
  transform:translateY(-8px);
  box-shadow:var(--shadow);
}

.service-card img{
  width:100%;
  height:170px;
  object-fit:cover;
}

.service-card-body{
  padding:23px 18px 24px;
  text-align:center;
  position:relative;
}

.service-icon{
  width:52px;
  height:52px;
  border-radius:50%;
  display:grid;
  place-items:center;
  margin:-50px auto 15px;
  color:#fff;
  border:5px solid #fff;
  font-size:1.1rem;
}

.service-card:nth-child(1) .service-icon{
  background:var(--blue);
}

.service-card:nth-child(2) .service-icon{
  background:var(--red);
}

.service-card:nth-child(3) .service-icon{
  background:var(--yellow);
}

.service-card:nth-child(4) .service-icon{
  background:var(--green);
}

.service-card:nth-child(5) .service-icon{
  background:var(--purple);
}

.service-card h3{
  font-size:1rem;
  color:var(--navy);
  line-height:1.25;
  margin-bottom:10px;
}

.service-card p{
  font-size:.86rem;
  color:var(--muted);
}

.why-list{
  list-style:none;
  margin:25px 0;
}

.why-list li{
  margin:12px 0;
  color:#465269;
}

.why-list i{
  color:var(--blue);
  margin-right:10px;
}

.quote-card{
  background:linear-gradient(135deg, var(--navy), var(--blue));
  color:#fff;
  border-radius:var(--radius);
  padding:40px;
  box-shadow:var(--shadow);
}

.quote-card p{
  font-size:1.2rem;
  color:#fff;
}

.quote-card strong{
  display:block;
  margin-top:20px;
}

.stats{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:18px;
  margin-top:48px;
}

.stat{
  padding:24px;
  text-align:center;
  background:#fff;
  border-radius:16px;
  border:1px solid var(--line);
}

.stat strong{
  display:block;
  color:var(--navy);
  font-size:2rem;
}

.projects-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:22px;
}

.project-card{
  position:relative;
  border-radius:18px;
  overflow:hidden;
  min-height:330px;
  box-shadow:var(--shadow);
}

.project-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  position:absolute;
  inset:0;
}

.project-overlay span{
  font-size:.78rem;
  color:var(--yellow);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:1px;
}

.project-overlay h3{
  font-size:1.25rem;
  margin-top:6px;
}

.cta{
  background:linear-gradient(120deg, var(--navy), var(--blue));
  color:#fff;
  border-radius:26px;
  padding:44px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:30px;
  position:relative;
  overflow:hidden;
}

.cta:after{
  content:"";
  position:absolute;
  width:240px;
  height:240px;
  border-radius:50%;
  background:rgba(255, 255, 255, .08);
  right:-60px;
  top:-100px;
}

.cta h2{
  font-size:clamp(2rem, 4vw, 3.1rem);
  line-height:1.05;
  max-width:700px;
}

.cta h2 span{
  color:var(--yellow);
}

.page-hero{
  padding:120px 0 110px;
  background:linear-gradient(90deg, rgba(8, 43, 99, .94), rgba(18, 99, 215, .75)), url("https://images.unsplash.com/photo-1562259949-e8e7689d7828?auto=format&fit=crop&w=1800&q=85") center/cover;
  color:#fff;
}

.page-hero h1{
  color:#fff;
  font-size:clamp(3rem, 6vw, 5rem);
}

.breadcrumbs{
  display:flex;
  gap:10px;
  align-items:center;
  font-weight:700;
  color:#dce7ff;
}

.breadcrumbs i{
  font-size:.7rem;
  color:var(--yellow);
}

.service-sidebar{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:24px;
  box-shadow:var(--shadow);
}

.service-sidebar h3{
  color:var(--navy);
  margin-bottom:15px;
}

.service-sidebar a{
  display:flex;
  justify-content:space-between;
  padding:13px 14px;
  border-radius:10px;
  margin:6px 0;
  background:var(--soft);
  font-weight:800;
  font-size:.9rem;
}

.service-sidebar a:hover, .service-sidebar a.active{
  background:var(--navy);
  color:#fff;
}

.detail-image{
  border-radius:20px;
  overflow:hidden;
  margin-bottom:30px;
}

.detail-image img{
  width:100%;
  height:420px;
  object-fit:cover;
}

.detail-content h2{
  font-size:2.6rem;
  color:var(--navy);
  line-height:1.1;
  margin-bottom:18px;
}

.detail-content h3{
  color:var(--navy);
  margin:28px 0 12px;
}

.detail-content p{
  color:var(--muted);
  margin-bottom:14px;
}

.detail-list{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:10px 20px;
  list-style:none;
  margin:22px 0;
}

.detail-list li{
  padding:10px 0;
  border-bottom:1px solid var(--line);
}

.detail-list i{
  color:var(--green);
  margin-right:10px;
}

.contact-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:28px;
  box-shadow:var(--shadow);
}

.contact-item{
  display:flex;
  gap:14px;
  margin:20px 0;
}

.contact-item i{
  width:42px;
  height:42px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--soft);
  color:var(--blue);
}

.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}

.form-group{
  margin-bottom:16px;
}

.form-group.full{
  grid-column:1/-1;
}

label{
  display:block;
  font-weight:800;
  color:var(--navy);
  margin-bottom:7px;
  font-size:.88rem;
}

input, select, textarea{
  width:100%;
  padding:14px 15px;
  border:1px solid #dbe3ee;
  border-radius:12px;
  font:inherit;
  outline:none;
  transition:.2s;
  background:#fff;
}

input:focus, select:focus, textarea:focus{
  border-color:var(--blue);
  box-shadow:0 0 0 4px rgba(18, 99, 215, .1);
}

textarea{
  min-height:150px;
  resize:vertical;
}

.map{
  border-radius:20px;
  overflow:hidden;
  min-height:400px;
  background:#dfe8f5;
}

.map iframe{
  width:100%;
  height:100%;
  border:0;
  min-height:400px;
}

.reveal{
  opacity:0;
  transform:translateY(30px);
  transition:.7s ease;
}

.reveal.show{
  opacity:1;
  transform:none;
}

.footer{
  position:relative;
  background-image:url("../assets/images/footer-bg.jpg");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  color:#fff;
  overflow:hidden;
  padding-top:90px;
}

.footer-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(
            135deg,
            rgba(5,24,58,.97),
            rgba(10,46,101,.94)
        );
  z-index:0;
}

.footer .container{
  position:relative;
  z-index:2;
}

.footer-shape{
  position:absolute;
  border-radius:50%;
  filter:blur(5px);
  opacity:.18;
  z-index:1;
}

.footer-shape-one{
  width:350px;
  height:350px;
  background:#ff3d3d;
  top:-160px;
  right:-100px;
}

.footer-shape-two{
  width:280px;
  height:280px;
  background:#fdb913;
  bottom:-160px;
  left:-100px;
}

.footer-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:40px;
  padding:0 0 60px;
  margin-bottom:65px;
  border-bottom:1px solid rgba(255,255,255,.15);
}

.footer-cta-content{
  max-width:650px;
}

.footer-cta-content span{
  display:block;
  color:#fdb913;
  font-size:13px;
  font-weight:800;
  letter-spacing:2px;
  margin-bottom:12px;
}

.footer-cta-content h2{
  color:#fff;
  font-size:42px;
  line-height:1.15;
  margin-bottom:14px;
}

.footer-cta-content p{
  color:rgba(255,255,255,.72);
  font-size:16px;
  line-height:1.7;
}

.footer-cta-buttons{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}

.footer-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:16px 24px;
  border-radius:10px;
  text-decoration:none;
  font-size:14px;
  font-weight:800;
  text-transform:uppercase;
  transition:.35s ease;
}

.footer-btn-primary{
  background:linear-gradient(
        135deg,
        #ff3d3d,
        #fdb913
    );
  color:#fff;
  box-shadow:0 12px 30px rgba(255,61,61,.25);
}

.footer-btn-primary:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 35px rgba(255,61,61,.35);
}

.footer-btn-phone{
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.22);
  color:#fff;
  backdrop-filter:blur(10px);
}

.footer-btn-phone:hover{
  background:#fff;
  color:#0b2d68;
  transform:translateY(-4px);
}

.footer-main{
  display:grid;
  grid-template-columns:1.3fr .8fr 1fr 1.2fr;
  gap:55px;
  padding-bottom:65px;
}

.footer-column h4{
  position:relative;
  color:#fff;
  font-size:20px;
  margin-bottom:28px;
  padding-bottom:15px;
}

.footer-column h4::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:45px;
  height:3px;
  border-radius:20px;
  background:linear-gradient(
        90deg,
        #ff3d3d,
        #fdb913
    );
}

.footer-logo{
  display:inline-flex;
  align-items:center;
  gap:12px;
  color:#fff;
  text-decoration:none;
  margin-bottom:24px;
}

.footer-logo-mark{
  width:55px;
  height:55px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:16px;
  background:linear-gradient(
        135deg,
        #1a5fd0,
        #ff3d3d
    );
  font-size:24px;
  box-shadow:0 12px 30px rgba(0,0,0,.25);
}

.footer-logo-text{
  display:flex;
  flex-direction:column;
  font-size:22px;
  font-weight:900;
  letter-spacing:.4px;
}

.footer-logo-text small{
  color:rgba(255,255,255,.68);
  font-size:10px;
  letter-spacing:1.5px;
  margin-top:4px;
}

.footer-about p{
  color:rgba(255,255,255,.7);
  line-height:1.85;
  margin-bottom:22px;
}

.footer-badges{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:25px;
}

.footer-badges span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 13px;
  border-radius:30px;
  background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.12);
  color:#fff;
  font-size:12px;
}

.footer-badges i{
  color:#fdb913;
}

.socials{
  display:flex;
  gap:12px;
}

.socials a{
  width:43px;
  height:43px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  color:#fff;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.13);
  text-decoration:none;
  transition:.35s ease;
}

.socials a:hover{
  background:#fdb913;
  color:#0b2d68;
  transform:translateY(-5px);
}

.footer-links{
  list-style:none;
  margin:0;
  padding:0;
}

.footer-links li{
  margin-bottom:14px;
}

.footer-links a{
  display:inline-flex;
  align-items:center;
  gap:9px;
  color:rgba(255,255,255,.72);
  text-decoration:none;
  font-size:14px;
  transition:.3s ease;
}

.footer-links a i{
  color:#fdb913;
  font-size:11px;
  transition:.3s ease;
}

.footer-links a:hover{
  color:#fff;
  transform:translateX(6px);
}

.footer-contact{
  display:flex;
  flex-direction:column;
  gap:17px;
}

.footer-contact-item{
  display:flex;
  align-items:flex-start;
  gap:13px;
  color:#fff;
  text-decoration:none;
}

.footer-contact-icon{
  min-width:42px;
  width:42px;
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  color:#fff;
  background:linear-gradient(
        135deg,
        rgba(255,61,61,.9),
        rgba(253,185,19,.9)
    );
  box-shadow:0 8px 22px rgba(0,0,0,.18);
}

.footer-contact-item span:last-child{
  color:rgba(255,255,255,.86);
  font-size:13px;
  line-height:1.55;
  word-break:break-word;
}

.footer-contact-item small{
  display:block;
  color:#fdb913;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:1px;
  margin-bottom:3px;
}

.footer-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
  padding:24px 0;
  border-top:1px solid rgba(255,255,255,.14);
  color:rgba(255,255,255,.65);
  font-size:13px;
}

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

.footer-bottom-links a{
  color:rgba(255,255,255,.7);
  text-decoration:none;
  transition:.3s;
}

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

.whatsapp{
  position:fixed;
  right:25px;
  bottom:25px;
  width:60px;
  height:60px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#25d366;
  color:#fff;
  border-radius:50%;
  font-size:30px;
  text-decoration:none;
  z-index:9999;
  box-shadow:0 14px 35px rgba(37,211,102,.4);
  animation:whatsappPulse 2s infinite;
  transition:.35s ease;
}

.whatsapp:hover{
  transform:translateY(-6px) scale(1.05);
}

@keyframes whatsappPulse{
  0%{
  
          box-shadow:
              0 0 0 0 rgba(37,211,102,.45),
              0 14px 35px rgba(37,211,102,.4);
  
      }
  
      70%{
  
          box-shadow:
              0 0 0 18px rgba(37,211,102,0),
              0 14px 35px rgba(37,211,102,.4);
  
      }
  
      100%{
  
          box-shadow:
              0 0 0 0 rgba(37,211,102,0),
              0 14px 35px rgba(37,211,102,.4);
  
      }
}

@media (max-width:1100px){
  .footer-main{
    grid-template-columns:repeat(2,1fr);
  }

  .footer-top{
    align-items:flex-start;
    flex-direction:column;
  }

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

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

  .trust-item{
    border-right:0;
    border-bottom:1px solid var(--line);
  }

  .menu, .phone-pill{
    display:none;
  }

  .mobile-toggle{
    display:block;
  }

  .menu.open{
    display:flex;
    position:absolute;
    left:4%;
    right:4%;
    top:78px;
    background:#fff;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    padding:15px;
    border-radius:16px;
    box-shadow:var(--shadow);
  }

  .menu.open a{
    padding:13px;
  }

  .dropdown-menu{
    position:static;
    opacity:1;
    visibility:visible;
    transform:none;
    box-shadow:none;
    border:0;
    display:none;
  }

  .dropdown.open .dropdown-menu{
    display:block;
  }
}

@media (max-width:820px){
  .hero{
    min-height:620px;
    background:linear-gradient(rgba(255, 255, 255, .92), rgba(255, 255, 255, .92)), url("https://images.unsplash.com/photo-1600585154340-be6161a56a0c?auto=format&fit=crop&w=1200&q=80") center/cover;
  }

  .about-grid, .why-grid, .contact-grid, .service-detail-grid{
    grid-template-columns:1fr;
    gap:38px;
  }

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

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

  .footer-main{
    grid-template-columns:1fr 1fr;
  }

  .cta{
    flex-direction:column;
    align-items:flex-start;
  }

  .topbar-inner{
    justify-content:center;
  }

  .topbar-group:last-child{
    display:none;
  }
}

@media (max-width:620px){
  .section{
    padding:72px 0;
  }

  .hero h1{
    font-size:3.25rem;
  }

  .trust-grid, .services-grid, .projects-grid, .mini-features, .detail-list, .form-grid{
    grid-template-columns:1fr;
  }

  .trust-strip{
    margin-top:-28px;
  }

  .trust-item{
    border-bottom:1px solid var(--line);
  }

  .nav-actions .btn{
    display:none;
  }

  .footer-main{
    grid-template-columns:1fr;
  }

  .footer-bottom{
    flex-direction:column;
    text-align:center;
  }

  .image-card img{
    height:400px;
  }

  .experience-badge{
    width:118px;
    height:118px;
  }

  .cta{
    padding:30px 24px;
  }
}

.before-after{
  padding:120px 0;
  background:#fff;
}

.section-title{
  text-align:center;
  max-width:700px;
  margin:auto auto 70px;
}

.section-title span{
  color:#ff3d3d;
  font-weight:700;
  letter-spacing:2px;
  text-transform:uppercase;
}

.section-title h2{
  line-height:1.05;
  letter-spacing:-1.5px;
  font-size:55px;
  color:#0B2D68;
  margin:15px 0;
  font-weight:800;
}

.section-title h2 strong{
  color:#FDB913;
}

.section-title p{
  margin-top:15px;
  color:#666;
  line-height:1.8;
}

.ba-wrapper{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:40px;
}

.ba-card{
  background:#fff;
  border-radius:25px;
  overflow:hidden;
  box-shadow:0 20px 50px rgba(0,0,0,.08);
  transition:.4s;
}

.ba-card:hover{
  transform:translateY(-8px);
}

.compare{
  position:relative;
  overflow:hidden;
  height:500px;
}

.compare img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.after{
  position:absolute;
  inset:0;
}

.before-box{
  position:absolute;
  inset:0;
  width:50%;
  overflow:hidden;
}

.before-box img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.slider{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:0;
  cursor:ew-resize;
  z-index:20;
}

.divider{
  position:absolute;
  top:0;
  left:50%;
  width:4px;
  height:100%;
  background:#fff;
  transform:translateX(-50%);
  box-shadow:0 0 20px rgba(0,0,0,.4);
  z-index:15;
}

.divider::after{
  content:"↔";
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:65px;
  height:65px;
  border-radius:50%;
  background:#0B2D68;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:28px;
  font-weight:bold;
}

.tag{
  position:absolute;
  top:25px;
  padding:10px 20px;
  color:#fff;
  border-radius:30px;
  font-size:14px;
  font-weight:700;
  z-index:30;
}

.before-tag{
  left:25px;
  background:#ff3d3d;
}

.after-tag{
  right:25px;
  background:#0B2D68;
}

.project-info{
  padding:35px;
}

.project-info h3{
  color:#0B2D68;
  margin-bottom:15px;
  font-size:28px;
}

.project-info p{
  color:#666;
  line-height:1.8;
}

.service-page-hero{
  background-image:url("../assets/images/driveway-hero.jpg");
  background-size:cover;
  background-position:center;
  position:relative;
  display:flex;
  align-items:center;
  min-height:460px;
  overflow:hidden;
  isolation:isolate;
  background:url("../assets/images/driveway-hero.jpg")
    center/cover no-repeat;
}

.service-page-overlay{
  position:absolute;
  inset:0;
  z-index:-2;
  background:linear-gradient(
      90deg,
      rgba(5,24,58,.98) 0%,
      rgba(8,43,99,.92) 48%,
      rgba(18,99,215,.48) 100%
    );
}

.service-page-hero::before{
  content:"";
  position:absolute;
  z-index:-1;
  top:-180px;
  left:-150px;
  width:430px;
  height:430px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:50%;
  box-shadow:0 0 0 55px rgba(255,255,255,.035),
    0 0 0 110px rgba(255,255,255,.02);
}

.service-page-hero::after{
  opacity:.8;
  content:"";
  position:absolute;
  right:-100px;
  bottom:-145px;
  z-index:-1;
  width:480px;
  height:300px;
  border-radius:65% 0 0 0;
  background:linear-gradient(
      135deg,
      rgba(241,63,79,.92),
      rgba(255,189,24,.9)
    );
  transform:rotate(-8deg);
}

.service-page-hero .container{
  position:relative;
  z-index:2;
  width:min(1180px,92%);
}

.service-page-hero-content{
  max-width:820px;
  padding:100px 0;
}

.service-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:12px;
  margin-bottom:18px;
  color:var(--yellow);
  font-size:.76rem;
  font-weight:900;
  letter-spacing:2px;
  text-transform:uppercase;
}

.service-eyebrow::before{
  content:"";
  width:36px;
  height:3px;
  border-radius:10px;
  background:var(--red);
}

.service-page-hero h1{
  margin-bottom:20px;
  max-width:790px;
  margin:0 0 22px;
  color:#fff;
  font-size:clamp(2.8rem,5vw,4.2rem);
  line-height:1.04;
  letter-spacing:-2px;
}

.service-page-hero p{
  max-width:680px;
  margin-bottom:30px;
  color:rgba(255,255,255,.78);
  font-size:1.08rem;
  line-height:1.8;
}

.service-breadcrumbs{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:11px;
  color:#fff;
  font-size:.86rem;
  font-weight:700;
}

.service-breadcrumbs a{
  text-decoration:none;
  color:rgba(255,255,255,.72);
  transition:.3s ease;
}

.service-breadcrumbs a:hover{
  color:var(--yellow);
}

.service-breadcrumbs i{
  color:var(--yellow);
  font-size:.62rem;
}

.service-detail-section{
  position:relative;
  padding:110px 0;
  overflow:hidden;
  background:radial-gradient(
      circle at 90% 5%,
      rgba(18,99,215,.08),
      transparent 24%
    ),
    linear-gradient(
      180deg,
      var(--soft) 0,
      #fff 38%
    );
}

.service-detail-layout{
  display:grid;
  grid-template-columns:350px minmax(0,1fr);
  gap:55px;
  align-items:start;
}

.service-main-content{
  min-width:0;
}

.service-sidebar-modern{
  position:sticky;
  top:105px;
  display:flex;
  flex-direction:column;
  gap:24px;
}

.sidebar-widget{
  position:relative;
  overflow:hidden;
  padding:28px;
  background:rgba(255,255,255,.96);
  border:1px solid rgba(8,43,99,.07);
  border-radius:22px;
  box-shadow:0 18px 45px rgba(8,43,99,.09);
  backdrop-filter:blur(10px);
}

.sidebar-widget::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:4px;
  background:linear-gradient(
      90deg,
      var(--red),
      var(--yellow),
      var(--blue)
    );
}

.sidebar-title span, .sidebar-small-title{
  display:block;
  margin-bottom:7px;
  color:var(--red);
  font-size:.7rem;
  font-weight:900;
  letter-spacing:1.6px;
  text-transform:uppercase;
}

.sidebar-title h3, .sidebar-info-card h3{
  margin-bottom:24px;
  margin:0 0 24px;
  color:var(--navy);
  font-size:1.55rem;
  line-height:1.2;
}

.sidebar-service-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.sidebar-service-list a{
  text-decoration:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:15px 16px;
  color:var(--navy);
  background:var(--soft);
  border:1px solid transparent;
  border-radius:12px;
  font-size:.8rem;
  font-weight:800;
  transition:.35s ease;
}

.sidebar-service-list a span{
  display:flex;
  align-items:center;
  gap:11px;
}

.sidebar-service-list a span i{
  width:19px;
  color:var(--red);
  text-align:center;
}

.sidebar-service-list a > i{
  font-size:.68rem;
  transition:.35s ease;
}

.sidebar-service-list a:hover, .sidebar-service-list a.active{
  color:#fff;
  background:linear-gradient(
      135deg,
      var(--navy),
      var(--blue)
    );
  box-shadow:0 12px 25px rgba(8,43,99,.22);
  transform:translateX(6px);
}

.sidebar-service-list a:hover i, .sidebar-service-list a.active i{
  color:var(--yellow);
}

.sidebar-service-list a:hover > i, .sidebar-service-list a.active > i{
  transform:translateX(3px);
}

.sidebar-contact-list{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.sidebar-contact-item{
  text-decoration:none;
  display:flex;
  align-items:flex-start;
  gap:13px;
  color:#243653;
}

.sidebar-contact-icon{
  min-width:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 43px;
  width:43px;
  height:43px;
  color:#fff;
  background:linear-gradient(
      135deg,
      var(--red),
      var(--yellow)
    );
  border-radius:13px;
  box-shadow:0 8px 18px rgba(241,63,79,.18);
}

.sidebar-contact-item span:last-child{
  word-break:break-word;
  font-size:.8rem;
  line-height:1.55;
  overflow-wrap:anywhere;
}

.sidebar-contact-item small{
  display:block;
  margin-bottom:2px;
  color:#8493a8;
  font-size:.63rem;
  font-weight:900;
  letter-spacing:1px;
  text-transform:uppercase;
}

.sidebar-cta-card{
  background-image:url("../assets/images/painting-sidebar.jpg");
  background-size:cover;
  background-position:center;
  position:relative;
  min-height:400px;
  overflow:hidden;
  padding:32px;
  border-radius:22px;
  background:url("../assets/images/painting-sidebar.jpg")
    center/cover no-repeat;
  box-shadow:0 22px 48px rgba(5,24,58,.25);
  isolation:isolate;
}

.sidebar-cta-overlay{
  position:absolute;
  inset:0;
  z-index:-2;
  background:linear-gradient(
      180deg,
      rgba(5,24,58,.28),
      rgba(5,24,58,.98)
    );
}

.sidebar-cta-card::after{
  content:"";
  position:absolute;
  z-index:-1;
  top:-75px;
  right:-75px;
  width:180px;
  height:180px;
  border-radius:50%;
  background:rgba(255,189,24,.2);
  box-shadow:0 0 0 25px rgba(255,255,255,.035);
}

.sidebar-cta-content{
  height:100%;
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  min-height:336px;
}

.sidebar-cta-content > span{
  margin-bottom:10px;
  color:var(--yellow);
  font-size:.7rem;
  font-weight:900;
  letter-spacing:1.7px;
  text-transform:uppercase;
}

.sidebar-cta-content h3{
  margin-bottom:14px;
  margin:0 0 14px;
  color:#fff;
  font-size:1.7rem;
  line-height:1.24;
}

.sidebar-cta-content p{
  margin-bottom:22px;
  color:rgba(255,255,255,.74);
  font-size:.84rem;
  line-height:1.75;
}

.sidebar-cta-button, .sidebar-cta-phone, .map-direction-link{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  font-weight:900;
  transition:.35s ease;
}

.sidebar-cta-button{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  font-weight:800;
  text-decoration:none;
  transition:.35s ease;
  padding:15px 18px;
  color:#fff;
  background:linear-gradient(
      135deg,
      var(--red),
      var(--yellow)
    );
  border-radius:11px;
  font-size:.75rem;
  text-transform:uppercase;
  box-shadow:0 10px 24px rgba(241,63,79,.25);
}

.sidebar-cta-button:hover{
  transform:translateY(-4px);
}

.sidebar-cta-phone{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  text-decoration:none;
  font-weight:700;
  margin-top:15px;
  color:#fff;
  font-size:.86rem;
}

.sidebar-cta-phone:hover{
  color:var(--yellow);
}

.sidebar-map-card{
  padding-bottom:20px;
}

.sidebar-map{
  height:230px;
  overflow:hidden;
  border-radius:15px;
  box-shadow:inset 0 0 0 1px rgba(8,43,99,.08);
}

.sidebar-map iframe{
  width:100%;
  height:100%;
  border:0;
}

.map-direction-link{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  font-weight:800;
  text-decoration:none;
  margin-top:18px;
  color:var(--navy);
  font-size:.73rem;
  letter-spacing:.5px;
  text-transform:uppercase;
}

.map-direction-link:hover{
  color:var(--blue);
  transform:translateY(-2px);
}

.service-featured-image{
  position:relative;
  height:540px;
  overflow:hidden;
  margin-bottom:48px;
  border-radius:28px;
  box-shadow:0 26px 65px rgba(8,43,99,.16);
}

.service-featured-image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .85s ease;
}

.service-featured-image::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
      180deg,
      transparent 44%,
      rgba(5,24,58,.68)
    );
}

.service-featured-image:hover img{
  transform:scale(1.055);
}

.service-image-badge{
  position:absolute;
  bottom:28px;
  left:28px;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  width:140px;
  height:140px;
  color:var(--navy);
  background:#fff;
  border:6px solid rgba(255,255,255,.45);
  border-radius:50%;
  box-shadow:0 16px 40px rgba(0,0,0,.22);
  text-align:center;
}

.service-image-badge strong{
  color:var(--red);
  font-size:2.35rem;
  line-height:1;
}

.service-image-badge span{
  margin-top:7px;
  padding:0 17px;
  font-size:.64rem;
  font-weight:900;
  line-height:1.3;
  text-transform:uppercase;
}

.service-image-label{
  position:absolute;
  right:28px;
  bottom:28px;
  z-index:2;
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 19px;
  color:var(--navy);
  background:rgba(255,255,255,.94);
  border:1px solid rgba(255,255,255,.55);
  border-radius:40px;
  font-size:.73rem;
  font-weight:900;
  backdrop-filter:blur(12px);
}

.service-image-label i{
  color:var(--red);
}

.content-eyebrow{
  display:block;
  margin-bottom:12px;
  color:var(--red);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:1.8px;
  text-transform:uppercase;
}

.service-content-header h2{
  margin-bottom:20px;
  margin:0 0 20px;
  color:var(--navy);
  font-size:clamp(2.35rem,4vw,3.15rem);
  line-height:1.12;
  letter-spacing:-1.5px;
}

.service-lead{
  max-width:850px;
  color:#52647d;
  font-size:1.12rem;
  line-height:1.85;
}

.service-intro-grid{
  display:grid;
  grid-template-columns:1.4fr .8fr;
  gap:35px;
  margin:42px 0 65px;
}

.service-intro-text p{
  margin-bottom:18px;
  color:#5e6e83;
  line-height:1.9;
}

.service-highlight-card{
  position:relative;
  overflow:hidden;
  padding:30px;
  color:#fff;
  background:linear-gradient(
      145deg,
      var(--navy),
      var(--blue)
    );
  border-radius:21px;
  box-shadow:0 18px 42px rgba(8,43,99,.18);
}

.service-highlight-card::after{
  content:"";
  position:absolute;
  right:-55px;
  bottom:-65px;
  width:150px;
  height:150px;
  border-radius:50%;
  background:rgba(255,189,24,.16);
}

.service-highlight-card i{
  display:flex;
  align-items:center;
  justify-content:center;
  width:55px;
  height:55px;
  margin-bottom:20px;
  color:var(--yellow);
  background:rgba(255,255,255,.13);
  border-radius:15px;
  font-size:1.4rem;
}

.service-highlight-card h3{
  margin-bottom:12px;
  color:#fff;
  font-size:1.35rem;
}

.service-highlight-card p{
  color:rgba(255,255,255,.76);
  line-height:1.75;
}

.service-section-heading{
  margin-bottom:30px;
}

.service-section-heading span{
  display:block;
  margin-bottom:8px;
  color:var(--red);
  font-size:.7rem;
  font-weight:900;
  letter-spacing:1.6px;
  text-transform:uppercase;
}

.service-section-heading h3{
  color:var(--navy);
  font-size:clamp(1.8rem,3vw,2.25rem);
  line-height:1.2;
}

.service-benefit-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
  margin-bottom:70px;
}

.service-benefit-card{
  position:relative;
  overflow:hidden;
  padding:28px;
  background:#fff;
  border:1px solid rgba(8,43,99,.075);
  border-radius:20px;
  box-shadow:0 14px 34px rgba(8,43,99,.065);
  transition:.35s ease;
}

.service-benefit-card::after{
  content:"";
  position:absolute;
  right:-35px;
  bottom:-35px;
  width:85px;
  height:85px;
  border-radius:50%;
  background:rgba(18,99,215,.045);
  transition:.35s ease;
}

.service-benefit-card:hover{
  border-color:rgba(18,99,215,.18);
  box-shadow:0 22px 48px rgba(8,43,99,.13);
  transform:translateY(-8px);
}

.service-benefit-card:hover::after{
  transform:scale(1.8);
}

.benefit-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:59px;
  height:59px;
  margin-bottom:20px;
  color:var(--red);
  background:linear-gradient(
      135deg,
      rgba(241,63,79,.12),
      rgba(255,189,24,.22)
    );
  border-radius:17px;
  font-size:1.45rem;
  transition:.35s ease;
}

.service-benefit-card:hover .benefit-icon{
  color:#fff;
  background:linear-gradient(
      135deg,
      var(--red),
      var(--yellow)
    );
  transform:rotate(-5deg) scale(1.05);
}

.service-benefit-card h4{
  margin-bottom:10px;
  color:var(--navy);
  font-size:1.08rem;
}

.service-benefit-card p{
  color:#68788d;
  font-size:.85rem;
  line-height:1.75;
}

.service-process-section{
  margin-bottom:60px;
  padding:46px;
  background:linear-gradient(
      145deg,
      #f8faff,
      #eef4fc
    );
  border:1px solid rgba(8,43,99,.06);
  border-radius:28px;
}

.service-process-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
}

.process-step{
  position:relative;
  padding-top:8px;
}

.process-step span{
  display:flex;
  align-items:center;
  justify-content:center;
  width:53px;
  height:53px;
  margin-bottom:20px;
  color:#fff;
  background:linear-gradient(
      135deg,
      var(--red),
      var(--yellow)
    );
  border:5px solid #fff;
  border-radius:50%;
  box-shadow:0 10px 25px rgba(241,63,79,.2);
  font-size:.82rem;
  font-weight:900;
}

.process-step:not(:last-child)::after{
  content:"";
  position:absolute;
  top:34px;
  left:66px;
  width:calc(100% - 42px);
  height:2px;
  background:linear-gradient(
      90deg,
      var(--yellow),
      rgba(255,189,24,.12)
    );
}

.process-step h4{
  margin-bottom:10px;
  color:var(--navy);
  font-size:1.05rem;
}

.process-step p{
  color:#6c7c90;
  font-size:.79rem;
  line-height:1.75;
}

.service-preparation-box{
  display:flex;
  align-items:flex-start;
  gap:25px;
  margin-bottom:60px;
  padding:36px;
  background:#fff;
  border:1px solid rgba(8,43,99,.065);
  border-left:5px solid var(--yellow);
  border-radius:22px;
  box-shadow:0 18px 44px rgba(8,43,99,.085);
}

.preparation-icon{
  min-width:70px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 70px;
  width:70px;
  height:70px;
  color:#fff;
  background:linear-gradient(
      135deg,
      var(--navy),
      var(--blue)
    );
  border-radius:18px;
  box-shadow:0 12px 26px rgba(8,43,99,.2);
  font-size:1.7rem;
}

.service-preparation-box span{
  color:var(--red);
  font-size:.68rem;
  font-weight:900;
  letter-spacing:1.5px;
  text-transform:uppercase;
}

.service-preparation-box h3{
  margin:8px 0 12px;
  color:var(--navy);
  font-size:1.65rem;
}

.service-preparation-box p{
  color:#68788d;
  line-height:1.85;
}

.service-final-cta{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:35px;
  overflow:hidden;
  padding:50px;
  background:linear-gradient(
      135deg,
      #071c42,
      var(--navy),
      var(--blue)
    );
  border-radius:28px;
  box-shadow:0 25px 58px rgba(8,43,99,.24);
  isolation:isolate;
}

.service-final-cta::before, .service-final-cta::after{
  content:"";
  position:absolute;
  z-index:-1;
  border-radius:50%;
}

.service-final-cta::before{
  content:"";
  position:absolute;
  border-radius:50%;
  right:-95px;
  bottom:-155px;
  width:270px;
  height:270px;
  background:rgba(255,189,24,.2);
}

.service-final-cta::after{
  top:-110px;
  left:42%;
  width:210px;
  height:210px;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 0 0 35px rgba(255,255,255,.025);
}

.service-final-cta-content, .service-final-cta-actions{
  position:relative;
  z-index:2;
}

.service-final-cta-content span{
  color:var(--yellow);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:1.7px;
  text-transform:uppercase;
}

.service-final-cta-content h2{
  max-width:600px;
  margin:10px 0;
  color:#fff;
  font-size:clamp(1.85rem,3vw,2.3rem);
  line-height:1.18;
}

.service-final-cta-content p{
  color:rgba(255,255,255,.7);
}

.service-final-cta-actions{
  display:flex;
  flex-direction:column;
  gap:12px;
  min-width:215px;
}

.service-cta-primary, .service-cta-secondary{
  text-decoration:none;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:15px 20px;
  border-radius:11px;
  font-size:.74rem;
  font-weight:900;
  text-transform:uppercase;
  transition:.35s ease;
}

.service-cta-primary{
  color:#fff;
  background:linear-gradient(
      135deg,
      var(--red),
      var(--yellow)
    );
  box-shadow:0 10px 25px rgba(241,63,79,.25);
}

.service-cta-secondary{
  color:#fff;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.25);
  backdrop-filter:blur(8px);
}

.service-cta-primary:hover, .service-cta-secondary:hover{
  transform:translateY(-4px);
}

.service-cta-secondary:hover{
  color:var(--navy);
  background:#fff;
}

@media (max-width:1200px){
  .service-detail-layout{
    grid-template-columns:310px minmax(0,1fr);
    gap:35px;
  }

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

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

  .process-step:nth-child(2)::after{
    display:none;
  }
}

@media (max-width:991px){
  .ba-wrapper{
    grid-template-columns:1fr;
  }

  .compare{
    height:350px;
  }

  .section-title h2{
    font-size:40px;
  }

  .service-page-hero h1{
    font-size:46px;
  }

  .service-detail-layout{
    grid-template-columns:1fr;
  }

  .service-sidebar-modern{
    position:static;
    order:2;
  }

  .service-main-content{
    order:1;
  }

  .service-intro-grid{
    grid-template-columns:1fr;
  }

  .service-final-cta{
    align-items:flex-start;
    flex-direction:column;
  }

  .service-final-cta-actions{
    width:100%;
  }
}

@media (max-width:767px){
  .footer{
    padding-top:70px;
  }

  .footer-top{
    margin-bottom:50px;
    padding-bottom:50px;
  }

  .footer-cta-content h2{
    font-size:34px;
  }

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

  .footer-cta-buttons{
    width:100%;
  }

  .footer-btn{
    width:100%;
  }

  .footer-bottom{
    flex-direction:column;
    text-align:center;
  }

  .footer-bottom-links{
    justify-content:center;
    flex-wrap:wrap;
  }

  .service-page-hero h1{
    font-size:38px;
  }

  .service-content-header h2{
    font-size:38px;
  }

  .service-final-cta-content h2{
    font-size:29px;
  }

  .service-page-hero{
    min-height:390px;
  }

  .service-page-hero-content{
    padding:78px 0;
  }

  .service-page-hero p{
    font-size:.98rem;
  }

  .service-detail-section{
    padding:75px 0;
  }

  .service-featured-image{
    height:390px;
    border-radius:22px;
  }

  .service-image-badge{
    width:110px;
    height:110px;
  }

  .service-image-badge strong{
    font-size:1.95rem;
  }

  .service-image-label{
    display:none;
  }

  .service-benefit-grid, .service-process-grid{
    grid-template-columns:1fr;
  }

  .process-step::after{
    display:none;
  }

  .service-process-section{
    padding:30px;
  }

  .service-preparation-box{
    flex-direction:column;
  }

  .service-final-cta{
    padding:36px 28px;
  }
}

@media (max-width:480px){
  .footer-cta-content h2{
    font-size:29px;
  }

  .footer-logo-text{
    font-size:19px;
  }

  .whatsapp{
    width:54px;
    height:54px;
    right:18px;
    bottom:18px;
    font-size:26px;
  }

  .service-content-header h2{
    font-size:32px;
  }

  .service-benefit-card, .sidebar-widget{
    padding:22px;
  }

  .service-page-hero h1{
    font-size:2rem;
    letter-spacing:-1px;
  }

  .service-featured-image{
    border-radius:20px;
    height:320px;
  }

  .sidebar-widget, .service-benefit-card{
    padding:22px;
  }

  .sidebar-cta-card{
    min-height:360px;
    padding:25px;
  }

  .service-process-section, .service-preparation-box{
    padding:25px;
  }
}

body{
  font-family:Inter, Arial, Helvetica, sans-serif;
  color:var(--ink);
  background:#fff;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

.header{
  position:sticky;
  top:0;
  z-index:1000;
  background:rgba(255, 255, 255, .96);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(8, 43, 99, .08);
  transition:box-shadow .35s ease,background .35s ease;
}

.header:hover{
  box-shadow:0 10px 35px rgba(8,43,99,.08);
}

.logo, .phone-pill, .topbar a{
  transition:color .3s ease,transform .3s ease;
}

.logo:hover, .phone-pill:hover{
  transform:translateY(-2px);
}

.btn, .footer-btn, .sidebar-cta-button, .service-cta-primary, .service-cta-secondary, .map-direction-link{
  position:relative;
  overflow:hidden;
}

.btn::before, .footer-btn::before, .sidebar-cta-button::before, .service-cta-primary::before{
  content:"";
  position:absolute;
  top:-120%;
  left:-45%;
  width:35%;
  height:340%;
  background:rgba(255,255,255,.28);
  transform:rotate(24deg);
  transition:left .6s ease;
}

.btn:hover::before, .footer-btn:hover::before, .sidebar-cta-button:hover::before, .service-cta-primary:hover::before{
  left:125%;
}

.service-card, .project-card, .ba-card, .contact-card, .quote-card, .stat, .mini-feature, .sidebar-widget, .service-benefit-card, .service-highlight-card, .service-preparation-box{
  will-change:transform;
}

.project-card::after{
  content:"";
  position:absolute;
  inset:0;
  border:1px solid rgba(255,255,255,.2);
  border-radius:inherit;
  pointer-events:none;
}

.project-overlay{
  position:absolute;
  inset:auto 0 0;
  padding:70px 24px 24px;
  background:linear-gradient(transparent, rgba(8, 43, 99, .94));
  color:#fff;
  transform:translateY(8px);
  transition:transform .45s ease;
}

.project-card:hover .project-overlay{
  transform:translateY(0);
}

.service-card a.more{
  display:inline-block;
  margin-top:14px;
  color:var(--blue);
  font-weight:900;
  font-size:.82rem;
  position:relative;
}

.service-card a.more::after{
  content:"";
  position:absolute;
  right:100%;
  bottom:-4px;
  left:0;
  height:2px;
  background:var(--blue);
  transition:right .3s ease;
}

.service-card:hover a.more::after{
  right:0;
}

.contact-card, .quote-card{
  transition:transform .35s ease,box-shadow .35s ease;
}

.contact-card:hover, .quote-card:hover{
  transform:translateY(-6px);
  box-shadow:0 24px 60px rgba(8,43,99,.15);
}

.map iframe, .sidebar-map iframe{
  filter:saturate(.9) contrast(.96);
  transition:filter .4s ease,transform .6s ease;
}

.map:hover iframe, .sidebar-map:hover iframe{
  filter:saturate(1.08) contrast(1);
  transform:scale(1.015);
}

.footer-links a, .footer-contact-item, .socials a{
  will-change:transform;
}

.compare::after{
  content:"Drag to compare";
  position:absolute;
  bottom:20px;
  left:50%;
  z-index:14;
  padding:8px 13px;
  color:#fff;
  background:rgba(5,24,58,.7);
  border:1px solid rgba(255,255,255,.2);
  border-radius:30px;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.7px;
  text-transform:uppercase;
  backdrop-filter:blur(8px);
  transform:translateX(-50%);
  pointer-events:none;
}

.reveal:nth-child(2){
  transition-delay:.08s;
}

.reveal:nth-child(3){
  transition-delay:.16s;
}

.reveal:nth-child(4){
  transition-delay:.24s;
}

@media (prefers-reduced-motion:reduce){
  *, *::before, *::after{
    scroll-behavior:auto !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
}
/*==================================================
  FIX: STICKY SIDEBAR EN PÁGINAS DE SERVICIOS
==================================================*/

.service-detail-section{
    overflow:visible;
}

.service-detail-section .container{
    overflow:visible;
}

.service-detail-layout{
    display:grid;
    grid-template-columns:350px minmax(0, 1fr);
    gap:55px;
    align-items:start;
    overflow:visible;
}

.service-sidebar-modern{
    position:sticky;
    top:110px;
    align-self:start;
    height:max-content;
    overflow:visible;
}

.service-main-content{
    min-width:0;
    align-self:start;
}








.home-section-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
    color: var(--red);
    font-size: .76rem;
    font-weight: 900;
    letter-spacing: 1.8px;
    text-transform: uppercase
}

.home-section-kicker:before {
    content: "";
    width: 34px;
    height: 3px;
    background: linear-gradient(90deg, var(--red), var(--yellow));
    border-radius: 20px
}

.home-section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 45px;
    margin-bottom: 50px
}

.home-section-heading>div {
    max-width: 700px
}

.home-section-heading h2,
.home-about-content h2,
.home-why-content h2 {
    color: var(--navy);
    font-size: clamp(2.4rem, 4.5vw, 4rem);
    line-height: 1.05;
    letter-spacing: -2px
}

.home-section-heading h2 span,
.home-about-content h2 span,
.home-why-content h2 span {
    display: block;
    color: var(--blue)
}

.home-section-heading>p {
    max-width: 430px;
    color: var(--muted);
    line-height: 1.85
}

.home-section-heading-light h2,
.home-section-heading-light p {
    color: #fff
}

.home-section-heading-light h2 span {
    color: var(--yellow)
}

.home-about {
    position: relative;
    overflow: hidden;
    background: radial-gradient(circle at 5% 10%, rgba(18, 99, 215, .08), transparent 24%), #fff
}

.home-about-grid,
.home-why-grid {
    display: grid;
    grid-template-columns: 1.02fr .98fr;
    gap: 75px;
    align-items: center
}

.home-about-visual,
.home-why-visual {
    position: relative;
    min-height: 620px
}

.home-about-main-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 78%;
    height: 510px;
    overflow: hidden;
    border-radius: 30px;
    box-shadow: 0 25px 65px rgba(8, 43, 99, .18)
}

.home-about-secondary-image {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 48%;
    height: 300px;
    overflow: hidden;
    border: 10px solid #fff;
    border-radius: 26px;
    box-shadow: 0 20px 50px rgba(8, 43, 99, .14)
}

.home-about-main-image img,
.home-about-secondary-image img,
.home-why-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: .8s
}

.home-about-main-image:hover img,
.home-about-secondary-image:hover img,
.home-why-image:hover img {
    transform: scale(1.05)
}

.home-experience-card {
    position: absolute;
    bottom: 38px;
    left: 22px;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 14px;
    width: 220px;
    padding: 22px;
    color: #fff;
    background: linear-gradient(135deg, var(--navy), var(--blue));
    border-radius: 20px;
    box-shadow: 0 18px 40px rgba(8, 43, 99, .25)
}

.home-experience-card strong {
    color: var(--yellow);
    font-size: 2.5rem
}

.home-experience-card span {
    font-size: .72rem;
    font-weight: 800;
    line-height: 1.35;
    text-transform: uppercase
}

.home-about-rating,
.home-why-badge {
    position: absolute;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 18px;
    background: rgba(255, 255, 255, .94);
    border-radius: 17px;
    box-shadow: 0 15px 35px rgba(8, 43, 99, .12)
}

.home-about-rating {
    top: 42px;
    right: 0
}

.home-about-rating>i {
    color: var(--yellow);
    font-size: 1.45rem
}

.home-about-rating strong,
.home-about-rating span,
.home-call-link small,
.home-call-link strong,
.home-why-badge strong,
.home-why-badge span {
    display: block
}

.home-about-rating strong,
.home-why-badge strong {
    color: var(--navy);
    font-size: .82rem
}

.home-about-rating span,
.home-why-badge span {
    color: var(--muted);
    font-size: .68rem
}

.home-about-content>p {
    margin-top: 18px;
    color: var(--muted);
    line-height: 1.85
}

.home-about-content .home-lead {
    color: #42516a;
    font-size: 1.08rem
}

.home-about-features {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin: 32px 0
}

.home-feature-item {
    display: flex;
    gap: 13px;
    padding: 18px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    transition: .35s
}

.home-feature-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 16px 34px rgba(8, 43, 99, .09)
}

.home-feature-icon {
    display: grid;
    place-items: center;
    flex: 0 0 44px;
    height: 44px;
    color: var(--blue);
    background: var(--soft);
    border-radius: 13px
}

.home-feature-item strong,
.home-feature-item span {
    display: block
}

.home-feature-item strong {
    color: var(--navy);
    font-size: .84rem
}

.home-feature-item span {
    color: var(--muted);
    font-size: .72rem
}

.home-about-actions {
    display: flex;
    align-items: center;
    gap: 25px;
    flex-wrap: wrap
}

.home-call-link {
    display: flex;
    align-items: center;
    gap: 12px
}

.home-call-link>span {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    color: #fff;
    background: var(--red);
    border-radius: 50%
}

.home-call-link small {
    color: var(--muted);
    font-size: .68rem
}

.home-call-link strong {
    color: var(--navy)
}

.home-services {
    position: relative;
    overflow: hidden;
    background: #f5f8fd
}

.home-services-shape {
    position: absolute;
    border-radius: 50%
}

.home-services-shape-one {
    top: -180px;
    right: -160px;
    width: 420px;
    height: 420px;
    background: rgba(18, 99, 215, .08)
}

.home-services-shape-two {
    bottom: -180px;
    left: -160px;
    width: 360px;
    height: 360px;
    background: rgba(255, 189, 24, .1)
}

.home-services .container {
    position: relative;
    z-index: 2
}

.home-services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px
}

.home-service-card {
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(8, 43, 99, .07);
    border-radius: 22px;
    box-shadow: 0 14px 36px rgba(8, 43, 99, .07);
    transition: .4s
}

.home-service-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 24px 55px rgba(8, 43, 99, .14)
}

.home-service-featured {
    grid-column: span 2;
    display: grid;
    grid-template-columns: 1.12fr .88fr
}

.home-service-image {
    position: relative;
    height: 250px;
    overflow: hidden
}

.home-service-featured .home-service-image {
    height: 100%;
    min-height: 380px
}

.home-service-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: .8s
}

.home-service-card:hover img {
    transform: scale(1.07)
}

.home-service-number {
    position: absolute;
    top: 18px;
    right: 18px;
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    color: #fff;
    background: rgba(5, 24, 58, .76);
    border-radius: 50%;
    font-size: .72rem;
    font-weight: 900
}

.home-service-content {
    padding: 30px
}

.home-service-icon {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    margin: -58px 0 20px;
    color: #fff;
    background: linear-gradient(135deg, var(--red), var(--yellow));
    border: 6px solid #fff;
    border-radius: 17px
}

.home-service-featured .home-service-icon {
    margin-top: 0
}

.home-service-content h3 {
    margin-bottom: 12px;
    color: var(--navy);
    font-size: 1.3rem
}

.home-service-content p {
    color: var(--muted);
    font-size: .86rem
}

.home-service-content ul {
    margin: 20px 0;
    list-style: none
}

.home-service-content li {
    margin: 8px 0;
    color: #4c5d75;
    font-size: .8rem
}

.home-service-content li i {
    color: var(--green)
}

.home-service-content>a,
.home-services-footer>a,
.home-heading-link {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--blue);
    font-size: .78rem;
    font-weight: 900;
    text-transform: uppercase
}

.home-service-content>a {
    margin-top: 20px
}

.home-services-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 32px;
    padding: 22px 26px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px
}

.home-services-footer>div {
    display: flex;
    gap: 10px;
    color: var(--navy);
    font-weight: 800
}

.home-services-footer>div i {
    color: var(--red)
}

.home-why-content>p {
    margin: 20px 0 30px;
    color: var(--muted)
}

.home-why-item {
    display: grid;
    grid-template-columns: 58px 1fr;
    gap: 18px;
    padding: 20px 0;
    border-bottom: 1px solid var(--line)
}

.home-why-item>span {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    color: #fff;
    background: linear-gradient(135deg, var(--navy), var(--blue));
    border-radius: 16px;
    font-weight: 900
}

.home-why-item h3 {
    color: var(--navy)
}

.home-why-item p {
    color: var(--muted);
    font-size: .82rem
}

.home-why-image {
    position: absolute;
    inset: 0 0 80px 80px;
    overflow: hidden;
    border-radius: 30px;
    box-shadow: 0 25px 65px rgba(8, 43, 99, .16)
}

.home-why-quote {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
    width: 390px;
    padding: 30px;
    color: #fff;
    background: linear-gradient(135deg, var(--navy), var(--blue));
    border-radius: 22px
}

.home-why-quote>i {
    color: var(--yellow);
    font-size: 2rem
}

.home-why-badge {
    top: 35px;
    left: 20px
}

.home-why-badge>i {
    color: var(--red);
    font-size: 1.4rem
}

.home-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    margin-top: 75px
}

.home-stat {
    padding: 28px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    text-align: center;
    transition: .35s
}

.home-stat:hover {
    transform: translateY(-7px);
    box-shadow: 0 18px 40px rgba(8, 43, 99, .1)
}

.home-stat strong,
.home-stat span {
    display: block
}

.home-stat strong {
    color: var(--navy);
    font-size: 2.3rem
}

.home-stat span {
    color: var(--muted)
}

.home-before-after {
    color: #fff;
    background: radial-gradient(circle at 15% 20%, rgba(18, 99, 215, .25), transparent 24%), linear-gradient(135deg, #051832, #082b63)
}

.home-comparison-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 28px
}

.home-comparison-card {
    overflow: hidden;
    background: #fff;
    border-radius: 24px;
    box-shadow: 0 24px 55px rgba(0, 0, 0, .2)
}

.home-comparison {
    position: relative;
    height: 470px;
    overflow: hidden
}

.home-comparison img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.home-comparison-after {
    position: absolute;
    inset: 0
}

.home-comparison-before {
    position: absolute;
    inset: 0;
    width: 50%;
    overflow: hidden
}

.home-comparison-before img {
    width: 100%;
    max-width: none
}

.home-comparison-slider {
    position: absolute;
    inset: 0;
    z-index: 20;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: ew-resize
}

.home-comparison-divider {
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 12;
    width: 4px;
    height: 100%;
    background: #fff;
    transform: translateX(-50%)
}

.home-comparison-divider span {
    position: absolute;
    top: 50%;
    left: 50%;
    display: grid;
    place-items: center;
    width: 62px;
    height: 62px;
    color: #fff;
    background: var(--red);
    border: 5px solid #fff;
    border-radius: 50%;
    transform: translate(-50%, -50%)
}

.home-comparison-label {
    position: absolute;
    top: 20px;
    z-index: 14;
    padding: 9px 15px;
    color: #fff;
    border-radius: 30px;
    font-size: .7rem;
    font-weight: 900;
    text-transform: uppercase
}

.home-comparison-label-before {
    left: 20px;
    background: var(--red)
}

.home-comparison-label-after {
    right: 20px;
    background: var(--navy)
}

.home-comparison-info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 25px 28px
}

.home-comparison-info span {
    color: var(--red);
    font-size: .68rem;
    font-weight: 900;
    text-transform: uppercase
}

.home-comparison-info h3 {
    color: var(--navy)
}

.home-comparison-info>i {
    color: var(--blue);
    font-size: 1.7rem
}

.home-before-after-action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 35px;
    padding: 25px 28px;
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 18px
}

.home-before-after-action p {
    color: rgba(255, 255, 255, .75)
}

.home-projects {
    background: #f7f9fd
}

.home-projects-grid {
    display: grid;
    grid-template-columns: 1.25fr .75fr;
    grid-template-rows: repeat(2, 290px);
    gap: 22px
}

.home-project-card {
    position: relative;
    overflow: hidden;
    border-radius: 22px;
    box-shadow: 0 18px 45px rgba(8, 43, 99, .11)
}

.home-project-large {
    grid-row: span 2
}

.home-project-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: .8s
}

.home-project-card:hover img {
    transform: scale(1.07)
}

.home-project-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 30px;
    color: #fff;
    background: linear-gradient(180deg, transparent 38%, rgba(5, 24, 58, .92))
}

.home-project-overlay span {
    color: var(--yellow);
    font-size: .68rem;
    font-weight: 900;
    text-transform: uppercase
}

.home-project-overlay h3 {
    margin: 7px 0 15px
}

.home-project-overlay a {
    opacity: 0;
    transform: translateY(10px);
    transition: .35s
}

.home-project-card:hover .home-project-overlay a {
    opacity: 1;
    transform: none
}

.home-final-cta {
    padding: 0 0 100px;
    background: #f7f9fd
}

.home-final-cta-inner {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 30px;
    padding: 45px 48px;
    color: #fff;
    background: linear-gradient(135deg, #071c42, var(--navy), var(--blue));
    border-radius: 28px
}

.home-final-cta-icon {
    display: grid;
    place-items: center;
    width: 78px;
    height: 78px;
    color: var(--yellow);
    background: rgba(255, 255, 255, .1);
    border-radius: 22px;
    font-size: 2rem
}

.home-final-cta-content h2 {
    color: #fff;
    font-size: clamp(1.8rem, 3vw, 2.5rem)
}

.home-final-cta-content p {
    color: rgba(255, 255, 255, .7)
}

.home-final-cta-actions {
    display: flex;
    align-items: center;
    gap: 18px
}

.home-final-phone {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #fff;
    font-weight: 900
}

@media(max-width:1100px) {
    .home-services-grid {
        grid-template-columns: repeat(2, 1fr)
    }

    .home-final-cta-inner {
        grid-template-columns: auto 1fr
    }

    .home-final-cta-actions {
        grid-column: 1/-1
    }
}

@media(max-width:900px) {
    .home-section-heading {
        align-items: flex-start;
        flex-direction: column
    }

    .home-about-grid,
    .home-why-grid {
        grid-template-columns: 1fr
    }

    .home-services-grid {
        grid-template-columns: 1fr 1fr
    }

    .home-comparison-grid {
        grid-template-columns: 1fr
    }

    .home-projects-grid {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 430px 280px
    }

    .home-project-large {
        grid-column: 1/-1;
        grid-row: auto
    }
}

@media(max-width:700px) {

    .home-about-features,
    .home-services-grid,
    .home-stats {
        grid-template-columns: 1fr
    }

    .home-service-featured {
        grid-column: auto;
        display: block
    }

    .home-service-featured .home-service-image {
        height: 250px;
        min-height: 0
    }

    .home-about-visual {
        min-height: 520px
    }

    .home-about-main-image {
        width: 88%;
        height: 420px
    }

    .home-about-secondary-image {
        width: 52%;
        height: 230px
    }

    .home-services-footer,
    .home-before-after-action {
        align-items: flex-start;
        flex-direction: column
    }

    .home-why-image {
        inset: 0 0 95px 35px
    }

    .home-comparison {
        height: 380px
    }

    .home-projects-grid {
        grid-template-columns: 1fr;
        grid-template-rows: repeat(3, 330px)
    }

    .home-final-cta-inner {
        grid-template-columns: 1fr;
        padding: 35px 28px
    }

    .home-final-cta-actions {
        align-items: flex-start;
        flex-direction: column
    }
}

@media(max-width:480px) {
    .home-about-visual {
        min-height: 470px
    }

    .home-about-main-image {
        width: 100%;
        height: 350px
    }

    .home-about-secondary-image {
        width: 55%;
        height: 190px
    }

    .home-about-actions {
        align-items: flex-start;
        flex-direction: column
    }

    .home-why-image {
        inset: 0 0 100px 0
    }

    .home-why-quote {
        width: 100%;
        padding: 24px
    }

    .home-comparison {
        height: 320px
    }

    .home-projects-grid {
        grid-template-rows: repeat(3, 290px)
    }
}


/*==================================================
Legal Pages
==================================================*/

.legal-hero{
    position:relative;
    overflow:hidden;
    padding:115px 0 95px;
    color:#fff;
    background:
        linear-gradient(135deg,rgba(5,24,58,.98),rgba(8,43,99,.92)),
        url("https://images.unsplash.com/photo-1450101499163-c8848c66ca85?auto=format&fit=crop&w=1800&q=80")
        center/cover no-repeat;
}

.legal-hero::before{
    content:"";
    position:absolute;
    top:-150px;
    right:-120px;
    width:380px;
    height:380px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.1);
    box-shadow:
        0 0 0 50px rgba(255,255,255,.025),
        0 0 0 100px rgba(255,255,255,.015);
}

.legal-hero .container{
    position:relative;
    z-index:2;
}

.legal-kicker{
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-bottom:16px;
    color:var(--yellow);
    font-size:.74rem;
    font-weight:900;
    letter-spacing:1.8px;
    text-transform:uppercase;
}

.legal-kicker::before{
    content:"";
    width:34px;
    height:3px;
    background:var(--red);
    border-radius:20px;
}

.legal-hero h1{
    max-width:780px;
    margin-bottom:18px;
    color:#fff;
    font-size:clamp(2.8rem,5vw,4.5rem);
    line-height:1.04;
    letter-spacing:-2px;
}

.legal-hero p{
    max-width:690px;
    color:rgba(255,255,255,.75);
    font-size:1.05rem;
    line-height:1.8;
}

.legal-breadcrumbs{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px;
    margin-top:28px;
    color:rgba(255,255,255,.72);
    font-size:.82rem;
    font-weight:700;
}

.legal-breadcrumbs i{
    color:var(--yellow);
    font-size:.62rem;
}

.legal-page{
    padding:90px 0 110px;
    background:
        linear-gradient(180deg,#f7f9fc 0,#fff 260px);
}

.legal-layout{
    display:grid;
    grid-template-columns:280px minmax(0,1fr);
    gap:45px;
    align-items:start;
}

.legal-sidebar{
    position:sticky;
    top:110px;
    padding:24px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:0 14px 35px rgba(8,43,99,.08);
}

.legal-sidebar h3{
    margin-bottom:15px;
    color:var(--navy);
    font-size:1rem;
}

.legal-sidebar a{
    display:block;
    padding:11px 12px;
    color:var(--muted);
    border-radius:10px;
    font-size:.8rem;
    font-weight:700;
    transition:.3s ease;
}

.legal-sidebar a:hover{
    color:var(--navy);
    background:var(--soft);
    transform:translateX(4px);
}

.legal-contact-card{
    margin-top:18px;
    padding:18px;
    color:#fff;
    background:linear-gradient(135deg,var(--navy),var(--blue));
    border-radius:14px;
}

.legal-contact-card strong,
.legal-contact-card span{
    display:block;
}

.legal-contact-card strong{
    margin-bottom:7px;
    font-size:.85rem;
}

.legal-contact-card span,
.legal-contact-card a{
    color:rgba(255,255,255,.76);
    font-size:.73rem;
    line-height:1.55;
}

.legal-content{
    padding:42px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:22px;
    box-shadow:0 18px 45px rgba(8,43,99,.08);
}

.legal-notice{
    display:flex;
    align-items:flex-start;
    gap:14px;
    margin-bottom:32px;
    padding:18px;
    background:#fff8e6;
    border:1px solid rgba(255,189,24,.35);
    border-radius:14px;
}

.legal-notice i{
    margin-top:3px;
    color:#d89900;
}

.legal-notice p{
    margin:0;
    color:#6f5a1a;
    font-size:.8rem;
    line-height:1.65;
}

.legal-section{
    scroll-margin-top:125px;
    padding:28px 0;
    border-bottom:1px solid var(--line);
}

.legal-section:first-of-type{
    padding-top:0;
}

.legal-section:last-child{
    border-bottom:0;
}

.legal-section h2{
    margin-bottom:14px;
    color:var(--navy);
    font-size:1.55rem;
    line-height:1.25;
}

.legal-section h3{
    margin:22px 0 10px;
    color:var(--navy);
    font-size:1rem;
}

.legal-section p,
.legal-section li{
    color:var(--muted);
    font-size:.9rem;
    line-height:1.85;
}

.legal-section p + p{
    margin-top:12px;
}

.legal-section ul{
    margin:14px 0 0 20px;
}

.legal-section li{
    margin:8px 0;
}

.legal-meta{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:12px;
    margin-bottom:30px;
    color:var(--muted);
    font-size:.75rem;
}

.legal-meta span{
    display:inline-flex;
    align-items:center;
    gap:7px;
    padding:8px 11px;
    background:var(--soft);
    border-radius:30px;
}

.legal-meta i{
    color:var(--blue);
}

.legal-bottom-links{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    margin-top:34px;
    padding-top:25px;
    border-top:1px solid var(--line);
}

.legal-bottom-links a{
    display:inline-flex;
    align-items:center;
    gap:9px;
    color:var(--blue);
    font-size:.8rem;
    font-weight:900;
    text-transform:uppercase;
}

@media(max-width:900px){

    .legal-layout{
        grid-template-columns:1fr;
    }

    .legal-sidebar{
        position:static;
    }

}

@media(max-width:600px){

    .legal-hero{
        padding:90px 0 75px;
    }

    .legal-page{
        padding:70px 0 85px;
    }

    .legal-content{
        padding:26px 22px;
    }

    .legal-bottom-links{
        align-items:flex-start;
        flex-direction:column;
    }

}



/*==================================================
Legal Pages
==================================================*/

.legal-hero{
    position:relative;
    overflow:hidden;
    padding:115px 0 95px;
    color:#fff;
    background:
        linear-gradient(135deg,rgba(5,24,58,.98),rgba(8,43,99,.92)),
        url("https://images.unsplash.com/photo-1450101499163-c8848c66ca85?auto=format&fit=crop&w=1800&q=80")
        center/cover no-repeat;
}

.legal-hero::before{
    content:"";
    position:absolute;
    top:-150px;
    right:-120px;
    width:380px;
    height:380px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.1);
    box-shadow:
        0 0 0 50px rgba(255,255,255,.025),
        0 0 0 100px rgba(255,255,255,.015);
}

.legal-hero .container{
    position:relative;
    z-index:2;
}

.legal-kicker{
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-bottom:16px;
    color:var(--yellow);
    font-size:.74rem;
    font-weight:900;
    letter-spacing:1.8px;
    text-transform:uppercase;
}

.legal-kicker::before{
    content:"";
    width:34px;
    height:3px;
    background:var(--red);
    border-radius:20px;
}

.legal-hero h1{
    max-width:780px;
    margin-bottom:18px;
    color:#fff;
    font-size:clamp(2.8rem,5vw,4.5rem);
    line-height:1.04;
    letter-spacing:-2px;
}

.legal-hero p{
    max-width:690px;
    color:rgba(255,255,255,.75);
    font-size:1.05rem;
    line-height:1.8;
}

.legal-breadcrumbs{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px;
    margin-top:28px;
    color:rgba(255,255,255,.72);
    font-size:.82rem;
    font-weight:700;
}

.legal-breadcrumbs i{
    color:var(--yellow);
    font-size:.62rem;
}

.legal-page{
    padding:90px 0 110px;
    background:
        linear-gradient(180deg,#f7f9fc 0,#fff 260px);
}

.legal-layout{
    display:grid;
    grid-template-columns:280px minmax(0,1fr);
    gap:45px;
    align-items:start;
}

.legal-sidebar{
    position:sticky;
    top:110px;
    padding:24px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:0 14px 35px rgba(8,43,99,.08);
}

.legal-sidebar h3{
    margin-bottom:15px;
    color:var(--navy);
    font-size:1rem;
}

.legal-sidebar a{
    display:block;
    padding:11px 12px;
    color:var(--muted);
    border-radius:10px;
    font-size:.8rem;
    font-weight:700;
    transition:.3s ease;
}

.legal-sidebar a:hover{
    color:var(--navy);
    background:var(--soft);
    transform:translateX(4px);
}

.legal-contact-card{
    margin-top:18px;
    padding:18px;
    color:#fff;
    background:linear-gradient(135deg,var(--navy),var(--blue));
    border-radius:14px;
}

.legal-contact-card strong,
.legal-contact-card span{
    display:block;
}

.legal-contact-card strong{
    margin-bottom:7px;
    font-size:.85rem;
}

.legal-contact-card span,
.legal-contact-card a{
    color:rgba(255,255,255,.76);
    font-size:.73rem;
    line-height:1.55;
}

.legal-content{
    padding:42px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:22px;
    box-shadow:0 18px 45px rgba(8,43,99,.08);
}

.legal-notice{
    display:flex;
    align-items:flex-start;
    gap:14px;
    margin-bottom:32px;
    padding:18px;
    background:#fff8e6;
    border:1px solid rgba(255,189,24,.35);
    border-radius:14px;
}

.legal-notice i{
    margin-top:3px;
    color:#d89900;
}

.legal-notice p{
    margin:0;
    color:#6f5a1a;
    font-size:.8rem;
    line-height:1.65;
}

.legal-section{
    scroll-margin-top:125px;
    padding:28px 0;
    border-bottom:1px solid var(--line);
}

.legal-section:first-of-type{
    padding-top:0;
}

.legal-section:last-child{
    border-bottom:0;
}

.legal-section h2{
    margin-bottom:14px;
    color:var(--navy);
    font-size:1.55rem;
    line-height:1.25;
}

.legal-section h3{
    margin:22px 0 10px;
    color:var(--navy);
    font-size:1rem;
}

.legal-section p,
.legal-section li{
    color:var(--muted);
    font-size:.9rem;
    line-height:1.85;
}

.legal-section p + p{
    margin-top:12px;
}

.legal-section ul{
    margin:14px 0 0 20px;
}

.legal-section li{
    margin:8px 0;
}

.legal-meta{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:12px;
    margin-bottom:30px;
    color:var(--muted);
    font-size:.75rem;
}

.legal-meta span{
    display:inline-flex;
    align-items:center;
    gap:7px;
    padding:8px 11px;
    background:var(--soft);
    border-radius:30px;
}

.legal-meta i{
    color:var(--blue);
}

.legal-bottom-links{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    margin-top:34px;
    padding-top:25px;
    border-top:1px solid var(--line);
}

.legal-bottom-links a{
    display:inline-flex;
    align-items:center;
    gap:9px;
    color:var(--blue);
    font-size:.8rem;
    font-weight:900;
    text-transform:uppercase;
}

@media(max-width:900px){

    .legal-layout{
        grid-template-columns:1fr;
    }

    .legal-sidebar{
        position:static;
    }

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

    .service-sidebar-modern{
        width:100%;
        gap:18px;
    }

    .sidebar-widget,
    .sidebar-cta-card{
        width:100%;
    }

    .sidebar-map{
        height:260px;
    }

}

@media(max-width:600px){

    .legal-hero{
        padding:90px 0 75px;
    }

    .legal-page{
        padding:70px 0 85px;
    }

    .legal-content{
        padding:26px 22px;
    }

    .legal-bottom-links{
        align-items:flex-start;
        flex-direction:column;
    }

}

/*==================================================
About Page Hero
==================================================*/

.about-page-hero{
    position:relative;
    display:flex;
    align-items:center;
    min-height:520px;
    overflow:hidden;
    background:url("../assets/images/about-banner.jpg") center/cover no-repeat;
}

.about-page-hero-overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            90deg,
            rgba(5,24,58,.96) 0%,
            rgba(8,43,99,.9) 55%,
            rgba(8,43,99,.45) 100%
        );
}

.about-page-shape{
    position:absolute;
    border-radius:50%;
}

.about-shape-one{
    top:-180px;
    right:-120px;
    width:420px;
    height:420px;
    border:1px solid rgba(255,255,255,.08);
    box-shadow:
        0 0 0 60px rgba(255,255,255,.02),
        0 0 0 120px rgba(255,255,255,.015);
}

.about-shape-two{
    bottom:-140px;
    left:-140px;
    width:320px;
    height:320px;
    background:rgba(255,189,24,.08);
}

.about-page-hero .container{
    position:relative;
    z-index:2;
}

.about-page-hero-content{
    max-width:760px;
    padding:120px 0;
}

.about-hero-badge{
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-bottom:22px;
    padding:12px 18px;
    color:var(--yellow);
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.15);
    border-radius:50px;
    backdrop-filter:blur(10px);
    font-size:.76rem;
    font-weight:900;
    letter-spacing:1.5px;
    text-transform:uppercase;
}

.about-hero-badge i{
    color:var(--red);
}

.about-page-hero h1{
    margin-bottom:24px;
    color:#fff;
    font-size:clamp(3rem,5vw,4.7rem);
    line-height:1.05;
    letter-spacing:-2px;
}

.about-page-hero h1 span{
    display:block;
    color:var(--yellow);
}

.about-page-hero p{
    max-width:650px;
    margin-bottom:35px;
    color:rgba(255,255,255,.78);
    font-size:1.05rem;
    line-height:1.85;
}

.about-hero-actions{
    display:flex;
    align-items:center;
    gap:20px;
    margin-bottom:35px;
    flex-wrap:wrap;
}

.about-hero-phone{
    display:flex;
    align-items:center;
    gap:12px;
    color:#fff;
    font-weight:800;
}

.about-hero-phone i{
    display:grid;
    place-items:center;
    width:50px;
    height:50px;
    color:#fff;
    background:var(--red);
    border-radius:50%;
    box-shadow:0 12px 25px rgba(241,63,79,.25);
}

.about-breadcrumbs{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    color:rgba(255,255,255,.65);
    font-size:.84rem;
    font-weight:700;
}

.about-breadcrumbs a{
    color:#fff;
    transition:.3s ease;
}

.about-breadcrumbs a:hover{
    color:var(--yellow);
}

.about-breadcrumbs i{
    color:var(--yellow);
    font-size:.62rem;
}

@media(max-width:768px){

    .about-page-hero{
        min-height:430px;
    }

    .about-page-hero-content{
        padding:90px 0;
    }

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

}

/*==================================================
Contact Hero
==================================================*/

.contact-page-hero{

    position:relative;

    display:flex;

    align-items:center;

    overflow:hidden;

    min-height:520px;

    background:url("../assets/images/contact-banner.jpg") center/cover no-repeat;

}

.contact-page-overlay{

    position:absolute;

    inset:0;

    background:
    linear-gradient(
        90deg,
        rgba(5,24,58,.95),
        rgba(8,43,99,.88),
        rgba(8,43,99,.45)
    );

}

.contact-page-shape{

    position:absolute;

    border-radius:50%;

}

.contact-shape-one{

    width:420px;

    height:420px;

    right:-140px;

    top:-170px;

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

    box-shadow:
    0 0 0 60px rgba(255,255,255,.02),
    0 0 0 120px rgba(255,255,255,.015);

}

.contact-shape-two{

    width:300px;

    height:300px;

    left:-120px;

    bottom:-120px;

    background:rgba(255,189,24,.08);

}

.contact-page-hero .container{

    position:relative;

    z-index:2;

}

.contact-page-content{

    max-width:760px;

    padding:120px 0;

}

.contact-badge{

    display:inline-flex;

    align-items:center;

    gap:10px;

    margin-bottom:22px;

    padding:12px 18px;

    color:var(--yellow);

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

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

    border-radius:50px;

    backdrop-filter:blur(10px);

    font-size:.78rem;

    font-weight:800;

    letter-spacing:1.5px;

    text-transform:uppercase;

}

.contact-badge i{

    color:var(--red);

}

.contact-page-content h1{

    margin-bottom:22px;

    color:#fff;

    font-size:clamp(3rem,5vw,4.8rem);

    line-height:1.05;

    letter-spacing:-2px;

}

.contact-page-content h1 span{

    display:block;

    color:var(--yellow);

}

.contact-page-content p{

    max-width:670px;

    margin-bottom:35px;

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

    font-size:1.05rem;

    line-height:1.9;

}

.contact-actions{

    display:flex;

    align-items:center;

    gap:18px;

    flex-wrap:wrap;

    margin-bottom:35px;

}

.contact-scroll{

    display:flex;

    align-items:center;

    gap:10px;

    color:#fff;

    font-weight:700;

    transition:.35s;

}

.contact-scroll:hover{

    color:var(--yellow);

}

.contact-breadcrumb{

    display:flex;

    align-items:center;

    gap:10px;

    flex-wrap:wrap;

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

    font-size:.85rem;

    font-weight:700;

}

.contact-breadcrumb a{

    color:#fff;

    transition:.3s;

}

.contact-breadcrumb a:hover{

    color:var(--yellow);

}

.contact-breadcrumb i{

    color:var(--yellow);

    font-size:.65rem;

}

@media(max-width:768px){

    .contact-page-hero{

        min-height:430px;

    }

    .contact-page-content{

        padding:90px 0;

    }

    .contact-actions{

        flex-direction:column;

        align-items:flex-start;

    }

}

/*==================================================
Francisco's Painting - Responsive Header
==================================================*/

.fps-topbar{
    position:relative;
    z-index:1100;
    color:#fff;
    background:var(--navy);
    font-size:.76rem;
}

.fps-topbar-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    min-height:42px;
}

.fps-topbar-left,
.fps-topbar-right{
    display:flex;
    align-items:center;
    gap:22px;
}

.fps-topbar-left a,
.fps-topbar-right > span{
    display:flex;
    align-items:center;
    gap:8px;
    color:rgba(255,255,255,.82);
}

.fps-topbar i{
    color:var(--yellow);
}

.fps-topbar-social{
    display:flex;
    align-items:center;
    gap:8px;
}

.fps-topbar-social a{
    display:grid;
    place-items:center;
    width:27px;
    height:27px;
    color:#fff;
    background:rgba(255,255,255,.09);
    border:1px solid rgba(255,255,255,.12);
    border-radius:8px;
    transition:.3s ease;
}

.fps-topbar-social a:hover{
    color:var(--navy);
    background:var(--yellow);
    transform:translateY(-2px);
}


/*==================================================
Header
==================================================*/

.fps-header{
    position:sticky;
    top:0;
    z-index:1050;
    background:rgba(255,255,255,.97);
    border-bottom:1px solid rgba(8,43,99,.08);
    box-shadow:0 6px 28px rgba(8,43,99,.055);
    backdrop-filter:blur(16px);
}

.fps-header-inner{
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    gap:35px;
    min-height:88px;
}

.fps-logo{
    display:flex;
    align-items:center;
    flex:0 0 auto;
}

.fps-logo img{
    width:105px;
    max-height:68px;
    object-fit:contain;
}


/*==================================================
Desktop Navigation
==================================================*/

.fps-desktop-nav{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    height:88px;
}

.fps-nav-link{
    position:relative;
    display:flex;
    align-items:center;
    gap:7px;
    height:100%;
    padding:0 14px;
    color:#273750;
    font-size:.76rem;
    font-weight:900;
    letter-spacing:.35px;
    text-transform:uppercase;
    transition:.3s ease;
}

.fps-nav-link::after{
    content:"";
    position:absolute;
    right:50%;
    bottom:0;
    left:50%;
    height:4px;
    background:linear-gradient(
        90deg,
        var(--red),
        var(--yellow),
        var(--blue)
    );
    border-radius:5px 5px 0 0;
    transition:.35s ease;
}

.fps-nav-link:hover,
.fps-nav-link.fps-active,
.fps-nav-dropdown.fps-active > .fps-nav-link{
    color:var(--navy);
}

.fps-nav-link:hover::after,
.fps-nav-link.fps-active::after,
.fps-nav-dropdown.fps-active > .fps-nav-link::after{
    right:14px;
    left:14px;
}

.fps-nav-link > i{
    font-size:.62rem;
    transition:.3s ease;
}


/*==================================================
Desktop Dropdown
==================================================*/

.fps-nav-dropdown{
    position:relative;
    height:100%;
}

.fps-nav-dropdown:hover > .fps-nav-link > i{
    transform:rotate(180deg);
}

.fps-dropdown-panel{
    position:absolute;
    top:calc(100% + 14px);
    left:50%;
    width:390px;
    padding:18px;
    background:#fff;
    border:1px solid rgba(8,43,99,.08);
    border-radius:20px;
    box-shadow:0 24px 65px rgba(8,43,99,.18);
    opacity:0;
    visibility:hidden;
    transform:translate(-50%,14px);
    transition:.3s ease;
}

.fps-dropdown-panel::before{
    content:"";
    position:absolute;
    top:-10px;
    left:50%;
    width:20px;
    height:20px;
    background:#fff;
    border-top:1px solid rgba(8,43,99,.08);
    border-left:1px solid rgba(8,43,99,.08);
    transform:translateX(-50%) rotate(45deg);
}

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

.fps-dropdown-heading{
    display:flex;
    align-items:center;
    gap:13px;
    margin-bottom:15px;
    padding:5px 4px 16px;
    border-bottom:1px solid var(--line);
}

.fps-dropdown-icon{
    display:grid;
    place-items:center;
    width:47px;
    height:47px;
    color:#fff;
    background:linear-gradient(135deg,var(--red),var(--yellow));
    border-radius:14px;
}

.fps-dropdown-heading small,
.fps-dropdown-heading strong{
    display:block;
}

.fps-dropdown-heading small{
    color:var(--red);
    font-size:.62rem;
    font-weight:900;
    letter-spacing:1px;
    text-transform:uppercase;
}

.fps-dropdown-heading strong{
    color:var(--navy);
    font-size:1rem;
}

.fps-dropdown-links{
    display:flex;
    flex-direction:column;
    gap:5px;
}

.fps-dropdown-links a{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    padding:11px 12px;
    color:#45556d;
    background:#fff;
    border-radius:11px;
    font-size:.76rem;
    font-weight:750;
    transition:.3s ease;
}

.fps-dropdown-links a > span{
    display:flex;
    align-items:center;
    gap:10px;
}

.fps-dropdown-links a > span i{
    width:18px;
    color:var(--red);
    text-align:center;
}

.fps-dropdown-links a > i{
    color:#a0abbb;
    font-size:.65rem;
}

.fps-dropdown-links a:hover,
.fps-dropdown-links a.fps-active{
    color:#fff;
    background:linear-gradient(135deg,var(--navy),var(--blue));
    transform:translateX(4px);
}

.fps-dropdown-links a:hover i,
.fps-dropdown-links a.fps-active i{
    color:var(--yellow);
}

.fps-dropdown-all{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    margin-top:13px;
    padding:12px;
    color:var(--blue);
    background:var(--soft);
    border-radius:11px;
    font-size:.7rem;
    font-weight:900;
    text-transform:uppercase;
    transition:.3s ease;
}

.fps-dropdown-all:hover{
    color:#fff;
    background:var(--red);
}


/*==================================================
Header Actions
==================================================*/

.fps-header-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:15px;
}

.fps-header-phone{
    display:flex;
    align-items:center;
    gap:10px;
}

.fps-header-phone-icon{
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    color:#fff;
    background:var(--blue);
    border-radius:50%;
    box-shadow:0 9px 22px rgba(18,99,215,.24);
}

.fps-header-phone small,
.fps-header-phone strong{
    display:block;
}

.fps-header-phone small{
    color:var(--muted);
    font-size:.58rem;
    line-height:1.3;
}

.fps-header-phone strong{
    color:var(--navy);
    font-size:.8rem;
}

.fps-quote-button{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    min-height:47px;
    overflow:hidden;
    padding:12px 18px;
    color:#fff;
    background:linear-gradient(135deg,var(--red),var(--yellow));
    border-radius:12px;
    box-shadow:0 11px 25px rgba(241,63,79,.22);
    font-size:.7rem;
    font-weight:900;
    text-transform:uppercase;
    transition:.35s ease;
}

.fps-quote-button::before{
    content:"";
    position:absolute;
    top:-120%;
    left:-50%;
    width:35%;
    height:340%;
    background:rgba(255,255,255,.3);
    transform:rotate(25deg);
    transition:left .6s ease;
}

.fps-quote-button:hover{
    transform:translateY(-3px);
}

.fps-quote-button:hover::before{
    left:130%;
}


/*==================================================
Mobile Menu Button
==================================================*/

.fps-menu-button{
    display:none;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    width:48px;
    height:48px;
    padding:0;
    background:var(--navy);
    border:0;
    border-radius:13px;
    cursor:pointer;
}

.fps-menu-button span{
    width:21px;
    height:2px;
    background:#fff;
    border-radius:5px;
    transition:.3s ease;
}


/*==================================================
Overlay
==================================================*/

.fps-menu-overlay{
    position:fixed;
    inset:0;
    z-index:1990;
    background:rgba(3,15,37,.74);
    backdrop-filter:blur(5px);
    opacity:0;
    visibility:hidden;
    transition:.35s ease;
}

.fps-menu-overlay.fps-open{
    opacity:1;
    visibility:visible;
}


/*==================================================
Mobile Off-Canvas Menu
==================================================*/

.fps-mobile-menu{
    position:fixed;
    top:0;
    right:0;
    z-index:2000;
    display:flex;
    flex-direction:column;
    width:min(420px,92%);
    height:100dvh;
    overflow-y:auto;
    color:var(--ink);
    background:#fff;
    box-shadow:-20px 0 60px rgba(3,15,37,.22);
    transform:translateX(105%);
    transition:.42s cubic-bezier(.22,.8,.25,1);
}

.fps-mobile-menu.fps-open{
    transform:translateX(0);
}

.fps-mobile-menu-header{
    position:sticky;
    top:0;
    z-index:5;
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:86px;
    padding:14px 22px;
    background:rgba(255,255,255,.96);
    border-bottom:1px solid var(--line);
    backdrop-filter:blur(14px);
}

.fps-mobile-logo img{
    width:100px;
    max-height:62px;
    object-fit:contain;
}

.fps-menu-close{
    display:grid;
    place-items:center;
    width:43px;
    height:43px;
    color:#fff;
    background:var(--navy);
    border:0;
    border-radius:12px;
    cursor:pointer;
    font-size:1.1rem;
    transition:.3s ease;
}

.fps-menu-close:hover{
    background:var(--red);
    transform:rotate(90deg);
}


/*==================================================
Mobile Company Information
==================================================*/

.fps-mobile-company{
    display:flex;
    align-items:center;
    gap:13px;
    margin:20px 20px 12px;
    padding:17px;
    color:#fff;
    background:linear-gradient(135deg,var(--navy),var(--blue));
    border-radius:17px;
}

.fps-mobile-company-icon{
    display:grid;
    place-items:center;
    flex:0 0 48px;
    width:48px;
    height:48px;
    color:var(--yellow);
    background:rgba(255,255,255,.1);
    border-radius:14px;
    font-size:1.25rem;
}

.fps-mobile-company strong,
.fps-mobile-company span{
    display:block;
}

.fps-mobile-company strong{
    margin-bottom:3px;
    font-size:.83rem;
    line-height:1.3;
}

.fps-mobile-company span{
    color:rgba(255,255,255,.68);
    font-size:.66rem;
    line-height:1.4;
}


/*==================================================
Mobile Navigation
==================================================*/

.fps-mobile-nav{
    display:flex;
    flex-direction:column;
    padding:10px 20px 20px;
}

.fps-mobile-link,
.fps-mobile-dropdown-button{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    width:100%;
    padding:15px 13px;
    color:#34435a;
    background:transparent;
    border:0;
    border-bottom:1px solid var(--line);
    font-size:.82rem;
    font-weight:850;
    text-align:left;
    cursor:pointer;
    transition:.3s ease;
}

.fps-mobile-link > span,
.fps-mobile-dropdown-button > span{
    display:flex;
    align-items:center;
    gap:12px;
}

.fps-mobile-link > span i,
.fps-mobile-dropdown-button > span i{
    display:grid;
    place-items:center;
    width:34px;
    height:34px;
    color:var(--blue);
    background:var(--soft);
    border-radius:10px;
}

.fps-mobile-link > i,
.fps-mobile-dropdown-button > i{
    color:#a0abbb;
    font-size:.65rem;
    transition:.3s ease;
}

.fps-mobile-link:hover,
.fps-mobile-link.fps-active,
.fps-mobile-dropdown.fps-active > .fps-mobile-dropdown-button{
    color:var(--navy);
    background:#f8faff;
}

.fps-mobile-link.fps-active > span i,
.fps-mobile-dropdown.fps-active > .fps-mobile-dropdown-button span i{
    color:#fff;
    background:linear-gradient(135deg,var(--red),var(--yellow));
}

.fps-mobile-dropdown.fps-open .fps-mobile-dropdown-button > i{
    color:var(--red);
    transform:rotate(180deg);
}

.fps-mobile-submenu{
    display:grid;
    grid-template-rows:0fr;
    background:#f8faff;
    border-radius:0 0 13px 13px;
    overflow:hidden;
    transition:grid-template-rows .4s ease;
}

.fps-mobile-submenu > *{
    min-height:0;
}

.fps-mobile-dropdown.fps-open .fps-mobile-submenu{
    grid-template-rows:1fr;
    padding:8px;
}

.fps-mobile-submenu a{
    display:block;
    margin:3px 0;
    padding:11px 12px 11px 47px;
    color:#64738a;
    border-radius:9px;
    font-size:.75rem;
    font-weight:700;
    transition:.3s ease;
}

.fps-mobile-submenu a:hover,
.fps-mobile-submenu a.fps-active{
    color:#fff;
    background:var(--navy);
    transform:translateX(3px);
}


/*==================================================
Mobile Contact
==================================================*/

.fps-mobile-contact{
    margin:0 20px 20px;
    padding:21px;
    background:var(--soft);
    border:1px solid var(--line);
    border-radius:17px;
}

.fps-mobile-contact-title{
    display:block;
    margin-bottom:14px;
    color:var(--red);
    font-size:.68rem;
    font-weight:900;
    letter-spacing:1.3px;
    text-transform:uppercase;
}

.fps-mobile-contact > a,
.fps-mobile-contact > div{
    display:flex;
    align-items:flex-start;
    gap:12px;
    margin:14px 0;
    color:#3f5069;
    font-size:.75rem;
    line-height:1.5;
}

.fps-mobile-contact > a > i,
.fps-mobile-contact > div > i{
    display:grid;
    place-items:center;
    flex:0 0 36px;
    width:36px;
    height:36px;
    color:#fff;
    background:var(--blue);
    border-radius:10px;
}

.fps-mobile-contact small{
    display:block;
    margin-bottom:2px;
    color:#8895a8;
    font-size:.58rem;
    font-weight:900;
    letter-spacing:.8px;
    text-transform:uppercase;
}
/*==================================================
Mobile Services Submenu - Fix
==================================================*/

.fps-mobile-submenu{
    max-height:0;
    overflow:hidden;
    padding:0 8px;
    background:#f8faff;
    border-radius:0 0 13px 13px;
    opacity:0;
    visibility:hidden;
    transform:translateY(-8px);
    transition:
        max-height .45s ease,
        padding .35s ease,
        opacity .3s ease,
        transform .35s ease,
        visibility .35s ease;
}

.fps-mobile-dropdown.fps-open .fps-mobile-submenu{
    max-height:550px;
    padding:8px;
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}

.fps-mobile-submenu a{
    display:block;
    margin:3px 0;
    padding:11px 12px 11px 47px;
    color:#64738a;
    border-radius:9px;
    font-size:.75rem;
    font-weight:700;
    transition:.3s ease;
}

.fps-mobile-submenu a:hover,
.fps-mobile-submenu a.fps-active{
    color:#fff;
    background:var(--navy);
    transform:translateX(3px);
}

/*==================================================
Body State
==================================================*/

body.fps-menu-open{
    overflow:hidden;
}


/*==================================================
Responsive
==================================================*/

@media(max-width:1180px){

    .fps-header-inner{
        gap:22px;
    }

    .fps-desktop-nav{
        gap:2px;
    }

    .fps-nav-link{
        padding:0 10px;
        font-size:.7rem;
    }

    .fps-header-phone small{
        display:none;
    }

}

@media(max-width:1024px){

    .fps-topbar-right > span:first-child{
        display:none;
    }

    .fps-desktop-nav,
    .fps-header-phone,
    .fps-quote-button{
        display:none;
    }

    .fps-header-inner{
        grid-template-columns:auto 1fr;
        min-height:78px;
    }

    .fps-header-actions{
        justify-self:end;
    }

    .fps-menu-button{
        display:flex;
    }

    .fps-logo img{
        width:95px;
        max-height:60px;
    }

}

@media(max-width:767px){

    .fps-topbar{
        display:none;
    }

    .fps-header-inner{
        min-height:72px;
    }

    .fps-logo img{
        width:88px;
        max-height:54px;
    }

    .fps-menu-button{
        width:45px;
        height:45px;
    }

}

@media(max-width:480px){

    .fps-mobile-menu{
        width:94%;
    }

    .fps-mobile-menu-header{
        padding-inline:17px;
    }

    .fps-mobile-company,
    .fps-mobile-contact{
        margin-right:15px;
        margin-left:15px;
    }

    .fps-mobile-nav{
        padding-right:15px;
        padding-left:15px;
    }

    .fps-mobile-actions{
        padding:17px 15px;
    }

}

/*==================================================
  CORRECCIÓN FINAL RESPONSIVE — SERVICE DETAIL
  Mantiene las mismas clases existentes
==================================================*/

/* Escritorio */
.service-detail-section{
    width:100%;
    max-width:100%;
    overflow:visible;
}

.service-detail-section .container{
    max-width:100%;
    overflow:visible;
}

.service-detail-layout{
    display:grid;
    grid-template-columns:350px minmax(0,1fr);
    gap:55px;
    align-items:start;
    width:100%;
    max-width:100%;
    overflow:visible;
}

.service-sidebar-modern{
    position:sticky;
    top:110px;
    align-self:start;
    width:100%;
    min-width:0;
    max-width:100%;
    height:max-content;
}

.service-main-content{
    align-self:start;
    width:100%;
    min-width:0;
    max-width:100%;
}

/* Evita que componentes internos ensanchen la cuadrícula */
.service-featured-image,
.service-content-header,
.service-intro-grid,
.service-intro-text,
.service-highlight-card,
.service-benefit-grid,
.service-benefit-card,
.service-process-section,
.service-process-grid,
.process-step,
.service-preparation-box,
.service-final-cta,
.service-final-cta-content,
.service-final-cta-actions,
.sidebar-widget,
.sidebar-cta-card,
.sidebar-map-card{
    min-width:0;
    max-width:100%;
}

/* Tablet */
@media(max-width:1200px){

    .service-detail-layout{
        grid-template-columns:310px minmax(0,1fr);
        gap:35px;
    }

}

/* Tablet vertical y móvil */
@media(max-width:991px){

    .service-detail-section{
        padding:75px 0;
        overflow:hidden;
    }

    .service-detail-section .container{
        width:min(100% - 36px,1180px);
        overflow:hidden;
    }

    .service-detail-layout{
        display:flex;
        flex-direction:column;
        grid-template-columns:none;
        gap:40px;
        width:100%;
        max-width:100%;
        overflow:hidden;
    }

    .service-main-content{
        order:1;
        width:100%;
        min-width:0;
        max-width:100%;
    }

    .service-sidebar-modern{
        position:static;
        top:auto;
        order:2;
        width:100%;
        min-width:0;
        max-width:100%;
        height:auto;
        align-self:stretch;
    }

    .service-intro-grid{
        grid-template-columns:1fr;
    }

    .service-benefit-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

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

    .service-final-cta{
        flex-direction:column;
        align-items:flex-start;
    }

    .service-final-cta-actions{
        width:100%;
        min-width:0;
    }

}

/* Teléfonos */
@media(max-width:767px){

    .service-detail-section .container{
        width:100%;
        padding-inline:18px;
    }

    .service-detail-layout{
        gap:30px;
    }

    .service-featured-image{
        width:100%;
        height:330px;
        max-width:100%;
        margin-bottom:35px;
        border-radius:20px;
    }

    .service-featured-image img{
        width:100%;
        height:100%;
        object-fit:cover;
    }

    .service-content-header h2{
        font-size:2rem;
        overflow-wrap:anywhere;
    }

    .service-lead{
        font-size:1rem;
    }

    .service-benefit-grid,
    .service-process-grid{
        grid-template-columns:1fr;
        width:100%;
    }

    .service-process-section{
        width:100%;
        padding:25px 20px;
    }

    .process-step::after{
        display:none;
    }

    .service-preparation-box{
        width:100%;
        padding:25px 20px;
        flex-direction:column;
    }

    .service-final-cta{
        width:100%;
        padding:30px 22px;
    }

    .service-cta-primary,
    .service-cta-secondary{
        width:100%;
    }

    .sidebar-widget,
    .sidebar-cta-card,
    .sidebar-map-card{
        width:100%;
        max-width:100%;
    }

    .sidebar-widget{
        padding:22px 18px;
    }

    .sidebar-service-list a{
        width:100%;
        max-width:100%;
        padding:14px 13px;
        overflow-wrap:anywhere;
    }

    .sidebar-contact-item,
    .sidebar-contact-item span:last-child{
        min-width:0;
        max-width:100%;
        overflow-wrap:anywhere;
        word-break:break-word;
    }

    .sidebar-map{
        width:100%;
        height:260px;
    }

}

/* Teléfonos pequeños */
@media(max-width:480px){

    .service-detail-section .container{
        padding-inline:14px;
    }

    .service-featured-image{
        height:285px;
    }

    .service-content-header h2{
        font-size:1.75rem;
    }

    .service-section-heading h3{
        font-size:1.65rem;
    }

    .service-benefit-card{
        padding:22px 18px;
    }

    .sidebar-cta-card{
        min-height:340px;
        padding:24px 20px;
    }

}

/*==================================================
Projects Hero
==================================================*/

.projects-page-hero{
    position:relative;
    display:flex;
    align-items:center;
    min-height:520px;
    overflow:hidden;
    background:
        url("../assets/images/projects-banner.jpg")
        center/cover no-repeat;
}

.projects-page-overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            90deg,
            rgba(5,24,58,.96) 0%,
            rgba(8,43,99,.9) 55%,
            rgba(8,43,99,.42) 100%
        );
}

.projects-page-shape{
    position:absolute;
    border-radius:50%;
}

.projects-shape-one{
    top:-170px;
    right:-140px;
    width:420px;
    height:420px;
    border:1px solid rgba(255,255,255,.08);
    box-shadow:
        0 0 0 60px rgba(255,255,255,.02),
        0 0 0 120px rgba(255,255,255,.015);
}

.projects-shape-two{
    bottom:-135px;
    left:-120px;
    width:300px;
    height:300px;
    background:rgba(255,189,24,.09);
}

.projects-page-hero .container{
    position:relative;
    z-index:2;
}

.projects-page-content{
    max-width:780px;
    padding:120px 0;
}

.projects-badge{
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-bottom:22px;
    padding:12px 18px;
    color:var(--yellow);
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.15);
    border-radius:50px;
    backdrop-filter:blur(10px);
    font-size:.76rem;
    font-weight:900;
    letter-spacing:1.5px;
    text-transform:uppercase;
}

.projects-badge i{
    color:var(--red);
}

.projects-page-content h1{
    margin-bottom:22px;
    color:#fff;
    font-size:clamp(3rem,5vw,4.8rem);
    line-height:1.05;
    letter-spacing:-2px;
}

.projects-page-content h1 span{
    display:block;
    color:var(--yellow);
}

.projects-page-content p{
    max-width:680px;
    margin-bottom:35px;
    color:rgba(255,255,255,.78);
    font-size:1.05rem;
    line-height:1.9;
}

.projects-actions{
    display:flex;
    align-items:center;
    gap:20px;
    flex-wrap:wrap;
    margin-bottom:35px;
}

.projects-quote-link{
    display:flex;
    align-items:center;
    gap:10px;
    color:#fff;
    font-weight:800;
    transition:.35s ease;
}

.projects-quote-link:hover{
    color:var(--yellow);
    transform:translateY(-2px);
}

.projects-breadcrumb{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    color:rgba(255,255,255,.65);
    font-size:.84rem;
    font-weight:700;
}

.projects-breadcrumb a{
    color:#fff;
    transition:.3s ease;
}

.projects-breadcrumb a:hover{
    color:var(--yellow);
}

.projects-breadcrumb i{
    color:var(--yellow);
    font-size:.62rem;
}

/*==================================================
Responsive
==================================================*/

@media(max-width:768px){

    .projects-page-hero{
        min-height:430px;
    }

    .projects-page-content{
        padding:90px 0;
    }

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

}

@media(max-width:480px){

    .projects-page-content h1{
        font-size:2.35rem;
        letter-spacing:-1px;
    }

    .projects-page-content p{
        font-size:.95rem;
    }

}

/*==================================================
Modern Hero
==================================================*/

.modern-hero{
    position:relative;
    display:flex;
    align-items:center;
    min-height:720px;
    overflow:hidden;
    background:
        linear-gradient(
            135deg,
            #f8fbff 0%,
            #ffffff 50%,
            #eef5ff 100%
        );
}

.modern-hero-overlay{
    position:absolute;
    inset:0;
    background:
        radial-gradient(
            circle at 12% 15%,
            rgba(18,99,215,.1),
            transparent 25%
        ),
        radial-gradient(
            circle at 90% 80%,
            rgba(255,189,24,.12),
            transparent 22%
        );
}

.modern-hero-shape{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
}

.modern-shape-one{
    top:-180px;
    right:-120px;
    width:430px;
    height:430px;
    border:1px solid rgba(18,99,215,.12);
    box-shadow:
        0 0 0 60px rgba(18,99,215,.025),
        0 0 0 120px rgba(18,99,215,.018);
}

.modern-shape-two{
    bottom:-140px;
    left:-140px;
    width:330px;
    height:330px;
    background:rgba(241,63,79,.05);
}

.modern-hero .container{
    position:relative;
    z-index:2;
}

.modern-hero-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:75px;
    align-items:center;
    padding:90px 0 125px;
}

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

.modern-hero-badge{
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-bottom:22px;
    padding:11px 17px;
    color:var(--navy);
    background:#fff;
    border:1px solid rgba(8,43,99,.09);
    border-radius:50px;
    box-shadow:0 12px 30px rgba(8,43,99,.08);
    font-size:.72rem;
    font-weight:900;
    letter-spacing:1.4px;
    text-transform:uppercase;
}

.modern-hero-badge i{
    color:var(--red);
}

.modern-hero-content h1{
    margin-bottom:24px;
    color:var(--navy);
    font-size:clamp(3.4rem,5.5vw,5.4rem);
    line-height:.98;
    letter-spacing:-3px;
}

.modern-hero-content h1 span{
    display:block;
    margin-top:12px;
    color:var(--blue);
}

.modern-hero-content p{
    max-width:610px;
    margin-bottom:32px;
    color:#55657b;
    font-size:1.05rem;
    line-height:1.85;
}

.modern-hero-actions{
    display:flex;
    align-items:center;
    gap:14px;
    flex-wrap:wrap;
    margin-bottom:30px;
}

.modern-primary-btn,
.modern-secondary-btn{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    min-height:52px;
    padding:15px 23px;
    border-radius:13px;
    font-size:.76rem;
    font-weight:900;
    text-transform:uppercase;
    transition:.35s ease;
}

.modern-primary-btn{
    overflow:hidden;
    color:#fff;
    background:
        linear-gradient(
            135deg,
            var(--red),
            var(--yellow)
        );
    box-shadow:0 14px 30px rgba(241,63,79,.24);
}

.modern-primary-btn::before{
    content:"";
    position:absolute;
    top:-120%;
    left:-45%;
    width:35%;
    height:350%;
    background:rgba(255,255,255,.28);
    transform:rotate(25deg);
    transition:left .6s ease;
}

.modern-primary-btn:hover::before{
    left:130%;
}

.modern-secondary-btn{
    color:var(--navy);
    background:#fff;
    border:1px solid var(--line);
    box-shadow:0 10px 25px rgba(8,43,99,.07);
}

.modern-primary-btn:hover,
.modern-secondary-btn:hover{
    transform:translateY(-4px);
}

.modern-secondary-btn:hover{
    color:#fff;
    background:var(--navy);
}

.modern-hero-contact{
    display:flex;
    align-items:center;
    gap:12px;
}

.modern-contact-icon{
    display:grid;
    place-items:center;
    width:48px;
    height:48px;
    color:#fff;
    background:var(--blue);
    border-radius:50%;
    box-shadow:0 10px 24px rgba(18,99,215,.25);
}

.modern-hero-contact small,
.modern-hero-contact a{
    display:block;
}

.modern-hero-contact small{
    color:var(--muted);
    font-size:.68rem;
}

.modern-hero-contact a{
    color:var(--navy);
    font-size:1rem;
    font-weight:900;
}


/*==================================================
Hero Visual
==================================================*/

.modern-hero-visual{
    position:relative;
    min-height:560px;
}

.modern-main-image{
    position:absolute;
    inset:20px 0 20px 45px;
    overflow:hidden;
    border-radius:36px 36px 120px 36px;
    box-shadow:0 30px 70px rgba(8,43,99,.2);
}

.modern-main-image::after{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            180deg,
            transparent 55%,
            rgba(5,24,58,.25)
        );
}

.modern-main-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .9s ease;
}

.modern-main-image:hover img{
    transform:scale(1.05);
}

.modern-floating-card{
    position:absolute;
    z-index:3;
    display:flex;
    align-items:center;
    background:rgba(255,255,255,.95);
    border:1px solid rgba(8,43,99,.08);
    border-radius:18px;
    box-shadow:0 18px 42px rgba(8,43,99,.15);
    backdrop-filter:blur(12px);
}

.modern-card-experience{
    bottom:10px;
    left:0;
    gap:14px;
    width:230px;
    padding:20px;
}

.modern-card-experience strong{
    color:var(--red);
    font-size:2.5rem;
    line-height:1;
}

.modern-card-experience span{
    color:var(--navy);
    font-size:.72rem;
    font-weight:900;
    line-height:1.4;
    text-transform:uppercase;
}

.modern-card-quality{
    top:55px;
    right:-20px;
    gap:12px;
    padding:16px 18px;
}

.modern-card-quality > i{
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    color:#fff;
    background:var(--yellow);
    border-radius:13px;
}

.modern-card-quality strong,
.modern-card-quality span{
    display:block;
}

.modern-card-quality strong{
    color:var(--navy);
    font-size:.8rem;
}

.modern-card-quality span{
    max-width:170px;
    color:var(--muted);
    font-size:.66rem;
    line-height:1.4;
}

.modern-color-strip{
    position:absolute;
    right:12px;
    bottom:55px;
    z-index:4;
    display:flex;
    gap:7px;
    padding:9px;
    background:#fff;
    border-radius:30px;
    box-shadow:0 10px 25px rgba(8,43,99,.15);
}

.modern-color-strip span{
    width:20px;
    height:20px;
    border-radius:50%;
}

.modern-color-strip span:nth-child(1){
    background:var(--red);
}

.modern-color-strip span:nth-child(2){
    background:var(--yellow);
}

.modern-color-strip span:nth-child(3){
    background:var(--blue);
}


/*==================================================
Trust Section
==================================================*/

.modern-trust-section{
    position:relative;
    z-index:5;
    margin-top:-65px;
    padding-bottom:30px;
}

.modern-trust-grid{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    overflow:hidden;
    background:#fff;
    border:1px solid var(--line);
    border-radius:22px;
    box-shadow:0 22px 55px rgba(8,43,99,.13);
}

.modern-trust-item{
    display:flex;
    align-items:flex-start;
    gap:13px;
    padding:25px 20px;
    border-right:1px solid var(--line);
    transition:.35s ease;
}

.modern-trust-item:last-child{
    border-right:0;
}

.modern-trust-item:hover{
    background:var(--soft);
    transform:translateY(-4px);
}

.modern-trust-icon{
    display:grid;
    place-items:center;
    flex:0 0 46px;
    width:46px;
    height:46px;
    background:var(--soft);
    border-radius:14px;
    font-size:1.1rem;
}

.modern-icon-blue{
    color:var(--blue);
}

.modern-icon-red{
    color:var(--red);
}

.modern-icon-yellow{
    color:#e7a600;
}

.modern-icon-green{
    color:var(--green);
}

.modern-icon-purple{
    color:var(--purple);
}

.modern-trust-item strong{
    display:block;
    margin-bottom:5px;
    color:var(--navy);
    font-size:.78rem;
    line-height:1.3;
}

.modern-trust-item span{
    display:block;
    color:var(--muted);
    font-size:.68rem;
    line-height:1.45;
}


/*==================================================
Responsive
==================================================*/

@media(max-width:1100px){

    .modern-hero-grid{
        gap:45px;
    }

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

    .modern-trust-item{
        border-bottom:1px solid var(--line);
    }

}

@media(max-width:900px){

    .modern-hero{
        min-height:auto;
    }

    .modern-hero-grid{
        grid-template-columns:1fr;
        padding:80px 0 130px;
    }

    .modern-hero-content{
        max-width:720px;
    }

    .modern-hero-visual{
        min-height:520px;
    }

    .modern-main-image{
        inset:0 35px 15px;
    }

    .modern-card-quality{
        right:0;
    }

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

}

@media(max-width:620px){

    .modern-hero-grid{
        padding:65px 0 110px;
    }

    .modern-hero-content h1{
        font-size:3.2rem;
        letter-spacing:-2px;
    }

    .modern-hero-actions{
        align-items:stretch;
        flex-direction:column;
    }

    .modern-primary-btn,
    .modern-secondary-btn{
        width:100%;
    }

    .modern-hero-visual{
        min-height:430px;
    }

    .modern-main-image{
        inset:0 0 30px;
        border-radius:25px 25px 75px 25px;
    }

    .modern-card-quality{
        top:18px;
        right:10px;
    }

    .modern-card-experience{
        bottom:0;
        left:10px;
        width:210px;
    }

    .modern-color-strip{
        right:10px;
        bottom:45px;
    }

    .modern-trust-section{
        margin-top:-40px;
    }

    .modern-trust-grid{
        grid-template-columns:1fr;
    }

    .modern-trust-item{
        border-right:0;
        border-bottom:1px solid var(--line);
    }

}

@media(max-width:420px){

    .modern-hero-content h1{
        font-size:2.7rem;
    }

    .modern-hero-visual{
        min-height:390px;
    }

    .modern-card-quality{
        display:none;
    }

    .modern-card-experience{
        width:195px;
        padding:16px;
    }

    .modern-card-experience strong{
        font-size:2rem;
    }

}

/* Contenedor principal */

.apple-page-transition{
    position:relative;

    width:100%;
    min-height:100vh;

    background:#fff;

    opacity:0;

    transform:
        perspective(1400px)
        translate3d(0,24px,-70px)
        scale(.965);

    transform-origin:center center;

    filter:blur(8px);

    border-radius:24px;

    box-shadow:
        0 40px 100px rgba(5,24,58,.18);

    transition:
        opacity .55s ease,
        transform .8s cubic-bezier(.16,1,.3,1),
        filter .65s ease,
        border-radius .75s cubic-bezier(.16,1,.3,1),
        box-shadow .75s ease;

    will-change:
        transform,
        opacity,
        filter,
        border-radius;
}


/* Página visible */

.apple-page-transition.apple-page-visible{
    opacity:1;

    transform:
        perspective(1400px)
        translate3d(0,0,0)
        scale(1);

    filter:blur(0);

    border-radius:0;

    box-shadow:none;
}


/* Animación de salida */

.apple-page-transition.apple-page-leaving{
    opacity:0;

    transform:
        perspective(1400px)
        translate3d(0,-18px,-80px)
        scale(.965);

    filter:blur(7px);

    border-radius:24px;

    box-shadow:
        0 35px 90px rgba(5,24,58,.2);

    transition:
        opacity .38s ease,
        transform .48s cubic-bezier(.4,0,.2,1),
        filter .4s ease,
        border-radius .45s ease,
        box-shadow .45s ease;
}


/* Capa de profundidad */

.apple-page-transition::before{
    content:"";

    position:fixed;
    inset:0;

    z-index:999999;

    pointer-events:none;

    opacity:0;

    background:
        radial-gradient(
            circle at center,
            rgba(255,255,255,.06),
            rgba(5,24,58,.22)
        );

    transition:opacity .6s ease;
}

.apple-page-transition:not(.apple-page-visible)::before,
.apple-page-transition.apple-page-leaving::before{
    opacity:1;
}


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

@media(max-width:991px){

    .apple-page-transition{
        transform:
            perspective(1000px)
            translate3d(0,18px,-45px)
            scale(.975);

        border-radius:20px;

        filter:blur(6px);
    }

    .apple-page-transition.apple-page-visible{
        transform:
            perspective(1000px)
            translate3d(0,0,0)
            scale(1);

        border-radius:0;
        filter:blur(0);
    }

    .apple-page-transition.apple-page-leaving{
        transform:
            perspective(1000px)
            translate3d(0,-12px,-45px)
            scale(.975);

        border-radius:20px;
        filter:blur(5px);
    }

}


@media(max-width:600px){

    .apple-page-transition{
        transform:
            translate3d(0,14px,0)
            scale(.982);

        border-radius:16px;

        filter:blur(4px);

        box-shadow:
            0 25px 60px rgba(5,24,58,.15);
    }

    .apple-page-transition.apple-page-visible{
        transform:
            translate3d(0,0,0)
            scale(1);

        border-radius:0;
        filter:blur(0);
        box-shadow:none;
    }

    .apple-page-transition.apple-page-leaving{
        transform:
            translate3d(0,-10px,0)
            scale(.982);

        border-radius:16px;
        filter:blur(4px);
    }

}


/*==================================================
ACCESSIBILITY
==================================================*/

@media(prefers-reduced-motion:reduce){

    .apple-page-transition,
    .apple-page-transition.apple-page-visible,
    .apple-page-transition.apple-page-leaving{
        opacity:1;

        transform:none;

        filter:none;

        border-radius:0;

        box-shadow:none;

        transition:none;
    }

    .apple-page-transition::before{
        display:none;
    }

}

/*==================================================
Projects Lightbox Trigger
Mantiene el diseño actual de las tarjetas
==================================================*/

.project-card{
    position:relative;
    overflow:hidden;
    cursor:zoom-in;
}

/* Enlace que cubre toda la tarjeta */

.project-popup-open{
    position:absolute;
    inset:0;
    z-index:2;

    display:block;

    width:100%;
    height:100%;

    color:inherit;
    text-decoration:none;

    border-radius:inherit;

    cursor:zoom-in;
}

/* Imagen dentro del enlace */

.project-popup-open > img{
    position:absolute;
    inset:0;
    z-index:1;

    display:block;

    width:100%;
    height:100%;

    object-fit:cover;
    object-position:center;

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

/* Mantiene el zoom que ya usa la tarjeta */

.project-card:hover .project-popup-open > img{
    transform:scale(1.055);
}


/*==================================================
Overlay existente
==================================================*/

.project-popup-open .project-overlay{
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    z-index:3;

    padding:70px 24px 24px;

    color:#fff;

    background:
        linear-gradient(
            transparent,
            rgba(8,43,99,.94)
        );

    transition:transform .45s ease;
}

.project-card:hover .project-overlay{
    transform:translateY(0);
}


/*==================================================
Expand Icon
==================================================*/

.project-view-icon{
    position:absolute;
    right:22px;
    bottom:22px;
    z-index:4;

    display:grid;
    place-items:center;

    width:46px;
    height:46px;

    color:#fff;
    background:rgba(255,255,255,.14);

    border:1px solid rgba(255,255,255,.28);
    border-radius:50%;

    box-shadow:0 10px 25px rgba(0,0,0,.14);

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

    opacity:0;
    transform:scale(.8);

    pointer-events:none;

    transition:
        opacity .35s ease,
        transform .35s ease,
        color .3s ease,
        background .35s ease;
}

.project-card:hover .project-view-icon{
    opacity:1;
    transform:scale(1);
}

.project-popup-open:focus-visible .project-view-icon{
    opacity:1;
    transform:scale(1);
}

.project-popup-open:focus-visible{
    outline:3px solid var(--yellow);
    outline-offset:4px;
}


/*==================================================
Responsive
==================================================*/

@media(max-width:767px){

    .project-view-icon{
        right:16px;
        bottom:16px;

        width:42px;
        height:42px;

        opacity:1;
        transform:scale(1);
    }

    .project-popup-open .project-overlay{
        padding:60px 18px 18px;
    }

}

@media(max-width:480px){

    .project-view-icon{
        right:14px;
        bottom:14px;

        width:40px;
        height:40px;
    }

}
/*==================================================
PROJECT LIGHTBOX — FULL VIEWPORT
==================================================*/

.project-lightbox{
    position:fixed !important;

    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    left:0 !important;

    z-index:2147483647 !important;

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

    width:100vw !important;
    max-width:none !important;

    height:100vh !important;
    height:100dvh !important;
    max-height:none !important;

    margin:0 !important;
    padding:24px !important;

    overflow:hidden !important;

    opacity:0;
    visibility:hidden;
    pointer-events:none;

    transform:none !important;
    filter:none !important;

    background:rgba(3,15,37,.92);

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

.project-lightbox.is-open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
}


/* Fondo oscuro */

.project-lightbox-backdrop{
    position:absolute !important;
    inset:0 !important;
    z-index:1;

    display:block;

    width:100%;
    height:100%;

    margin:0;
    padding:0;

    background:rgba(3,15,37,.78);

    border:0;

    cursor:zoom-out;

    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
}


/* Contenedor de la fotografía */

.project-lightbox-content{
    position:relative !important;
    z-index:2;

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

    width:auto !important;
    max-width:calc(100vw - 48px) !important;

    height:auto !important;
    max-height:calc(100dvh - 48px) !important;

    margin:0 !important;
    padding:0 !important;

    overflow:visible !important;

    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;

    opacity:0;

    transform:translate3d(0,20px,0) scale(.95) !important;

    transition:
        opacity .35s ease,
        transform .45s cubic-bezier(.16,1,.3,1);
}

.project-lightbox.is-open .project-lightbox-content{
    opacity:1;

    transform:
        translate3d(0,0,0)
        scale(1) !important;
}


/* Imagen completa */

.project-lightbox-image{
    position:static !important;

    display:block;

    width:auto !important;
    max-width:calc(100vw - 48px) !important;

    height:auto !important;
    max-height:calc(100dvh - 48px) !important;

    object-fit:contain !important;
    object-position:center;

    margin:0;

    border-radius:16px;

    box-shadow:
        0 30px 100px rgba(0,0,0,.55);

    user-select:none;
    -webkit-user-drag:none;
}


/* Botón cerrar */

.project-lightbox-close{
    position:fixed !important;

    top:20px !important;
    right:20px !important;

    z-index:2147483647 !important;

    display:grid;
    place-items:center;

    width:48px;
    height:48px;

    margin:0;
    padding:0;

    color:#fff;
    background:rgba(255,255,255,.14);

    border:1px solid rgba(255,255,255,.24);
    border-radius:50%;

    cursor:pointer;

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

    font-size:1.1rem;

    transition:
        background .3s ease,
        transform .3s ease;
}

.project-lightbox-close:hover{
    color:#fff;
    background:var(--red);

    transform:rotate(90deg);
}


/* Bloquea completamente el fondo */

html.project-lightbox-open,
body.project-lightbox-open{
    overflow:hidden !important;
    overscroll-behavior:none;
}


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

@media(max-width:767px){

    .project-lightbox{
        padding:10px !important;
    }

    .project-lightbox-content,
    .project-lightbox-image{
        max-width:calc(100vw - 20px) !important;
        max-height:calc(100dvh - 20px) !important;
    }

    .project-lightbox-image{
        border-radius:11px;
    }

    .project-lightbox-close{
        top:12px !important;
        right:12px !important;

        width:44px;
        height:44px;

        background:rgba(5,24,58,.8);
    }

}


@media(max-height:520px) and (orientation:landscape){

    .project-lightbox{
        padding:8px 64px 8px 8px !important;
    }

    .project-lightbox-content,
    .project-lightbox-image{
        max-width:calc(100vw - 72px) !important;
        max-height:calc(100dvh - 16px) !important;
    }

}


/*==================================================
Services Page
==================================================*/

.fps-services-kicker{
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-bottom:14px;
    color:var(--red);
    font-size:.73rem;
    font-weight:900;
    letter-spacing:1.8px;
    text-transform:uppercase;
}

.fps-services-kicker::before{
    content:"";
    width:34px;
    height:3px;
    background:linear-gradient(
        90deg,
        var(--red),
        var(--yellow)
    );
    border-radius:20px;
}


/*==================================================
Hero
==================================================*/

.fps-services-hero{
    position:relative;
    display:flex;
    align-items:center;
    min-height:560px;
    overflow:hidden;
    isolation:isolate;
    background:
        url("../assets/images/footer-bg.jpg")
        center/cover no-repeat;
}

.fps-services-hero-overlay{
    position:absolute;
    inset:0;
    z-index:-3;
    background:
        linear-gradient(
            90deg,
            rgba(5,24,58,.97) 0%,
            rgba(8,43,99,.92) 54%,
            rgba(18,99,215,.5) 100%
        );
}

.fps-services-shape{
    position:absolute;
    z-index:-1;
    border-radius:50%;
    pointer-events:none;
}

.fps-services-shape-one{
    top:-180px;
    right:-120px;
    width:430px;
    height:430px;
    border:1px solid rgba(255,255,255,.11);
    box-shadow:
        0 0 0 55px rgba(255,255,255,.025),
        0 0 0 110px rgba(255,255,255,.015);
}

.fps-services-shape-two{
    bottom:-160px;
    left:-130px;
    width:340px;
    height:340px;
    background:rgba(255,189,24,.1);
}

.fps-services-hero .container{
    position:relative;
    z-index:2;
}

.fps-services-hero-content{
    max-width:790px;
    padding:115px 0;
}

.fps-services-badge{
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-bottom:22px;
    padding:11px 17px;
    color:var(--yellow);
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.16);
    border-radius:40px;
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    font-size:.72rem;
    font-weight:900;
    letter-spacing:1.5px;
    text-transform:uppercase;
}

.fps-services-badge i{
    color:var(--red);
}

.fps-services-hero h1{
    margin-bottom:22px;
    color:#fff;
    font-size:clamp(3rem,5.5vw,5rem);
    line-height:1.02;
    letter-spacing:-2.5px;
}

.fps-services-hero h1 span{
    display:block;
    color:var(--yellow);
}

.fps-services-hero p{
    max-width:680px;
    margin-bottom:32px;
    color:rgba(255,255,255,.78);
    font-size:1.05rem;
    line-height:1.85;
}

.fps-services-hero-actions{
    display:flex;
    align-items:center;
    gap:15px;
    flex-wrap:wrap;
    margin-bottom:34px;
}

.fps-services-primary-button,
.fps-services-secondary-button{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    min-height:52px;
    padding:15px 22px;
    border-radius:12px;
    font-size:.74rem;
    font-weight:900;
    text-transform:uppercase;
    transition:.35s ease;
}

.fps-services-primary-button{
    overflow:hidden;
    color:#fff;
    background:linear-gradient(
        135deg,
        var(--red),
        var(--yellow)
    );
    box-shadow:0 13px 30px rgba(241,63,79,.25);
}

.fps-services-primary-button::before{
    content:"";
    position:absolute;
    top:-120%;
    left:-45%;
    width:35%;
    height:340%;
    background:rgba(255,255,255,.28);
    transform:rotate(24deg);
    transition:left .6s ease;
}

.fps-services-primary-button:hover::before{
    left:130%;
}

.fps-services-primary-button:hover,
.fps-services-secondary-button:hover{
    transform:translateY(-4px);
}

.fps-services-secondary-button{
    color:#fff;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.23);
    backdrop-filter:blur(10px);
}

.fps-services-secondary-button:hover{
    color:var(--navy);
    background:#fff;
}

.fps-services-breadcrumb{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    color:rgba(255,255,255,.65);
    font-size:.82rem;
    font-weight:700;
}

.fps-services-breadcrumb a{
    color:#fff;
}

.fps-services-breadcrumb a:hover{
    color:var(--yellow);
}

.fps-services-breadcrumb i{
    color:var(--yellow);
    font-size:.62rem;
}


/*==================================================
Services Section
==================================================*/

.fps-services-section{
    position:relative;
    overflow:hidden;
    padding:110px 0;
    background:
        radial-gradient(
            circle at 100% 0,
            rgba(18,99,215,.08),
            transparent 24%
        ),
        #f7f9fd;
}

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

.fps-services-heading-content{
    max-width:720px;
}

.fps-services-heading h2{
    color:var(--navy);
    font-size:clamp(2.5rem,4.4vw,4rem);
    line-height:1.06;
    letter-spacing:-2px;
}

.fps-services-heading h2 span{
    display:block;
    color:var(--blue);
}

.fps-services-heading > p{
    max-width:430px;
    color:var(--muted);
    line-height:1.85;
}

.fps-services-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:24px;
}

.fps-service-card{
    position:relative;
    min-width:0;
    overflow:hidden;
    background:#fff;
    border:1px solid rgba(8,43,99,.07);
    border-radius:22px;
    box-shadow:0 15px 38px rgba(8,43,99,.07);
    transition:
        transform .4s ease,
        box-shadow .4s ease;
}

.fps-service-card:hover{
    transform:translateY(-10px);
    box-shadow:0 26px 60px rgba(8,43,99,.15);
}

.fps-service-card-featured{
    grid-column:span 2;
    display:grid;
    grid-template-columns:1.08fr .92fr;
}

.fps-service-image{
    position:relative;
    height:245px;
    overflow:hidden;
}

.fps-service-card-featured .fps-service-image{
    height:100%;
    min-height:420px;
}

.fps-service-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .8s ease;
}

.fps-service-card:hover .fps-service-image img{
    transform:scale(1.07);
}

.fps-service-image-overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            180deg,
            transparent 50%,
            rgba(5,24,58,.18)
        );
}

.fps-service-number{
    position:absolute;
    top:18px;
    right:18px;
    z-index:2;
    display:grid;
    place-items:center;
    width:48px;
    height:48px;
    color:#fff;
    background:rgba(5,24,58,.72);
    border:1px solid rgba(255,255,255,.2);
    border-radius:50%;
    backdrop-filter:blur(10px);
    font-size:.7rem;
    font-weight:900;
}

.fps-service-card-content{
    position:relative;
    padding:30px;
}

.fps-service-icon{
    display:grid;
    place-items:center;
    width:58px;
    height:58px;
    margin-top:-59px;
    margin-bottom:20px;
    color:#fff;
    background:linear-gradient(
        135deg,
        var(--red),
        var(--yellow)
    );
    border:6px solid #fff;
    border-radius:17px;
    box-shadow:0 10px 24px rgba(241,63,79,.2);
    font-size:1.3rem;
}

.fps-service-card-featured .fps-service-icon{
    margin-top:0;
}

.fps-service-category{
    display:block;
    margin-bottom:8px;
    color:var(--red);
    font-size:.67rem;
    font-weight:900;
    letter-spacing:1.2px;
    text-transform:uppercase;
}

.fps-service-card h3{
    margin-bottom:12px;
    color:var(--navy);
    font-size:1.32rem;
    line-height:1.25;
}

.fps-service-card p{
    color:var(--muted);
    font-size:.86rem;
    line-height:1.75;
}

.fps-service-features{
    margin:20px 0 0;
    list-style:none;
}

.fps-service-features li{
    margin:8px 0;
    color:#526178;
    font-size:.78rem;
}

.fps-service-features i{
    margin-right:8px;
    color:var(--green);
}

.fps-service-link{
    display:inline-flex;
    align-items:center;
    gap:9px;
    margin-top:22px;
    color:var(--blue);
    font-size:.74rem;
    font-weight:900;
    text-transform:uppercase;
}

.fps-service-link i{
    transition:transform .3s ease;
}

.fps-service-card:hover .fps-service-link i{
    transform:translateX(5px);
}


/*==================================================
Process
==================================================*/

.fps-services-process{
    padding:110px 0;
    background:#fff;
}

.fps-services-process-heading{
    max-width:750px;
    margin:0 auto 55px;
    text-align:center;
}

.fps-services-process-heading .fps-services-kicker{
    justify-content:center;
}

.fps-services-process-heading h2{
    color:var(--navy);
    font-size:clamp(2.4rem,4vw,3.7rem);
    line-height:1.08;
    letter-spacing:-1.8px;
}

.fps-services-process-heading h2 span{
    display:block;
    color:var(--blue);
}

.fps-services-process-heading p{
    margin-top:18px;
    color:var(--muted);
    line-height:1.8;
}

.fps-services-process-grid{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:18px;
}

.fps-process-card{
    position:relative;
    overflow:hidden;
    padding:30px 23px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:20px;
    transition:.4s ease;
}

.fps-process-card:hover{
    border-color:rgba(18,99,215,.2);
    box-shadow:0 20px 45px rgba(8,43,99,.11);
    transform:translateY(-8px);
}

.fps-process-number{
    position:absolute;
    top:18px;
    right:18px;
    color:rgba(8,43,99,.09);
    font-size:2rem;
    font-weight:900;
}

.fps-process-icon{
    display:grid;
    place-items:center;
    width:55px;
    height:55px;
    margin-bottom:20px;
    color:var(--blue);
    background:var(--soft);
    border-radius:16px;
    font-size:1.3rem;
    transition:.35s ease;
}

.fps-process-card:hover .fps-process-icon{
    color:#fff;
    background:linear-gradient(
        135deg,
        var(--navy),
        var(--blue)
    );
    transform:rotate(-5deg);
}

.fps-process-card h3{
    margin-bottom:10px;
    color:var(--navy);
    font-size:1rem;
}

.fps-process-card p{
    color:var(--muted);
    font-size:.78rem;
    line-height:1.7;
}


/*==================================================
Guidance CTA
==================================================*/

.fps-services-guidance{
    padding:0 0 110px;
    background:#fff;
}

.fps-services-guidance-inner{
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    overflow:hidden;
    background:linear-gradient(
        135deg,
        #071c42,
        var(--navy),
        var(--blue)
    );
    border-radius:28px;
    box-shadow:0 28px 65px rgba(8,43,99,.2);
}

.fps-services-guidance-image{
    position:relative;
    min-height:520px;
    overflow:hidden;
}

.fps-services-guidance-image img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.fps-services-guidance-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(
        90deg,
        transparent 55%,
        rgba(8,43,99,.7)
    );
}

.fps-services-guidance-content{
    display:flex;
    justify-content:center;
    flex-direction:column;
    padding:55px;
}

.fps-services-guidance-content .fps-services-kicker{
    color:var(--yellow);
}

.fps-services-guidance-content h2{
    margin-bottom:18px;
    color:#fff;
    font-size:clamp(2rem,3.4vw,3rem);
    line-height:1.1;
}

.fps-services-guidance-content > p{
    color:rgba(255,255,255,.72);
    line-height:1.8;
}

.fps-services-guidance-features{
    display:grid;
    gap:11px;
    margin:25px 0 30px;
}

.fps-services-guidance-features div{
    display:flex;
    align-items:center;
    gap:10px;
    color:#fff;
    font-size:.82rem;
    font-weight:700;
}

.fps-services-guidance-features i{
    color:var(--yellow);
}

.fps-services-guidance-actions{
    display:flex;
    align-items:center;
    gap:22px;
    flex-wrap:wrap;
}

.fps-services-phone{
    display:flex;
    align-items:center;
    gap:12px;
    color:#fff;
}

.fps-services-phone > span{
    display:grid;
    place-items:center;
    width:48px;
    height:48px;
    color:#fff;
    background:rgba(255,255,255,.1);
    border:1px solid rgba(255,255,255,.18);
    border-radius:50%;
}

.fps-services-phone small,
.fps-services-phone strong{
    display:block;
}

.fps-services-phone small{
    color:rgba(255,255,255,.62);
    font-size:.65rem;
}

.fps-services-phone strong{
    font-size:.92rem;
}


/*==================================================
Responsive
==================================================*/

@media(max-width:1100px){

    .fps-services-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .fps-service-card-featured{
        grid-column:span 2;
    }

    .fps-services-process-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

}


@media(max-width:900px){

    .fps-services-heading{
        align-items:flex-start;
        flex-direction:column;
        gap:25px;
    }

    .fps-services-heading > p{
        max-width:650px;
    }

    .fps-services-guidance-inner{
        grid-template-columns:1fr;
    }

    .fps-services-guidance-image{
        min-height:390px;
    }

    .fps-services-guidance-overlay{
        background:linear-gradient(
            180deg,
            transparent 45%,
            rgba(8,43,99,.65)
        );
    }

}


@media(max-width:767px){

    .fps-services-hero{
        min-height:500px;
    }

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

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

    .fps-services-primary-button,
    .fps-services-secondary-button{
        width:100%;
    }

    .fps-services-section,
    .fps-services-process{
        padding:80px 0;
    }

    .fps-services-grid{
        grid-template-columns:1fr;
    }

    .fps-service-card-featured{
        grid-column:auto;
        display:block;
    }

    .fps-service-card-featured .fps-service-image{
        min-height:0;
        height:260px;
    }

    .fps-service-card-featured .fps-service-icon{
        margin-top:-59px;
    }

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

    .fps-services-guidance{
        padding-bottom:80px;
    }

    .fps-services-guidance-content{
        padding:38px 30px;
    }

}


@media(max-width:520px){

    .fps-services-hero h1{
        font-size:2.65rem;
        letter-spacing:-1.5px;
    }

    .fps-services-hero p{
        font-size:.96rem;
    }

    .fps-service-image{
        height:230px;
    }

    .fps-service-card-content{
        padding:26px 22px;
    }

    .fps-services-process-grid{
        grid-template-columns:1fr;
    }

    .fps-services-guidance-image{
        min-height:300px;
    }

    .fps-services-guidance-content{
        padding:32px 22px;
    }

    .fps-services-guidance-actions{
        align-items:flex-start;
        flex-direction:column;
    }

}

/*==================================================
MOBILE MENU — ACTIONS & SOCIAL AREA
Added as an isolated override. Existing menu behavior is preserved.
==================================================*/

.fps-mobile-actions{
    position:relative;
    flex-shrink:0;
    margin-top:auto;
    padding:25px 20px 28px;
    overflow:hidden;
    background:
        radial-gradient(
            circle at 100% 0,
            rgba(18,99,215,.12),
            transparent 38%
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f6f9fd 100%
        );
    border-top:1px solid rgba(8,43,99,.08);
}

.fps-mobile-actions::before{
    content:"";
    position:absolute;
    top:0;
    left:20px;
    width:52px;
    height:3px;
    border-radius:20px;
    background:linear-gradient(
        90deg,
        var(--red),
        var(--yellow),
        var(--blue)
    );
}

.fps-mobile-actions-heading{
    position:relative;
    z-index:2;
    margin-bottom:17px;
}

.fps-mobile-actions-heading > span{
    display:block;
    margin-bottom:5px;
    color:var(--red);
    font-size:.62rem;
    font-weight:900;
    letter-spacing:1.35px;
    text-transform:uppercase;
}

.fps-mobile-actions-heading h3{
    margin:0 0 7px;
    color:var(--navy);
    font-size:1.12rem;
    line-height:1.28;
}

.fps-mobile-actions-heading p{
    margin:0;
    color:#718096;
    font-size:.72rem;
    line-height:1.6;
}


/* Main quote button */

.fps-mobile-quote{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:46px minmax(0,1fr) 34px;
    align-items:center;
    gap:12px;
    width:100%;
    min-width:0;
    padding:13px 14px;
    overflow:hidden;
    color:#fff;
    background:linear-gradient(
        135deg,
        var(--red) 0%,
        #ff7b3f 48%,
        var(--yellow) 100%
    );
    border:0;
    border-radius:16px;
    box-shadow:
        0 14px 30px rgba(241,63,79,.22);
    text-decoration:none;
    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

.fps-mobile-quote::before{
    content:"";
    position:absolute;
    top:-140%;
    left:-35%;
    width:30%;
    height:380%;
    background:rgba(255,255,255,.28);
    transform:rotate(24deg);
    transition:left .65s ease;
}

.fps-mobile-quote:hover{
    color:#fff;
    transform:translateY(-3px);
    box-shadow:
        0 18px 38px rgba(241,63,79,.3);
}

.fps-mobile-quote:hover::before{
    left:130%;
}

.fps-mobile-quote-icon{
    position:relative;
    z-index:2;
    display:grid;
    place-items:center;
    width:46px;
    height:46px;
    color:#fff;
    background:rgba(255,255,255,.16);
    border:1px solid rgba(255,255,255,.22);
    border-radius:13px;
    font-size:1.05rem;
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
}

.fps-mobile-quote-text{
    position:relative;
    z-index:2;
    display:block;
    min-width:0;
}

.fps-mobile-quote-text small,
.fps-mobile-quote-text strong{
    display:block;
}

.fps-mobile-quote-text small{
    margin-bottom:2px;
    color:rgba(255,255,255,.76);
    font-size:.57rem;
    font-weight:800;
    letter-spacing:.8px;
    text-transform:uppercase;
}

.fps-mobile-quote-text strong{
    overflow-wrap:anywhere;
    color:#fff;
    font-size:.76rem;
    line-height:1.35;
}

.fps-mobile-quote-arrow{
    position:relative;
    z-index:2;
    display:grid;
    place-items:center;
    width:34px;
    height:34px;
    color:var(--navy);
    background:#fff;
    border-radius:50%;
    font-size:.7rem;
    transition:transform .3s ease;
}

.fps-mobile-quote:hover .fps-mobile-quote-arrow{
    transform:translateX(3px);
}


/* Secondary call button */

.fps-mobile-call{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    gap:12px;
    margin-top:11px;
    padding:12px 14px;
    color:var(--navy);
    background:#fff;
    border:1px solid rgba(8,43,99,.09);
    border-radius:14px;
    box-shadow:0 9px 22px rgba(8,43,99,.06);
    text-decoration:none;
    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease;
}

.fps-mobile-call:hover{
    color:var(--navy);
    border-color:rgba(18,99,215,.22);
    box-shadow:0 13px 28px rgba(8,43,99,.1);
    transform:translateY(-2px);
}

.fps-mobile-call > span{
    display:grid;
    place-items:center;
    flex:0 0 42px;
    width:42px;
    height:42px;
    color:#fff;
    background:linear-gradient(
        135deg,
        var(--navy),
        var(--blue)
    );
    border-radius:12px;
    box-shadow:0 8px 18px rgba(18,99,215,.2);
}

.fps-mobile-call small,
.fps-mobile-call strong{
    display:block;
}

.fps-mobile-call small{
    margin-bottom:2px;
    color:#8a97aa;
    font-size:.57rem;
    font-weight:900;
    letter-spacing:.8px;
    text-transform:uppercase;
}

.fps-mobile-call strong{
    color:var(--navy);
    font-size:.82rem;
}


/* Social networks */

.fps-mobile-social-area{
    position:relative;
    z-index:2;
    margin-top:20px;
    padding-top:18px;
    border-top:1px solid rgba(8,43,99,.08);
}

.fps-mobile-social-title{
    display:block;
    margin-bottom:11px;
    color:#7b899c;
    font-size:.61rem;
    font-weight:900;
    letter-spacing:1.15px;
    text-transform:uppercase;
}

.fps-mobile-social{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin:0;
}

.fps-mobile-social a{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:6px;
    min-width:0;
    min-height:72px;
    padding:11px 7px;
    overflow:hidden;
    color:var(--navy);
    background:#fff;
    border:1px solid rgba(8,43,99,.08);
    border-radius:14px;
    box-shadow:0 8px 22px rgba(8,43,99,.055);
    text-decoration:none;
    transition:
        color .3s ease,
        background .3s ease,
        border-color .3s ease,
        transform .3s ease,
        box-shadow .3s ease;
}

.fps-mobile-social a::before{
    content:"";
    position:absolute;
    inset:auto -20px -35px;
    height:55px;
    border-radius:50%;
    opacity:.08;
    transition:
        opacity .3s ease,
        transform .3s ease;
}

.fps-mobile-social a i{
    position:relative;
    z-index:2;
    font-size:1.15rem;
}

.fps-mobile-social a span{
    position:relative;
    z-index:2;
    max-width:100%;
    overflow:hidden;
    color:inherit;
    font-size:.58rem;
    font-weight:850;
    line-height:1.2;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.fps-mobile-social a:hover{
    color:#fff;
    border-color:transparent;
    transform:translateY(-4px);
}

.fps-mobile-social a:hover::before{
    opacity:.2;
    transform:scale(1.35);
}

.fps-social-facebook{
    color:#1877f2 !important;
}

.fps-social-facebook::before{
    background:#1877f2;
}

.fps-social-facebook:hover{
    color:#fff !important;
    background:#1877f2;
    box-shadow:0 12px 26px rgba(24,119,242,.24);
}

.fps-social-instagram{
    color:#c13584 !important;
}

.fps-social-instagram::before{
    background:#c13584;
}

.fps-social-instagram:hover{
    color:#fff !important;
    background:linear-gradient(
        135deg,
        #833ab4,
        #fd1d1d,
        #fcb045
    );
    box-shadow:0 12px 26px rgba(193,53,132,.23);
}

.fps-social-whatsapp{
    color:#20b95f !important;
}

.fps-social-whatsapp::before{
    background:#25d366;
}

.fps-social-whatsapp:hover{
    color:#fff !important;
    background:#25d366;
    box-shadow:0 12px 26px rgba(37,211,102,.23);
}


/* Mobile size refinements */

@media(max-width:480px){

    .fps-mobile-actions{
        padding:23px 15px 25px;
    }

    .fps-mobile-actions::before{
        left:15px;
    }

    .fps-mobile-quote{
        grid-template-columns:43px minmax(0,1fr) 32px;
        gap:10px;
        padding:12px;
    }

    .fps-mobile-quote-icon{
        width:43px;
        height:43px;
    }

    .fps-mobile-social{
        gap:7px;
    }

    .fps-mobile-social a{
        min-height:68px;
        padding-inline:5px;
    }

    .fps-mobile-social a span{
        font-size:.54rem;
    }

}

@media(max-width:360px){

    .fps-mobile-social{
        grid-template-columns:1fr;
    }

    .fps-mobile-social a{
        min-height:50px;
        flex-direction:row;
    }

}

/*==================================================
FIX DEFINITIVO — OFF CANVAS SIN SCROLL INFINITO
==================================================*/

html.fps-menu-open,
body.fps-menu-open{
    width:100% !important;
    height:100% !important;
    overflow:hidden !important;
    overscroll-behavior:none !important;
}

/* El menú siempre queda anclado al viewport */

body > .fps-mobile-menu{
    position:fixed !important;

    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    left:auto !important;

    z-index:2147483646 !important;

    display:flex !important;
    flex-direction:column !important;

    width:min(420px,94vw) !important;
    max-width:94vw !important;

    height:100vh !important;
    height:100dvh !important;
    max-height:100dvh !important;

    margin:0 !important;
    padding:0 !important;

    overflow:hidden !important;

    color:var(--ink);
    background:#fff;

    opacity:0;
    visibility:hidden;
    pointer-events:none;

    transform:translate3d(100%,0,0) !important;

    box-shadow:-20px 0 60px rgba(3,15,37,.28);

    transition:
        transform .42s cubic-bezier(.22,.8,.25,1),
        opacity .3s ease,
        visibility .3s ease;
}

body > .fps-mobile-menu.fps-open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;

    transform:translate3d(0,0,0) !important;
}


/* Overlay fijo */

body > .fps-menu-overlay{
    position:fixed !important;
    inset:0 !important;

    z-index:2147483645 !important;

    width:100vw !important;
    height:100vh !important;
    height:100dvh !important;

    margin:0 !important;
    padding:0 !important;

    background:rgba(3,15,37,.74);

    opacity:0;
    visibility:hidden;
    pointer-events:none;

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

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

body > .fps-menu-overlay.fps-open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
}


/* Encabezado fijo dentro del menú */

.fps-mobile-menu-header{
    position:relative !important;
    top:auto !important;

    z-index:20;

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

    flex:0 0 auto;

    min-height:86px;

    padding:14px 22px;

    background:#fff;
    border-bottom:1px solid var(--line);
}


/* Solo esta zona hace scroll */

.fps-mobile-menu-scroll{
    flex:1 1 auto;

    min-height:0;

    overflow-x:hidden !important;
    overflow-y:auto !important;

    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
}


/* El área inferior ya no empuja infinitamente */

.fps-mobile-actions{
    flex:0 0 auto;
    margin-top:0 !important;
}


/* Evita saltos por submenús demasiado altos */

.fps-mobile-submenu{
    max-height:0;
    overflow:hidden;
}

.fps-mobile-dropdown.fps-open .fps-mobile-submenu{
    max-height:520px;
    overflow:hidden;
}


/* Responsive */

@media(max-width:480px){

    body > .fps-mobile-menu{
        width:94vw !important;
        max-width:94vw !important;
    }

    .fps-mobile-menu-header{
        min-height:78px;
        padding:12px 17px;
    }

}