/* ============================================
   ATSEM CONTABILIDAD - Sistema de Diseño Premium
   ============================================ */

/* RESET */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

/* VARIABLES */
:root{
  --azul-oscuro:#0D2B3E;
  --azul-medio:#1E4D6B;
  --azul-claro:#2A7B98;
  --dorado:#D4A24C;
  --dorado-claro:#E0B868;
  --dorado-oscuro:#B8862E;
  --gris-claro:#F5F7FA;
  --gris-borde:#E2E8F0;
  --gris-texto:#5A6C7D;
  --gris-oscuro:#2D3748;
  --blanco:#FFFFFF;
  --negro:#0A1A24;

  --font-titulo:'Playfair Display',Georgia,'Times New Roman',serif;
  --font-cuerpo:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;

  --max-w:1280px;
  --header-h:90px;
  --radio:12px;
  --radio-sm:8px;
  --radio-lg:20px;

  --sombra-xs:0 1px 3px rgba(13,43,62,0.06);
  --sombra-sm:0 2px 8px rgba(13,43,62,0.08);
  --sombra-md:0 8px 24px rgba(13,43,62,0.12);
  --sombra-lg:0 16px 48px rgba(13,43,62,0.18);
  --sombra-dorado:0 8px 24px rgba(212,162,76,0.3);

  --trans:0.4s cubic-bezier(0.4,0,0.2,1);
  --trans-lenta:0.7s cubic-bezier(0.4,0,0.2,1);
  --trans-rebote:0.5s cubic-bezier(0.16,1,0.3,1);
}

/* IMPORTAR FUENTES */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,700&family=Inter:wght@300;400;500;600;700;800&family=Bebas+Neue&display=swap');

/* BASE */
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--font-cuerpo);color:var(--gris-texto);background:var(--blanco);line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased}

h1,h2,h3,h4,h5,h6{font-family:var(--font-titulo);color:var(--azul-oscuro);line-height:1.25;font-weight:700;letter-spacing:-0.5px}
h1{font-size:3.2rem}
h2{font-size:2.4rem}
h3{font-size:1.5rem}
h4{font-size:1.2rem}
p{margin-bottom:1rem}
a{text-decoration:none;color:inherit;transition:var(--trans)}
ul{list-style:none}
img{max-width:100%;height:auto;display:block}
section{position:relative}

/* SCROLLBAR */
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:var(--gris-claro)}
::-webkit-scrollbar-thumb{background:var(--azul-medio);border-radius:5px}
::-webkit-scrollbar-thumb:hover{background:var(--azul-oscuro)}

/* SELECCIÓN */
::selection{background:var(--dorado);color:var(--azul-oscuro)}

/* UTILIDADES */
.container{max-width:var(--max-w);margin:0 auto;padding:0 2rem}
.seccion{padding:6rem 0}
.seccion-gris{background:var(--gris-claro)}
.seccion-oscura{background:var(--azul-oscuro);color:var(--blanco)}

.eyebrow{display:inline-block;font-family:var(--font-cuerpo);font-size:0.8rem;font-weight:600;text-transform:uppercase;letter-spacing:3px;color:var(--dorado);margin-bottom:1rem}
.linea-dorado{width:50px;height:3px;background:var(--dorado);border-radius:2px}
.titulo-centro{text-align:center;margin-bottom:4rem}
.titulo-centro h2{margin-bottom:1rem}
.titulo-centro p{max-width:600px;margin:1rem auto 0;color:var(--gris-texto);font-size:1.05rem}
.titulo-centro .linea-dorado{margin:1.2rem auto}

/* BOTONES */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;padding:0.95rem 2.2rem;border-radius:var(--radio);font-family:var(--font-cuerpo);font-weight:600;font-size:0.95rem;letter-spacing:0.3px;cursor:pointer;border:none;transition:all var(--trans);position:relative;overflow:hidden}

.btn-primario{background:var(--dorado);color:var(--azul-oscuro);box-shadow:var(--sombra-dorado)}
.btn-primario:hover{background:var(--dorado-oscuro);transform:translateY(-3px);box-shadow:0 12px 30px rgba(212,162,76,0.4)}

.btn-secundario{background:var(--azul-oscuro);color:var(--blanco)}
.btn-secundario:hover{background:var(--azul-medio);transform:translateY(-3px);box-shadow:var(--sombra-md)}

.btn-outline{background:#FFFFFF;color:#111827;border:2px solid #111827}
.btn-outline:hover{background:#111827;color:#FFFFFF;transform:translateY(-2px)}

.btn-outline-blanco{background:transparent;color:var(--blanco);border:2px solid var(--blanco)}
.btn-outline-blanco:hover{background:var(--blanco);color:var(--azul-oscuro);transform:translateY(-3px)}

.btn-grande{padding:1.15rem 2.8rem;font-size:1rem}
.btn-block{width:100%}

/* EFECTO SHINE EN BOTONES */
.btn::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.3),transparent);transform:translateX(-100%);transition:transform 0.5s}
.btn:hover::before{transform:translateX(100%)}

/* ============================================
   HEADER
   ============================================ */
.header{position:fixed;top:0;left:0;width:100%;height:var(--header-h);background:rgba(13,43,62,0.95);backdrop-filter:blur(10px);z-index:1000;transition:all var(--trans)}
.header.scrolled{height:68px;box-shadow:var(--sombra-md)}

.header .container{display:flex;align-items:center;justify-content:space-between;height:100%}

.logo{display:flex;align-items:center;gap:0.75rem}
.logo img{height:56px;width:auto;filter:brightness(0) invert(1);display:block}
.logo-texto{font-family:var(--font-titulo);font-size:1.4rem;font-weight:700;color:var(--blanco);letter-spacing:0.5px}
.logo-texto span{color:var(--dorado)}

.nav-menu{display:flex;align-items:center;gap:2.2rem}
.nav-menu a{color:rgba(255,255,255,0.85);font-size:0.9rem;font-weight:500;text-transform:uppercase;letter-spacing:0.5px;position:relative;padding:0.4rem 0}
.nav-menu a::after{content:'';position:absolute;bottom:-2px;left:0;width:100%;height:2px;background:var(--dorado);transform:scaleX(0);transform-origin:left;transition:transform var(--trans)}
.nav-menu a:hover::after,.nav-menu a.active::after{transform:scaleX(1)}
.nav-menu a:hover{color:var(--dorado)}

.nav-cta{background:var(--dorado) !important;color:var(--azul-oscuro) !important;padding:0.6rem 1.5rem !important;border-radius:var(--radio-sm) !important;font-weight:600 !important}
.nav-cta:hover{background:var(--dorado-oscuro) !important;color:var(--blanco) !important;transform:translateY(-2px)}
.nav-cta::after{display:none}

.menu-toggle{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;padding:0.5rem;z-index:1001}
.menu-toggle span{width:26px;height:3px;background:var(--blanco);border-radius:2px;transition:var(--trans)}
.menu-toggle.activo span:nth-child(1){transform:rotate(45deg) translate(6px,6px)}
.menu-toggle.activo span:nth-child(2){opacity:0}
.menu-toggle.activo span:nth-child(3){transform:rotate(-45deg) translate(6px,-6px)}

/* ============================================
   HERO
   ============================================ */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;padding-top:var(--header-h);background:linear-gradient(135deg,var(--azul-oscuro) 0%,var(--azul-medio) 50%,var(--azul-claro) 100%);overflow:hidden}

.hero::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;
  background-image:
    radial-gradient(circle at 20% 50%,rgba(212,162,76,0.08) 0%,transparent 50%),
    radial-gradient(circle at 80% 80%,rgba(42,123,152,0.15) 0%,transparent 50%);
}

.hero::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:200px;background:linear-gradient(to top,var(--blanco),transparent);pointer-events:none}

.hero-contenido{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr 0.9fr;gap:4rem;align-items:center;width:100%}

.hero-texto{color:var(--blanco)}
.hero-texto .eyebrow{color:var(--dorado)}
.hero-texto h1{color:var(--blanco);font-size:3.8rem;margin-bottom:1.5rem;line-height:1.15}
.hero-texto h1 span{color:var(--dorado);font-style:italic}
.hero-texto p{font-size:1.2rem;color:rgba(255,255,255,0.85);margin-bottom:2.5rem;max-width:520px;line-height:1.8}

.hero-botones{display:flex;gap:1.2rem;flex-wrap:wrap}

.hero-visual{position:relative}
.hero-card{background:rgba(255,255,255,0.1);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,0.2);border-radius:var(--radio-lg);padding:2rem;box-shadow:var(--sombra-lg);animation:flotar 6s ease-in-out infinite}
@keyframes flotar{0%,100%{transform:translateY(0)}50%{transform:translateY(-15px)}}

.hero-card-titulo{color:var(--blanco);font-family:var(--font-cuerpo);font-size:0.85rem;text-transform:uppercase;letter-spacing:2px;margin-bottom:1.5rem;opacity:0.8}
.hero-card-item{display:flex;align-items:center;gap:1rem;padding:1rem 0;border-bottom:1px solid rgba(255,255,255,0.1)}
.hero-card-item:last-child{border-bottom:none}
.hero-card-item svg{flex-shrink:0;width:40px;height:40px;background:rgba(212,162,76,0.2);border-radius:var(--radio-sm);padding:8px;color:var(--dorado)}
.hero-card-item-texto h4{color:var(--blanco);font-family:var(--font-cuerpo);font-size:0.95rem;margin-bottom:0.2rem}
.hero-card-item-texto p{color:rgba(255,255,255,0.7);font-size:0.8rem;margin:0}

.hero-icono-flotante{position:absolute;width:70px;height:70px;border-radius:50%;background:var(--blanco);display:flex;align-items:center;justify-content:center;box-shadow:var(--sombra-lg);color:var(--dorado)}
.hero-icono-flotante.ico-1{top:-20px;right:-10px;animation:flotar 4s ease-in-out infinite}
.hero-icono-flotante.ico-2{bottom:-20px;left:-30px;animation:flotar 5s ease-in-out infinite 0.5s}

/* HERO STATS */
.hero-stats{display:flex;gap:3rem;margin-top:3rem;padding-top:2rem;border-top:1px solid rgba(255,255,255,0.15)}
.hero-stat .numero{font-family:var(--font-titulo);font-size:2.5rem;color:var(--dorado);font-weight:700}
.hero-stat .label{font-size:0.82rem;color:rgba(255,255,255,0.7);text-transform:uppercase;letter-spacing:1px}

/* ============================================
   BENEFICIOS
   ============================================ */
.beneficios-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.8rem}
.beneficio-card{background:var(--blanco);border-radius:var(--radio-lg);padding:2.5rem 2rem;box-shadow:var(--sombra-sm);border:1px solid var(--gris-borde);transition:all var(--trans);position:relative;overflow:hidden}
.beneficio-card::before{content:'';position:absolute;top:0;left:0;width:100%;height:4px;background:linear-gradient(90deg,var(--dorado),var(--dorado-claro));transform:scaleX(0);transform-origin:left;transition:transform var(--trans)}
.beneficio-card:hover{transform:translateY(-8px);box-shadow:var(--sombra-lg)}
.beneficio-card:hover::before{transform:scaleX(1)}

