/* =====================================================
   Web360 — Rediseño "Forma / Grid"
   Geometría plana estilo Bauhaus-Swiss: bloques, círculos,
   cuadrantes, líneas finas y tipografía condensada pesada.
   Paleta: blanco, grises claros y #0066FF (texto en casi-negro).
   Se carga DESPUÉS de style.css. Solo diseño: no toca textos,
   headings, links ni atributos SEO.
   ===================================================== */

:root {
  --ink: #111214;
  --white: #FFFFFF;
  --g1: #F5F5F5;
  --g2: #EBEBEB;
  --g3: #DADADA;
  --g4: #9B9B9B;
  --blue: #0066FF;
  --blue-dark: #0052CC;
  --blue-darker: #003D99;
  --blue-light: #4D94FF;
  --orange: #0066FF;
  --orange-light: #4D94FF;
  --zinc-50: #F5F5F5;
  --zinc-100: #EBEBEB;
  --zinc-200: #DADADA;
  --zinc-400: #9B9B9B;
  --zinc-500: #6B6B6B;
  --zinc-600: #4A4A4A;
  --zinc-700: #333333;
  --zinc-900: #111214;
  --display: 'Archivo', 'Inter', system-ui, sans-serif;
}

/* ── Base ── */
body { background: var(--white); color: var(--ink); }
::selection { background: var(--blue); color: #fff; }

h1, h2, .section-title {
  font-family: var(--display); font-stretch: 70%; font-weight: 850;
  letter-spacing: -.012em; line-height: .94; color: var(--ink);
}
h3, h4 { font-family: var(--display); font-stretch: 78%; font-weight: 800; letter-spacing: -.015em; }
.section-title { font-size: clamp(2.8rem, 6.4vw, 5.4rem); }
.text-blue, .text-orange { color: var(--blue) !important; }

/* Etiquetas: texto tracking + línea */
.section-label, .cta-badge {
  display: inline-flex; align-items: center; gap: .5rem;
  background: transparent !important; border: 0 !important; box-shadow: none;
  border-radius: 0; padding: 0; color: var(--ink) !important;
  font-size: .72rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
}
.section-label svg { color: var(--blue); }

/* ── Botones ── */
.btn-primary-w360, .btn-submit {
  background: var(--blue); color: #fff; border-radius: 0; box-shadow: none;
  text-transform: uppercase; letter-spacing: .1em; font-size: .85rem; font-weight: 800;
}
.btn-primary-w360:hover, .btn-submit:hover { background: var(--ink); color: #fff; transform: none; }
.btn-outline-w360 { background: transparent; border: 1.5px solid var(--ink); border-radius: 0; color: var(--ink); text-transform: uppercase; letter-spacing: .1em; font-size: .85rem; }
.btn-outline-w360:hover { background: var(--ink); color: #fff; }

/* ── Navbar ── */
#navbar { background: #fff; backdrop-filter: none; border-bottom: 1px solid var(--ink); }
#navbar .nav-link { font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ink); }
#navbar .nav-link:hover, #navbar .nav-link.active { color: var(--blue); }
.btn-contact-nav {
  background: var(--blue); border-radius: 0; box-shadow: none;
  font-size: .7rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; padding: .9rem 1.4rem;
}
.btn-contact-nav::after { content: ' \2192'; }
.btn-contact-nav:hover { background: var(--ink); }
.services-dropdown .dropdown-menu { background: #fff; border: 1px solid var(--ink); border-radius: 0; box-shadow: none; padding: 0; }
.services-dropdown .dropdown-item { color: var(--ink); font-weight: 700; padding: .7rem 1.2rem; border-bottom: 1px solid var(--g2); }
.services-dropdown .dropdown-item:hover { background: var(--blue); color: #fff; }
.w360-panel { background: #fff; }
.w360-nav-list > li > a, .w360-submenu-toggle { font-family: var(--display); font-stretch: 78%; text-transform: uppercase; }
.w360-panel-cta { background: var(--blue); border-radius: 0; }

/* ═════════════ HERO (home) ═════════════ */
#hero.hv2 { background: #fff; padding: calc(35px + 3.4rem) 0 3rem; position: relative; overflow: hidden; }
#hero.hv2::before, #hero.hv2::after { display: none; }

/* Formas decorativas */
.hv2-shape { position: absolute; pointer-events: none; display: block; }
.hv2-shape-half { left: 33%; top: 150px; width: 400px; height: 400px; border-radius: 50%; background: var(--g2); z-index: 0; }
.hv2-shape-disc { width: 78%; aspect-ratio: 1; border-radius: 50%; background: var(--g2); right: -14%; bottom: -26%; z-index: 0; }
.hv2-shape-quarter { width: 90px; height: 90px; background: #fff; border-radius: 0 0 0 100%; right: 0; top: 0; z-index: 2; }

.hv2-top { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--ink); padding: 1.1rem 0 .95rem; margin-bottom: 2.6rem; }
.hv2-badge { font-size: .74rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--ink); }
.hv2-badge::before { content: none; color: var(--blue); }
.hv2-top::after { content: ''; width: 12px; height: 12px; border-radius: 50%; background: var(--blue); }

.hv2-title {
  font-family: var(--display); font-stretch: 70%; font-weight: 900;
  font-size: clamp(3rem, 6.9vw, 6.2rem); line-height: .88; letter-spacing: -.012em;
  color: var(--ink); margin: 0 0 2.4rem; text-transform: none;
}
.hv2-mark { color: var(--blue); }

.hv2-lead { z-index: 1; display: flex; flex-direction: column; position: relative; padding-left: 1.4rem; border-left: 1px solid var(--ink); margin-top: auto; max-width: 34rem; }
.hv2-dot { position: absolute; left: -9px; bottom: -2px; width: 18px; height: 18px; border-radius: 50%; background: var(--blue); }
.hv2-tagline { font-family: 'Caveat', cursive; font-size: 2.3rem; font-weight: 700; line-height: 1; color: var(--blue); margin: 0 0 1rem; display: block; }
.hv2-desc { font-size: 1.05rem; line-height: 1.7; color: #2b2b2e; margin: 0 0 .6rem; padding: 0; border: 0; max-width: 32rem; }
.hv2-desc::before { display: none; }

/* Panel azul con el video */
.hv2-panel { position: relative; background: var(--blue); padding: 34px; overflow: hidden; flex: 1 1 auto; display: flex; flex-direction: column; justify-content: flex-start; min-height: 420px; }
.hv2-panel .hv2-video-frame { width: 100%; }
.hv2-video-frame { position: relative; z-index: 1; border-radius: 0 150px 0 0; overflow: hidden; background: #000; transform: none; padding: 0; box-shadow: none; }
.hv2-video-frame::before { display: none; }
.hv2-video-frame video { display: block; width: 100%; border: 0; border-radius: 0; }
.hv2-panel .hv2-shape-disc { background: #fff; width: 46%; right: auto; left: -14%; bottom: -22%; opacity: .16; }
.hv2-panel .hv2-shape-quarter { display: none; }

.hv2-partners { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 14px; padding: 22px 26px; background: var(--g2); margin-top: 0; border-radius: 0; box-shadow: none; }
.hv2-partners { flex-wrap: nowrap !important; gap: 10px !important; padding-left: 18px !important; padding-right: 18px !important; }
.hv2-partners img { height: auto; max-height: 58px; width: auto; flex: 0 1 auto; min-width: 0; max-width: 31%; object-fit: contain; filter: none; mix-blend-mode: multiply; }
.hv2-pdiv { flex: 0 0 1px; }
.hv2-pdiv { width: 1px; height: 40px; background: var(--g4); }

/* Chips */
.hv2-chips { display: flex; flex-wrap: nowrap; gap: 10px; margin: 3rem 0 .5rem; padding: 0; overflow-x: auto; border-top: 1px solid var(--ink); padding-top: 1.4rem; }
.hv2-chip {
  display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0; white-space: nowrap;
  padding: .65rem 1.2rem; border: 1.5px solid var(--ink); border-radius: 999px; background: #fff; color: var(--ink);
  font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; text-decoration: none;
  box-shadow: none; transform: none !important; transition: background .2s, color .2s, border-color .2s;
}
.hv2-chip:hover { background: var(--blue); border-color: var(--blue); color: #fff; }
.hv2-chip .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--blue) !important; }
.hv2-chip:hover .dot { background: #fff !important; }

/* Logos de clientes */
.hv2-logos-band { position: relative; margin-top: 3rem; padding: 34px 0 14px; background: var(--g1); border: 0; border-radius: 0; box-shadow: none; overflow: visible; }
.hv2-logos-band .logo-track { overflow: hidden; border-radius: 0; }
.hv2-logos-label { position: absolute; top: 0; left: 0; margin: 0; background: var(--ink); color: #fff; border-radius: 0; font-size: .66rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; padding: 8px 16px; box-shadow: none; transform: none; white-space: nowrap; }
.logo-slide img { filter: grayscale(1) contrast(1.2); opacity: .75; }
.hv2-logos-band .logo-track { mix-blend-mode: multiply; }

/* Stats: celdas de color */
.hv2-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin: 0 0 1.5rem; padding: 0; background: var(--g2); border-radius: 0; box-shadow: none; }
.hv2-stat { background: transparent; border: 0; border-radius: 0; box-shadow: none; padding: 34px 26px 30px; text-align: left; position: relative; }
.hv2-stat + .hv2-stat { border-left: 1px solid var(--g4); }
.hv2-stat:nth-child(2) { background: var(--blue); border-left-color: var(--blue); }
.hv2-stat:nth-child(3) { border-left-color: var(--blue); }
.hv2-stat-value { font-family: var(--display); font-stretch: 66%; font-weight: 900; font-size: clamp(3rem, 6vw, 5.4rem); line-height: .85; letter-spacing: -.03em; color: var(--blue); margin-bottom: .6rem; }
.hv2-stat-label { font-size: .7rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--ink); }
.hv2-stat:nth-child(2) .hv2-stat-value, .hv2-stat:nth-child(2) .hv2-stat-label { color: #fff; }

/* ═════════════ SERVICIOS ═════════════ */
#servicios, #que-hacemos, #casos, #crecimiento { background: #fff; }
#servicios .hv2-svc-eyebrow { display: flex; width: 100%; align-items: center; gap: 8px; margin-bottom: 1.4rem; padding: 0 0 .95rem; border-bottom: 1px solid var(--ink); background: transparent; box-shadow: none; transform: none; font-size: .74rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--ink); }
#servicios .hv2-svc-eyebrow::before { content: none; color: var(--blue); }
#servicios .hv2-svc-eyebrow .dot { display: none; }
#servicios .mb-5 { max-width: none !important; }
#servicios .hv2-svc-mark { background: none; padding: 0; margin: 0; color: var(--blue); }
#servicios .row.g-4 { --bs-gutter-x: 0; --bs-gutter-y: 0; border-top: 1px solid var(--ink); }

.hv2-svc-card {
  position: relative; display: block; height: 100%; background: #fff; border: 0;
  border-bottom: 1px solid var(--ink); border-right: 1px solid var(--ink); border-radius: 0;
  padding: 2.4rem 2rem 2.2rem; box-shadow: none; transition: background .25s, color .25s;
}
#servicios .row > div:nth-child(3n+1) .hv2-svc-card { border-left: 1px solid var(--ink); }
.hv2-svc-card:hover { background: var(--blue); transform: none; box-shadow: none; }
.hv2-svc-card:hover h3, .hv2-svc-card:hover p, .hv2-svc-card:hover .hv2-svc-link, .hv2-svc-card:hover .hv2-svc-num, .hv2-svc-card:hover h3 span { color: #fff !important; }
.hv2-svc-card:hover .hv2-svc-link { border-color: #fff; }
.hv2-svc-num { position: absolute; top: 24px; right: 26px; font-family: var(--display); font-stretch: 66%; font-weight: 850; font-size: 2.4rem; line-height: 1; color: var(--blue); letter-spacing: -.02em; }
/* Íconos: formas geométricas planas */
.hv2-svc-icon { width: 64px; height: 64px; margin-bottom: 1.8rem; border: 0 !important; transform: none !important; background: var(--blue) !important; box-shadow: none !important; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: background .25s, border-radius .3s; }
#servicios .row > div:nth-child(3n+2) .hv2-svc-icon { border-radius: 0; }
#servicios .row > div:nth-child(3n+3) .hv2-svc-icon { border-radius: 50% 50% 0 0; }
.hv2-svc-card:hover .hv2-svc-icon { background: #fff !important; }
.hv2-svc-card:hover .hv2-svc-icon svg { stroke: var(--blue); }
.hv2-svc-icon svg { filter: none; }
.hv2-svc-card h3 { font-size: 1.7rem; font-weight: 850; line-height: .95; color: var(--ink); margin-bottom: .8rem; text-transform: none; }
.hv2-svc-card h3 span { color: var(--blue) !important; font-size: .6em !important; }
.hv2-svc-card p { color: var(--zinc-600); }
.hv2-svc-link { color: var(--ink); border-bottom: 2px solid var(--ink); font-size: .7rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; padding: 0 0 2px; }

/* ═════════════ CASOS ═════════════ */
.case-card { background: var(--g1); border: 0; border-radius: 0; box-shadow: none; border-top: 1px solid var(--ink); transition: background .3s; }
.case-card:hover { background: var(--g2); border: 0; border-top: 1px solid var(--ink); box-shadow: none; }
.case-img { border-radius: 0 120px 0 0; box-shadow: none; background: var(--g2) !important; }
.case-img > div { background: var(--g2) !important; border-radius: 0 !important; }
.case-industry-badge { background: var(--ink); color: #fff; border-radius: 0; box-shadow: none; letter-spacing: .16em; }
.case-industry-badge svg { stroke: #fff; }
.case-metric-value { font-family: var(--display); font-stretch: 66%; font-weight: 900; font-size: 2.6rem; color: var(--blue); letter-spacing: -.03em; }
.case-metric-label { letter-spacing: .14em; color: var(--ink); }
.testimonial-quote { border-left: 3px solid var(--blue); }
.case-card h3, .case-card .fw-black { font-family: var(--display); font-stretch: 78%; }
.case-card div[style*="border-radius:14px"][style*="text-align:center"] { background: var(--blue) !important; border: 0 !important; border-radius: 0 !important; box-shadow: none; }
.case-card div[style*="border-radius:14px"][style*="text-align:center"] div { color: #fff !important; }
.case-card span[style*="border-radius:999px"], .case-card div[style*="border-radius:8px"] { background: #fff !important; border: 1px solid var(--ink) !important; color: var(--ink) !important; box-shadow: none; border-radius: 0 !important; }
.case-card a[style*="color:#0066FF"] { color: var(--blue) !important; }
.case-card a[href*="wa.me"] { background: var(--blue) !important; border-radius: 0 !important; box-shadow: none !important; }

/* ═════════════ EXPERIENCIA / BLOG ═════════════ */
section[style*="linear-gradient(to bottom,#fff,#fafafa)"] { background: #fff !important; }
.stat-box { background: var(--g1); border: 0; border-radius: 0; border-top: 1px solid var(--ink); box-shadow: none; }
.stat-box .stat-value { font-family: var(--display); font-stretch: 66%; font-weight: 900; font-size: 3rem; line-height: .9; color: var(--blue); letter-spacing: -.03em; }
.stat-box .stat-label { letter-spacing: .14em; text-transform: uppercase; font-size: .7rem; color: var(--ink); }
.experience-img-wrapper { border: 0; border-radius: 0 0 220px 0; background: var(--blue); box-shadow: none; }
.experience-img-wrapper img { filter: none; }

section[style*="background:#fafafa"] { background: var(--g1) !important; border-top: 1px solid var(--ink) !important; }
section[style*="background:#fafafa"] a[style*="border:1px solid #e4e4e7"] { background: #fff !important; border: 0 !important; border-top: 1px solid var(--ink) !important; border-radius: 0 !important; box-shadow: none; transition: background .25s !important; }
section[style*="background:#fafafa"] a[style*="border:1px solid #e4e4e7"]:hover { background: var(--blue) !important; box-shadow: none !important; }
section[style*="background:#fafafa"] a[style*="border:1px solid #e4e4e7"]:hover * { color: #fff !important; }
section[style*="background:#fafafa"] div[style*="width:72px"] { background: var(--blue) !important; border-radius: 50% !important; }
section[style*="background:#fafafa"] div[style*="width:72px"] svg { stroke: #fff !important; }

/* ═════════════ CONTACTO ═════════════ */
#contacto { background: var(--blue); padding: 8rem 0; position: relative; overflow: hidden; }
#contacto::before { content: ''; position: absolute; inset: auto; right: -160px; top: -160px; width: 520px; height: 520px; border-radius: 50%; background: rgba(255,255,255,.14); background-image: none; }
#contacto::after { content: ''; position: absolute; left: -90px; bottom: -90px; width: 260px; height: 260px; background: #fff; border-radius: 0 100% 0 0; opacity: .16; }
#contacto h2 { color: #fff; font-size: clamp(3rem, 7vw, 6.4rem); }
.cta-badge { color: #fff !important; }
.contact-form-box { background: #fff; border-radius: 0; padding: 3rem; box-shadow: none; }
.contact-form-box label { font-size: .7rem; letter-spacing: .16em; text-transform: uppercase; color: var(--ink); font-weight: 800; }
.contact-form-box .form-control, .contact-form-box .form-select { background: var(--g1); border: 0; border-bottom: 2px solid var(--ink); border-radius: 0; box-shadow: none; }
.contact-form-box .form-control:focus, .contact-form-box .form-select:focus { border-bottom-color: var(--blue); box-shadow: none; background: #fff; }
.btn-submit { background: var(--ink); }
.btn-submit:hover { background: var(--blue); }
#contacto svg[stroke="#FF6B35"] { stroke: #fff; }

/* ═════════════ FOOTER ═════════════ */
footer { background: var(--g2); color: var(--ink); border-top: 1px solid var(--ink); }
footer h4 { font-family: 'Inter', sans-serif; font-stretch: 100%; font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: var(--blue); }
footer .footer-link, footer .footer-desc, .footer-copy, .footer-legal-link { color: #3a3a3d; }
footer .footer-link:hover, .footer-legal-link:hover { color: var(--blue); }
footer svg[stroke="#0066FF"] { stroke: var(--blue); }
.footer-divider { border-top: 1px solid var(--ink); }
.social-btn { background: var(--ink); border-radius: 50%; color: #fff; box-shadow: none; }
.social-btn:hover { background: var(--blue); }

/* ═════════════ SUBPÁGINAS ═════════════ */
.service-page-hero, .service-hero, .page-top { background: #fff !important; }
.hero-badge { background: none; border: 0; border-bottom: 1px solid var(--ink); border-radius: 0; box-shadow: none; padding: 0 0 .9rem; color: var(--ink); font-size: .74rem; letter-spacing: .2em; text-transform: uppercase; font-weight: 700; }
.hero-title { font-family: var(--display); font-stretch: 66%; font-weight: 900; letter-spacing: -.012em; color: var(--ink); }
.hero-title .gradient-text { background: none; -webkit-text-fill-color: var(--blue); color: var(--blue); }
.hero-stat-value { font-family: var(--display); font-stretch: 66%; color: var(--blue); }
.service-article h2 { font-family: var(--display); font-stretch: 70%; font-weight: 850; letter-spacing: -.02em; font-size: 2.2rem; line-height: .95; }
.por-que-web360, .proceso-trabajo, .section-alt { background: transparent !important; }
.diferenciador, .paso-contenido, .method-card, .growth-card, .partner-chip { background: var(--g1) !important; border: 0 !important; border-top: 1px solid var(--ink) !important; border-radius: 0 !important; box-shadow: none; }
.paso-numero, .growth-icon-box, .method-icon { background: var(--blue) !important; box-shadow: none !important; color: #fff; border-radius: 50% !important; }
#metodologia { background: var(--g2); color: var(--ink); }
#metodologia h2, #metodologia h3, #metodologia p { color: var(--ink) !important; }
.service-hero-glow { background: rgba(0,102,255,.14) !important; filter: none; border-radius: 50%; }

/* Etiqueta superior de cada hero */
body .nosotros-hero .section-tag, body .equipo-hero .section-tag, body .empleos-hero .badge-tag,
body .comparativa-hero .section-eyebrow, body .service-hero .hero-badge, body #hero.page-top .hero-badge {
  display: flex !important; align-items: center; justify-content: flex-start; gap: .5rem; width: 100%; max-width: 100%;
  background: none !important; border: 0 !important; border-bottom: 1px solid var(--ink) !important; border-radius: 0 !important; box-shadow: none !important;
  padding: 0 0 .95rem !important; margin: 0 0 2.2rem !important; color: var(--ink) !important;
  font-size: .74rem !important; font-weight: 700 !important; letter-spacing: .2em !important; text-transform: uppercase;
}
body .nosotros-hero .section-tag::before, body .equipo-hero .section-tag::before, body .empleos-hero .badge-tag::before,
body .comparativa-hero .section-eyebrow::before, body .service-hero .hero-badge::before, body #hero.page-top .hero-badge::before { content: none; color: var(--blue); order: -1; }
body .empleos-hero .badge-tag svg { order: 5; margin-left: auto; color: var(--blue); }

body .nosotros-hero, body .equipo-hero, body .empleos-hero, body .comparativa-hero,
body .service-hero, body #hero.page-top, body .page-header { background: #fff !important; color: var(--ink) !important; text-align: left !important; }
body .empleos-hero::before { display: none; }
body .nosotros-hero, body .equipo-hero, body .empleos-hero, body .comparativa-hero { padding: calc(35px + 3.4rem) 0 3rem !important; }
body .nosotros-hero .text-center { text-align: left !important; }
body .nosotros-hero .justify-content-center { justify-content: flex-start !important; }
body .nosotros-hero .col-lg-8, body .nosotros-hero .col-lg-10 { flex: 0 0 100%; max-width: 100%; }

body .nosotros-hero h1, body .equipo-hero h1, body .empleos-hero h1, body .comparativa-hero h1,
body #hero.page-top .hero-title, body .page-header h1 {
  font-family: var(--display) !important; font-stretch: 66%; font-weight: 900 !important;
  font-size: clamp(3.4rem, 9vw, 8rem) !important; line-height: .86 !important; letter-spacing: -.012em !important;
  color: var(--ink) !important; text-align: left !important; margin: 0 0 1.8rem !important;
}
body .service-hero .hero-title { font-size: clamp(3rem, 7.4vw, 6.4rem) !important; line-height: .86 !important; letter-spacing: -.012em !important; margin-bottom: 1.6rem; }
body .nosotros-hero h1 span, body .equipo-hero h1 span, body .empleos-hero h1 span, body .comparativa-hero h1 span,
body #hero.page-top .hero-title span, body .page-header h1 span, body .service-hero .hero-title span { color: var(--blue) !important; -webkit-text-fill-color: var(--blue) !important; background: none !important; }
body .nosotros-hero .lead, body .equipo-hero .lead, body .empleos-hero .col-lg-7 > p, body .comparativa-hero p, body .page-header p {
  color: #2b2b2e !important; font-size: 1.1rem; line-height: 1.7; max-width: 38rem; margin: 0 0 1.8rem !important; text-align: left !important;
}
body .service-hero-text > p { color: #2b2b2e; max-width: 40rem; }

body .stats-bar { background: var(--g2) !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; padding: 0 !important; }
body .stats-bar .row { flex-wrap: nowrap; }
body .stats-bar .row > .stat-item { flex: 1 1 0; width: auto; max-width: none; min-width: 0; }
body .stats-bar .stat-item { text-align: left; padding: 28px 24px !important; }
body .stats-bar .col-md-3:nth-of-type(2) { background: var(--blue); }
body .stats-bar .col-md-3:nth-of-type(2) .stat-number, body .stats-bar .col-md-3:nth-of-type(2) .stat-label { color: #fff !important; }
body .stats-bar .stat-divider { background: var(--g4) !important; }
body .stat-number { font-family: var(--display); font-stretch: 66%; font-weight: 900 !important; font-size: clamp(3rem, 6vw, 5rem) !important; line-height: .85 !important; color: var(--blue) !important; letter-spacing: -.03em !important; }
body .stat-label { color: var(--ink) !important; letter-spacing: .16em !important; font-size: .7rem !important; }
@media (max-width: 767px) { body .stats-bar .row { flex-wrap: wrap; } body .stats-bar .stat-divider { display: none; } body .stats-bar .row > .stat-item { flex: 0 0 50%; } }
body .empleos-hero .hero-stats { gap: 0; }
body .empleos-hero .stat-item { background: var(--g2); border-radius: 0; box-shadow: none; padding: 20px 26px; }
body .empleos-hero .stat-item:nth-child(2) { background: var(--blue); }
body .empleos-hero .stat-item:nth-child(2) strong, body .empleos-hero .stat-item:nth-child(2) span { color: #fff !important; }
body .empleos-hero .stat-item strong { font-family: var(--display); font-stretch: 66%; font-weight: 900; font-size: 3.2rem !important; line-height: .9; color: var(--blue) !important; }
body .empleos-hero .stat-item span { color: var(--ink) !important; font-size: .7rem !important; letter-spacing: .14em; text-transform: uppercase; }

body .porque-section, body .servicios-section, body .glassdoor-section { background: #fff !important; }
body .glassdoor-section { border-color: var(--ink) !important; }
body .section-label, body .timeline-year, body .servicio-num, body .team-card-role, body .section-eyebrow,
body .job-tag:not(.presencial):not(.remoto):not(.hibrido), body .caso-cta, body .section-title-lg span { color: var(--blue) !important; }
body .section-eyebrow { background: transparent !important; }
body .section-title-lg, body .section-heading { font-family: var(--display); font-stretch: 66%; font-weight: 900 !important; letter-spacing: -.012em !important; color: var(--ink) !important; line-height: .9 !important; font-size: clamp(2.8rem, 6vw, 5rem) !important; }
body .body-text, body .timeline-text, body .section-sub, body .porque-card p, body .servicio-info p { color: var(--zinc-600) !important; }
body .timeline::before { background: var(--ink) !important; width: 1px !important; left: 8px !important; }
body .timeline-dot { background: var(--blue) !important; border: 0 !important; box-shadow: none !important; }
body .servicio-item { border-bottom-color: var(--ink) !important; }

body .porque-card, body .team-card, body .job-card, body .caso-card, body .glassdoor-badge-card {
  background: var(--g1) !important; border: 0 !important; border-top: 1px solid var(--ink) !important; border-radius: 0 !important; box-shadow: none !important; transition: background .25s !important;
}
body .porque-card:hover, body .team-card:hover, body .job-card:hover, body .caso-card:hover, body .glassdoor-badge-card:hover { background: var(--g2) !important; border: 0 !important; border-top: 1px solid var(--ink) !important; box-shadow: none !important; transform: none; }
body .job-card.espontanea { background: #fff !important; border: 1.5px dashed var(--ink) !important; }
body .team-card::before { display: none; }
body .team-card-photo { border: 0 !important; box-shadow: none; background: var(--g2) !important; }
body .team-card-photo img { filter: grayscale(1) contrast(1.05); transition: filter .35s, transform .4s; }
body .team-card:hover .team-card-photo img { filter: none; }
body .team-card-avatar { background: var(--g2) !important; color: var(--blue) !important; }
body .team-card-name { font-family: var(--display); font-stretch: 78%; font-size: 1.2rem !important; }
body .porque-icon, body .caso-icon-wrap { background: var(--blue) !important; box-shadow: none; border-radius: 50% !important; }
body .porque-icon svg, body .caso-icon-wrap svg { stroke: #fff !important; color: #fff !important; }
body .caso-metric { font-family: var(--display); font-stretch: 66%; font-weight: 900; font-size: 4.4rem !important; line-height: .85; color: var(--blue) !important; letter-spacing: -.03em; }
body .caso-metric-label { color: var(--ink) !important; letter-spacing: .14em !important; }
body .caso-tag { background: #fff !important; color: var(--ink) !important; border: 1px solid var(--ink); border-radius: 0 !important; box-shadow: none; }
body .job-apply-btn { background: var(--blue) !important; border-radius: 0 !important; box-shadow: none; text-transform: uppercase; letter-spacing: .1em; font-size: 12px !important; }
body .job-card:hover .job-apply-btn { background: var(--ink) !important; }
body .job-tag { box-shadow: none; border-radius: 0 !important; }
body .job-card-left h3 { font-family: var(--display); font-stretch: 70%; font-weight: 850; font-size: 1.9rem !important; line-height: .95; }
body .empleos-hero .col-lg-5 > div { background: var(--blue) !important; border: 0 !important; border-radius: 0 120px 0 0 !important; box-shadow: none; }
body .empleos-hero .col-lg-5 img[alt="Web360"] { filter: brightness(0) invert(1); }
body .empleos-hero .col-lg-5 div[style*="border-radius:50%"] { background: #fff !important; color: var(--blue) !important; }
body .nosotros-cta { background: var(--blue) !important; }
body .nosotros-cta h2 { font-family: var(--display); font-stretch: 66%; font-weight: 900; font-size: clamp(3rem, 6vw, 5.4rem) !important; line-height: .88; }
body .btn-cta-white { background: #fff !important; color: var(--ink) !important; border-radius: 0 !important; box-shadow: none; text-transform: uppercase; letter-spacing: .1em; }
body .btn-cta-white:hover { background: var(--ink) !important; color: #fff !important; }
body .btn-cta-outline { border-radius: 0 !important; text-transform: uppercase; letter-spacing: .1em; }

/* Clientes */
body #clientes { background: #fff !important; padding: calc(35px + 3.4rem) 0 4rem !important; }
body #clientes > .container > div:first-child { text-align: left !important; margin-bottom: 2.6rem !important; }
body #clientes span[style*="display:inline-block"], body section[style*="#f5f7fa"] span[style*="display:inline-block"] {
  display: flex !important; width: 100%; background: none !important; color: var(--ink) !important; border-radius: 0 !important; border-bottom: 1px solid var(--ink);
  padding: 0 0 .95rem !important; margin: 0 0 2.2rem !important; font-size: .74rem !important; font-weight: 700 !important; letter-spacing: .2em !important;
}
body #clientes span[style*="display:inline-block"]::before, body section[style*="#f5f7fa"] span[style*="display:inline-block"]::before { content: none; color: var(--blue); }
body #clientes h1 { font-family: var(--display); font-stretch: 66%; font-weight: 900 !important; color: var(--ink) !important; font-size: clamp(3.4rem, 9vw, 8rem) !important; line-height: .86 !important; letter-spacing: -.012em !important; margin: 0 !important; }
body #clientes div[style*="grid-template-columns"] { max-width: none !important; gap: 12px 8px !important; border: 0; }
body #clientes div[style*="grid-template-columns"] > div { background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; transform: none !important; }
body #clientes div[style*="grid-template-columns"] > div:hover { background: transparent !important; box-shadow: none !important; }
body #clientes div[style*="grid-template-columns"] img { max-height: 56px !important; max-width: 150px !important; }
body #clientes img { mix-blend-mode: multiply; }
body section[style*="background:#f5f7fa"] { background: var(--g1) !important; border-color: var(--ink) !important; }
body section[style*="background:#f5f7fa"] > .container > div:first-child { text-align: left !important; }
body section[style*="background:#f5f7fa"] h2, body .reviews-section h2 { font-family: var(--display); font-stretch: 66%; font-weight: 900 !important; color: var(--ink) !important; font-size: clamp(3rem, 6vw, 5rem) !important; line-height: .88 !important; letter-spacing: -.03em !important; margin: 0 0 1rem !important; }
body section[style*="background:#f5f7fa"] p { margin-left: 0 !important; color: var(--zinc-600) !important; }
body section[style*="background:#f5f7fa"] div[style*="background:#fff"] { background: #fff !important; border: 0 !important; border-top: 1px solid var(--ink) !important; border-radius: 0 !important; box-shadow: none !important; }
body section[style*="background:#f5f7fa"] div[style*="justify-content:center"][style*="max-width:1000px"] { justify-content: flex-start !important; max-width: none !important; }
body .reviews-section { background: #fff !important; border-top: 1px solid var(--ink); }
body .reviews-section .text-center { text-align: left !important; }
body .reviews-section .text-center p { margin-left: 0 !important; color: var(--zinc-600) !important; }
body .section-eyebrow-sm { display: flex; width: 100%; background: none !important; color: var(--ink) !important; border: 0 !important; border-bottom: 1px solid var(--ink) !important; border-radius: 0 !important; padding: 0 0 .95rem !important; margin-bottom: 2rem; font-size: .74rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
body .section-eyebrow-sm::before { content: none; color: var(--blue); }
body .review-card { background: var(--g1) !important; border: 0 !important; border-top: 1px solid var(--ink) !important; border-radius: 0 !important; box-shadow: none !important; }
body .review-card:hover { box-shadow: none !important; background: var(--g2) !important; }
body .review-stars { color: var(--blue) !important; }
body .review-avatar { background: var(--blue) !important; color: #fff !important; box-shadow: none; }
body div[style*="max-width:860px"][style*="border:1.5px solid #bfdbfe"] { background: var(--g1) !important; border: 0 !important; border-radius: 0 120px 0 0 !important; box-shadow: none; }
body div[style*="max-width:860px"] > div[style*="position:absolute"] { display: none; }
body div[style*="max-width:860px"] h3 { font-family: var(--display); font-stretch: 66%; font-weight: 900 !important; color: var(--ink) !important; font-size: clamp(2.4rem, 4.6vw, 3.6rem) !important; line-height: .9 !important; letter-spacing: -.03em; }
body div[style*="max-width:860px"] div[style*="border-radius:999px"][style*="border:1px solid #dbeafe"] { background: #fff !important; border: 1px solid var(--ink) !important; border-radius: 0 !important; }
body div[style*="max-width:860px"] div[style*="min-width:110px"] { background: #fff !important; border: 0 !important; border-top: 1px solid var(--ink) !important; border-radius: 0 !important; box-shadow: none; }
body div[style*="min-width:110px"] > div:first-child { font-family: var(--display); font-stretch: 66%; font-weight: 900; color: var(--blue) !important; font-size: 2.4rem !important; letter-spacing: -.02em; }
body div[style*="max-width:860px"] a[href="casos.php"] { background: var(--blue) !important; border-radius: 0 !important; box-shadow: none !important; text-transform: uppercase; letter-spacing: .1em; }
body div[style*="max-width:860px"][style*="#0a1f4e"] { background: var(--blue) !important; border-radius: 0 0 0 120px !important; box-shadow: none; }
body div[style*="max-width:860px"][style*="#0a1f4e"] h3 { color: #fff !important; }
body div[style*="max-width:860px"][style*="#0a1f4e"] p { color: rgba(255,255,255,.88) !important; }
body div[style*="max-width:860px"][style*="#0a1f4e"] a[href*="wa.me"] { background: var(--ink) !important; border-radius: 0 !important; box-shadow: none !important; }

/* ═════════════ Responsive ═════════════ */
@media (max-width: 991px) {
  .hv2-shape-half { display: none; }
  .hv2-panel { padding: 22px; }
  .hv2-video-frame { border-radius: 0 90px 0 0; }
  .hv2-lead { margin-top: 0; }
  #servicios .row > div .hv2-svc-card { border-left: 1px solid var(--ink); }
}
@media (max-width: 767px) {
  .hv2-stats { grid-template-columns: repeat(2, 1fr); }
  .hv2-stat:nth-child(3) { border-left: 0; border-top: 1px solid var(--g4); }
  .hv2-stat:nth-child(4) { border-top: 1px solid var(--g4); }
  .contact-form-box { padding: 2rem 1.4rem; }
  .hv2-tagline { font-size: 2rem; }
}

/* "Por qué Web360" (era una sección oscura con texto blanco) */
body .por-que-web360 { background: #fff !important; color: var(--ink) !important; border-top: 1px solid var(--ink); }
body .por-que-web360::before, body .por-que-web360::after { display: none !important; }
body .por-que-web360 h2 { color: var(--ink) !important; font-family: var(--display); font-stretch: 70%; font-weight: 900; font-size: clamp(2.6rem, 5.4vw, 4.6rem); line-height: .9; letter-spacing: -.012em; }
body .por-que-web360 .intro { color: var(--zinc-600) !important; }
body .diferenciador h3 { color: var(--ink) !important; font-family: var(--display); font-stretch: 78%; font-weight: 850; font-size: 1.45rem; line-height: 1; }
body .diferenciador p { color: var(--zinc-600) !important; }
body .diferenciador:hover { background: var(--blue) !important; border-top-color: var(--blue) !important; }
body .diferenciador:hover h3, body .diferenciador:hover p { color: #fff !important; }