/* ═══════════════════════════════════════════════════════════
   360 REMOTO — Global Stylesheet v2.0
   Maquila de Nómina | SEO-optimized Design System
═══════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&display=swap');

/* ─── VARIABLES ─────────────────────────────────────────── */
:root {
  --azul:        #0A3D2C;
  --azul-medio:  #14664A;
  --azul-claro:  #1F8A64;
  --acento:      #FF8C00;
  --acento-h:    #e67e00;
  --acento-light:#FFF4E6;
  --blanco:      #FFFEFA;
  --gris-claro:  #F3F6F2;
  --gris-texto:  #5A6B63;
  --texto:       #0A3D2C;
  --rojo:        #E53E3E;
  --amarillo:    #F6AD55;
  --verde:       #38A169;
  --wa:          #25D366;
  --quote-bg:    #F1F5F9;
  --quote-border:#0B2447;
  --sombra:      0 8px 40px rgba(10,61,44,0.10);
  --sombra-lg:   0 20px 60px rgba(10,61,44,0.16);
  --radio:       14px;
  --radio-sm:    8px;
  --max:         1160px;
  --reading:     720px;
  --transition:  all .25s cubic-bezier(.4,0,.2,1);
  --navy:        var(--azul);
  --accent:      var(--acento);
  --muted:       var(--gris-texto);
  --text:        var(--texto);
  --font-head:   'Inter', sans-serif;
  --font-body:   'Inter', sans-serif;
  --font-display:'Inter', sans-serif;
  --font-btn:    'Inter', sans-serif;
  --font-label:  'Inter', sans-serif;
  --lockup-accent:#FF8C00;
  --ticker-h: 40px;
  --nav-h: 64px;
  --chrome-h: calc(var(--ticker-h) + var(--nav-h));
}


/* ─── RESET ─────────────────────────────────────────────── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }
body {
  font-family:var(--font-body);
  font-size:17px;
  font-weight:400;
  line-height:1.75;
  color:var(--texto);
  background:var(--blanco);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  padding-top: 0;
}
h1 {
  font-family:var(--font-head);
  font-weight:700;
  font-size:40px;
  line-height:1.2;
  letter-spacing:-0.02em;
  text-transform:none;
}
h2 {
  font-family:var(--font-head);
  font-weight:700;
  line-height:1.25;
  letter-spacing:-0.02em;
  text-transform:none;
}
h3,h4,h5,h6 { font-family:var(--font-head); font-weight:700; line-height:1.25; letter-spacing:-0.022em; }
.article-content h2, .article-content h3 {
  font-family:var(--font-head);
  font-weight:700;
  letter-spacing:-0.02em;
  line-height:1.3;
  text-transform:none;
}
img { max-width:100%; display:block; height:auto; }
a { text-decoration:none; }
a:not(.nav-phone):not(.nav-wa):not(.nav-cta):not([class*="btn"]):not([class*="sticky-lead"]) { color:inherit; }
ul { list-style:none; }
button { font-family:inherit; }

/* ─── UTILITIES ─────────────────────────────────────────── */
.container { max-width:var(--max); margin:0 auto; padding:0 24px; }
section { padding:52px 5%; }

.section-tag {
  display:inline-flex; align-items:center; gap:7px;
  font-size:.72rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
  color:var(--azul); background:rgba(10,61,44,.06);
  padding:5px 12px; border-radius:4px; margin-bottom:10px;
}
.section-tag::before { content:''; width:5px; height:5px; border-radius:1px; background:var(--azul); display:inline-block; }
.section-title {
  font-family:var(--font-head);
  font-size:clamp(1.55rem, 2.4vw, 2.15rem);
  font-weight:700; line-height:1.2; letter-spacing:-0.02em; text-transform:none; color:var(--azul);
  margin:0 0 10px; text-align:left; text-wrap:balance;
}
.section-sub {
  font-size:1rem; color:var(--gris-texto);
  line-height:1.55; max-width:640px; margin:0 0 24px; text-align:left; text-wrap:pretty;
}

