:root{--accent:#E8501F}
.svc-card{background:#FFFFFF !important;color:#1F2328 !important}
.svc-card > svg{color:#5B6270;transition:color .35s ease}
.svc-card .svc-desc-inner p{color:#5B6270}
.svc-card.is-active{background:var(--accent) !important;color:#FFFFFF !important}
.svc-card.is-active > svg{color:#FFFFFF}
.svc-card.is-active .svc-desc-inner p{color:rgba(255,255,255,0.9)}
.nav-toggle .icon-close{display:none}
.menu-open .nav-toggle .icon-close{display:block}
.menu-open .nav-toggle .icon-open{display:none}
.nav-panel{display:none !important}
@media (max-width: 960px){.menu-open .nav-panel{display:flex !important}}
.hp{position:absolute !important;left:-9999px !important;width:1px;height:1px;opacity:0}
#form-status.is-error{color:#B42318 !important}
#form-status.is-ok{color:#067647 !important}
button[type=submit][disabled]{opacity:.6;cursor:progress}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
body{margin:0;background:#F6F7F9}
a{color:inherit;text-decoration:none}a:hover{opacity:.85}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
section[id]{scroll-margin-top:16px}
.hero-slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;animation:heroFade 9s infinite ease-in-out}
.hero-slide-1{background-image:url(assets/img/banner-1.jpg);animation-delay:0s}
.hero-slide-2{background-image:url(assets/img/banner-2.jpg);animation-delay:-6s}
.hero-slide-3{background-image:url(assets/img/banner-3.jpg);animation-delay:-3s}
.cta-bg{background-image:url(assets/img/llamado-accion.jpg);background-size:cover;background-position:center 40%}
.sec-img{background-size:cover;background-repeat:no-repeat}
.sec-img-1{background-image:url(assets/img/como-trabajamos.jpg);background-position:60% center}
.sec-img-3{background-image:url(assets/img/quienes-somos.jpg);background-position:center 22%}
.sec-img-4{background-image:url(assets/img/contacto.jpg);background-position:center 30%}
.sec-img-2{background-image:url(assets/img/nuestro-sello.jpg);background-position:center center}
@keyframes heroFade{0%{opacity:1}33.33%{opacity:1}44.44%{opacity:0}88.89%{opacity:0}100%{opacity:1}}
@media (prefers-reduced-motion: reduce){.hero-slide{animation:none}.hero-slide-1{opacity:1}}
@keyframes revealUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes revealZoom{from{opacity:0;transform:scale(0.96)}to{opacity:1;transform:none}}
.js-reveal .reveal:not(.is-visible),.js-reveal .reveal-stagger:not(.is-visible) > *{opacity:0}
.js-reveal .reveal.is-visible{animation:revealUp 0.8s cubic-bezier(0.2,0.65,0.25,1) backwards;animation-delay:var(--d,0ms)}
.js-reveal .sec-img.reveal.is-visible{animation-name:revealZoom;animation-duration:1s}
.js-reveal .reveal-stagger.is-visible > *{animation:revealUp 0.7s cubic-bezier(0.2,0.65,0.25,1) backwards}
.js-reveal .reveal-stagger.is-visible > :nth-child(2){animation-delay:90ms}
.js-reveal .reveal-stagger.is-visible > :nth-child(3){animation-delay:180ms}
.js-reveal .reveal-stagger.is-visible > :nth-child(4){animation-delay:270ms}
.js-reveal .reveal-stagger.is-visible > :nth-child(5){animation-delay:360ms}
.js-reveal .reveal-stagger.is-visible > :nth-child(6){animation-delay:450ms}
.js-reveal .reveal-stagger.is-visible > :nth-child(7){animation-delay:540ms}
.js-reveal .reveal-stagger.is-visible > :nth-child(8){animation-delay:630ms}
@media (prefers-reduced-motion: reduce){.js-reveal .reveal,.js-reveal .reveal-stagger > *{opacity:1 !important;animation:none !important}}
@keyframes menuIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.nav-panel a:hover{background:#F3F4F6;opacity:1}
.svc-desc{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s ease}
.svc-card.is-active .svc-desc{grid-template-rows:1fr}
.svc-desc-inner{overflow:hidden;min-height:0}
.svc-desc-inner p{opacity:0;transform:translateY(4px);transition:opacity .35s ease,transform .35s ease}
.svc-card.is-active .svc-desc-inner p{opacity:1;transform:none}
.svc-card:hover{box-shadow:0 10px 24px rgba(17,24,39,0.08)}
.svc-card.is-active{box-shadow:0 14px 30px rgba(232,80,31,0.28)}
.svc-card:active{transform:scale(0.98)}
.svc-card:focus-visible{outline:2px solid #E8501F;outline-offset:3px}
@media (min-width: 1025px){
  .svc-card{position:relative !important;justify-content:center !important;align-items:center !important;text-align:center !important}
  .svc-card > svg{position:absolute;top:20px;left:20px}
  .svc-card > div{width:100%}
}
@media (prefers-reduced-motion: reduce){.svc-card,.svc-card svg,.svc-desc,.svc-desc-inner p{transition:none !important}}
.faq-q:focus-visible{outline:2px solid #E8501F;outline-offset:4px;border-radius:6px}
@media (max-width: 1024px){
  .hero-card{flex-basis:200px !important}
  .sec-img-3{flex-basis:320px !important;min-height:380px !important}
  .about-text{flex-basis:360px !important}
  .how-steps{flex-basis:380px !important}
  .sec-img-1{flex-basis:300px !important}
  .sec-img-2{flex-basis:300px !important;min-height:420px !important}
  .why-text{flex-basis:360px !important}
  .sec-img-4{flex-basis:280px !important}
  .contact-col{flex-basis:400px !important}
}
@media (max-width: 1024px){.foot-cols{justify-content:flex-start !important}}
@media (max-width: 960px){
  .nav-links,.nav-cta{display:none !important}
  .nav-toggle{display:inline-flex !important}
}
@media (min-width: 961px){.nav-panel{display:none !important}}
@media (max-width: 640px){
  .sec{padding-top:72px !important}
  .cta{margin-top:72px !important;min-height:340px !important;padding:56px 20px !important}
  .site-footer{margin-top:72px !important;padding-top:56px !important}
  .hero-box{min-height:560px !important;gap:48px !important;padding-bottom:110px !important}
  .hero-stats{width:100%;justify-content:space-around;padding:14px 16px !important;gap:16px !important}
  .hero-stats-wrap{width:100%}
  .svc-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:12px !important}
  .svc-card{min-height:150px !important;padding:16px !important}
  .svc-card h3{font-size:14px !important}
  .sec-img-1,.sec-img-2,.sec-img-3,.sec-img-4{flex-basis:100% !important;min-height:300px !important}
  .about-text,.how-steps,.why-text,.contact-col{flex-basis:100% !important}
  .foot-cols{justify-content:flex-start !important;gap:32px !important}
  .faq-grid{grid-template-columns:1fr !important;gap:12px !important}
  .hero-stats{display:none !important}
  .about-badge{display:none !important}
  .badge-float{display:block !important}
  .how-row{display:contents !important}
  .how-row .sec-img-1{order:1;flex:0 0 auto !important;width:100%;min-height:300px !important}
  .how-row .how-steps{order:2;flex:0 0 auto !important}
  .faq-item{gap:0 !important;padding:18px 20px !important}
  .faq-q{cursor:pointer !important;align-items:center !important;min-height:44px}
  .faq-chev{display:block !important;transition:transform .3s ease}
  .faq-item.is-open .faq-chev{transform:rotate(180deg)}
  .faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease}
  .faq-item.is-open .faq-a{grid-template-rows:1fr}
  .faq-a-inner{overflow:hidden;min-height:0}
  .faq-a-inner p{padding-top:8px;opacity:0;transition:opacity .3s ease}
  .faq-item.is-open .faq-a-inner p{opacity:1}
}
@media (max-width: 640px) and (prefers-reduced-motion: reduce){
  .faq-a,.faq-chev,.faq-a-inner p{transition:none !important}
}

/* Escritorio con mouse: la tarjeta bajo el cursor pasa a ser la destacada (lo maneja script.js) */
@media (min-width: 1025px) and (hover: hover) and (pointer: fine){
  .svc-card{cursor:default !important}
  .svc-card:active{transform:none}
}
}

/* Escritorio con mouse: tarjetas bajo el banner suben levemente y pasan a gris claro */
.hero-card{transition:transform .3s ease,background-color .3s ease,box-shadow .3s ease}
@media (min-width: 1025px) and (hover: hover) and (pointer: fine){
  .hero-card:hover{transform:translateY(-4px);background:#F1F3F5 !important;box-shadow:0 14px 34px rgba(17,24,39,0.10) !important}
}
@media (prefers-reduced-motion: reduce){.hero-card{transition:background-color .3s ease}.hero-card:hover{transform:none !important}}

/* Botón flotante de WhatsApp */
.wa-float{position:fixed;right:36px;bottom:36px;z-index:50;display:flex;align-items:center;gap:10px;text-decoration:none}
.wa-btn{width:58px;height:58px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 24px rgba(10,18,32,0.25);transition:transform .25s ease,box-shadow .25s ease;position:relative}
.wa-btn::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #25D366;animation:waPulse 2.4s ease-out infinite}
@keyframes waPulse{0%{transform:scale(1);opacity:.7}70%,100%{transform:scale(1.45);opacity:0}}
.wa-label{font-family:'Poppins',sans-serif;background:#FFFFFF;color:#1F2328;font-size:13px;font-weight:500;padding:10px 14px;border-radius:999px;box-shadow:0 8px 20px rgba(10,18,32,0.15);white-space:nowrap;opacity:0;transform:translateX(8px);pointer-events:none;transition:opacity .25s ease,transform .25s ease}
.wa-float:hover .wa-btn,.wa-float:focus-visible .wa-btn{transform:scale(1.06);box-shadow:0 14px 30px rgba(10,18,32,0.3)}
.wa-float:hover .wa-label,.wa-float:focus-visible .wa-label{opacity:1;transform:none}
.wa-float:hover{opacity:1}
.wa-float:focus-visible{outline:none}
.wa-float:focus-visible .wa-btn{outline:3px solid #1F2328;outline-offset:3px}
@media (max-width: 640px){.wa-float{right:22px;bottom:22px}.wa-btn{width:54px;height:54px}.wa-label{display:none}}
@media (prefers-reduced-motion: reduce){.wa-btn::after{animation:none;opacity:0}.wa-btn,.wa-label{transition:none}}

@media (max-width: 640px){.sec-img-3{background-position:center 8% !important}}
@media (max-width: 640px){.sec-img-4{background-position:center 18% !important}}

/* Cómo trabajamos: los pasos aparecen uno a uno al hacer scroll */
.js-reveal .how-step:not(.is-visible){opacity:0;transform:translateX(-24px)}
.how-step{transition:opacity .8s cubic-bezier(0.2,0.65,0.25,1),transform .8s cubic-bezier(0.2,0.65,0.25,1)}

/* Por qué elegirnos: tarjetas */
.why-cards{display:flex;flex-direction:column;gap:12px;margin-top:8px}
.why-card{display:flex;gap:14px;align-items:flex-start;background:#FFFFFF;border-radius:12px;padding:18px 20px;box-shadow:0 6px 18px rgba(17,24,39,0.05);transition:background-color .35s ease,color .35s ease,box-shadow .35s ease,transform .3s ease}
.why-card h3{margin:0 0 4px;font-size:16px;font-weight:600;line-height:1.35;color:#1F2328;transition:color .35s ease}
.why-card p{margin:0;font-size:14px;line-height:1.55;color:#5B6270;transition:color .35s ease}
.why-icon{flex:none;width:38px;height:38px;border-radius:10px;background:#FDECE6;color:var(--accent);display:flex;align-items:center;justify-content:center;transition:background-color .35s ease,color .35s ease}
@media (hover: hover) and (pointer: fine){
  .why-card:hover{background:var(--accent);box-shadow:0 14px 30px rgba(232,80,31,0.28);transform:translateY(-2px)}
  .why-card:hover h3{color:#FFFFFF}
  .why-card:hover p{color:rgba(255,255,255,0.9)}
  .why-card:hover .why-icon{background:rgba(255,255,255,0.18);color:#FFFFFF}
}
@media (prefers-reduced-motion: reduce){
  .how-step,.why-card{transition:none !important}
  .js-reveal .how-step:not(.is-visible){opacity:1;transform:none}
  .why-card:hover{transform:none}
}

/* Insignia "Administración profesional": entra de derecha a izquierda */
.badge-in{transition:opacity .9s cubic-bezier(0.2,0.65,0.25,1) .2s,transform .9s cubic-bezier(0.2,0.65,0.25,1) .2s}
.js-reveal .badge-in:not(.is-visible){opacity:0;transform:translateX(70px)}
@media (prefers-reduced-motion: reduce){.badge-in{transition:none !important}.js-reveal .badge-in:not(.is-visible){opacity:1;transform:none}}

/* FAQ: al pasar el mouse la tarjeta pasa a gris claro y sube levemente */
.faq-item{transition:background-color .35s ease,box-shadow .35s ease,transform .3s ease}
@media (hover: hover) and (pointer: fine){
  .faq-item:hover{background:#EEF0F3 !important;box-shadow:0 14px 30px rgba(17,24,39,0.08);transform:translateY(-2px)}
}
@media (prefers-reduced-motion: reduce){.faq-item{transition:background-color .35s ease}.faq-item:hover{transform:none !important}}