.beneficio-icono{width:64px;height:64px;border-radius:var(--radio);background:linear-gradient(135deg,var(--azul-oscuro),var(--azul-medio));display:flex;align-items:center;justify-content:center;margin-bottom:1.5rem;color:var(--dorado);transition:var(--trans)}
.beneficio-card:hover .beneficio-icono{background:linear-gradient(135deg,var(--dorado),var(--dorado-oscuro));color:var(--blanco);transform:scale(1.1) rotate(5deg)}
.beneficio-card h3{font-size:1.25rem;margin-bottom:0.75rem}
.beneficio-card p{font-size:0.92rem;color:var(--gris-texto);margin:0}

/* ============================================
   MÉTRICAS
   ============================================ */
.metricas{background:var(--azul-oscuro);padding:5rem 0;position:relative;overflow:hidden}
.metricas::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 50% 50%,rgba(212,162,76,0.08) 0%,transparent 70%)}
.metricas-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;text-align:center;position:relative;z-index:1}
.metrica{padding:1.5rem;border-right:1px solid rgba(255,255,255,0.1)}
.metrica:last-child{border-right:none}
.metrica .numero{font-family:'Bebas Neue',var(--font-titulo);font-size:4rem;color:var(--dorado);font-weight:400;font-style:normal;line-height:1;letter-spacing:1px}
.metrica .label{color:rgba(255,255,255,0.75);font-size:0.88rem;text-transform:uppercase;letter-spacing:2px;margin-top:0.8rem}

/* ============================================
   SECCIÓN NOSOTROS
   ============================================ */
.nosotros-bloque{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.nosotros-imagen{position:relative}
.nosotros-imagen img{border-radius:var(--radio-lg);box-shadow:var(--sombra-md);width:100%}
.nosotros-imagen::after{content:'';position:absolute;top:25px;left:-25px;width:100%;height:100%;border:3px solid var(--dorado);border-radius:var(--radio-lg);z-index:-1;opacity:0.5}
.nosotros-badge{position:absolute;bottom:30px;right:30px;background:var(--dorado);color:var(--azul-oscuro);padding:1.5rem 2rem;border-radius:var(--radio);box-shadow:var(--sombra-lg);text-align:center}
.nosotros-badge .num{font-family:var(--font-titulo);font-size:2.5rem;font-weight:700;display:block}
.nosotros-badge .txt{font-size:0.82rem;text-transform:uppercase;letter-spacing:1px;font-weight:600}

.nosotros-texto p{margin-bottom:1.5rem;font-size:1.02rem}
.nosotros-texto .destacado{font-size:1.15rem;color:var(--azul-oscuro);font-weight:500;font-style:italic;background:rgba(212,162,76,0.08);border-radius:6px;padding:1rem 1.25rem;margin:2rem 0}

.lista-check{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:2rem}
.lista-check li{display:flex;align-items:center;gap:0.75rem;font-size:0.95rem;color:var(--gris-oscuro);font-weight:500}
.lista-check li svg{flex-shrink:0;width:24px;height:24px;color:var(--dorado)}

/* ============================================
   MISIÓN VISIÓN VALORES
   ============================================ */
.mvv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.mvv-card{background:var(--blanco);padding:3rem 2.5rem;border-radius:var(--radio-lg);box-shadow:var(--sombra-sm);border:1px solid var(--gris-borde);transition:all var(--trans);position:relative;overflow:hidden}
.mvv-card::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:100%;background:linear-gradient(180deg,transparent,var(--gris-claro));transition:opacity var(--trans);opacity:0;z-index:0}
.mvv-card:hover{transform:translateY(-8px);box-shadow:var(--sombra-lg)}
.mvv-card:hover::after{opacity:1}
.mvv-card > *{position:relative;z-index:1}

.mvv-icono{width:70px;height:70px;border-radius:50%;background:linear-gradient(135deg,var(--azul-oscuro),var(--azul-medio));display:flex;align-items:center;justify-content:center;color:var(--dorado);margin-bottom:1.8rem;transition:var(--trans)}
.mvv-card:hover .mvv-icono{background:linear-gradient(135deg,var(--dorado),var(--dorado-oscuro));color:var(--blanco);transform:rotate(360deg);transition:transform 0.7s ease}

.mvv-card h3{margin-bottom:1rem;font-size:1.4rem}
.mvv-card p{font-size:0.95rem;margin:0}

/* VALORES TABLA */
.valores-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1.5rem}
.valor-card{text-align:center;padding:2.5rem 1.5rem;background:var(--blanco);border-radius:var(--radio-lg);box-shadow:var(--sombra-sm);border:1px solid var(--gris-borde);transition:all var(--trans)}
.valor-card:hover{transform:translateY(-8px);box-shadow:var(--sombra-md);border-color:var(--dorado)}
.valor-icono{width:60px;height:60px;border-radius:50%;background:var(--gris-claro);display:flex;align-items:center;justify-content:center;margin:0 auto 1.2rem;color:var(--dorado);transition:var(--trans)}
.valor-card:hover .valor-icono{background:var(--dorado);color:var(--blanco);transform:scale(1.15)}
.valor-card h4{font-size:1.1rem;margin-bottom:0.5rem}
.valor-card p{font-size:0.85rem;margin:0;color:var(--gris-texto)}

/* ============================================
   SERVICIOS IA
   ============================================ */