/* ─── BUTTONS ────────────────────────────────────────────── */
.btn-primary {
  display:inline-flex; align-items:center; gap:9px;
  background:#FF8C00; color:#fff;
  font-family:var(--font-btn); font-weight:800; font-size:.92rem;
  letter-spacing:.02em;
  padding:13px 24px; border-radius:9999px; text-decoration:none;
  transition:background .2s ease, box-shadow .2s ease; box-shadow:0 4px 20px rgba(255,140,0,.4);
  border:none; cursor:pointer; white-space:normal;
}
.btn-primary:hover { background:#e67e00; box-shadow:0 6px 22px rgba(255,140,0,.45); }
a.btn-primary[href*="wa.me"],
a.btn-whatsapp {
  background:var(--wa); color:#fff; box-shadow:0 4px 20px rgba(37,211,102,.35);
}
a.btn-primary[href*="wa.me"]:hover,
a.btn-whatsapp:hover { background:#1ebe5a; color:#fff; box-shadow:0 6px 22px rgba(37,211,102,.42); }

.btn-secondary {
  display:inline-flex; align-items:center; gap:9px;
  background:var(--azul); color:#fff;
  font-family:var(--font-btn); font-weight:800; font-size:.92rem;
  letter-spacing:.02em;
  padding:13px 24px; border-radius:999px; text-decoration:none;
  transition:background .2s ease; box-shadow:0 2px 8px rgba(10,61,44,.16);
  border:none; cursor:pointer;
}
.btn-secondary:hover { background:#071f17; }

.btn-outline {
  display:inline-flex; align-items:center; gap:9px;
  background:transparent; color:var(--azul);
  font-family:var(--font-btn); font-weight:800; font-size:.92rem;
  letter-spacing:.02em;
  padding:12px 24px; border-radius:999px; text-decoration:none;
  border:1px solid var(--azul); transition:background .2s ease, color .2s ease; cursor:pointer;
}
.btn-outline:hover { background:var(--azul); color:#fff; }

.btn-ghost {
  display:inline-flex; align-items:center; gap:9px;
  background:transparent; color:#fff;
  font-family:var(--font-btn); font-weight:800; font-size:.92rem;
  letter-spacing:.02em;
  padding:12px 24px; border-radius:999px; text-decoration:none;
  border:1px solid rgba(255,255,255,.35); transition:background .2s ease;
}
.btn-ghost:hover { background:rgba(255,255,255,.12); }

/* ─── CINTA SUPERIOR (in flow, not fixed) ───────────────── */
.site-ticker {
  position:relative; z-index:1200;
  height:var(--ticker-h);
  background:#0A3D2C; color:#fff;
  font-family:var(--font-label);
  font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  display:flex; align-items:center; justify-content:center;
  padding:0 12px;
  overflow:hidden;
  transition:height .28s ease, opacity .28s ease, padding .28s ease, max-height .28s ease;
}
body.ticker-hidden .site-ticker {
  height:0; max-height:0; opacity:0; padding:0; pointer-events:none; border:0;
}
.site-ticker-inner {
  display:flex; align-items:center; justify-content:center; gap:8px;
  white-space:nowrap; overflow:hidden; max-width:100%;
}
.site-ticker-lead { display:inline-flex; align-items:center; gap:6px; }
.site-ticker-icon { width:16px; height:16px; color:#FF8C00; flex-shrink:0; }
.site-ticker-dot {
  display:none; width:4px; height:4px; border-radius:50%;
  background:rgba(255,255,255,.4); flex-shrink:0;
}
.site-ticker-mid { color:#FF8C00; }
.site-ticker-pill {
  margin-left:4px; flex-shrink:0;
  background:#FF8C00; color:#0A3D2C;
  padding:2px 8px; border-radius:999px;
  font-size:10px; letter-spacing:.04em; font-weight:800;
  animation:tickerPulse 2s ease-in-out infinite;
}
@keyframes tickerPulse {
  0%, 100% { opacity:1; }
  50% { opacity:.72; }
}
@media (min-width:640px) {
  .site-ticker { font-size:13px; }
  .site-ticker-dot { display:inline-block; }
}
@media (max-width:480px) {
  .site-ticker-mid, .site-ticker-dot { display:none; }
}

/* ─── NAVEGACIÓN (solo #mainNav; no aplicar a breadcrumb <nav>) ─ */
#mainNav {
  position:sticky; top:0; left:0; right:0; z-index:1100;
  display:flex; align-items:center; justify-content:flex-start;
  padding:0 5%; height:var(--nav-h);
  background:rgba(255,254,250,.90);
  border-bottom:1px solid rgba(10,61,44,.07);
  box-shadow:0 2px 20px rgba(10,61,44,.06);
  transition:var(--transition);
  overflow:visible;
}
/* Blur en ::before: backdrop-filter en #mainNav convierte al menú fixed en un recuadro de ~49px */
#mainNav::before {
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
#mainNav.scrolled { box-shadow:0 4px 30px rgba(10,61,44,.10); }
body.nav-open .site-ticker { display:none; }
body.nav-open #mainNav { position:fixed; top:0; width:100%; }

.nav-logo {
  font-family:var(--font-head); font-weight:800; font-size:1.25rem;
  color:var(--azul); text-decoration:none;
  display:flex; align-items:center; gap:9px; flex-shrink:0;
}
.nav-logo.nav-lockup {
  gap:10px; overflow:visible; white-space:normal; max-width:none; text-overflow:unset;
}
.nav-lockup-text { display:flex; flex-direction:column; line-height:1; gap:3px; }
.nav-lockup-mark {
  font-family:var(--font-head); font-weight:800; font-size:18px;
  letter-spacing:-0.02em; color:var(--azul); text-transform:uppercase;
  display:flex; align-items:baseline; gap:4px;
}
.nav-lockup-accent { color:var(--lockup-accent,#FF8C00); }
.nav-lockup-kicker {
  font-family:var(--font-body); font-size:10px; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase; color:var(--azul); opacity:.6;
  white-space:nowrap;
}
.nav-logo img { height:36px; width:auto; }
.nav-lockup img { height:36px; width:36px; object-fit:contain; border-radius:8px; }

.nav-links { display:flex; align-items:center; gap:6px; margin-left:auto; }
.nav-links a {
  text-decoration:none; color:var(--gris-texto); font-size:.91rem; font-weight:500;
  padding:7px 13px; border-radius:8px; transition:var(--transition);
}
.nav-links a:hover, .nav-links a.active { color:var(--azul); background:var(--gris-claro); }

/* Dropdown — puente de hover + cierre retardado para poder elegir opción */
.nav-dropdown { position:relative; }
.nav-dropdown > a { display:flex; align-items:center; gap:5px; }
.nav-dropdown > a::after { content:'▾'; font-size:.7rem; }
.nav-dropdown::after {
  content:'';
  position:absolute; left:0; right:0; top:100%;
  height:18px; /* puente invisible entre trigger y menú */
}
.dropdown-menu {
  position:absolute; top:calc(100% + 4px); left:0;
  background:#fff; border:1px solid rgba(0,0,0,.05); border-radius:12px;
  padding:8px; min-width:220px;
  box-shadow:0 10px 40px rgba(10,61,44,.12);
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity .18s ease, visibility .18s ease, transform .18s ease;
  transition-delay:.45s; /* al salir: deja tiempo para bajar al menú */
  pointer-events:none; z-index:200;
}
.nav-dropdown:hover .dropdown-menu,
.nav-dropdown:focus-within .dropdown-menu,
.nav-dropdown.is-open .dropdown-menu {
  opacity:1; visibility:visible; transform:none; pointer-events:auto;
  transition-delay:0s;
}
.dropdown-menu a {
  display:flex; align-items:center; gap:10px;
  padding:10px 14px; border-radius:8px;
  font-size:.88rem; color:var(--texto) !important;
  background:transparent !important; transition:background .15s ease, color .15s ease;
}
.dropdown-menu a:hover { background:var(--gris-claro) !important; color:var(--azul-medio) !important; }
.dropdown-menu a .dmenu-icon { font-size:1.1rem; flex-shrink:0; }

.nav-cta {
  background:var(--wa) !important; color:#fff !important;
  padding:10px 18px !important; border-radius:999px !important;
  font-family:var(--font-btn) !important; font-weight:800 !important; font-size:.86rem !important; letter-spacing:.02em !important;
  transition:background .2s ease !important; box-shadow:none !important;
  margin-left:8px !important;
}
.nav-cta:hover { background:#1ebe5a !important; }
.nav-cta-mobile-only { display:none; }

.nav-actions {
  display:flex; align-items:center; gap:12px;
  flex-shrink:0; margin-left:10px;
}
#mainNav.site-header .nav-actions a.nav-phone,
#mainNav .nav-actions a.nav-phone,
.site-header a.nav-phone {
  display:none;
  align-items:center; gap:8px;
  font-family:var(--font-body);
  font-size:12px; font-weight:700; letter-spacing:0;
  background:#0A3D2C; color:#fff;
  padding:6px 12px; border-radius:9999px;
  text-decoration:none; white-space:nowrap; border:0;
}
#mainNav.site-header .nav-actions a.nav-phone:hover,
#mainNav .nav-actions a.nav-phone:hover { color:#fff; background:#07291e; }
#mainNav.site-header .nav-actions a.nav-phone svg,
#mainNav .nav-actions a.nav-phone svg { width:14px; height:14px; flex-shrink:0; }
#mainNav.site-header .nav-actions a.nav-wa,
#mainNav .nav-actions a.nav-wa,
.site-header a.nav-wa {
  display:inline-flex; align-items:center; gap:6px;
  background:#FF8C00; color:#fff;
  font-family:var(--font-btn);
  font-weight:900; font-size:13px;
  padding:8px 16px; border-radius:9999px;
  text-decoration:none; white-space:nowrap; border:0;
  box-shadow:0 4px 20px rgba(255,140,0,.4);
  transition:background .2s ease;
}
#mainNav.site-header .nav-actions a.nav-wa:hover,
#mainNav .nav-actions a.nav-wa:hover { background:#e67e00; color:#fff; }
#mainNav.site-header .nav-actions a.nav-wa img,
#mainNav .nav-actions a.nav-wa img,
#mainNav .nav-actions a.nav-wa .cotiza-wa-logo { width:22px; height:22px; object-fit:contain; flex-shrink:0; }
#mainNav.site-header .nav-actions a.nav-wa svg,
#mainNav .nav-actions a.nav-wa svg { width:14px; height:14px; flex-shrink:0; }

@media (min-width:961px) {
  #mainNav.site-header .nav-actions a.nav-phone,
  #mainNav .nav-actions a.nav-phone,
  .site-header a.nav-phone { display:inline-flex; }
}
@media (min-width:961px) and (max-width:1180px) {
  .nav-links { gap:2px; }
  .nav-links a { padding:7px 8px; font-size:.84rem; }
}

/* Mobile menu */
.nav-toggle {
  display:none; flex-direction:column; justify-content:center; align-items:center; gap:5px;
  cursor:pointer; padding:8px; min-width:44px; min-height:44px;
  background:transparent; border:0; border-radius:8px;
}
.nav-toggle span { display:block; width:22px; height:2px; background:var(--azul); border-radius:2px; transition:var(--transition); }

@media(max-width:960px) {
  .nav-toggle { display:flex; z-index:1002; }
  #mainNav.site-header .nav-actions a.nav-phone,
  #mainNav .nav-actions a.nav-phone,
  .site-header a.nav-phone { display:none; }
  .nav-cta-mobile-only { display:block; }
  .nav-actions { margin-left:auto; }
  .nav-links {
    position:fixed; top:var(--nav-h); left:0; right:0; bottom:auto;
    height:calc(100dvh - var(--nav-h)); max-height:calc(100vh - var(--nav-h));
    background:#fff; flex-direction:column; align-items:stretch;
    padding:16px 20px calc(24px + env(safe-area-inset-bottom)); gap:4px; overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    transform:translateX(100%); transition:transform .25s ease;
    border-top:1px solid var(--gris-claro);
    z-index:1001; width:100%; max-width:100vw;
    box-sizing:border-box; margin-left:0;
  }
  .nav-links.open { transform:none; }
  .nav-links > li { width:100%; }
  .nav-links a { width:100%; padding:12px 16px; font-size:1rem; box-sizing:border-box; min-height:44px; }
  .dropdown-menu {
    display:none; position:static; box-shadow:none; border:none;
    opacity:1; visibility:visible; transform:none; pointer-events:auto;
    background:var(--gris-claro); margin-top:4px; width:100%; min-width:0;
    transition:none; transition-delay:0s;
  }
  .nav-dropdown::after { display:none; }
  .nav-dropdown.open .dropdown-menu { display:block; }
  .nav-cta { width:100%; justify-content:center; margin-left:0 !important; white-space:normal; }
  #mainNav.scrolled .nav-links,
  body.nav-open .nav-links {
    top:var(--nav-h); height:calc(100dvh - var(--nav-h)); max-height:calc(100vh - var(--nav-h));
  }
}


.btn { display:inline-flex; align-items:center; gap:9px; font-family:var(--font-head); font-weight:700; border:none; border-radius:9999px; text-decoration:none; cursor:pointer; transition:var(--transition); }
.text-accent { color: var(--acento); }
.section { padding:52px 5%; }
.badge { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:999px; font-size:.78rem; font-weight:700; }
.badge-sm { font-size:.72rem; padding:3px 8px; background:rgba(10,61,44,.08); color:var(--azul-medio); }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:32px; }
.footer-col h4 { color:#fff; font-family:var(--font-head); margin-bottom:12px; }
.footer-col ul { list-style:none; padding:0; margin:0; }
.footer-col li { margin-bottom:8px; }
.footer-col a { color:rgba(255,255,255,.65); text-decoration:none; }
.footer-col a:hover { color:var(--acento); }
@media(max-width:900px){ .footer-grid{grid-template-columns:1fr 1fr;} }
@media(max-width:600px){ .footer-grid{grid-template-columns:1fr;} }

/* ─── PAGE HERO (internas) ───────────────────────────────── */
.page-hero {
  background:linear-gradient(165deg,#071f17 0%,#0A3D2C 62%,#14664A 100%);
  padding:48px 5% 44px; position:relative; overflow:hidden;
}
.page-hero::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse 700px 500px at 80% 50%,rgba(255,255,255,.05) 0%,transparent 70%);
}
.page-hero::after { content:none; }
.page-hero-inner { max-width:var(--max); margin:0 auto; position:relative; z-index:1; }
.page-hero .section-tag { color:rgba(255,255,255,.8); background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); margin-bottom:10px; }
.page-hero .section-tag::before { background:#fff; }
.page-hero h1 {
  font-family:var(--font-head); font-size:clamp(1.75rem,3.6vw,2.35rem); font-weight:700;
  letter-spacing:-0.02em; line-height:1.18; text-transform:none; color:#fff;
  margin:0 0 10px; text-align:left; text-wrap:balance;
}
.page-hero p {
  font-size:1rem; color:rgba(255,255,255,.78); max-width:640px;
  line-height:1.55; margin:0; text-align:left; text-wrap:pretty;
}
.page-hero .breadcrumb { display:flex; align-items:center; gap:8px; font-size:.82rem; color:rgba(255,255,255,.55); margin-bottom:12px; }
.page-hero .breadcrumb a { color:rgba(255,255,255,.6); transition:color .2s; }
.page-hero .breadcrumb a:hover { color:var(--acento); }
.page-hero .breadcrumb span { color:rgba(255,255,255,.3); }

/* Héroes verdes compactos (calculadoras / geo / metodología) */
.calc-hero,
.geo-hero,
.method-hero {
  padding:44px 5% 40px !important;
  min-height:0 !important;
  align-items:flex-start !important;
}
.calc-hero h1,
.geo-hero h1,
.method-hero h1 {
  text-align:left !important;
  margin-bottom:10px !important;
  line-height:1.15 !important;
}
.calc-hero p,
.geo-hero p,
.method-hero p {
  text-align:left !important;
  line-height:1.55 !important;
  margin-top:0 !important;
}

/* ─── FOOTER ─────────────────────────────────────────────── */
footer { background:#071f17; color:rgba(255,255,255,.55); padding:48px 5% 28px; }
.footer-inner {
  max-width:var(--max); margin:0 auto;
  display:grid; grid-template-columns:2.5fr 1fr 1fr 1fr; gap:48px;
  padding-bottom:40px; border-bottom:1px solid rgba(255,255,255,.07); margin-bottom:28px;
}
.footer-brand .footer-logo {
  font-family:var(--font-head); color:#fff;
  display:flex; align-items:center; gap:10px; margin-bottom:14px;
  letter-spacing:-0.02em; flex-wrap:nowrap; line-height:1;
}
.footer-brand .footer-logo .footer-lockup-text {
  display:flex; flex-direction:column; gap:3px; line-height:1;
}
.footer-brand .footer-logo .footer-lockup-mark {
  font-family:var(--font-head); font-weight:800; font-size:18px; letter-spacing:-0.02em;
  display:flex; align-items:baseline; gap:4px; text-transform:uppercase;
}
.footer-brand .footer-logo .footer-lockup-accent { color:var(--lockup-accent,#FF8C00); }
.footer-brand .footer-logo .footer-lockup-kicker {
  font-family:var(--font-label); font-size:10px; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:#fff; opacity:.6; white-space:nowrap;
}
.footer-brand .footer-logo img { height:36px; width:36px; object-fit:contain; border-radius:8px; background:#fff; padding:2px; }
.footer-brand p { font-size:.87rem; line-height:1.75; max-width:300px; }
.footer-brand .footer-contact { margin-top:22px; }
.footer-brand .footer-contact a { display:flex; align-items:center; gap:9px; color:rgba(255,255,255,.6); font-size:.87rem; margin-bottom:9px; transition:color .2s; }
.footer-brand .footer-contact a:hover { color:var(--acento); }
.footer-cert { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }
.footer-cert-badge { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); border-radius:6px; padding:5px 12px; font-size:.76rem; font-weight:600; color:rgba(255,255,255,.6); }
footer h4 { font-family:var(--font-head); color:#fff; font-size:.9rem; margin-bottom:18px; font-weight:700; }
.footer-links li { margin-bottom:11px; }
.footer-links a { color:rgba(255,255,255,.5); font-size:.86rem; transition:color .2s; display:flex; align-items:center; gap:7px; }
.footer-links a::before { content:'→'; font-size:.75rem; color:var(--acento); opacity:.6; }
.footer-links a:hover { color:var(--acento); }
.footer-links a:hover::before { opacity:1; }
.footer-bottom {
  max-width:var(--max); margin:0 auto;
  display:flex; justify-content:space-between; align-items:center;
  font-size:.81rem; flex-wrap:wrap; gap:12px;
}
.social-links { display:flex; gap:10px; }
.social-links a {
  width:36px; height:36px; background:rgba(255,255,255,.07); border-radius:9px;
  display:flex; align-items:center; justify-content:center;
  color:rgba(255,255,255,.6); font-size:.8rem; text-decoration:none;
  transition:var(--transition); font-family:var(--font-head); font-weight:700;
}
.social-links a:hover { background:var(--acento); color:#fff; transform:translateY(-2px); }

/* ─── WA FLOAT ──────────────────────────────────────────── */
.wa-float {
  position:fixed; bottom:28px; right:28px; z-index:500;
  width:60px; height:60px; background:#25D366; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 24px rgba(37,211,102,.5); text-decoration:none;
  animation:pulsewa 2.5s infinite; transition:transform .2s;
}
.wa-float:hover { transform:scale(1.1); }
.wa-float svg { width:30px; height:30px; fill:#fff; }
.wa-float .wa-tooltip {
  position:absolute; right:70px; background:#333; color:#fff;
  font-size:.78rem; font-weight:600; padding:6px 12px; border-radius:6px;
  white-space:nowrap; opacity:0; transition:opacity .2s;
  pointer-events:none;
}
.wa-float:hover .wa-tooltip { opacity:1; }

/* ─── REVEAL ANIMATION ──────────────────────────────────── */
.reveal { opacity:0; transform:translateY(24px); transition:opacity .65s ease, transform .65s ease; }
.reveal.visible { opacity:1; transform:none; }
.reveal-left { opacity:0; transform:translateX(-24px); transition:opacity .65s ease, transform .65s ease; }
.reveal-left.visible { opacity:1; transform:none; }
.reveal-right { opacity:0; transform:translateX(24px); transition:opacity .65s ease, transform .65s ease; }
.reveal-right.visible { opacity:1; transform:none; }

/* ─── ALERT/NOTICE ──────────────────────────────────────── */
.alert { padding:14px 20px; border-radius:10px; font-size:.9rem; margin-bottom:16px; display:flex; align-items:flex-start; gap:10px; }
.alert-success { background:rgba(0,201,167,.1); border:1.5px solid var(--acento); color:var(--azul); }
.alert-error { background:rgba(229,62,62,.08); border:1.5px solid var(--rojo); color:#8B1A1A; }
.alert-info { background:rgba(10,61,44,.07); border:1.5px solid var(--azul-claro); color:var(--azul); }

/* ─── CARDS ─────────────────────────────────────────────── */
.card {
  background:#fff; border:1px solid rgba(0,0,0,.05);
  border-radius:var(--radio); padding:28px;
  box-shadow:0 2px 12px rgba(10,61,44,.05);
  transition:var(--transition);
}
.card:hover { box-shadow:var(--sombra); transform:translateY(-4px); }

/* ─── BADGE ─────────────────────────────────────────────── */
.badge-green { background:#D4EDDA; color:#155724; font-size:.78rem; font-weight:700; padding:3px 10px; border-radius:20px; }
.badge-blue  { background:#E8F5EE; color:#0A3D2C; font-size:.78rem; font-weight:700; padding:3px 10px; border-radius:20px; }
.badge-teal  { background:var(--acento-light); color:#9a4d00; font-size:.78rem; font-weight:700; padding:3px 10px; border-radius:20px; }

/* ─── FORM ELEMENTS ─────────────────────────────────────── */
.form-group { margin-bottom:20px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
label { display:block; font-size:.84rem; font-weight:600; color:var(--azul); margin-bottom:7px; }
.form-req { color:var(--rojo); }
input[type="text"], input[type="email"], input[type="tel"], input[type="number"],
select, textarea {
  width:100%; padding:12px 16px;
  border:1.5px solid rgba(0,0,0,.1); border-radius:9px;
  font-family:var(--font-body); font-size:.93rem; color:var(--texto);
  background:#FAFAF8; transition:var(--transition); outline:none; resize:none;
}
input:focus, select:focus, textarea:focus {
  border-color:var(--azul-medio); box-shadow:0 0 0 3px rgba(10,61,44,.12);
}
input::placeholder, textarea::placeholder { color:#A0AABF; }
select { appearance:none; background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%235A6480' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; cursor:pointer; }

/* ─── ANIMATIONS ─────────────────────────────────────────── */
@keyframes fadeUp { from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:translateY(0)} }
@keyframes pulsewa { 0%,100%{box-shadow:0 4px 24px rgba(37,211,102,.5)} 50%{box-shadow:0 4px 36px rgba(37,211,102,.75)} }
@keyframes spin { to{transform:rotate(360deg)} }
@keyframes shimmer { 0%{background-position:-200% 0} 100%{background-position:200% 0} }

/* ─── RESPONSIVE ─────────────────────────────────────────── */
@media(max-width:960px) {
  .footer-inner { grid-template-columns:1fr 1fr; }
  .form-row { grid-template-columns:1fr; }
}
@media(max-width:600px) {
  .footer-inner { grid-template-columns:1fr; gap:32px; }
  section { padding:40px 5%; }
  .wa-float { bottom:20px; right:20px; }
}

/* ══════════════════════════════════
   STATS / COUNTERS
   ══════════════════════════════════ */
.stats-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,160px),1fr)); gap:2rem; text-align:center; }
.stat-item { }
.stat-number { font-family:var(--font-head); font-size:3rem; font-weight:800; color:var(--navy); display:inline; }
.stat-suffix { font-family:var(--font-head); font-size:2.5rem; font-weight:800; color:var(--accent); display:inline; }
.stat-label { display:block; color:var(--muted); font-size:.9rem; margin-top:.25rem; }

/* ══════════════════════════════════
   BLOG STYLES REFERENCED IN PAGES.CSS breadcrumb color fix
   ══════════════════════════════════ */
.breadcrumb ol { display:flex; gap:.5rem; list-style:none; padding:0; margin:0 0 1.5rem; font-size:.875rem; }
.breadcrumb li::after { content:" /"; color:rgba(255,255,255,.4); margin-left:.5rem; }
.breadcrumb li:last-child::after { display:none; }
.breadcrumb a { color:rgba(255,255,255,.65); }
.breadcrumb a:hover { color:var(--accent); }

/* Light breadcrumb for non-hero pages */
.breadcrumb.bc-light ol { }
.breadcrumb.bc-light a { color:var(--muted); }
.breadcrumb.bc-light li::after { color:#cbd5e1; }

/* ═══════════════════════════════════════════════════════════
   360 REMOTO — Responsive / Mobile polish (todas las vistas)
   Cargar DESPUÉS de global.css y pages.css
═══════════════════════════════════════════════════════════ */

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
html, body {
  max-width: 100%;
  overflow-x: clip;
}
body {
  padding-bottom: env(safe-area-inset-bottom, 0);
}

img, video, canvas, svg {
  max-width: 100%;
  height: auto;
}

iframe, embed, object {
  max-width: 100%;
}

/* Tablas: nunca rompen el viewport */
table {
  max-width: 100%;
}
.table-scroll,
.article-body,
.article-content,
.blog-content,
.content-block,
.calc-main,
.payroll-page {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.article-body table,
.article-content table,
.blog-content table,
.content-block table,
.calc-main table {
  display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Contenedores fluidos */
.container {
  width: 100%;
  max-width: var(--max, 1160px);
  padding-left: max(16px, env(safe-area-inset-left));
  padding-right: max(16px, env(safe-area-inset-right));
  box-sizing: border-box;
}

/* Botones: no forzar ancho rígido en móvil */
.btn-primary,
.btn-secondary,
.btn-outline,
.btn-ghost,
.btn360,
.nav-cta {
  white-space: normal;
  text-align: center;
  max-width: 100%;
}

/* CTA lead embudo */
.cta-lead-360 {
  box-sizing: border-box;
  max-width: 100%;
}
.cta-lead-360 > div {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
}
.cta-lead-360 a {
  box-sizing: border-box;
}

/* ─── TABLET ─────────────────────────────────────────────── */
@media (max-width: 960px) {
  section,
  .section {
    padding: 44px 4%;
  }

  .page-hero {
    padding: 40px 4% 36px;
  }

  .nav-logo {
    font-size: 1.05rem;
    max-width: calc(100vw - 170px);
  }
  #mainNav a.nav-lockup {
    overflow: visible;
    text-overflow: unset;
    white-space: normal;
    max-width: none;
  }

  /* Grids genéricos → una o dos columnas cómodas */
  .faq-grid,
  .calc-hub-grid,
  .proof-grid,
  .blog-grid,
  .includes-grid,
  .pricing-grid,
  .info-grid,
  .cert-grid,
  .problemas-grid,
  .benefits-grid,
  .services-grid,
  .steps-grid,
  .calc-cards-grid {
    grid-template-columns: 1fr !important;
  }

  .contact-grid,
  .about-grid,
  .diferenciadores-grid,
  .service-detail-card,
  .guarantee-box,
  .calc-hub-card {
    grid-template-columns: 1fr !important;
    flex-direction: column;
  }

  .calc-features {
    grid-template-columns: 1fr !important;
  }

  .process-steps {
    flex-direction: column;
    align-items: stretch;
  }
  .process-step {
    min-width: 0;
  }
  .process-arrow {
    display: none !important;
  }

  /* Calculadoras */
  .calc-hero-inner,
  .calc-layout,
  .section-grid,
  .cta-grid,
  .link-cards,
  .faq-list,
  .search-grid,
  .sua-steps,
  .sua-actions.sua-download-grid {
    grid-template-columns: 1fr !important;
  }

  .calc-hero {
    padding: 40px 4% 48px !important;
  }

  /* Blog article layouts */
  .article-wrap,
  .blog-wrap,
  .grid {
    grid-template-columns: 1fr !important;
  }

  .cta-contact-grid,
  .cta-grid,
  .trust-grid,
  .links-grid {
    grid-template-columns: 1fr !important;
  }

  /* Footer */
  .footer-inner,
  .footer-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 28px !important;
  }
}

/* ─── MÓVIL ──────────────────────────────────────────────── */
@media (max-width: 680px) {
  html {
    font-size: 15px;
  }

  section,
  .section {
    padding: 36px 4%;
  }

  .container {
    padding-left: 16px;
    padding-right: 16px;
  }

  .page-hero {
    padding: 32px 4% 30px;
  }
  .page-hero h1 {
    font-size: 40px;
    line-height: 1.2;
  }
  .page-hero p {
    font-size: 1rem;
  }

  .section-title {
    font-size: clamp(1.45rem, 6.5vw, 1.9rem);
  }
  .section-sub {
    font-size: .98rem;
    margin-bottom: 20px;
  }

  .footer-inner,
  .footer-grid {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }
  .footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
  }

  .card,
  .contact-form-wrap,
  .calc-hub-card,
  .info-card,
  .pricing-card,
  .service-detail-card {
    padding: 1.15rem !important;
    border-radius: 14px !important;
  }

  .calc-hub-card {
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
  }

  .btn-primary,
  .btn-secondary,
  .btn-outline,
  .btn-ghost,
  .btn360,
  .hero-ctas .btn-primary,
  .hero-ctas .btn-ghost,
  .cta-actions a,
  .cta-actions .btn-primary,
  .cta-actions .btn-outline,
  .cta-actions .btn-outline-white {
    width: 100%;
    justify-content: center;
  }

  .hero-ctas,
  .cta-actions {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  .form-row {
    grid-template-columns: 1fr !important;
  }

  /* Stats / trust: 2 cols cómodas, no 4 apretadas */
  .stats-bar,
  .stats-grid,
  .hero-trust,
  .panel-metrics,
  .trust-strip {
    grid-template-columns: 1fr 1fr !important;
  }

  .stat-number,
  .stat-suffix {
    font-size: clamp(1.6rem, 8vw, 2.2rem) !important;
  }

  /* Evita “cuadrados” altos en cards de blog/home */
  .blog-card-img {
    height: 150px !important;
  }

  .dif-row {
    grid-template-columns: 1fr !important;
    gap: 8px;
  }

  /* Espacio inferior para WA flotante */
  body {
    padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px));
  }

  .wa-float {
    bottom: max(16px, env(safe-area-inset-bottom)) !important;
    right: max(16px, env(safe-area-inset-right)) !important;
    width: 56px;
    height: 56px;
  }
  .wa-float .wa-tooltip {
    display: none;
  }

  .cta-lead-360 {
    margin: 1.25rem 0 !important;
    padding: 1.1rem 1rem !important;
    border-radius: 14px !important;
  }
  .cta-lead-360 h3 {
    font-size: 1.05rem !important;
  }
  .cta-lead-360 a {
    flex: 1 1 100%;
    width: 100%;
  }

  /* Banner superior home */
  .top-promo-banner {
    gap: 10px !important;
    padding: 10px 4% !important;
    font-size: .8rem !important;
  }
  .top-promo-banner .top-promo-sep {
    display: none;
  }
  .top-promo-banner a {
    width: 100%;
    text-align: center;
    box-sizing: border-box;
  }
}

/* ─── MÓVIL PEQUEÑO ──────────────────────────────────────── */
@media (max-width: 400px) {
  .stats-bar,
  .hero-trust,
  .trust-strip,
  .panel-metrics {
    grid-template-columns: 1fr !important;
  }

  .nav-logo {
    font-size: .95rem;
  }
}

/* Prefers reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* ─── TIPO: Inter títulos + cuerpo (400/600/700/800) ─ */
html {
  --azul: #0A3D2C !important;
  --azul2: #14664A !important;
  --azul3: #1F8A64 !important;
  --naranja: #FF8C00 !important;
  --texto: #0A3D2C !important;
  --bg: #FFFEFA !important;
  --blue: #0A3D2C !important;
  --navy: #0A3D2C !important;
  --n360-ink: #0A3D2C !important;
  --n360-soft: #FFFEFA !important;
  --n360-line: rgba(0,0,0,.05) !important;
  --n360-text: #5A6B63 !important;
}
html, body, button, input, select, textarea {
  font-family: 'Inter', sans-serif !important;
  font-weight: 400;
}
html body {
  font-size: 17px;
  line-height: 1.75;
}
html body p, html body li, html body td, html body th,
html body a:not(.nav-phone):not(.nav-wa):not(.nav-cta):not([class*="btn"]),
html body span:not(.nav-lockup-mark):not(.nav-lockup-accent):not(.nav-lockup-kicker),
html body small,
html body summary, html body blockquote, html body figcaption {
  font-family: 'Inter', sans-serif !important;
  font-weight: 400;
}
html body label, html body .section-tag, html body .nav-links a:not(.nav-cta),
html body .cat-badge, html body .article-tag, html body .site-ticker,
html body .site-ticker * {
  font-family: 'Inter', sans-serif !important;
  font-weight: 600;
}
html body h1, html body h2,
html body .section-title, html body .page-hero h1, html body .hero h1,
html body .calc-hero h1, html body .article-content h2, html body .article-content h3,
html body .content h2, html body .content h3,
html body .nav-lockup-mark, html body .footer-lockup-mark {
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  text-transform: none !important;
}
html body h1, html body .page-hero h1,
html body .hero h1, html body .calc-hero h1 {
  font-size: 40px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-transform: none !important;
}
html body .about-pro h1,
html body .about-pro h2 {
  font-family: Anton, Inter, sans-serif !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: -0.02em !important;
}
html body .section-title {
  line-height: 1.2 !important;
  text-transform: none !important;
}
html body .article-content h2, html body .article-content h3,
html body .content h2, html body .content h3 {
  text-transform: none !important;
  line-height: 1.3 !important;
}
html body .btn-primary, html body .btn-secondary, html body .btn-outline,
html body .btn-ghost, html body .nav-cta,
html body .calc-btn, html body a.btn {
  font-family: 'Inter', sans-serif !important;
  font-weight: 800 !important;
}
#mainNav,
#mainNav a:not(.nav-phone):not(.nav-wa),
.site-ticker, .footer-lockup-kicker, .nav-lockup-kicker {
  font-family: 'Inter', sans-serif !important;
}
#mainNav .nav-lockup-mark, #mainNav .nav-lockup-accent,
.footer-lockup-mark {
  font-family: 'Inter', sans-serif !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}
.nav-lockup-kicker, .footer-lockup-kicker, .site-ticker, .site-ticker * {
  text-transform: uppercase !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
}

/* ─── BRAND LOCK: leftover page CSS cannot revert to navy / old type ─ */
html body {
  background: #FFFEFA !important;
  color: #0A3D2C;
  padding-top: 0;
}
html body .payroll-page,
html body .about-pro {
  background: #FFFEFA !important;
  font-family: Inter, sans-serif !important;
}
html body .hero-payroll {
  background:
    radial-gradient(circle at 88% 5%, rgba(255,140,0,.16), transparent 28%),
    linear-gradient(180deg, #FFFEFA 0%, #F3F6F2 55%, #FFFEFA 100%) !important;
}
html body .hero,
html body .article .hero,
.page-hero,
.cta-section,
.bg-navy-gradient,
.article-hero,
.article-cta,
.faq-cta,
html body .article .cta-box {
  background: linear-gradient(165deg, #071f17 0%, #0A3D2C 62%, #14664A 100%) !important;
  color: #fff;
}
html body .btn360,
html body .btn360-primary,
html body .ap-btn,
html body .ap-btn-primary,
html body .calc-primary {
  font-family: 'Inter', sans-serif !important;
  font-weight: 800 !important;
  border-radius: 9999px;
}
html body .btn-primary,
html body .btn360-primary,
html body .ap-btn-primary,
html body .cta-lead-360 a[href*="/cotiza/"],
html body .cta-lead-360 a[href*="/maquila-de-nomina/"],
html body .cta-lead-360 a[href*="/auditoria-nomina/"] {
  background: #FF8C00 !important;
  color: #fff !important;
  border-radius: 9999px !important;
}
html body .btn-primary:hover,
html body .btn360-primary:hover,
html body .ap-btn-primary:hover {
  background: #e67e00 !important;
}
html body a.btn-primary[href*="wa.me"],
html body a.btn-whatsapp,
html body .nav-cta,
html body .cta-lead-360 a[href*="wa.me"] {
  background: #25D366 !important;
  color: #fff !important;
  border-radius: 9999px !important;
}
html body a.btn-primary[href*="wa.me"]:hover,
html body a.btn-whatsapp:hover,
html body .nav-cta:hover,
html body .cta-lead-360 a[href*="wa.me"]:hover {
  background: #1ebe5a !important;
  color: #fff !important;
}
html body .calc-primary {
  background: #FF8C00 !important;
  color: #fff !important;
}
html body .calc-primary:hover {
  background: #e67e00 !important;
  color: #fff !important;
}
html body .calc-secondary {
  background: #fff !important;
  color: #0A3D2C !important;
  border: 1px solid rgba(255,255,255,.35) !important;
}
html body .calc-secondary:hover {
  background: #F3F6F2 !important;
  color: #0A3D2C !important;
}

html body .cta-lead-360 a {
  border-radius: 9999px !important;
  font-family: Inter, sans-serif !important;
}
html body a.btn-main {
  background: #FF8C00 !important;
  color: #fff !important;
  border-radius: 9999px !important;
  font-weight: 800 !important;
  font-family: Inter, sans-serif !important;
}
html body a.btn-alt {
  background: #fff !important;
  color: #0A3D2C !important;
  border-radius: 9999px !important;
  font-weight: 800 !important;
}

/* Testimonials / cotiza-card quote look */
html body .testimonial,
html body blockquote.cotiza-card,
html body .cotiza-card {
  background: var(--quote-bg, #F1F5F9) !important;
  border: none !important;
  border-left: 4px solid var(--quote-border, #0B2447) !important;
  border-radius: 0 12px 12px 0;
  box-shadow: none;
}

/* Reading column: blog articles, términos, privacidad, FAQ — not marketing grids */
html body .privacy-content,
html body section.section .faq-wrap,
html body .article-content {
  max-width: 720px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
html body .privacy-content,
html body section.section .faq-wrap {
  padding-top: 48px;
  padding-bottom: 48px;
}
html body .article-content {
  padding-top: 48px;
  padding-bottom: 48px;
}

/* Header pills — last in file so they beat pages.css / responsive.css copies */
#mainNav.site-header .nav-actions a.nav-phone,
#mainNav .nav-actions a.nav-phone,
.site-header a.nav-phone {
  display: none !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: Inter, sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  line-height: 1.2 !important;
  background: #0A3D2C !important;
  color: #fff !important;
  padding: 6px 12px !important;
  border-radius: 9999px !important;
  text-decoration: none !important;
  border: 0 !important;
  box-shadow: none !important;
  white-space: nowrap !important;
}
#mainNav.site-header .nav-actions a.nav-phone svg,
#mainNav .nav-actions a.nav-phone svg {
  width: 14px !important; height: 14px !important; max-width: 14px !important;
  flex-shrink: 0 !important; color: #fff !important; stroke: #fff !important;
}
#mainNav.site-header .nav-actions a.nav-wa,
#mainNav .nav-actions a.nav-wa,
.site-header a.nav-wa {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-family: Inter, sans-serif !important;
  font-weight: 900 !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  background: #FF8C00 !important;
  color: #fff !important;
  padding: 8px 16px !important;
  border-radius: 9999px !important;
  text-decoration: none !important;
  border: 0 !important;
  box-shadow: 0 4px 20px rgba(255,140,0,.4) !important;
  white-space: nowrap !important;
}
#mainNav.site-header .nav-actions a.nav-wa:hover,
#mainNav .nav-actions a.nav-wa:hover,
.site-header a.nav-wa:hover { background: #e67e00 !important; color: #fff !important; }
#mainNav.site-header .nav-actions a.nav-wa img,
#mainNav .nav-actions a.nav-wa img,
#mainNav .nav-actions a.nav-wa .cotiza-wa-logo {
  width: 22px !important; height: 22px !important; max-width: 22px !important;
  object-fit: contain !important; flex-shrink: 0 !important; display: block !important;
}
#mainNav.site-header .nav-actions a.nav-wa svg,
#mainNav .nav-actions a.nav-wa svg {
  width: 14px !important; height: 14px !important; max-width: 14px !important;
  flex-shrink: 0 !important; color: #fff !important; stroke: #fff !important;
}
@media (min-width: 961px) {
  #mainNav.site-header .nav-actions a.nav-phone,
  #mainNav .nav-actions a.nav-phone,
  .site-header a.nav-phone { display: inline-flex !important; }
}
@media (max-width: 960px) {
  #mainNav.site-header .nav-actions a.nav-phone,
  #mainNav .nav-actions a.nav-phone,
  .site-header a.nav-phone { display: none !important; }
}

/* ─── CTA contrast lock: beats a { color: inherit } and page a{} ─ */
html body a.btn-primary,
html body a.btn-accent,
html body a.btn-main,
html body a.btn360-primary,
html body a.ap-btn-primary,
html body a.n360-btn-primary,
html body a.calc-primary,
html body a.faq-cta-primary,
html body .sticky-lead-360__cotiza,
html body .n360-approx__btn {
  color: #fff !important;
}
html body a.btn-whatsapp,
html body a.btn-wa,
html body a.n360-btn-wa,
html body a.faq-cta-wa,
html body a.sticky-lead-360__wa,
html body .n360-approx__wa,
html body a[class*="btn"][href*="wa.me"],
html body a.calc-btn[href*="wa.me"],
html body .cta-lead-360 a[href*="wa.me"] {
  background: #25D366 !important;
  color: #fff !important;
}
html body a.btn-whatsapp:hover,
html body a.btn-wa:hover,
html body a.n360-btn-wa:hover,
html body a.faq-cta-wa:hover,
html body a.sticky-lead-360__wa:hover,
html body .n360-approx__wa:hover,
html body a[class*="btn"][href*="wa.me"]:hover,
html body a.calc-btn[href*="wa.me"]:hover,
html body .cta-lead-360 a[href*="wa.me"]:hover {
  background: #1ebe5a !important;
  color: #fff !important;
}
html body a.btn-primary:hover,
html body a.btn360-primary:hover,
html body a.ap-btn-primary:hover,
html body a.n360-btn-primary:hover,
html body a.faq-cta-primary:hover,
html body .sticky-lead-360__cotiza:hover {
  color: #fff !important;
}
html body .hero a.btn-ghost:not([href*="wa.me"]),
html body .page-hero a.btn-ghost:not([href*="wa.me"]),
html body .cta-final a.btn-ghost:not([href*="wa.me"]),
html body .cta-section a.btn-ghost:not([href*="wa.me"]),
html body .cta-buttons a.btn-ghost:not([href*="wa.me"]),
html body .audit-hero a.btn-ghost:not([href*="wa.me"]),
html body .geo-hero a.btn-ghost:not([href*="wa.me"]),
html body .geo-cta a.btn-ghost:not([href*="wa.me"]),
html body .calc-hero a.btn-ghost:not([href*="wa.me"]),
html body .n360-chat-sec a.btn-ghost:not([href*="wa.me"]),
html body .cta-lead-360 a:not([href*="wa.me"]):not([href*="/cotiza/"]):not([href*="/maquila-de-nomina/"]):not([href*="/auditoria-nomina/"]),
html body a.btn-outline-white {
  color: #fff !important;
  border-color: rgba(255,255,255,.45) !important;
  background: transparent !important;
}
html body .hero a.btn-ghost:not([href*="wa.me"]):hover,
html body .page-hero a.btn-ghost:not([href*="wa.me"]):hover,
html body .cta-final a.btn-ghost:not([href*="wa.me"]):hover,
html body .cta-section a.btn-ghost:not([href*="wa.me"]):hover,
html body .cta-buttons a.btn-ghost:not([href*="wa.me"]):hover,
html body .audit-hero a.btn-ghost:not([href*="wa.me"]):hover,
html body .geo-hero a.btn-ghost:not([href*="wa.me"]):hover,
html body .geo-cta a.btn-ghost:not([href*="wa.me"]):hover,
html body .n360-chat-sec a.btn-ghost:not([href*="wa.me"]):hover,
html body a.btn-outline-white:hover {
  color: #fff !important;
  background: rgba(255,255,255,.12) !important;
}
html body a.btn360-secondary:not([href*="wa.me"]),
html body a.n360-btn-ghost:not([href*="wa.me"]),
html body a.btn-alt {
  color: #0A3D2C !important;
}
html body a.calc-btn:not(.secondary) {
  color: #fff !important;
}
html body a.calc-btn.secondary {
  color: #0A3D2C !important;
}