/* Rox: cápsulas, superficies claras y prueba visual de trabajos reales. */
:root{--barra:88px;--fondo-2:#f4f7fb;--texto-2:#5b6b80;--linea:#dfe7f0;--menta-osc:#116b56;--menta-clara:#eaf8f3;--radio:28px}
body{overflow-x:clip}html{scroll-padding-block:110px 110px}::selection{background:var(--menta);color:var(--azul)}
.contenedor{width:min(1320px,100%)}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--menta-osc);outline-offset:5px}
h1,h2,h3{letter-spacing:-.035em}.antetitulo{display:none}
.barra{inset:16px 20px auto;height:72px;max-width:1380px;margin-inline:auto;gap:20px;border:1px solid var(--linea);border-radius:999px;padding-inline:24px;background:#fff;box-shadow:0 7px 26px rgba(11,37,69,.06)}
.marca img{width:39px;height:39px}.marca b{font-size:1rem}.marca span{font-family:var(--sans);letter-spacing:.08em;font-size:.6rem}
.menu{gap:20px}.menu>a{font-size:.88rem}.btn{border-radius:999px;min-height:50px;padding:12px 25px;white-space:normal;text-align:center;transition:background .18s,color .18s,transform .18s,box-shadow .18s;line-height:1.3}
.btn:hover{transform:translateY(-2px);box-shadow:0 6px 15px rgba(11,37,69,.1)}
.btn-menta{background:var(--azul);border-color:var(--azul);color:#fff}.btn-menta:hover{background:var(--azul-2);border-color:var(--azul-2);color:#fff}
.btn-wa{background:var(--menta);border-color:var(--menta);color:var(--azul)}.btn-wa:hover{background:#62d7bd;border-color:#62d7bd;color:var(--azul)}
.btn-barra{min-height:46px;padding:10px 20px}.flecha{width:19px;height:19px;flex:none}
.portada{margin-top:0;padding-top:108px;border:0;background:var(--menta-clara);color:var(--azul);border-radius:0 0 60px 60px}
.portada .contenedor{grid-template-columns:1.05fr 1fr;align-items:center;gap:64px;padding-block:64px 84px}
.portada h1{font-size:clamp(2.8rem,5.1vw,4.55rem);line-height:1.04;letter-spacing:-.04em;color:var(--azul);text-wrap:balance;max-width:13ch}
.portada h1 em{color:var(--menta-osc);font-style:normal;text-decoration:none}
.portada .sub{color:#405d60;font-size:1.16rem;line-height:1.65;max-width:49ch;margin-block:26px 28px}
.portada .sello{color:var(--menta-osc);text-transform:none;letter-spacing:0;font:600 .9rem var(--sans);margin-bottom:20px}
.portada-botones{gap:12px}.portada .btn:not(.btn-menta):not(.btn-wa){border-color:#9cb9b1;color:var(--azul)}
.portada .btn:not(.btn-menta):not(.btn-wa):hover{background:#fff}
.escena-rox{position:relative;padding:25px 0 82px;min-width:0}
.web-real{display:block;background:#fff;border:1px solid #c4ded5;border-radius:23px;padding:9px;transform:rotate(-3deg);box-shadow:0 18px 38px rgba(11,37,69,.14);overflow:hidden;text-decoration:none;transition:transform .28s}
.web-real:hover{transform:rotate(-1deg) translateY(-3px)}
.web-real img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:15px}
.web-real-cabecera{display:flex;justify-content:space-between;align-items:center;padding:12px 12px 15px;color:var(--azul);font-weight:700;font-size:.95rem}
.web-real-cabecera span{color:var(--texto-2);font-size:.74rem;font-weight:400}
.chat-cuerpo{background:#eef6f2;border-radius:15px;padding:18px 16px 78px;display:flex;flex-direction:column;gap:10px}
.burbuja{max-width:82%;margin:0;padding:10px 14px;border-radius:18px;font-size:.92rem;line-height:1.4;color:var(--azul)}
.burbuja.cliente{align-self:flex-start;background:#fff;border-bottom-left-radius:6px}
.burbuja.negocio{align-self:flex-end;background:#d3f3e6;border-bottom-right-radius:6px}
.consulta-ejemplo{position:absolute;right:-6px;bottom:4px;width:76%;background:var(--azul);color:#fff;border-radius:24px;padding:20px 23px;box-shadow:0 14px 28px rgba(11,37,69,.14);transform:rotate(2deg)}
.consulta-ejemplo p{margin:0 0 10px;font-size:.98rem;line-height:1.45}.consulta-ejemplo p:last-of-type{margin:0;color:#a4ecd9}.consulta-ejemplo small{display:block;margin-top:12px;color:#c2d5e4;font-size:.72rem}
.escena-rox{animation:rox-entrada .8s cubic-bezier(.16,1,.3,1) both}
@keyframes rox-entrada{from{transform:translateY(12px);opacity:.65}to{transform:none;opacity:1}}
.confianza{border:0;background:#fff}.confianza ul{padding-block:30px}.confianza li{color:#405d60;font-size:.88rem}.confianza li::before{border-radius:50%}
.bloque{padding-block:80px;border-bottom:0}.bloque h2{font-size:clamp(2rem,3.9vw,3.1rem);max-width:24ch;letter-spacing:-.035em}
.bloque .centrado{text-align:left}.centrado .entradilla{margin-inline:0}.bloque .entradilla{margin-top:18px}
.servicios{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}.servicio{padding:22px 0 8px;border-top:1px solid var(--linea);gap:14px;min-width:0}.servicio h3{font-size:1.24rem}.servicio .ico{display:none}
.servicio .btn{font-size:.9rem}.servicio .mas{text-decoration:none;gap:8px}.servicio .mas:hover{text-decoration:underline;text-underline-offset:4px}
#servicios .servicio:nth-child(-n+2){grid-column:span 2;background:var(--azul);color:#fff;border:0;border-radius:var(--radio);padding:34px 38px;position:relative;overflow:hidden}
#servicios .servicio:nth-child(-n+2) h3{color:#fff;font-size:1.9rem;max-width:17ch}#servicios .servicio:nth-child(-n+2) p,#servicios .servicio:nth-child(-n+2) li{color:#d4e2ef}#servicios .servicio:nth-child(-n+2) b{color:#fff}#servicios .servicio:nth-child(-n+2) .mas{color:#fff}
#servicios .servicio:nth-child(-n+2) .btn{background:var(--menta);border-color:var(--menta);color:var(--azul)}
#servicios .servicio:nth-child(-n+2) .gratis{color:#a4ecd9;border:0;padding:0;letter-spacing:0;text-transform:none;font-family:var(--sans);font-size:.9rem}
.bloque-suave{background:var(--fondo-2);border-radius:44px;margin-inline:20px}
.bloque-azul{background:var(--azul);border-radius:44px;margin-inline:20px;color:#fff}.bloque-azul p,.bloque-azul .entradilla{color:#d3e0ed}
.producto{gap:48px}.antes-despues{border-radius:22px;overflow:hidden}.ad{background:#fff;border:0;padding:26px}.ad-despues{background:#e0f4ed;border:0}.ad+.ad{border:0}.ad b{font:700 .84rem var(--sans);letter-spacing:0;text-transform:none}.ad p{color:var(--texto-2)}
#trabajos .servicios{grid-template-columns:repeat(2,minmax(0,1fr))}
#trabajos .servicio{border-top:0;padding:0 0 24px;background:var(--fondo-2);border-radius:28px;overflow:hidden;gap:16px}
#trabajos .servicio>h3,#trabajos .servicio>p,#trabajos .servicio>.versiones{margin-inline:26px}
#trabajos .servicio>.btn{margin-left:26px}
#trabajos .servicio:not(:has(.proyecto-imagen)){padding-top:26px}
#trabajos .bloque-suave .servicio{background:#fff}
.proyecto-imagen{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:top;transition:transform .3s}
#trabajos .servicio:hover .proyecto-imagen{transform:scale(1.015)}
.pasos{border-top:0}.paso,.paso+.paso{border:0;padding:24px}.paso h3{font-size:1.3rem}
.tarjeta-hero{background:#fff;color:var(--azul);border:1px solid #c4ded5;border-radius:28px;padding:34px;box-shadow:0 16px 34px rgba(11,37,69,.08);min-width:0}
.tarjeta-hero h2{color:var(--azul);font-size:1.65rem;line-height:1.15}.tarjeta-hero p{color:var(--texto-2)}
.tarjeta-hero .precio-cifra{font:700 3.5rem/1.1 var(--display);letter-spacing:-.04em;color:var(--azul);margin-block:18px}
.precio-cifra small{display:block;margin-top:12px;font-family:var(--sans);letter-spacing:0}.portada .miga,.portada .miga a{color:#405d60;font-family:var(--sans);letter-spacing:0;text-transform:none}
.costo-lista{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:36px}.costo{padding:30px;background:var(--fondo-2);border-radius:24px}.costo h3{font-size:1.3rem;margin-bottom:14px}.costo p:last-child{margin:0}
.nota-fuente{font-size:.85rem;color:var(--texto-2);margin-top:26px;max-width:80ch}.resumen-precio{font-size:.9rem;border-top:1px solid var(--linea);padding-top:18px;margin-top:20px}
.pregunta{border-top:1px solid var(--linea)}.pregunta h3{font-size:1.18rem}
.pie{background:var(--menta-clara);color:var(--azul);border-radius:44px 44px 0 0;margin-top:48px;padding-block:60px 24px}
.pie b,.pie h4{color:var(--azul)}.pie p{color:#405d60}.pie a{color:var(--azul);padding-block:8px;line-height:1.4;min-height:40px}.pie .legal{font-family:var(--sans);letter-spacing:0;color:#405d60;font-size:.83rem;border-color:#bddace}
.pie h4{font:700 1rem var(--display);letter-spacing:0;text-transform:none;margin-bottom:12px}.pie-rejilla{gap:32px}
.mk-reveal{opacity:1;transform:none}.conmutador{display:block;position:absolute;width:1px;height:1px;opacity:0}.conmutador:focus-visible + .hamburguesa{outline:3px solid var(--menta-osc);outline-offset:3px}
.hamburguesa{border-radius:999px;text-transform:none;letter-spacing:0;font:600 .9rem var(--sans);min-height:46px;padding-inline:18px;background:var(--menta-clara);border:0}
@media(min-width:1001px){.conmutador{display:none}}
@media(max-width:1150px){.menu{gap:12px}.menu>a{font-size:.8rem}.barra{gap:12px;padding-inline:18px}.portada .contenedor{gap:36px}}
@media(max-width:1000px){.menu{visibility:hidden;top:82px;left:0;right:0;border:1px solid var(--linea);border-radius:24px;box-shadow:0 12px 26px rgba(11,37,69,.1)}.conmutador:checked ~ .menu{visibility:visible;max-height:70vh;overflow-y:auto}.menu>a{font-size:1rem;padding-inline:24px;border-bottom-color:var(--linea)}.menu>a:last-child{border-bottom:0}.servicios{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.barra{inset:12px 12px auto;height:66px;padding-inline:14px;gap:10px}.marca img{width:34px;height:34px}.marca b{font-size:.88rem}.marca span{font-size:.55rem}.btn-barra{min-width:44px;min-height:44px;padding:10px}.hamburguesa{padding-inline:15px}.portada{padding-top:90px;border-radius:0 0 34px 34px}.portada .contenedor{grid-template-columns:1fr;padding-block:36px 40px;gap:24px}.portada h1{max-width:none;font-size:clamp(2.55rem,9.8vw,3.8rem);line-height:1.05}.portada .sub{font-size:1.08rem;margin-block:22px}.portada-botones>.btn{flex:1 1 155px;padding-inline:18px}.escena-rox{padding:18px 5px 88px}.consulta-ejemplo{right:0;width:83%;padding:17px 19px}.web-real-cabecera{font-size:.83rem;padding:9px}.web-real-cabecera span{font-size:.68rem}.web-real{transform:rotate(-2deg)}.confianza ul{grid-template-columns:1fr 1fr;gap:16px;padding-block:28px}.confianza li{font-size:.82rem}.bloque{padding-block:54px}.bloque-suave,.bloque-azul{margin-inline:10px;border-radius:30px}.servicios,.costo-lista,#trabajos .servicios{grid-template-columns:1fr}#servicios .servicio:nth-child(-n+2){grid-column:auto;padding:28px}#servicios .servicio:nth-child(-n+2) h3{font-size:1.7rem}.producto{gap:20px}.tarjeta-hero{padding:26px}.tarjeta-hero .precio-cifra{font-size:3rem}.costo{padding:24px}.pie{border-radius:30px 30px 0 0;padding-block:40px 112px}.pie-rejilla{grid-template-columns:1fr 1fr;gap:28px 22px}.pie-rejilla>div:first-child{grid-column:1/-1}.pie a{font-size:.9rem}.pie .legal{font-size:.8rem;line-height:1.6}.wa-movil{display:flex;inset:auto 14px max(12px,env(safe-area-inset-bottom));width:auto;padding:6px;gap:6px;border:1px solid #ccded7;border-radius:999px;background:#fff;box-shadow:0 8px 24px rgba(11,37,69,.16)}.wa-movil .btn{min-height:48px;padding:11px 12px;flex:1;border-radius:999px;border:0;font-size:.9rem}.wa-movil .btn+.btn{border-left:0;background:var(--menta-clara)}body{padding-bottom:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.btn:hover,.web-real,.web-real:hover{transform:none}}
@media(max-width:760px){.chat-cuerpo{padding-bottom:18px}}
/* los dos servicios principales (agente y páginas web) destacados lado a lado */
@media(min-width:1001px){#servicios .servicios{grid-template-columns:repeat(6,minmax(0,1fr))}#servicios .servicio{grid-column:span 2}#servicios .servicio:nth-child(-n+2){grid-column:span 3}}
@media(max-width:1000px){#servicios .servicio:nth-child(-n+2){grid-column:auto}}
/* insignias de certificaciones: pequeñas y en fila */
.certi-insignias{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-bottom:24px}
.certi-insignias img{width:48px;height:48px;object-fit:contain}
.credencial-rox{display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 12px;border:1px solid var(--linea);border-radius:18px;text-decoration:none;background:#fff;color:var(--azul);font:600 .82rem/1.4 var(--sans);letter-spacing:0;text-transform:none;text-align:center;min-width:0}
a.credencial-rox:hover{background:var(--menta-clara);border-color:#91cbb8}
.credencial-rox small{color:var(--texto-2);font-weight:400;font-size:.7rem}
@media(max-width:1000px){.certi-insignias{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){.certi-insignias{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}
.certi-texto,.certi-cab .btn{font-family:var(--sans);text-transform:none;letter-spacing:0}