.sia-seccion{background:#FFFFFF;padding:5rem 0}

.sia-encabezado{text-align:center;margin-bottom:3rem}
.sia-encabezado h2{font-family:var(--font-cuerpo);font-size:3rem;font-weight:800;color:var(--azul-oscuro);margin-bottom:0.8rem;letter-spacing:-1px;line-height:1.2}
.sia-desc{color:var(--gris-texto);font-size:0.95rem;line-height:1.7;margin-bottom:0.6rem}
.sia-instruccion{color:#9CA3AF;font-size:0.82rem;margin-bottom:0.9rem}
.sia-barra-oro{display:block;width:48px;height:3px;background:#D4A24C;border-radius:2px;margin:0 auto}

.sia-layout{display:grid;grid-template-columns:1fr 285px;gap:3rem;align-items:center}

/* GRID DE CARDS */
.sia-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem}

.sia-visual{display:none}

.sia-card{background:#FFFFFF;border:1px solid #E8EDF3;border-radius:16px;overflow:hidden;box-shadow:0 2px 12px rgba(13,43,62,0.06);cursor:pointer;transition:all 0.28s ease}
.sia-card:hover{transform:translateY(-5px);box-shadow:0 10px 32px rgba(13,43,62,0.12);border-color:rgba(212,162,76,0.4)}
.sia-card.activa{border-color:#D4A24C;box-shadow:0 0 0 2px rgba(212,162,76,0.2),0 10px 32px rgba(13,43,62,0.1)}

.sia-cuerpo{padding:1.8rem 1.6rem}

.sia-mini-ico{width:44px;height:44px;background:#EEF2F7;border-radius:10px;display:flex;align-items:center;justify-content:center;color:var(--azul-oscuro);margin-bottom:1.1rem;transition:all 0.28s ease}
.sia-card:hover .sia-mini-ico,.sia-card.activa .sia-mini-ico{background:var(--azul-oscuro);color:#FFFFFF}

.sia-cuerpo h3{font-family:var(--font-cuerpo);font-size:1.02rem;font-weight:700;color:var(--azul-oscuro);margin-bottom:0.5rem;line-height:1.3}
.sia-cuerpo p{font-size:0.86rem;color:var(--gris-texto);line-height:1.6;margin:0}

.sia-arrow{display:block;text-align:right;color:#D1D5DB;font-size:1rem;margin-top:0.8rem;transition:all 0.28s ease}
.sia-card:hover .sia-arrow,.sia-card.activa .sia-arrow{color:#D4A24C;transform:translateX(3px)}

/* TELÉFONO */
.sia-phone-col{display:flex;justify-content:center;align-items:center}

.sia-iphone{width:264px;background:#1C1C1E;border-radius:44px;padding:12px;position:relative;box-shadow:0 0 0 1px #2C2C2E,0 0 0 3px #1C1C1E,0 32px 80px rgba(0,0,0,0.65)}

.sia-isla{width:108px;height:32px;background:#1C1C1E;border-radius:0 0 20px 20px;position:absolute;top:0;left:50%;transform:translateX(-50%);z-index:2}

.sia-pantalla{background:#FFFFFF;border-radius:36px;overflow:hidden;display:flex;flex-direction:column;height:558px}

.sia-chat-top{display:flex;align-items:center;gap:0.55rem;padding:1rem 0.9rem 0.65rem;border-bottom:1px solid #F0F2F4;flex-shrink:0}

.sia-av{width:36px;height:36px;border-radius:9px;background:#0D2B3E;color:#D4A24C;font-weight:800;font-size:0.72rem;display:flex;align-items:center;justify-content:center;font-family:var(--font-cuerpo);flex-shrink:0;letter-spacing:0.5px}

.sia-av-data{flex:1;min-width:0}
.sia-av-data strong{display:block;font-size:0.80rem;font-weight:700;color:#111827;font-family:var(--font-cuerpo)}
.sia-av-data span{display:flex;align-items:center;gap:4px;font-size:0.68rem;color:#6B7280;font-family:var(--font-cuerpo)}

.sia-punto{display:inline-block;width:6px;height:6px;background:#22C55E;border-radius:50%;flex-shrink:0}

.sia-menu-pts{font-size:1.1rem;color:#9CA3AF;padding:0 0.1rem}

.sia-mensajes{flex:1;overflow-y:auto;padding:0.9rem;display:flex;flex-direction:column;gap:0.65rem;scroll-behavior:smooth}
.sia-mensajes::-webkit-scrollbar{width:2px}
.sia-mensajes::-webkit-scrollbar-thumb{background:#E5E7EB;border-radius:2px}

.sia-burbuja{background:#F3F4F6;border-radius:12px 12px 12px 2px;padding:0.7rem 0.85rem;font-size:0.76rem;color:#374151;line-height:1.55;font-family:var(--font-cuerpo);max-width:94%}
.sia-burbuja strong{color:#0D2B3E}

.sia-burbuja-usr{background:#0D2B3E;border-radius:12px 12px 2px 12px;padding:0.6rem 0.85rem;font-size:0.76rem;color:#FFFFFF;line-height:1.5;font-family:var(--font-cuerpo);max-width:86%;align-self:flex-end}

.sia-typing{display:flex;gap:4px;padding:0.75rem 0.9rem;background:#F3F4F6;border-radius:12px 12px 12px 2px;width:fit-content}
.sia-typing span{width:6px;height:6px;background:#9CA3AF;border-radius:50%;animation:siaDots 1.2s ease-in-out infinite}
.sia-typing span:nth-child(2){animation-delay:.2s}
.sia-typing span:nth-child(3){animation-delay:.4s}
@keyframes siaDots{0%,60%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-5px);opacity:1}}

.sia-input-fila{display:flex;align-items:center;padding:0.55rem 0.75rem;border-top:1px solid #F0F2F4;gap:0.45rem;flex-shrink:0}
.sia-input-fila input{flex:1;border:none;outline:none;font-size:0.75rem;color:#9CA3AF;font-family:var(--font-cuerpo);background:transparent;padding:0.25rem 0}
.sia-input-fila button{width:28px;height:28px;border-radius:50%;background:#3B82F6;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#FFFFFF;flex-shrink:0;transition:background .2s}
.sia-input-fila button:hover{background:#2563EB}

.sia-footer-txt{text-align:center;font-size:0.58rem;color:#D1D5DB;font-family:var(--font-cuerpo);letter-spacing:1.2px;padding:0.35rem 0 0.5rem;flex-shrink:0;margin:0}

.sia-quick-replies{display:flex;flex-wrap:wrap;gap:0.4rem;padding:0.4rem 0 0.2rem;max-width:95%}
.sia-qr-btn{background:#FFFFFF;border:1px solid #E2E8F0;border-radius:20px;padding:0.35rem 0.75rem;font-size:0.72rem;color:#0D2B3E;font-family:var(--font-cuerpo);font-weight:500;cursor:pointer;transition:all 0.2s ease;white-space:nowrap}
.sia-qr-btn:hover{background:#0D2B3E;color:#FFFFFF;border-color:#0D2B3E}

@media(max-width:1140px){
  .sia-layout{grid-template-columns:1fr;row-gap:2.5rem}
  .sia-phone-col{display:flex;justify-content:center}
  .sia-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:860px){
  .sia-encabezado h2{font-size:2.4rem}
  .sia-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:540px){
  .sia-encabezado h2{font-size:2rem}
  .sia-grid{grid-template-columns:repeat(2,1fr);gap:0.9rem}
  .sia-cuerpo{padding:1.2rem 1.1rem}
  .sia-cuerpo h3{font-size:0.9rem}
  .sia-cuerpo p{font-size:0.8rem}
  .sia-iphone{width:240px}
  .sia-pantalla{height:500px}
  .sia-isla{width:96px;height:28px}
}

/* ============================================
   SERVICIO DETALLE
   ============================================ */
.detalle-layout{display:grid;grid-template-columns:0.8fr 1.2fr;gap:4rem;align-items:start}
.detalle-lateral{position:sticky;top:100px}
.detalle-lateral-img{border-radius:var(--radio-lg);overflow:hidden;box-shadow:var(--sombra-md);margin-bottom:2rem;background:linear-gradient(135deg,var(--azul-oscuro),var(--azul-medio));height:300px;display:flex;align-items:center;justify-content:center}
.detalle-lateral-img svg{width:120px;height:120px;color:var(--dorado);opacity:0.8}

.detalle-cta-card{background:var(--azul-oscuro);color:var(--blanco);padding:2rem;border-radius:var(--radio-lg);text-align:center}
.detalle-cta-card h4{color:var(--blanco);margin-bottom:0.5rem}
.detalle-cta-card p{color:rgba(255,255,255,0.7);font-size:0.9rem;margin-bottom:1.5rem}

.detalle-contenido h2{margin-bottom:1rem}
.detalle-contenido p{font-size:1.05rem;margin-bottom:1.5rem}
.detalle-contenido .lead{font-size:1.2rem;color:var(--azul-oscuro);font-weight:500;font-style:italic;background:rgba(212,162,76,0.08);border-radius:6px;padding:1rem 1.25rem;margin:2rem 0}

.detalle-beneficios{margin:2.5rem 0}
.detalle-beneficios h3{margin-bottom:1.5rem}
.detalle-beneficios-lista{display:grid;gap:1rem}
.detalle-beneficios-lista li{display:flex;align-items:start;gap:1rem;padding:1.2rem 1.5rem;background:var(--gris-claro);border-radius:var(--radio);transition:var(--trans)}
.detalle-beneficios-lista li:hover{background:var(--azul-oscuro);color:var(--blanco);transform:translateX(8px)}
.detalle-beneficios-lista li:hover h4{color:var(--dorado)}
.detalle-beneficios-lista li:hover p{color:rgba(255,255,255,0.8)}
.detalle-beneficios-lista li svg{flex-shrink:0;width:40px;height:40px;background:var(--dorado);color:var(--azul-oscuro);border-radius:var(--radio-sm);padding:8px}
.detalle-beneficios-lista li h4{font-size:1.05rem;margin-bottom:0.2rem;transition:var(--trans)}
.detalle-beneficios-lista li p{font-size:0.9rem;margin:0;transition:var(--trans)}

.detalle-relacionados{margin-top:3rem;padding-top:2rem;border-top:2px solid var(--gris-borde)}
.detalle-relacionados h3{margin-bottom:1.5rem}
.relacionados-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.relacionado-card{padding:1.8rem;background:var(--gris-claro);border-radius:var(--radio-lg);transition:var(--trans);border:1px solid transparent}
.relacionado-card:hover{background:var(--blanco);border-color:var(--dorado);box-shadow:var(--sombra-sm);transform:translateY(-5px)}
.relacionado-card svg{width:32px;height:32px;color:var(--dorado);margin-bottom:1rem}
.relacionado-card h4{font-size:1.05rem;margin-bottom:0.3rem}
.relacionado-card p{font-size:0.85rem;margin:0;color:var(--gris-texto)}

/* ============================================
   PROCESO
   ============================================ */
.proceso-timeline{position:relative;padding:2rem 0}
.progreso-linea{position:absolute;top:48px;left:10%;width:80%;height:3px;background:var(--gris-borde);z-index:0;border-radius:2px}
.progreso-linea::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,var(--dorado),var(--azul-claro));border-radius:2px;transform:scaleX(0);transform-origin:left;transition:transform 1.5s ease}
.progreso-linea.activo::after{transform:scaleX(1)}

.proceso-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;position:relative;z-index:1}
.paso{text-align:center}
.paso-circulo{width:96px;height:96px;border-radius:50%;background:var(--blanco);border:3px solid var(--gris-borde);display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem;transition:all var(--trans-rebote);position:relative;color:var(--azul-medio)}
.paso-circulo .num{position:absolute;top:-10px;right:-10px;width:28px;height:28px;background:var(--dorado);color:var(--azul-oscuro);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-tuerpo);font-weight:700;font-size:0.85rem}
.paso:hover .paso-circulo{border-color:var(--dorado);transform:scale(1.1);box-shadow:var(--sombra-dorado)}
.paso-circulo svg{width:36px;height:36px}
.paso h3{font-size:1.25rem;margin-bottom:0.75rem}
.paso p{font-size:0.9rem;color:var(--gris-texto);max-width:250px;margin:0 auto}

/* ============================================
   TESTIMONIOS
   ============================================ */
.testimonios-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.testimonio-card{background:var(--blanco);padding:2.5rem 2.2rem;border-radius:var(--radio-lg);box-shadow:var(--sombra-sm);border:1px solid var(--gris-borde);transition:all var(--trans);position:relative}
.testimonio-card:hover{transform:translateY(-8px);box-shadow:var(--sombra-lg);border-color:var(--dorado)}

.testimonio-comillas{position:absolute;top:25px;right:30px;font-family:var(--font-titulo);font-size:5rem;color:var(--dorado);opacity:0.15;line-height:1}
.testimonio-estrellas{display:flex;gap:4px;margin-bottom:1.2rem;color:var(--dorado)}
.testimonio-estrellas svg{width:20px;height:20px}
.testimonio-card blockquote{color:var(--gris-oscuro);font-style:italic;margin-bottom:1.8rem;font-size:1rem;line-height:1.8;position:relative;z-index:1}

.testimonio-autor{display:flex;align-items:center;gap:1rem;padding-top:1.5rem;border-top:1px solid var(--gris-borde)}
.testimonio-avatar{width:54px;height:54px;border-radius:50%;background:linear-gradient(135deg,var(--azul-oscuro),var(--azul-medio));display:flex;align-items:center;justify-content:center;color:var(--dorado);font-family:var(--font-titulo);font-weight:700;font-size:1.2rem;flex-shrink:0}
.testimonio-autor-info h4{font-family:var(--font-cuerpo);font-size:1rem;margin-bottom:0.1rem}
.testimonio-autor-info span{font-size:0.85rem;color:var(--gris-texto)}

/* LOGOS CLIENTES */
.clientes-strip{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:4rem;margin-top:4rem;padding-top:4rem;border-top:1px solid var(--gris-borde)}
.cliente-logo{font-family:var(--font-titulo);font-size:1.6rem;color:var(--gris-borde);font-weight:700;text-transform:uppercase;letter-spacing:1px;transition:var(--trans)}
.cliente-logo:hover{color:var(--azul-medio);transform:scale(1.1)}

/* ============================================
   BLOG
   ============================================ */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.blog-card{background:var(--blanco);border-radius:var(--radio-lg);overflow:hidden;box-shadow:var(--sombra-sm);border:1px solid var(--gris-borde);transition:all var(--trans)}
.blog-card:hover{transform:translateY(-10px);box-shadow:var(--sombra-lg);border-color:var(--dorado)}

.blog-card-img{width:100%;height:200px;background:linear-gradient(135deg,var(--azul-oscuro),var(--azul-medio));display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.blog-card-img svg{width:64px;height:64px;color:var(--dorado);opacity:0.7;transition:var(--trans)}
.blog-card:hover .blog-card-img svg{transform:scale(1.15);opacity:0.9}
.blog-card-img::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:50%;background:linear-gradient(to top,rgba(13,43,62,0.5),transparent)}

.blog-card-body{padding:1.8rem}
.blog-card-cat{display:inline-block;background:rgba(212,162,76,0.12);color:var(--dorado-oscuro);padding:0.3rem 0.9rem;border-radius:20px;font-size:0.72rem;text-transform:uppercase;letter-spacing:1.5px;font-weight:600;margin-bottom:1rem}
.blog-card-body h3{font-size:1.2rem;margin-bottom:0.7rem;transition:var(--trans)}
.blog-card:hover .blog-card-body h3{color:var(--azul-medio)}
.blog-card-body p{font-size:0.9rem;color:var(--gris-texto);margin-bottom:1.5rem}
.blog-card-meta{display:flex;justify-content:space-between;font-size:0.82rem;color:var(--gris-texto);padding-top:1rem;border-top:1px solid var(--gris-borde)}
.blog-card-meta span{display:flex;align-items:center;gap:0.4rem}
.blog-card-meta svg{width:14px;height:14px;color:var(--dorado)}

/* ============================================
   FORMULARIOS
   ============================================ */
.form-card{max-width:720px;margin:0 auto;background:var(--blanco);padding:3.5rem;border-radius:var(--radio-lg);box-shadow:var(--sombra-md);border:1px solid var(--gris-borde)}

.form-group{margin-bottom:1.5rem}
.form-group label{display:block;font-weight:600;color:var(--azul-oscuro);margin-bottom:0.5rem;font-size:0.88rem;letter-spacing:0.3px}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:0.9rem 1.1rem;border:2px solid var(--gris-borde);border-radius:var(--radio-sm);font-family:var(--font-cuerpo);font-size:0.95rem;color:var(--gris-oscuro);transition:var(--trans);background:var(--gris-claro)}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--dorado);background:var(--blanco);box-shadow:0 0 0 4px rgba(212,162,76,0.12)}
.form-group textarea{resize:vertical;min-height:130px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}

.form-success{display:none;background:linear-gradient(135deg,#D4EDDA,#E8F5E9);color:#155724;padding:1.2rem 1.5rem;border-radius:var(--radio);margin-bottom:1.5rem;border:1px solid #C3E6CB;font-weight:500;font-size:0.9rem;align-items:center;gap:0.75rem}
.form-success.activo{display:flex;animation:slideIn 0.5s ease}
.form-success svg{width:24px;height:24px;flex-shrink:0}

@keyframes slideIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}

/* CONTACTO INFO */
.contacto-layout{display:grid;grid-template-columns:1fr 1.3fr;gap:4rem;align-items:start}
.contacto-datos{padding:1rem 0}
.contacto-item{display:flex;align-items:start;gap:1.2rem;margin-bottom:2.5rem}
.contacto-item-icono{width:56px;height:56px;border-radius:var(--radio);background:linear-gradient(135deg,var(--azul-oscuro),var(--azul-medio));display:flex;align-items:center;justify-content:center;color:var(--dorado);flex-shrink:0;transition:var(--trans)}
.contacto-item:hover .contacto-item-icono{background:linear-gradient(135deg,var(--dorado),var(--dorado-oscuro));color:var(--blanco);transform:scale(1.1)}
.contacto-item-info h4{font-family:var(--font-cuerpo);font-size:1rem;margin-bottom:0.3rem}
.contacto-item-info p{font-size:0.95rem;margin:0;color:var(--gris-texto)}

/* COTIZACIÓN PLANES */
.planes-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-bottom:4rem}
.plan-card{background:var(--blanco);border-radius:var(--radio-lg);padding:2.5rem 2rem;box-shadow:var(--sombra-sm);border:2px solid var(--gris-borde);transition:all var(--trans);text-align:center;position:relative}
.plan-card:hover{transform:translateY(-8px);box-shadow:var(--sombra-lg);border-color:var(--dorado)}
.plan-card.destacado{border-color:var(--dorado);transform:scale(1.03)}
.plan-card.destacado:hover{transform:scale(1.03) translateY(-8px)}
.plan-badge{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:var(--dorado);color:var(--azul-oscuro);padding:0.35rem 1.2rem;border-radius:20px;font-size:0.72rem;font-weight:700;letter-spacing:1px;text-transform:uppercase}

.plan-card h3{font-size:1.35rem;margin-bottom:0.5rem}
.plan-desc{font-size:0.85rem;color:var(--gris-texto);margin-bottom:1.5rem}
.plan-precio{font-family:var(--font-titulo);font-size:2.8rem;color:var(--dorado);font-weight:700;margin-bottom:0.5rem}
.plan-precio span{font-size:1rem;color:var(--gris-texto);font-weight:400}
.plan-lista{text-align:left;margin:1.5rem 0}
.plan-lista li{padding:0.6rem 0;font-size:0.9rem;color:var(--gris-oscuro);border-bottom:1px solid var(--gris-borde);display:flex;align-items:center;gap:0.75rem}
.plan-lista li:last-child{border-bottom:none}
.plan-lista li svg{width:18px;height:18px;color:var(--dorado);flex-shrink:0}

/* ============================================
   CTA SECCIÓN
   ============================================ */
/* ============================================
   PROCESO DE TRABAJO
   ============================================ */
.proceso-seccion{background:#FFFFFF;padding:5rem 0;border-top:1px solid #E8EDF3}

.proceso-header{text-align:center;max-width:640px;margin:0 auto 4rem}
.proceso-header h2{font-family:var(--font-cuerpo);font-size:3rem;font-weight:800;color:var(--azul-oscuro);letter-spacing:-1px;line-height:1.2;margin-bottom:0.9rem}
.proceso-header p{color:var(--gris-texto);font-size:1rem;line-height:1.7;margin:0}

.proceso-pasos{display:flex;align-items:flex-start;position:relative;gap:0}

.proceso-pasos::before{
  content:'';
  position:absolute;
  top:57px;
  left:calc(12.5% + 2px);
  right:calc(12.5% + 2px);
  height:2px;
  background:linear-gradient(90deg,#E2E8F0 0%,#CBD5E1 50%,#E2E8F0 100%);
  z-index:0
}

.proceso-paso{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;z-index:1;padding:0 1rem}

.proceso-num{font-family:var(--font-cuerpo);font-size:0.75rem;font-weight:700;color:#D4A24C;letter-spacing:1.5px;margin-bottom:0.65rem}

.proceso-circulo{
  width:82px;height:82px;
  border-radius:50%;
  background:var(--azul-oscuro);
  display:flex;align-items:center;justify-content:center;
  color:#FFFFFF;
  margin-bottom:1.3rem;
  position:relative;
  transition:all 0.3s ease;
  box-shadow:0 4px 18px rgba(13,43,62,0.22)
}
.proceso-paso:hover .proceso-circulo{background:#D4A24C;transform:translateY(-5px);box-shadow:0 10px 28px rgba(212,162,76,0.38)}

.proceso-paso h4{font-family:var(--font-cuerpo);font-size:1rem;font-weight:700;color:var(--azul-oscuro);margin-bottom:0.55rem;line-height:1.3}
.proceso-paso p{font-size:0.85rem;color:var(--gris-texto);line-height:1.65;margin:0;max-width:190px}

@media(max-width:1024px){
  .proceso-pasos::before{top:57px;left:calc(12.5% + 2px);right:calc(12.5% + 2px)}
  .proceso-paso{padding:0 0.6rem}
  .proceso-paso p{max-width:160px}
}
@media(max-width:768px){
  .proceso-pasos{flex-wrap:wrap;row-gap:3rem;column-gap:0}
  .proceso-pasos::before{display:none}
  .proceso-paso{flex:0 0 50%;padding:0 1.5rem}
  .proceso-paso p{max-width:100%}
  .proceso-header h2{font-size:2.4rem}
}
@media(max-width:480px){
  .proceso-paso{flex:0 0 50%;padding:0 0.8rem}
  .proceso-header h2{font-size:2rem}
  .proceso-circulo{width:68px;height:68px}
  .proceso-paso p{font-size:0.78rem}
}

.cta-seccion{background:linear-gradient(135deg,var(--azul-oscuro),var(--azul-medio));padding:5rem 0;text-align:center;color:var(--blanco);position:relative;overflow:hidden}
.cta-secion::before{content:'';position:absolute;top:0;right:0;width:60%;height:100%;background:radial-gradient(circle,rgba(212,162,76,0.12) 0%,transparent 70%)}
.cta-secion h2{color:var(--blanco);margin-bottom:1rem;position:relative;z-index:1}
.cta-secion p{color:rgba(255,255,255,0.85);max-width:620px;margin:0 auto 2rem;position:relative;z-index:1;font-size:1.05rem}
.cta-secion .btn{position:relative;z-index:1}

/* VARIANTE CTA CON PATRÓN */
.cta-pattern{background:var(--azul-oscuro);position:relative}
.cta-pattern::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;
  background-image:repeating-linear-gradient(45deg,transparent,transparent 30px,rgba(212,162,76,0.03) 30px,rgba(212,162,76,0.03) 60px)}
.cta-pattern .container{position:relative;z-index:1}

/* ============================================
   PÁGINA HERO
   ============================================ */
.pagina-hero{padding:calc(var(--header-h) + 4rem) 0 5rem;background:linear-gradient(135deg,var(--azul-oscuro),var(--azul-medio));color:var(--blanco);text-align:center;position:relative;overflow:hidden}
.pagina-hero::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 50% 50%,rgba(212,162,76,0.1) 0%,transparent 70%)}
.pagina-hero h1{color:var(--blanco);margin-bottom:1rem;position:relative;z-index:1}
.pagina-hero h1 span{color:var(--dorado);font-style:italic}
.pagina-hero p{color:rgba(255,255,255,0.85);max-width:620px;margin:0 auto;position:relative;z-index:1;font-size:1.1rem}
.breadcrumb{display:flex;justify-content:center;gap:0.5rem;margin-top:1.5rem;font-size:0.85rem;position:relative;z-index:1}
.breadcrumb a{color:var(--dorado)}
.breadcrumb span{color:rgba(255,255,255,0.5)}

/* ============================================
   FOOTER
   ============================================ */
.footer{background:var(--negro);color:rgba(255,255,255,0.6);padding:4rem 0 0}

.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1.4fr 1.3fr 0.8fr;gap:2.5rem;margin-bottom:3rem}

.footer-col-marca p{font-size:0.88rem;line-height:1.8;margin:0;max-width:240px}

.footer-logo{margin-bottom:1.4rem;display:flex;align-items:center}
.footer-logo img{height:64px;width:auto;max-width:220px;object-fit:contain;filter:brightness(0) invert(1)}

.footer-col h4{color:#FFFFFF;font-family:var(--font-cuerpo);font-size:0.82rem;font-weight:700;text-transform:uppercase;letter-spacing:1.8px;margin-bottom:1.4rem}

.footer-col ul{list-style:none;padding:0;margin:0}
.footer-col ul li{margin-bottom:0.75rem;font-size:0.87rem}
.footer-col ul li a{color:rgba(255,255,255,0.6);transition:color 0.25s ease}
.footer-col ul li a:hover{color:var(--dorado)}

.footer-contacto-lista li{display:flex;align-items:flex-start;gap:0.6rem;margin-bottom:0.85rem;font-size:0.87rem}
.footer-contacto-lista svg{flex-shrink:0;margin-top:2px;color:var(--dorado);opacity:0.8}

.footer-bottom{border-top:1px solid rgba(255,255,255,0.08);padding:1.4rem 0;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.footer-bottom p{font-size:0.82rem;margin:0;color:rgba(255,255,255,0.45)}

.footer-redes{display:flex;gap:0.55rem}
.footer-redes a{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,0.08);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,0.7);transition:all 0.25s ease}
.footer-redes a:hover{background:var(--dorado);color:var(--azul-oscuro);transform:translateY(-2px)}

@media(max-width:1024px){
  .footer-grid{grid-template-columns:1.4fr 1fr 1.2fr 1fr;gap:2rem}
  .footer-grid .footer-col:last-child{grid-column:1;grid-row:2}
}
@media(max-width:768px){
  .footer-grid{grid-template-columns:1fr 1fr;gap:2.5rem 2rem}
  .footer-col-marca{grid-column:1/-1}
  .footer-col-marca p{max-width:100%}
}
@media(max-width:480px){
  .footer-grid{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column;text-align:center;gap:1rem}
}

/* ============================================
   ANIMACIONES SCROLL
   ============================================ */
.reveal{opacity:0;transform:translateY(40px);transition:opacity 0.7s ease,transform 0.7s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-izq{opacity:0;transform:translateX(-40px);transition:opacity 0.7s ease,transform 0.7s ease}
.reveal-izq.visible{opacity:1;transform:translateX(0)}
.reveal-der{opacity:0;transform:translateX(40px);transition:opacity 0.7s ease,transform 0.7s ease}
.reveal-der.visible{opacity:1;transform:translateX(0)}
.reveal-scale{opacity:0;transform:scale(0.9);transition:opacity 0.7s ease,transform 0.7s ease}
.reveal-scale.visible{opacity:1;transform:scale(1)}
.reveal-delay-1{transition-delay:0.1s}
.reveal-delay-2{transition-delay:0.2s}
.reveal-delay-3{transition-delay:0.3s}
.reveal-delay-4{transition-delay:0.4s}

@keyframes rotate{from{transform:rotate(0)}to{transform:rotate(360deg)}}

/* ============================================
   RESPONSIVE
   ============================================ */
@media (max-width:1024px){
  h1{font-size:2.6rem}
  h2{font-size:2rem}
  .hero-contenido{grid-template-columns:1fr;gap:3rem}
  .hero-visual{display:none}
  .beneficios-grid{grid-template-columns:repeat(2,1fr)}
  .valores-grid{grid-template-columns:repeat(3,1fr)}
  .detale-layout{grid-template-columns:1fr}
}

@media (max-width:768px){
  h1{font-size:2.2rem}
  h2{font-size:1.8rem}
  .seccion{padding:4rem 0}
  .container{padding:0 1.5rem}

  /* Logo responsive */
  .logo img,.logo-natural img{height:60px;max-width:200px;object-fit:contain}

  /* Menú hamburguesa */
  .menu-toggle{display:flex}
  .nav-menu{
    position:fixed;top:var(--header-h);right:0;
    width:85%;max-width:320px;
    height:calc(100vh - var(--header-h));
    background:var(--azul-oscuro);
    flex-direction:column;justify-content:flex-start;align-items:flex-start;
    padding:2rem 1.5rem;gap:1.2rem;
    transform:translateX(100%);
    transition:transform var(--trans);
    box-shadow:-8px 0 32px rgba(0,0,0,0.3);
    overflow-y:auto;
    z-index:999
  }
  .nav-menu.activo{transform:translateX(0)}
  .nav-menu a{font-size:1rem;color:rgba(255,255,255,0.9);width:100%;padding:0.6rem 0;border-bottom:1px solid rgba(255,255,255,0.07)}
  .nav-menu a:last-child{border-bottom:none}
  .nav-menu .nav-cta{
    background:var(--dorado) !important;
    color:var(--azul-oscuro) !important;
    border-radius:var(--radio-sm) !important;
    padding:0.7rem 1.5rem !important;
    text-align:center;
    width:auto;
    border-bottom:none !important;
    margin-top:0.5rem
  }
  /* Header compacto en móvil */
  .header{height:64px}
  :root{--header-h:64px}

  .hero-contenido{gap:2rem;text-align:center}
  .hero-texto p{margin:0 auto 2rem}
  .hero-botones{justify-content:center}
  .hero-stats{justify-content:center;flex-wrap:wrap;gap:2rem}

  .mvv-grid,.testimonios-grid,.blog-grid,.planes-grid{grid-template-columns:1fr}
  .beneficios-grid{grid-template-columns:1fr}
  .valores-grid{grid-template-columns:1fr 1fr}
  .proceso-grid{grid-template-columns:1fr;gap:3rem}
  .progreso-linea{display:none}
  .metricas-grid{grid-template-columns:1fr 1fr;gap:2.5rem}
  .metrica{border-right:none;border-bottom:1px solid rgba(255,255,255,0.1);padding-bottom:1.5rem}
  .metrica:last-child{border-bottom:none}

  .nosotros-bloque,.contacto-layout{grid-template-columns:1fr;gap:2.5rem}
  .nosotros-imagen{order:-1}
  .nosotros-imagen::after{display:none}

  .lista-check{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
  .relacionados-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-bottom{flex-direction:column;gap:1rem;text-align:center}
  .form-card{padding:2rem 1.5rem}

  .plan-card.destacado{transform:none}
  .plan-card.destacado:hover{transform:translateY(-8px)}
}

/* ============================================
   HEADER BLANCO
   ============================================ */
.header-blanco{
  background:#FFFFFF;
  box-shadow:0 1px 0 #E2E8F0,0 4px 20px rgba(13,43,62,0.05)
}
.header-blanco.scrolled{box-shadow:0 1px 0 #E2E8F0,0 8px 24px rgba(13,43,62,0.1)}

/* Logo en header blanco — sin filtro de inversión */
.logo-natural img{
  filter:none;
  height:86px;
  width:auto;
  max-width:280px;
  object-fit:contain;
  transform-origin:left center;
  transition:transform var(--trans)
}
.header.scrolled .logo-natural img{
  transform:scale(0.77)
}

.nav-oscuro a{color:#374151;font-weight:500;font-size:0.875rem;letter-spacing:0.3px}
.nav-oscuro a:hover{color:var(--azul-medio)}
.nav-oscuro a.active{color:var(--azul-oscuro);font-weight:600}
.nav-oscuro a::after{background:var(--azul-medio)}
.nav-oscuro a.active::after{width:100%}

.menu-toggle-oscuro span{background:var(--azul-oscuro)}
.menu-toggle-oscuro.activo span:nth-child(1){transform:rotate(45deg) translate(6px,6px)}
.menu-toggle-oscuro.activo span:nth-child(2){opacity:0}
.menu-toggle-oscuro.activo span:nth-child(3){transform:rotate(-45deg) translate(6px,-6px)}

/* ============================================
   HERO NUEVO — fondo blanco, foto derecha
   ============================================ */
.hero-nuevo{
  background:#FFFFFF;
  overflow:hidden;
  position:relative
}

/* ============================================
   CANVAS — RED DE PARTÍCULAS
   ============================================ */
#hero-canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:0
}
@media(max-width:768px){#hero-canvas{display:block}}


.hero-nuevo-layout{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  gap:0;
  align-items:stretch;
  min-height:calc(var(--header-h) + 520px)
}

.hero-nuevo-texto-col{
  padding:calc(var(--header-h) + 2.2rem) 3.5rem 2.5rem;
  padding-left:calc(max(0px,(100vw - var(--max-w)) / 2) + 2rem);
  display:flex;
  align-items:center
}

/* — Texto — */
.hero-nuevo-texto .eyebrow{
  color:var(--dorado);
  font-size:0.72rem;
  letter-spacing:3px;
  margin-bottom:0.9rem
}

.hero-nuevo-texto h1{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-weight:800;
  font-size:4rem;
  line-height:1.15;
  letter-spacing:-2.5px;
  color:#111827;
  margin:0 0 1.4rem
}

.hero-h1-azul{color:#111827}

@keyframes marcaEntrada{
  0%{background-color:transparent}
  100%{background-color:rgba(212,162,76,0.82)}
}

.marca{
  background-color:transparent;
  padding:0 6px 2px;
  border-radius:3px;
  display:inline;
  animation:marcaEntrada 0.5s ease-in-out forwards
}
.marca-1{animation-delay:0.4s}
.marca-2{animation-delay:1s}
.marca-3{animation-delay:1.6s}

.hero-nuevo-texto p{
  color:#374151;
  font-size:1.08rem;
  line-height:1.7;
  margin-bottom:2.2rem;
  max-width:100%;
  font-weight:400;
}


.hero-botones{display:flex;gap:3rem;align-items:center;flex-wrap:nowrap;padding-left:7rem}

/* — Botón oscuro (Conocer más) — */
.btn-oscuro{
  background:#1B7B6A;
  color:#FFFFFF;
  border:none;
  letter-spacing:0.2px
}
.btn-oscuro:hover{
  background:#16685A;
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(27,123,106,0.4)
}

/* Botones del hero */
.hero-botones .btn{
  flex:none;
  padding:1rem 2.4rem;
  font-size:1rem;
  font-weight:600;
  border-radius:4px;
  letter-spacing:0.2px
}

/* — Imagen — */
.hero-nuevo-imagen{
  position:relative;
  overflow:hidden
}

.hero-nuevo-imagen img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}

/* ============================================
   BENEFICIOS STRIP — barra horizontal
   ============================================ */
.beneficios-strip{
  background:#FFFFFF;
  padding:2.4rem 0;
  border-top:1px solid #E8EDF3;
  border-bottom:1px solid #E8EDF3
}

.beneficios-strip-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0
}

.beneficio-item{
  display:flex;
  align-items:center;
  gap:1rem;
  padding:0.6rem 2rem 0.6rem 0;
  border-right:1px solid #E8EDF3;
  transition:background var(--trans)
}
.beneficio-item:last-child{border-right:none;padding-right:0}
.beneficio-item:first-child{padding-left:0}

.beneficio-icono-sm{
  width:64px;height:64px;flex-shrink:0;
  background:transparent;
  border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  color:#0D2B3E;
  overflow:visible;
  transition:var(--trans)
}
.beneficio-icono-sm img{
  width:42px;height:42px;
  object-fit:contain;
  display:block
}
.beneficio-item:hover .beneficio-icono-sm{
  background:transparent;
  transform:scale(1.05)
}

.beneficio-item h4{
  font-size:0.9rem;
  color:#0F1B2D;
  margin-bottom:0.18rem;
  font-family:var(--font-cuerpo);
  font-weight:700;
  line-height:1.25
}
.beneficio-item p{
  font-size:0.78rem;
  color:#7A8FA6;
  margin:0;
  line-height:1.45
}

/* ============================================
   MÉTRICAS — encabezado + stats
   ============================================ */
.metricas-encabezado{
  text-align:center;
  margin-bottom:3rem;
  max-width:780px;
  margin-left:auto;
  margin-right:auto
}
@keyframes metricaTituloIn{
  0%  {opacity:0;transform:translateY(36px) scale(0.96)}
  100%{opacity:1;transform:translateY(0)    scale(1)}
}
.metricas-encabezado h2{
  color:#FFFFFF;
  font-family:var(--font-cuerpo);
  font-weight:800;
  font-size:3.2rem;
  line-height:1.2;
  margin-bottom:1rem;
  letter-spacing:-1.5px;
  opacity:0
}
.metricas-encabezado.visible h2{
  animation:metricaTituloIn 0.9s cubic-bezier(0.22,1,0.36,1) 0.15s both
}
.metricas-encabezado p{
  color:rgba(255,255,255,0.65);
  font-size:0.95rem;
  line-height:1.7;
  margin:0
}

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

/* Tablet grande (1100px) — sigue en dos columnas, h1 un poco menor */
@media (max-width:1100px){
  .hero-nuevo-texto h1{font-size:3.2rem;letter-spacing:-2px}
  .hero-nuevo-texto-col{padding-right:2.5rem}
  .hero-botones{padding-left:4rem}
}

/* Tablet (1024px) — apila en una columna, imagen debajo */
@media (max-width:1024px){
  .hero-nuevo-layout{grid-template-columns:1fr;min-height:auto}
  .hero-nuevo-texto-col{
    padding:calc(var(--header-h) + 2rem) 2.5rem 2.5rem;
    text-align:center
  }
  .hero-nuevo-texto p{margin-left:auto;margin-right:auto;max-width:600px}
  .hero-botones{justify-content:center;padding-left:0;gap:1.5rem}
  .hero-nuevo-texto h1{font-size:3rem;letter-spacing:-1.5px}
  .hero-nuevo-imagen{height:400px}
  .beneficios-strip-grid{grid-template-columns:repeat(2,1fr)}
  .beneficio-item:nth-child(2){border-right:none}
  .beneficio-item:nth-child(3){border-right:1px solid #DDE3ED;padding-left:0}
  .beneficio-item:nth-child(1),.beneficio-item:nth-child(2){border-bottom:1px solid #DDE3ED;padding-bottom:1.2rem}
  .beneficio-item:nth-child(3),.beneficio-item:nth-child(4){padding-top:1.2rem}
}

/* Mobile grande (768px) */
@media (max-width:768px){
  .hero-nuevo-texto-col{padding:calc(var(--header-h) + 1.5rem) 1.5rem 2rem;text-align:center}
  .hero-nuevo-texto h1{font-size:2.4rem;letter-spacing:-1px}
  .hero-nuevo-texto p{font-size:1rem;max-width:100%}
  .hero-botones{flex-direction:column;align-items:center;gap:1rem;padding-left:0}
  .hero-botones .btn{width:100%;max-width:280px;text-align:center;justify-content:center}
  .hero-nuevo-imagen{height:260px}
  .beneficios-strip-grid{grid-template-columns:1fr 1fr;gap:0}
  .metricas-encabezado h2{font-size:2rem}
  .nav-menu.nav-oscuro{background:var(--azul-oscuro)}
  .nav-menu.nav-oscuro a{color:rgba(255,255,255,0.9)}
  .nav-menu.nav-oscuro a.active{color:var(--dorado)}
}

/* Mobile pequeño (480px) */
@media (max-width:480px){
  .hero-nuevo-texto h1{font-size:2rem;letter-spacing:-0.5px}
  .hero-nuevo-texto p{font-size:0.95rem}
  .hero-nuevo-imagen{height:220px}
  .hero-botones .btn{max-width:100%}
  .valores-grid{grid-template-columns:1fr}
  .metricas-grid{grid-template-columns:repeat(2,1fr);gap:1.5rem}
  .metrica{border-right:none;border-bottom:1px solid rgba(255,255,255,0.1);padding-bottom:1.2rem}
  .metrica:nth-child(odd){border-right:1px solid rgba(255,255,255,0.1)!important}
  .metrica:last-child,.metrica:nth-last-child(2):nth-child(odd){border-bottom:none}
  .metrica .numero{font-size:3rem}
  .footer{padding:1.2rem 0 0}
  .footer-grid{grid-template-columns:1fr 1fr;gap:0 0.75rem;margin-bottom:0.8rem}
  .footer-col-marca{grid-column:1/-1;padding-bottom:0.75rem;border-bottom:1px solid rgba(255,255,255,0.08)}
  .footer-grid .footer-col:last-child{display:none}
  .footer-logo{margin-bottom:0.4rem}
  .footer-logo img{height:34px}
  .footer-col-marca p{font-size:0.72rem;line-height:1.5}
  .footer-col:not(.footer-col-marca){padding:0.55rem 0}
  .footer-col h4{font-size:0.67rem;margin-bottom:0.4rem;letter-spacing:1px}
  .footer-col ul li{font-size:0.69rem;margin-bottom:0.2rem}
  .footer-contacto-lista li{font-size:0.69rem;margin-bottom:0.3rem;gap:0.32rem}
  .footer-bottom{padding:0.65rem 0;gap:0.4rem}
  .footer-bottom p{font-size:0.67rem}
  .footer-redes a{width:27px;height:27px}
  .beneficios-strip-grid{grid-template-columns:1fr 1fr}
  .beneficio-item:nth-child(2){border-right:none}
  .beneficio-item:nth-child(3){border-right:1px solid #DDE3ED}
  .beneficio-item:nth-child(1),.beneficio-item:nth-child(2){border-bottom:1px solid #DDE3ED;padding-bottom:1rem}
  .beneficio-item:nth-child(3),.beneficio-item:nth-child(4){padding-top:1rem;border-bottom:none}
}

/* ============================================
   FOOTER COMPACTO — MÓVIL (forzado al final)
   ============================================ */
@media(max-width:480px){
  footer.footer{padding:1rem 0 0!important}
  footer.footer .footer-grid{grid-template-columns:1fr 1fr!important;gap:0 0.7rem!important;margin-bottom:0.7rem!important}
  footer.footer .footer-col-marca{grid-column:1/-1!important;padding-bottom:0.65rem!important;border-bottom:1px solid rgba(255,255,255,0.08)!important}
  footer.footer .footer-col:last-child{display:none!important}
  footer.footer .footer-grid>.footer-col:nth-child(2){display:none!important}
  footer.footer .footer-logo{margin-bottom:0.35rem!important}
  footer.footer .footer-logo img{height:30px!important}
  footer.footer .footer-col-marca p{font-size:0.7rem!important;line-height:1.45!important}
  footer.footer .footer-col:not(.footer-col-marca){padding:0.5rem 0!important}
  footer.footer .footer-col h4{font-size:0.65rem!important;margin-bottom:0.35rem!important;letter-spacing:0.9px!important}
  footer.footer .footer-col ul li{font-size:0.67rem!important;margin-bottom:0.18rem!important}
  footer.footer .footer-contacto-lista li{font-size:0.67rem!important;margin-bottom:0.28rem!important;gap:0.3rem!important}
  footer.footer .footer-bottom{padding:0.6rem 0!important;gap:0.35rem!important}
  footer.footer .footer-bottom p{font-size:0.65rem!important}
  footer.footer .footer-redes a{width:26px!important;height:26px!important}
}

/* ============================================
   OVERFLOW FIX — BENEFICIOS Y MÉTRICAS MÓVIL
   ============================================ */
@media(max-width:480px){
  .beneficio-item{min-width:0;gap:0.45rem;padding:0.6rem 0}
  .beneficio-icono-sm{width:36px;height:36px;flex-shrink:0}
  .beneficio-icono-sm img{width:24px;height:24px}
  .beneficio-item h4{font-size:0.74rem;line-height:1.2}
  .beneficio-item p{font-size:0.65rem;line-height:1.35}
  .metrica{min-width:0;padding:0.9rem 0.2rem}
  .metrica .numero{font-size:2.1rem}
  .metrica .label{font-size:0.66rem;letter-spacing:1px;margin-top:0.35rem}
}

/* ============================================
   NOSOTROS — PRIMERA SECCIÓN (sin hero, full-width como index)
   ============================================ */
.seccion-primera-nosotros{
  padding:0;
  overflow:hidden
}
.seccion-primera-nosotros .nosotros-bloque{
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  gap:0;
  align-items:stretch;
  min-height:calc(var(--header-h) + 520px)
}
.seccion-primera-nosotros .nosotros-texto{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding-top:calc(var(--header-h) + 2.2rem);
  padding-bottom:2.5rem;
  padding-right:3.5rem;
  padding-left:calc(max(0px,(100vw - var(--max-w)) / 2) + 2rem)
}
.seccion-primera-nosotros .nosotros-texto h2{
  font-family:var(--font-cuerpo);
  font-size:2.8rem;
  font-weight:800;
  letter-spacing:-1.5px;
  line-height:1.15;
  margin-bottom:1.25rem;
  color:var(--azul-oscuro)
}
.seccion-primera-nosotros .nosotros-texto p{
  color:#374151;
  font-size:1.06rem;
  line-height:1.72;
  margin-bottom:1.8rem
}
.seccion-primera-nosotros .lista-check{
  grid-template-columns:1fr;
  gap:0.8rem;
  margin-top:1.5rem
}
.seccion-primera-nosotros .lista-check li{
  font-size:0.97rem;
  color:var(--gris-oscuro)
}
.seccion-primera-nosotros .nosotros-imagen{
  border-radius:0;
  box-shadow:none;
  overflow:hidden;
  position:relative
}
.seccion-primera-nosotros .nosotros-imagen::after{
  display:none
}
.seccion-primera-nosotros .nosotros-imagen img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  border-radius:0;
  box-shadow:none;
  display:block
}
@media(max-width:1024px){
  .seccion-primera-nosotros .nosotros-bloque{grid-template-columns:1fr;min-height:auto}
  .seccion-primera-nosotros .nosotros-imagen{order:-1;height:400px}
  .seccion-primera-nosotros .nosotros-texto{
    padding:2.5rem 2.5rem;
    text-align:left
  }
  .seccion-primera-nosotros .nosotros-texto h2{font-size:2.2rem;letter-spacing:-1px}
}
@media(max-width:768px){
  .seccion-primera-nosotros .nosotros-imagen{height:280px}
  .seccion-primera-nosotros .nosotros-texto{padding:2rem 1.5rem}
  .seccion-primera-nosotros .nosotros-texto h2{font-size:1.9rem;letter-spacing:-0.5px}
  .seccion-primera-nosotros .lista-check li{font-size:0.9rem}
}
@media(max-width:480px){
  .seccion-primera-nosotros .nosotros-imagen{height:220px}
  .seccion-primera-nosotros .nosotros-texto{padding:1.75rem 1.25rem}
  .seccion-primera-nosotros .nosotros-texto h2{font-size:1.65rem;letter-spacing:-0.3px}
  .seccion-primera-nosotros .nosotros-texto p{font-size:0.95rem}
}

/* ============================================
   MVV STRIP — diseño minimal con dividers
   ============================================ */
.mvv-seccion{padding-top:3rem;padding-bottom:3rem}

.mvv-strip{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border:1px solid var(--gris-borde);
  border-radius:var(--radio);
  overflow:hidden
}

.mvv-col{
  padding:2.5rem 2.8rem;
  border-right:1px solid var(--gris-borde);
  display:flex;
  flex-direction:column
}
.mvv-col:last-child{border-right:none}

.mvv-col-header{
  display:flex;
  align-items:center;
  gap:1rem;
  margin-bottom:1rem
}

.mvv-icon-circle{
  width:90px;height:90px;
  border-radius:50%;
  background:transparent;
  border:1.5px solid var(--gris-borde);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
  overflow:hidden
}
.mvv-icon-circle img{
  width:70px;height:70px;
  object-fit:contain;
  display:block
}

.mvv-col h3{
  font-family:var(--font-cuerpo);
  font-size:1.35rem;
  font-weight:700;
  color:var(--azul-oscuro);
  margin-bottom:0.85rem;
  letter-spacing:-0.3px
}

.mvv-col p{
  font-size:0.875rem;
  color:var(--gris-texto);
  line-height:1.65;
  margin-bottom:0
}

.mvv-valores-lista{
  display:flex;flex-direction:column;gap:0.45rem
}
.mvv-valores-lista li{
  font-size:0.92rem;
  color:var(--gris-texto);
  line-height:1.65;
  display:flex;
  align-items:center;
  gap:0.55rem
}
.mvv-valores-lista li::before{
  content:'';
  width:6px;height:6px;
  border-radius:50%;
  background:var(--dorado);
  flex-shrink:0
}

@media(max-width:768px){
  .mvv-seccion{padding-top:2rem;padding-bottom:2rem}
  .mvv-strip{grid-template-columns:1fr}
  .mvv-col{border-right:none;border-bottom:1px solid var(--gris-borde);padding:1.8rem 1.5rem}
  .mvv-col:last-child{border-bottom:none}
  .mvv-icon-circle{width:70px;height:70px}
  .mvv-icon-circle img{width:54px;height:54px}
  .mvv-col h3{font-size:1.2rem}
  .mvv-col-header{gap:0.85rem;margin-bottom:0.85rem}
}

/* ============================================
   SERVICIOS PAGE  (scroll layout — no sidebar)
   ============================================ */

.svc-page{
  padding-top:var(--header-h)
}

/* PAGE HEADER */
.svc-page-header{
  max-width:var(--max-w);
  margin:0 auto;
  padding:1.75rem 3rem 1rem
}

.svc-breadcrumb{
  display:flex;
  align-items:center;
  gap:0.4rem;
  font-size:0.8rem;
  color:var(--gris-texto);
  margin-bottom:1.25rem
}

.svc-breadcrumb a{color:var(--azul-medio);transition:color 0.15s}
.svc-breadcrumb a:hover{color:var(--azul-oscuro)}

.svc-page-header h1{
  font-family:var(--font-cuerpo);
  font-size:2rem;
  font-weight:800;
  color:var(--azul-oscuro);
  letter-spacing:-0.03em;
  margin-bottom:0;
  text-wrap:balance;
  text-align:center;
  animation:svc-titulo-compresion 0.9s cubic-bezier(0.16,1,0.3,1) both 0.1s
}

.svc-page-header h1::after{
  content:'';
  display:block;
  width:52px;
  height:3px;
  background:var(--dorado);
  border-radius:2px;
  margin:0.85rem auto 0.9rem;
  transform-origin:center;
  animation:svc-linea-dorada 0.55s cubic-bezier(0.16,1,0.3,1) both 0.7s
}

.svc-page-header>p{
  font-size:1rem;
  color:var(--gris-texto);
  max-width:58ch;
  line-height:1.65;
  text-align:center;
  margin:0 auto;
  animation:svc-subtitulo-entrada 0.6s ease both 0.95s
}

@keyframes svc-titulo-compresion{
  from{
    opacity:0;
    letter-spacing:0.18em;
    transform:translateY(-10px)
  }
  to{
    opacity:1;
    letter-spacing:-0.03em;
    transform:translateY(0)
  }
}

@keyframes svc-linea-dorada{
  from{transform:scaleX(0);opacity:0}
  to{transform:scaleX(1);opacity:1}
}

@keyframes svc-subtitulo-entrada{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}

@media(prefers-reduced-motion:reduce){
  .svc-page-header h1,
  .svc-page-header h1::after,
  .svc-page-header>p{
    animation:none
  }
}

/* SECTIONS */
.svc-section{
  background:white
}

.svc-section-alt{
  background:#F5F7FA
}

.svc-section-inner{
  max-width:var(--max-w);
  margin:0 auto;
  padding:4rem 3rem
}

/* Top divider between sections */
.svc-section+.svc-section,
.svc-section+.svc-section-alt,
.svc-section-alt+.svc-section{
  border-top:1px solid var(--gris-borde)
}

/* HERO: icon-box + info */
.svc-hero{
  display:grid;
  grid-template-columns:200px 1fr;
  gap:3.5rem;
  align-items:start;
  margin-bottom:3rem
}

/* ── FULL-BLEED HERO (texto izq alineado, imagen der al borde del viewport) ── */
.svc-fullbleed-hero{
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  gap:0;
  align-items:start;
  overflow:hidden
}

.svc-fullbleed-texto{
  display:grid;
  grid-template-columns:calc(max(160px,(100vw - var(--max-w)) / 2) + 4rem) 1fr;
  gap:0;
  align-items:center;
  align-self:center;
  padding:2rem 3.5rem 2rem 0
}

.svc-fullbleed-ico{
  width:230px;
  height:230px;
  justify-self:center;
  align-self:center;
  margin-top:-2rem;
  flex-shrink:0;
  opacity:0;
  transform:translateY(20px)
}

.svc-fullbleed-ico img{
  width:78%;
  height:auto
}

.svc-fullbleed-img{
  overflow:hidden;
  height:360px;
  clip-path:inset(0 100% 0 0)
}

.svc-fullbleed-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block
}

.svc-fullbleed-texto h2{
  font-family:var(--font-cuerpo);
  font-weight:800;
  letter-spacing:-0.03em;
  margin-bottom:0.9rem;
  text-wrap:balance;
  opacity:0;
  transform:translateY(20px)
}

.svc-fullbleed-texto .svc-info>p{
  font-size:0.925rem;
  color:var(--gris-texto);
  line-height:1.7;
  margin-bottom:1.5rem;
  max-width:65ch;
  opacity:0;
  transform:translateY(20px)
}

.svc-fullbleed-texto .svc-incluye-label{
  opacity:0;
  transform:translateY(20px)
}

.svc-fullbleed-texto .svc-incluye{
  grid-template-columns:repeat(2,1fr);
  opacity:0;
  transform:translateY(20px)
}

/* ── ANIMACIONES ACTIVADAS POR SCROLL ── */
.svc-in-view .svc-fullbleed-img{
  animation:svc-img-wipe 1s cubic-bezier(0.16,1,0.3,1) both 0.2s
}
.svc-in-view .svc-fullbleed-ico{
  animation:svc-elem-asciende 0.7s cubic-bezier(0.16,1,0.3,1) both 0.6s
}
.svc-in-view .svc-fullbleed-texto h2{
  animation:svc-elem-asciende 0.75s cubic-bezier(0.16,1,0.3,1) both 0.75s
}
.svc-in-view .svc-fullbleed-texto .svc-info>p{
  animation:svc-elem-asciende 0.65s cubic-bezier(0.16,1,0.3,1) both 0.95s
}
.svc-in-view .svc-fullbleed-texto .svc-incluye-label{
  animation:svc-elem-asciende 0.55s ease both 1.15s
}
.svc-in-view .svc-fullbleed-texto .svc-incluye{
  animation:svc-elem-asciende 0.6s ease both 1.3s
}

/* ── FULLBLEED INVERTIDO (foto izq, texto centro, ícono gutter der) ── */
.svc-fullbleed-hero-rev{
  grid-template-columns:0.9fr 1.1fr
}

.svc-fullbleed-texto-rev{
  grid-template-columns:1fr calc(max(160px,(100vw - var(--max-w)) / 2) + 4rem);
  padding:2rem 0 2rem 3.5rem
}

.svc-fullbleed-ico-rev{
  justify-self:center;
  align-self:center;
  margin-top:-2rem
}

.svc-hero-solo{
  padding-top:3rem;
  padding-bottom:3rem
}

@keyframes svc-img-wipe{
  from{clip-path:inset(0 100% 0 0)}
  to{clip-path:inset(0 0% 0 0)}
}

@keyframes svc-elem-asciende{
  from{opacity:0;transform:translateY(20px)}
  to{opacity:1;transform:translateY(0)}
}

@media(prefers-reduced-motion:reduce){
  .svc-fullbleed-img{
    clip-path:inset(0 0% 0 0);
    animation:none
  }
  .svc-fullbleed-ico,
  .svc-fullbleed-texto h2,
  .svc-fullbleed-texto .svc-info>p,
  .svc-fullbleed-texto .svc-incluye-label,
  .svc-fullbleed-texto .svc-incluye{
    opacity:1;
    transform:none;
    animation:none
  }
}

.svc-icon-box{
  background:#EDF1F7;
  border-radius:12px;
  aspect-ratio:1;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--azul-oscuro)
}

.svc-section-alt .svc-icon-box{
  background:#E8EDF3
}

.svc-info h2{
  font-family:var(--font-cuerpo);
  font-size:1.75rem;
  font-weight:800;
  color:var(--azul-oscuro);
  letter-spacing:-0.03em;
  margin-bottom:0.9rem;
  text-wrap:balance
}

.svc-info>p{
  font-size:0.925rem;
  color:var(--gris-texto);
  line-height:1.7;
  margin-bottom:1.5rem;
  max-width:65ch
}

.svc-incluye-label{
  font-family:var(--font-cuerpo);
  font-size:0.7rem;
  font-weight:700;
  color:var(--azul-oscuro);
  text-transform:uppercase;
  letter-spacing:1.5px;
  margin-bottom:0.75rem
}

.svc-incluye{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0.5rem 2rem;
  list-style:none
}

.svc-incluye li{
  display:flex;
  align-items:flex-start;
  gap:0.5rem;
  font-size:0.865rem;
  color:#374151;
  line-height:1.5
}

.svc-incluye li::before{
  content:'';
  width:18px;height:18px;
  flex-shrink:0;
  background:var(--dorado);
  border-radius:50%;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E") center/contain no-repeat
}

/* BENEFITS */
.svc-benefits{
  background:var(--azul-oscuro);
  border-radius:14px;
  padding:2.25rem 2.5rem;
  margin-bottom:2.5rem
}

.svc-section-alt .svc-benefits{
  background:var(--azul-medio)
}

.svc-benefits-label{
  font-family:var(--font-cuerpo);
  font-size:0.7rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:1.5px;
  color:var(--dorado);
  margin-bottom:1.5rem;
  text-align:center
}

.svc-benefits-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:2rem
}

.svc-ben-card{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:0.75rem
}

.svc-ben-ico{
  width:46px;height:46px;
  border-radius:12px;
  background:rgba(212,162,76,0.15);
  border:1px solid rgba(212,162,76,0.35);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
  color:var(--dorado)
}

.svc-ben-card h4{
  font-family:var(--font-cuerpo);
  font-size:0.845rem;
  font-weight:600;
  color:white;
  margin-bottom:0.3rem;
  line-height:1.35
}

.svc-ben-card p{
  font-size:0.8rem;
  color:rgba(255,255,255,0.72);
  margin:0;
  line-height:1.55
}

/* CTA ROW */
.svc-cta-row{
  display:flex;
  align-items:center;
  gap:1.5rem
}

.svc-cta-link{
  display:flex;
  align-items:center;
  gap:0.35rem;
  font-size:0.855rem;
  font-weight:500;
  color:var(--azul-medio);
  transition:color 0.15s
}

.svc-cta-link:hover{color:var(--azul-oscuro)}

/* MOBILE DROPDOWN NAV */
.svc-mobile-bar{
  display:none;
  position:sticky;
  top:var(--header-h);
  z-index:10;
  background:white;
  border-bottom:1px solid var(--gris-borde);
  padding:0.65rem 1.25rem
}

.svc-mobile-select{
  width:100%;
  font-family:var(--font-cuerpo);
  font-size:0.875rem;
  font-weight:500;
  color:var(--azul-oscuro);
  background:white;
  border:1.5px solid var(--gris-borde);
  border-radius:8px;
  padding:0.55rem 0.85rem;
  -webkit-appearance:none;
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230D2B3E' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 0.75rem center;
  background-size:16px;
  cursor:pointer
}

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  .svc-page-header{padding:2.5rem 2rem 1.5rem}
  .svc-section-inner{padding:3.5rem 2rem}
  .svc-hero{grid-template-columns:170px 1fr;gap:2.5rem}
  /* Fullbleed: gutter reducido en tablet */
  .svc-fullbleed-hero{grid-template-columns:1fr 1fr}
  .svc-fullbleed-hero-rev{grid-template-columns:1fr 1fr}
  .svc-fullbleed-texto{
    grid-template-columns:130px 1fr;
    padding:2.5rem 2rem 2.5rem 0
  }
  .svc-fullbleed-texto-rev{
    grid-template-columns:1fr 130px;
    padding:2.5rem 0 2.5rem 2rem
  }
  .svc-fullbleed-ico{width:130px;height:130px;margin-top:0}
  .svc-fullbleed-ico-rev{margin-top:0}
  .svc-fullbleed-img{height:320px}
  .svc-benefits-grid{grid-template-columns:repeat(2,1fr);gap:1.25rem}
  .svc-ben-card:last-child{grid-column:1/-1;max-width:320px;margin:0 auto}
}

@media(max-width:768px){
  .svc-mobile-bar{display:block}
  .svc-page-header{padding:2rem 1.25rem 1rem}
  .svc-page-header h1{font-size:1.5rem}
  .svc-section-inner{padding:2rem 1.25rem}

  /* Fullbleed: apilado vertical en móvil */
  .svc-fullbleed-hero,
  .svc-fullbleed-hero-rev{
    grid-template-columns:1fr;
    min-height:auto
  }
  .svc-fullbleed-img{
    height:240px;
    order:-1;
    clip-path:none !important
  }
  /* Texto: una sola columna sin gutter */
  .svc-fullbleed-texto,
  .svc-fullbleed-texto-rev{
    grid-template-columns:1fr;
    padding:1.75rem 1.25rem 2rem;
    align-self:auto
  }
  /* Ocultar ícono-gutter en móvil (redundante sin el gutter) */
  .svc-fullbleed-ico,
  .svc-fullbleed-ico-rev{
    display:none
  }
  /* Lista de dos columnas → una sola */
  .svc-fullbleed-texto .svc-incluye{
    grid-template-columns:1fr
  }

  .svc-hero{grid-template-columns:1fr;gap:1.5rem}
  .svc-icon-box{width:110px;aspect-ratio:1}
  .svc-info h2{font-size:1.35rem}
  .svc-incluye{grid-template-columns:1fr}
  .svc-benefits-grid{grid-template-columns:1fr;gap:1.5rem}
  .svc-benefits{padding:1.5rem 1.25rem}
  .svc-cta-row{flex-direction:column;align-items:flex-start;gap:0.75rem}
}

@media(max-width:480px){
  .svc-fullbleed-img{height:200px}
  .svc-fullbleed-texto,
  .svc-fullbleed-texto-rev{padding:1.5rem 1rem 1.75rem}
  .svc-info h2{font-size:1.2rem}
  .svc-page-header h1{font-size:1.3rem}
  .svc-benefits{padding:1.25rem 1rem}
}

/* ══════════════════════════════════════════
   COTIZACIÓN PAGE
══════════════════════════════════════════ */
.cot-breadcrumb{
  background:white;
  border-bottom:1px solid var(--gris-borde);
  padding:0.65rem 0
}
.cot-breadcrumb-inner{
  max-width:var(--max-w);
  margin:0 auto;
  padding:0 3rem;
  display:flex;
  align-items:center;
  gap:0.5rem;
  font-size:0.8rem;
  color:var(--gris-texto)
}
.cot-breadcrumb-inner a{
  color:var(--azul-medio);
  text-decoration:none
}
.cot-breadcrumb-inner a:hover{color:var(--azul-oscuro)}

.cot-page{
  background:#F5F7FA;
  padding:3rem 3rem 2rem
}

.cot-wrap{
  max-width:var(--max-w);
  margin:0 auto;
  display:grid;
  grid-template-columns:340px 1fr;
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 4px 48px rgba(13,43,62,0.10)
}

/* Panel izquierdo azul */
.cot-panel{
  background:var(--azul-oscuro);
  padding:3rem 2.5rem;
  display:flex;
  flex-direction:column;
  gap:2rem
}
.cot-panel h2{
  font-family:var(--font-titulo);
  font-size:1.9rem;
  font-weight:700;
  color:white;
  line-height:1.2;
  margin-bottom:0.75rem
}
.cot-panel>div>p{
  font-size:0.875rem;
  color:rgba(255,255,255,0.72);
  line-height:1.65
}
.cot-checks{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:1rem
}
.cot-checks li{
  display:flex;
  align-items:center;
  gap:0.75rem;
  font-size:0.875rem;
  font-weight:500;
  color:rgba(255,255,255,0.92)
}
.cot-checks li svg{
  flex-shrink:0;
  color:var(--dorado)
}
.cot-panel-contacto{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:1.25rem
}
.cot-panel-contacto li{
  display:flex;
  align-items:flex-start;
  gap:0.9rem
}
.cot-panel-ico{
  width:36px;
  height:36px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(212,162,76,0.15);
  border-radius:8px;
  color:var(--dorado)
}
.cot-panel-contacto li div:last-child{
  display:flex;
  flex-direction:column;
  gap:0.15rem
}
.cot-panel-contacto li strong{
  font-size:0.72rem;
  font-weight:600;
  color:var(--dorado);
  text-transform:uppercase;
  letter-spacing:0.06em
}
.cot-panel-contacto li span{
  font-size:0.875rem;
  color:rgba(255,255,255,0.82);
  line-height:1.45;
  word-break:break-word;
  overflow-wrap:break-word
}

/* Área del formulario */
.cot-form-area{
  background:white;
  padding:2.75rem 3rem
}
.form-success#cot-success{
  display:none;
  align-items:center;
  gap:0.75rem;
  background:#f0fdf4;
  border:1px solid #86efac;
  color:#166534;
  border-radius:10px;
  padding:1rem 1.25rem;
  font-size:0.875rem;
  margin-bottom:1.5rem
}
.form-success#cot-success.activo{display:flex}

.cot-form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.25rem;
  margin-bottom:1.25rem
}
.cot-form-group{
  display:flex;
  flex-direction:column;
  gap:0.4rem
}
.cot-form-group label{
  font-size:0.78rem;
  font-weight:600;
  color:var(--azul-oscuro);
  letter-spacing:0.01em
}
.cot-form-group input,
.cot-form-group select,
.cot-form-group textarea{
  border:1.5px solid var(--gris-borde);
  border-radius:8px;
  padding:0.65rem 0.9rem;
  font-family:var(--font-cuerpo);
  font-size:0.875rem;
  color:var(--azul-oscuro);
  background:white;
  transition:border-color 0.15s;
  outline:none;
  width:100%
}
.cot-form-group input:focus,
.cot-form-group select:focus,
.cot-form-group textarea:focus{
  border-color:var(--azul-medio)
}
.cot-form-group input::placeholder,
.cot-form-group textarea::placeholder{
  color:#9faab5
}
.cot-form-group textarea{
  min-height:110px;
  resize:vertical
}
.cot-form-group select{
  appearance:none;
  -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230D2B3E' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 0.75rem center;
  background-size:16px;
  cursor:pointer
}
.cot-btn{
  display:inline-block;
  padding:0.85rem 2.25rem;
  background:var(--dorado);
  color:white;
  border:none;
  border-radius:8px;
  font-family:var(--font-cuerpo);
  font-size:0.9rem;
  font-weight:600;
  cursor:pointer;
  transition:background 0.2s, transform 0.15s;
  letter-spacing:0.01em
}
.cot-btn:hover{
  background:#c4922e;
  transform:translateY(-1px)
}

/* Sección info: ubicación, teléfono, email, horario */
.cot-info-section{
  background:#F5F7FA;
  padding:2rem 3rem 4rem
}
.cot-info-wrap{
  max-width:var(--max-w);
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1.25rem
}
.cot-info-card{
  background:white;
  border-radius:12px;
  border:1px solid var(--gris-borde);
  padding:1.75rem 1.5rem;
  display:flex;
  flex-direction:column;
  gap:0.85rem
}
.cot-info-icon{
  width:44px;height:44px;
  background:rgba(212,162,76,0.12);
  border:1px solid rgba(212,162,76,0.3);
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--dorado);
  flex-shrink:0
}
.cot-info-card h4{
  font-family:var(--font-cuerpo);
  font-size:0.855rem;
  font-weight:700;
  color:var(--azul-oscuro);
  margin:0
}
.cot-info-card p{
  font-size:0.82rem;
  color:var(--gris-texto);
  line-height:1.6;
  margin:0
}

/* RESPONSIVE COTIZACIÓN */
@media(max-width:1024px){
  .cot-page{padding:2.5rem 2rem 1.75rem}
  .cot-wrap{grid-template-columns:280px 1fr}
  .cot-panel{padding:2.5rem 2rem}
  .cot-form-area{padding:2.5rem 2rem}
  .cot-info-section{padding:1.75rem 2rem 3rem}
  .cot-info-wrap{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .cot-breadcrumb-inner{padding:0 1.25rem}
  .cot-page{padding:1.5rem 1.25rem 1.25rem}
  .cot-form-row{grid-template-columns:1fr}
  .cot-info-section{padding:1.25rem 1.25rem 3rem}
  .cot-info-wrap{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .cot-wrap{grid-template-columns:1fr}
  .cot-panel{padding:2rem 1.5rem;gap:1.5rem}
  .cot-panel h2{font-size:1.5rem}
  .cot-form-area{padding:2rem 1.5rem}
}
@media(max-width:480px){
  .cot-info-wrap{grid-template-columns:1fr}
}

/* ── INDEX: logo en hero + nav centrada (solo tablet/desktop) ── */
.hero-logo-grande{
  display:none
}

@media(min-width:769px){
  /* Oculta logo de navbar solo en index */
  .page-index .header .logo{
    display:none
  }
  /* Centra la nav al quedarse sola */
  .page-index .header .container{
    justify-content:center
  }
  /* Logo grande en el hero */
  .hero-logo-grande{
    display:block;
    width:200px;
    margin-bottom:0;
    mix-blend-mode:multiply
  }
}

/* ── Hero logo + "Soluciones" en fila ── */
.hero-logo-row{
  display:flex;
  align-items:flex-end;
  gap:1.1rem;
  margin-bottom:0.6rem
}
.hero-sol-word{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-weight:800;
  font-size:3.8rem;
  line-height:1;
  letter-spacing:-2px;
  color:#111827
}

/* "Corporativas" centrada y separada de la línea anterior */
.page-index .hero-nuevo-texto h1 .h1-linea-1{display:block}
.page-index .hero-nuevo-texto h1 .h1-linea-2{display:block;text-align:center;margin-top:0.55rem}
.page-index .hero-nuevo-texto h1 .marca-3{display:inline}


/* Responsive: logo oculto en mobile, fila se apila */
@media(max-width:1024px){
  .hero-sol-word{ font-size:3rem; letter-spacing:-1.5px }
}
@media(max-width:768px){
  .hero-logo-row{ flex-direction:column; align-items:center; gap:0.75rem }
  .hero-logo-grande{ width:160px !important }
  .hero-sol-word{ font-size:2.4rem; letter-spacing:-1px }
}

/* ── Animación entrada logo hero ── */
@keyframes logoEntrada{
  0%{
    opacity:0;
    transform:translateY(24px) scale(0.88);
    filter:blur(8px) drop-shadow(0 0 0 rgba(212,162,76,0))
  }
  55%{
    opacity:1;
    transform:translateY(-4px) scale(1.02);
    filter:blur(0) drop-shadow(0 0 0 rgba(212,162,76,0))
  }
  72%{
    transform:translateY(0) scale(1);
    filter:blur(0) drop-shadow(0 0 20px rgba(212,162,76,0.55))
  }
  100%{
    opacity:1;
    transform:translateY(0) scale(1);
    filter:blur(0) drop-shadow(0 0 8px rgba(212,162,76,0.18))
  }
}

.hero-logo-grande{
  animation:logoEntrada 1.15s cubic-bezier(0.22,1,0.36,1) 0.1s both
}

@media(prefers-reduced-motion:reduce){
  .hero-logo-grande{ animation:none; opacity:1 }
}